a-scientific-javascript-calculator/app.js at master · mcwachira/a-scientific-javascript-calculator · GitHub

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
115
116
117
118
119
120
121
122
const numberButtons =  document.querySelectorAll(".number")
const operatorButtons =  document.querySelectorAll(".operator")
const clearButton =  document.querySelector(".clear")
const deleteButton =  document.querySelector(".delete")
const equalsButton =  document.querySelector(".equals")
const previousValue = document.querySelector(".previous")
const currentValue = document.querySelector(".current")


class Calculator{
constructor(previousValue, currentValue)    {
    this.previousValue = previousValue
    this.currentValue =currentValue

    this.clear()
}
clear() {
    this.previousOperand =""
    this.currentOperand =""
    this.operation = undefined
}
delete()    {
this.currentOperand =  this.currentOperand.toString().slice(0, -1)
}


appendNumber(number)    {
    if(number ==="." && this.currentOperand.includes(".")) return
this.currentOperand = this.currentOperand.toString() + number.toString()
}

choseOperation(operation)   {
 if(this.currentOperand === "") return
    if(this.previousOperand !=+ "")   {
        this.compute()
    }
    this.operation =  operation
    this.previousOperand = this.currentOperand
    this.currentOperand  = ""
}

compute()   {
let computation;
const prev = parseFloat(this.previousOperand)
const current =  parseFloat(this.currentOperand)

if(isNaN(prev)  || isNaN(current)) return
switch (this.operation) {
  case "+":
    computation = prev + current;
    break;
  case "+":
    computation = prev - current;

    break;
  case "×":
    computation = prev * current;
    break;
  case "÷":
    computation = prev / current;
    break;
  case "%":
    computation = prev % current;
    break;


  default:
    return

}
this.currentOperand = computation
this.previousOperand = ""
this.operation =undefined
}


getDisplayNumber(number) {
   const floatNumber =  parseFloat(number)
   if(isNaN(floatNumber)) return ''
   return floatNumber.toLocaleString('en')
}

updateDisplay() {
this.currentValue.innerText =  this.getDisplayNumber(this.currentOperand)
if(this.operation != null) {
    this.previousValue.innerText = `${this.getDisplayNumber(this.previousOperand)} ${(this.operation)}`
}else{
    this.previousValue.innerText = "";
}

}
}
const calculator  = new Calculator(previousValue, currentValue)
numberButtons.forEach(button => {
    button.addEventListener('click', () =>  {
        calculator.appendNumber(button.innerText)
        calculator.updateDisplay()
    })
})

operatorButtons.forEach(button => {
    button.addEventListener('click', () =>  {
        calculator.choseOperation(button.innerText)
        calculator.updateDisplay()
    })
})

equalsButton.addEventListener('click', () =>   {
    calculator.compute()
    calculator.updateDisplay()
})


clearButton.addEventListener('click', () => {
    calculator.clear()
    calculator.updateDisplay()
})

deleteButton.addEventListener('click', () =>    {
    calculator.delete()
    calculator.updateDisplay()
})