FilesExpand file tree

 master

/

script.js

Copy path

Blame

More file actions

Blame

More file actions

Latest commit

 

History

History

History

114 lines (105 loc) · 4.18 KB

 master

/

script.js

Copy path

Top

File metadata and controls

• Code
• Blame

114 lines (105 loc) · 4.18 KB

Raw

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

let core = (function(){

let autoGenerator = function(max){

return Math.floor(Math.random()*(max+1))

}

let state={

points:0,

wrongAnswer:0,

}

let setGame = function(){

return {

firstNumber : autoGenerator(10),

secondNumber: autoGenerator(10),

operator : ['+','-','x'][autoGenerator(2)]

}

}

let initialState = function(h1,input,p){

input.value ="";

input.focus();

state.currentProblem = setGame();

h1.textContent = `${state.currentProblem.firstNumber} ${state.currentProblem.operator} ${state.currentProblem.secondNumber}`;

p.innerHTML =`You need <span class='points'>${10-state.points}</span> more points and are allowed to make <span class='mistakes'>${2-state.wrongAnswer}</span> more mistakes`;

}

let renderProgress = function (progress){

progress.style.transform =`scaleX(${state.points/10})`;

}

return {

initialState : initialState,

state : state,

renderProgress: renderProgress,

}

})();

let view = (function(){

let dataFromHtml ={

autoNumber: document.querySelector('.auto-number'),

answerInput: document.querySelector('.answer'),

text : document.querySelector('.text'),

form : document.querySelector('.rightAnswerForm'),

progressBAr: document.querySelector('.progress-inner'),

resetBtn :document.querySelector('.resetBtn'),

endMessage :document.querySelector('.end-message'),

}

let colorChange = function(yourClass){

dataFromHtml.autoNumber.classList.add(yourClass);

setTimeout(function(){

dataFromHtml.autoNumber.classList.remove(yourClass);

},441)

}

return {

dataFromHtml : dataFromHtml,

colorChange :colorChange,

}

})();

let controller = (function(core,view){

let viewData = view.dataFromHtml;

let problem = core.state;

core.initialState(viewData.autoNumber,viewData.answerInput,viewData.text);

viewData.form.addEventListener('submit',function(e){

let answer;

e.preventDefault();

if(problem.currentProblem.operator == '+')

answer =problem.currentProblem.firstNumber + problem.currentProblem.secondNumber;

if(problem.currentProblem.operator == '-')

answer = problem.currentProblem.firstNumber - problem.currentProblem.secondNumber;

if(problem.currentProblem.operator =='x')

answer = problem.currentProblem.firstNumber * problem.currentProblem.secondNumber;

let yourAnswer =parseInt(viewData.answerInput.value);

if(yourAnswer === answer){

problem.points++;

view.colorChange('animate-right');

if(problem.points <=10){

if(problem.points == 10){

viewData.endMessage.textContent ="Congrates!! You win";

reset();

}

this.nextElementSibling.firstElementChild.textContent = 10-problem.points;

core.initialState(viewData.autoNumber,viewData.answerInput,viewData.text);

core.renderProgress(viewData.progressBAr);

}

}else{

problem.wrongAnswer++;

view.colorChange('animate-wrong');

if(problem.wrongAnswer <=2){

if(problem.wrongAnswer ==2){

viewData.endMessage.textContent = "Ahh!! all the best for the next";

reset();

}

this.nextElementSibling.lastElementChild.textContent = 2- problem.wrongAnswer;

core.initialState(viewData.autoNumber,viewData.answerInput,viewData.text);

}

}

});

viewData.resetBtn.addEventListener('click',function(){

document.body.classList.remove('overlay-is-open');

})

function reset(){

document.body.classList.add('overlay-is-open');

setTimeout(function(){

viewData.resetBtn.focus();

},1500);

core.state.points =0;

core.state.wrongAnswer =0;

core.initialState(viewData.autoNumber,viewData.answerInput,viewData.text);

core.renderProgress(viewData.progressBAr);

}

})(core,view);