-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
234 lines (197 loc) · 7.77 KB
/
script.js
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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
let memory = ['0', '0', '0'] //array that will hold arguments and funtion type, memeory[0] & memory[2] to hold numbers, memory[1] holds operator
const digits = document.querySelectorAll('.number') // listens for when the user clicks or presses any of the digits
digits.forEach((number) => {
number.addEventListener('click', () => {
numbers(number.id)
})
})
const funcs = document.querySelectorAll('.func') //listens for when user selects specific function, adds to memory[1]
funcs.forEach((func) => {
func.addEventListener('click', () => {
if (func.id == '√') {
clear()
memory[0] = parseFloat(memory[0])
subPrintSqr()
memory[0] = sqrRoot(memory[0]).toString()
print(memory[0])
memory[1] = '0'
}
else operators(func.id)
})
})
const ce = document.querySelector('.CE') //listens for when user hits the CE button and wipes memory array
ce.addEventListener('click', () => {
memory = ['0', '0', '0']
display.classList.remove('smaller')
clear()
})
const del = document.querySelector('.backspace')
del.addEventListener('click', () => {
display.removeChild(display.lastChild)
backspace()
})
const equals = document.querySelector('#Enter') //listens for when user clicks equals button
equals.addEventListener('click', () => {
memory[0] = parseFloat(memory[0])
memory[2] = parseFloat(memory[2])
clear()
subPrint()
memory[0] = equate(memory[0], memory[2]).toString() //executes equate function and returns anser in memory[0]
memory[1] = '0'
memory[2] = '0'
print(memory[0])
})
window.addEventListener('keydown', (e) => { //Keyboard support, listens for when the users either numbers or function symbols only. Enter is used for equals. Used Event keys to identify whihc button is pressed
const button = document.querySelector(`button[id="${e.key}"]`)
console.log(e)
console.log(button.id)
if (!button) return
if (button.id == 0 || button.id == 1 || button.id == 2 || button.id == 3 || button.id == 4 || button.id == 5 || button.id == 6 || button.id == 7 || button.id == 8 || button.id == 9 || button.id == `.`) {
numbers(button.id)
}
else if (button.id === `+`|| button.id == `-` || button.id == `*` || button.id == `/` || button.id == `^` ) {
operators(button.id)
}
else if (button.id == `Enter`) {
memory[0] = parseFloat(memory[0])
memory[2] = parseFloat(memory[2])
clear()
subPrint()
memory[0] = equate(memory[0], memory[2]).toString() //executes equate function and returns anser in memory[0]
memory[1] = '0'
memory[2] = '0'
print(memory[0])
}
else if (button.id == `Delete`) { //Delete key is the keyboard support for the CE
memory = ['0', '0', '0']
display.classList.remove('smaller')
clear()
}
else if (button.id == `Backspace`) {
display.removeChild(display.lastChild)
backspace()
}
})
///////////////////////////FUNCTIONS//////////////////////////////////
function print(x) { //function that will displays input as well as funtion results
x = x.toString()
const screen = document.querySelector('#display')
for (let i = 0; i < x.length; i++) { // implemented for loop to print out solution as individual divs instead of 1 div for large answers. ie. answer = 25, print 2 sperate divs for 2 AND 5, instead of 1 div for 25. Necessary for backspace functionality
const div = document.createElement('div')
div.textContent = x.charAt(i)
screen.appendChild(div)
}
if (display.childElementCount > 10) { //shrink and wraps divs if #display gets full
display.classList.add('smaller')
}
}
function clear() { //CE, clear display function. Deletes divs whihc represent the numbers and funcs selected by user
while (display.firstChild) {
display.removeChild(display.firstChild)
}
while (subdisplay.firstChild) {
subdisplay.removeChild(subdisplay.firstChild)
}
}
function numbers(input) {
if (memory[1] == 0) {
if (input == '.' && isFloat(memory[0]) == true) {
return
}
else {
print(input)
memory[0] += input //appends user input instead of adding number together, creates string of numbers
}
}
else if (memory[1] != 0 && memory[2] == 0) { //conditional to see whether memory[2] contains anything, will clear display much like a real calculator to take second number input by user
display.classList.remove('smaller')
clear()
print(input)
memory[2] += input
}
else if (memory[1] != 0 && memory[2] != 0) {
if (input == '.' && isFloat(memory[2]) == true) {
return
}
else {
print(input)
memory[2] += input
}
}
}
function operators(input) {
if (memory[1] == 0) { //case if user selects a function without a prior function slected, memory[1] is empty
memory[1] = input
print(input)
}
else { //case when the user will "chain" functions together instead of using the equals button
memory[0] = parseFloat(memory[0])
memory[2] = parseFloat(memory[2])
memory[0] = equate(memory[0], memory[2])
memory[1] = input
memory[2] = '0'
clear()
print(memory[0])
print(input)
}
}
function equate(a,b) { // equals funtion, looks at func operator in memory[1] and executes based on func
if (memory[1] === "+") {
return a+b
}
else if (memory[1] === "-") {
return a-b
}
else if (memory[1] === "*") {
return a*b
}
else if (memory[1] === "/") {
return a/b
}
else if (memory[1] === "^") {
return a**b
}
else {
console.log('ERROR!')
}
}
function backspace() { //backspace/delele function, will delete off last string character in memory
if (display.childElementCount < 11) {
display.classList.remove('smaller')
}
if (memory[0] != 0 && memory[2] == 0 && memory[1] == 0) {
if (memory[0].length > 1) {
memory[0] = memory[0].slice(0, -1)
}
else memory[0] = '0'
}
else if (memory[0] != 0 && memory[2] != 0) {
if (memory[2].length > 1) {
memory[2] = memory[2].slice(0, -1)
}
else memory[2] = '0'
}
else if (memory[0] != 0 && memory[2] == 0 && memory[1] != 0) {
memory[1] = '0'
}
else return
}
function isFloat(x) { // function to check if argument is a floating number
if (x.indexOf('.') > -1) return true
else return false
}
function subPrint() { // subdsiplay that will display the current memory values which yeilds answer in main display
const subScreen = document.querySelector('#subdisplay')
const div = document.createElement('div')
div.textContent = `${memory[0]} ${memory[1]} ${memory[2]}`
subScreen.appendChild(div)
}
function sqrRoot(a) { // square root funtion, stand alone as this function does nto take a 2nd paramenter
return a**(1/2)
}
function subPrintSqr() {
const subScreen = document.querySelector('#subdisplay')
const div = document.createElement('div')
div.textContent = `√ ${memory[0]}`
subScreen.appendChild(div)
}