diff --git a/index.html b/index.html index e69de29..71ef7eb 100644 --- a/index.html +++ b/index.html @@ -0,0 +1,73 @@ + + + + + + + + +
+ +
Super Happy Fun Register: $[
+
+
]
+ +
+ +
+

Calculating with ordered operations.

+
+ + +
+

[7]

+

[8]

+

[9]

+

[/]

+

[clear]

+
+ + +
+

[4]

+

[5]

+

[6]

+

[*]

+

[get balance]

+
+ + +
+

[1]

+

[2]

+

[3]

+

[-]

+

[deposit cash]

+
+ + +
+

[0]

+

[00]

+

[.]

+

[+]

+

[withdraw cash]

+
+ + +
+

+

+

+

[=]

+
+ +
+ + +
+
+ + + + \ No newline at end of file diff --git a/js/calculator.js b/js/calculator.js index e69de29..bf3a08c 100644 --- a/js/calculator.js +++ b/js/calculator.js @@ -0,0 +1,21 @@ +var calculator = { + total: null, + + lastOperator: [], + + clear: function() {this.total = null;}, + + add: function(num) {return this.total += num;}, + + subtract: function(num) {return this.total -= num;}, + + multiply: function(num) {return this.total *= num;}, + + divide: function(num) { + // add event listener + return this.total /= num; + }, + + equals: function() { return this.total ;} //push this.total to register.display +}; + diff --git a/js/cash_register.js b/js/cash_register.js index e69de29..fb7e2de 100644 --- a/js/cash_register.js +++ b/js/cash_register.js @@ -0,0 +1,263 @@ +var register = { + + balance: 0, + + display: 0, + + regMode: "ordered", + + getBalance: function() { + return this.balance; + }, + + depositCash: function() { + this.balance += parseFloat(display.innerHTML); + display.innerHTML = ""; + console.log(this.balance); + }, + + withdrawCash: function() { + if (parseFloat(display.innerHTML) > this.balance) { + display.innerHTML = "ERROR: INSUFFICIENT RUPEES"; + console.log("You is broke. Go cut some grass!"); + } else { + this.balance -= parseFloat(display.innerHTML); + display.innerHTML = ""; + console.log(this.balance); + } + } +}; + +document.getElementById("keyGetBalance").addEventListener("click", function(){ + register.getBalance(); + console.log("This is your balance."); + console.log(register.getBalance()); + console.log(register.balance); +}); + +document.getElementById("keyDepositCash").addEventListener("click", function(){ + register.depositCash(); + console.log("This is how much you deposited."); + console.log(register.balance); +}); + +document.getElementById("keyWithdrawCash").addEventListener("click", function(){ + register.withdrawCash(); + console.log("This is your balance."); + console.log(register.balance); +}); + +var keys = { + display: document.getElementById("display"), + key1: document.getElementById("key1"), + key2: document.getElementById("key2"), + key3: document.getElementById("key3"), + key4: document.getElementById("key4"), + key5: document.getElementById("key5"), + key6: document.getElementById("key6"), + key7: document.getElementById("key7"), + key8: document.getElementById("key8"), + key9: document.getElementById("key9"), + key0: document.getElementById("key0"), + key00: document.getElementById("key00"), + keyPeriod: document.getElementById("keyPeriod"), + keyClear: document.getElementById("keyClear"), + chained: document.getElementById("chained"), + ordered: document.getElementById("ordered") + +}; + +var press = { + press1: keys.key1.addEventListener('click', function() { + display.innerHTML += 1;}), + press2: keys.key2.addEventListener('click', function() { + display.innerHTML += 2;}), + press3: keys.key3.addEventListener('click', function() { + display.innerHTML += 3;}), + press4: keys.key4.addEventListener('click', function() { + display.innerHTML += 4;}), + press5: keys.key5.addEventListener('click', function() { + display.innerHTML += 5;}), + press6: keys.key6.addEventListener('click', function() { + display.innerHTML += 6;}), + press7: keys.key7.addEventListener('click', function() { + display.innerHTML += 7;}), + press8: keys.key8.addEventListener('click', function() { + display.innerHTML += 8;}), + press9: keys.key9.addEventListener('click', function() { + display.innerHTML += 9;}), + press0: keys.key0.addEventListener('click', function() { + display.innerHTML += 0;}), + press00: keys.key00.addEventListener('click', function() { + display.innerHTML += '00';}), + pressPeriod: keys.keyPeriod.addEventListener('click', function() {display.innerHTML += '.';}), + pressClear: keys.keyClear.addEventListener('click', function() { + display.innerHTML = ''; + calculator.total = null; + calculator.lastOperator = []; + }), + pressChained: keys.chained.addEventListener('click', function() { + // starts with same functionality as clear + display.innerHTML = ''; + register.regMode = "chained"; + calculator.total = null; + calculator.lastOperator = []; + document.getElementById("opAlert").innerHTML = "Calculating with chained operations."; + }), + pressOrdered: keys.ordered.addEventListener('click', function() { + // starts with same functionality as clear + display.innerHTML = ''; + register.regMode = "ordered"; + calculator.total = null; + calculator.lastOperator = []; + document.getElementById("opAlert").innerHTML = "Calculating with ordered operations."; + }) +}; + +// This function should be added to the chainoperations.js module +function lastOpCheck(keys) { + if (calculator.lastOperator[0] === "add") { + calculator.add(parseFloat(keys)); + } else if (calculator.lastOperator[0] === "subtract") { + calculator.subtract(parseFloat(keys)); + } else if (calculator.lastOperator[0] === "multiply") { + calculator.multiply(parseFloat(keys)); + } else if (calculator.lastOperator[0] === "divide") { + calculator.divide(parseFloat(keys)); + } else { + console.log("You broke the damn calculator."); + } +} + +var operations = { + equalsButton: document.getElementById("keyEquals").addEventListener("click", function() { + if (register.regMode === "ordered") { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + console.log(calculator.lastOperator); + + // these loops should be refactored + for (var i = 0; i < calculator.lastOperator.length; i++) { + while (calculator.lastOperator[i] === "*") { + num = calculator.lastOperator[i-1] * calculator.lastOperator[i+1]; + calculator.lastOperator.splice(i-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var k = 0; k < calculator.lastOperator.length; k++) { + while (calculator.lastOperator[k] === "/") { + num = calculator.lastOperator[k-1] / calculator.lastOperator[k+1]; + calculator.lastOperator.splice(k-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var m = 0; m < calculator.lastOperator.length; m++) { + while (calculator.lastOperator[m] === "+") { + num = calculator.lastOperator[m-1] + calculator.lastOperator[m+1]; + calculator.lastOperator.splice(m-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var p = 0; p < calculator.lastOperator.length; p++) { + while (calculator.lastOperator[p] === "-") { + num = calculator.lastOperator[p-1] - calculator.lastOperator[p+1]; + calculator.lastOperator.splice(p-1, 3, num); + console.log(calculator.lastOperator); + } + } + console.log(calculator.lastOperator[0]); + display.innerHTML = calculator.lastOperator[0].toFixed(3); + calculator.lastOperator = []; + } + if (register.regMode === "chained") { + lastOpCheck(keys.display.innerHTML); + calculator.lastOperator = []; + display.innerHTML = calculator.total.toFixed(3); + } + }), + + addButton: document.getElementById("keyAdd").addEventListener("click", function() { + if (register.regMode === "ordered") { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('+'); + console.log(calculator.lastOperator); + display.innerHTML = ""; + } + if (register.regMode === "chained") { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total += parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "add"; + display.innerHTML = ""; + } + }), + + subtractButton: document.getElementById("keySubtract").addEventListener("click", function() { + if (register.regMode === "ordered") { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('-'); + display.innerHTML = ""; + } + if (register.regMode === "chained") { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total -= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "subtract"; + display.innerHTML = ""; + } + }), + + multiplyButton: document.getElementById("keyMultiply").addEventListener("click", function() { + if (register.regMode === "ordered") { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('*'); + console.log(calculator.lastOperator); + display.innerHTML = ""; + } + if (register.regMode === "chained") { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total *= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "multiply"; + display.innerHTML = ""; + } + }), + + divideButton: document.getElementById("keyDivide").addEventListener("click", function() { + if (register.regMode === "ordered") { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('/'); + display.innerHTML = ""; + } + if (register.regMode === "chained") { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total /= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "divide"; + display.innerHTML = ""; + } + }) +}; diff --git a/js/chainoperations.js b/js/chainoperations.js new file mode 100644 index 0000000..921a511 --- /dev/null +++ b/js/chainoperations.js @@ -0,0 +1,65 @@ +// Chain of Operations + +var operations = { + equalsButton: document.getElementById("keyEquals").addEventListener("click", function() { + lastOpCheck(keys.display.innerHTML); + calculator.lastOperator = []; + display.innerHTML = calculator.total.toFixed(3); + }), + + addButton: document.getElementById("keyAdd").addEventListener("click", function() { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total += parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "add"; + display.innerHTML = ""; + }), + + subtractButton: document.getElementById("keySubtract").addEventListener("click", function() { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total -= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "subtract"; + display.innerHTML = ""; + }), + + multiplyButton: document.getElementById("keyMultiply").addEventListener("click", function() { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total *= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "multiply"; + display.innerHTML = ""; + }), + + divideButton: document.getElementById("keyDivide").addEventListener("click", function() { + if (calculator.lastOperator.length > 0) { + lastOpCheck(keys.display.innerHTML); + } else { + if (calculator.total !== null) { + calculator.total /= parseFloat(keys.display.innerHTML); + } else { + calculator.total = parseFloat(keys.display.innerHTML); + } + } + calculator.lastOperator[0] = "divide"; + display.innerHTML = ""; + }), +}; \ No newline at end of file diff --git a/js/modular_calculator.js b/js/modular_calculator.js new file mode 100644 index 0000000..35b02f8 --- /dev/null +++ b/js/modular_calculator.js @@ -0,0 +1,12 @@ +var calculator = { + + add: function(a, b) {return a + b;}, + + subtract: function(a, b) {return a - b;}, + + multiply: function(a, b) {return a * b;}, + + divide: function(a, b) {return a / b;}, + +}; + diff --git a/js/modular_register.js b/js/modular_register.js new file mode 100644 index 0000000..5ca6df1 --- /dev/null +++ b/js/modular_register.js @@ -0,0 +1,92 @@ +(function() { + + var register = { + + init: function() { + this.cacheDom(); + this.bindEvents(); + + }, + + cacheDom: function() { + this.equalsButton = document.getElementById("keyEquals"); + // this.addButton = document.getElementById("keyAdd"); + // this.subtractButton = document.getElementById("keySubtract"); + // this.multiplyButton = document.getElementById("keymultiply"); + // this.divideButton = document.getElementById("keyDivide"); + this.display = document.getElementById("display"); + this.numberButtons = document.querySelectorAll(".number"); + this.operatorButtons = document.querySelectorAll(".operator"); + this.chainedButton = document.getElementById("chained"); + this.orderedButton = document.getElementById("ordered"); + + }, + + bindEvents: function() { + this.equalsButton.addEventListener('click', functionhere); + this.chainedButton.addEventListener('click', function() { + states.regMode = "chained"; + clear(); + }); + this.orderedButton.addEventListener('click', function() { + states.regMode = "ordered"; + clear(); + }); + // this.addButton.addEventListener('click', functionhere); + // this.subtractButton.addEventListener('click', functionhere); + // this.multiplyButton.addEventListener('click', functionhere); + // this.divideButton.addEventListener('click', functionhere); + for (var i=0; i < this.numberButtons.length; i++) { + this.numberButtons[i].onclick = this.appendDisplay; + } + for (var k=0; k < this.operatorButtons.length; k++) { + this.operatorButtons[k].addEventListener('click', function() { + this.operate(); + }); + } + }, + + appendDisplay: function() { + this.display.innerHTML += this.innerHTML; + }, + + clear: function() { + display.innerHTML = ""; + states.numArr = []; + }, + + operate: function() { + if (states.regMode === "ordered") { + states.numArr.push(parseFloat(this.display.innerHTML)); + // much unfinished + } + if (states.regMode === "chained") { + if (this.opCheck()) { + states.numArr[0] = calculateFunction(states.numArr[0], parseFloat(this.display.innerHTML)); // need to keep track of which button was pressed to trigger whatever calculator function + this.display.innerHTML = states.numArr[0]; + } else { + this.opCheck(); + } + } + }, + + opCheck: function() { + if (numArr.length > 0) { + return true; + } else { + states.numArr[0] = parseFloat(this.display.innerHTML); + states.numArr[1] = /* the correct operator */; + } + }, + + states: { + regMode: "ordered", + numArr: [], + } + +// Use check functions that return true or false + + }; + + init(); +})(); \ No newline at end of file diff --git a/js/orderedoperations.js b/js/orderedoperations.js new file mode 100644 index 0000000..7be7245 --- /dev/null +++ b/js/orderedoperations.js @@ -0,0 +1,78 @@ +// Order Of Operations + +var operations = { + equalsButton: document.getElementById("keyEquals").addEventListener("click", function() { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + console.log(calculator.lastOperator); + + // 1. Semi-string approach. + // calculator.total = parseFloat(calculator.lastOperator); + // console.log(calculator.total); + + + // 2. Looping through an array for math functions. + for (var i = 0; i < calculator.lastOperator.length; i++) { + while (calculator.lastOperator[i] === "*") { + num = calculator.lastOperator[i-1] * calculator.lastOperator[i+1]; + calculator.lastOperator.splice(i-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var k = 0; k < calculator.lastOperator.length; k++) { + while (calculator.lastOperator[k] === "/") { + num = calculator.lastOperator[k-1] / calculator.lastOperator[k+1]; + calculator.lastOperator.splice(k-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var m = 0; m < calculator.lastOperator.length; m++) { + while (calculator.lastOperator[m] === "+") { + num = calculator.lastOperator[m-1] + calculator.lastOperator[m+1]; + calculator.lastOperator.splice(m-1, 3, num); + console.log(calculator.lastOperator); + } + } + for (var p = 0; p < calculator.lastOperator.length; p++) { + while (calculator.lastOperator[p] === "-") { + num = calculator.lastOperator[p-1] - calculator.lastOperator[p+1]; + calculator.lastOperator.splice(p-1, 3, num); + console.log(calculator.lastOperator); + } + } + + // 3. Joining all elements in an array into a long math string. + // calculator.numStr = calculator.lastOperator.join(''); + // console.log(calculator.numStr); + // calculator.total = parseFloat(calculator.numStr); + + console.log(calculator.lastOperator[0]); + display.innerHTML = calculator.lastOperator[0].toFixed(3); + calculator.lastOperator = []; + }), + + addButton: document.getElementById("keyAdd").addEventListener("click", function() { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('+'); + console.log(calculator.lastOperator); + display.innerHTML = ""; + }), + + subtractButton: document.getElementById("keySubtract").addEventListener("click", function() { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('-'); + display.innerHTML = ""; + }), + + multiplyButton: document.getElementById("keyMultiply").addEventListener("click", function() { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('*'); + console.log(calculator.lastOperator); + display.innerHTML = ""; + }), + + divideButton: document.getElementById("keyDivide").addEventListener("click", function() { + calculator.lastOperator.push(parseFloat(keys.display.innerHTML)); + calculator.lastOperator.push('/'); + display.innerHTML = ""; + }), +}; \ No newline at end of file diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..5690b86 --- /dev/null +++ b/styles.css @@ -0,0 +1,38 @@ +p { + display: table-cell; + padding: 15px; + font-size: 200%; +} + +.row { + display: table-row; +} + +.cell { + background-color: #C3EAF7; + +} + +.cell:hover { + background-color: #7ED5F2; +} + +.cell:active { + background-color: #4AAECF; +} + +.register { + background-color: #F7C3C9; +} + +.register:hover { + background-color: #EB7885; +} + +.register:active { + background-color: #E8384C; +} + +.top { + background-color: #B0E8BD; +} \ No newline at end of file