Skip to content

Commit

Permalink
Added comments and fixed some bugs
Browse files Browse the repository at this point in the history
  • Loading branch information
@jezi89
jezi89 committed Oct 9, 2023
1 parent b97d769 commit 1677aa0
Showing 1 changed file with 58 additions and 53 deletions.
111 changes: 58 additions & 53 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@
</div>
<div id="keys">
<div id="numbers">
<!-- inline javascript just for practice purposes, Document.querySelector() is preferred. No ids, because we do direct function calls with parameters passed by value and later converted into Strings and back to Number-->
<div onclick="onClickNumber(7)">7</div>
<div onclick="onClickNumber(8)">8</div>
<div onclick="onClickNumber(9)">9</div>
Expand All @@ -109,110 +110,114 @@
</div>

<script>
// inline script for testing purposes. Preferred way is in separate file. Javascript goes before including Bignumber library from CDN
// Get result and Operator display fields
const myInput = document.getElementById('result');
const myOperator = document.getElementById('operator');

// Initialize Action and Memory
let Action = '';
let Memory = undefined;
let lastIsNumber = '';
let Count = 0;

//Put clicked Number in display in #numbers container (80% width)
function onClickNumber(CN) {
if (myOperator.value === '=' || lastIsNumber === 'false') {
// If Statement to Check if myInput converted to String is any of these values, if so replace myInput.value with Clicked Number. const does not restrict change of Object properties.
if (myOperator.value === '=') {
console.log(myOperator.value);
myOperator.value = '';
myInput.value = CN;
console.log('test1.0');
} else if (
(myInput.value === '' && Memory != undefined) ||
myInput.value === '0' ||
(myOperator.value != '' && Memory === undefined)
(myOperator.value != '' && Memory != undefined)
) {
console.log('test1.1');
Memory = myInput.value;
console.log(myOperator.value);
myOperator.value = '';
myInput.value = CN;
} else if (myInput.value.includes('.') && CN === '.') {
console.log('test1.2');

}
//Using include instead of Indexof for checking dot. .inlcudes() is more readable. Alternative here if you need strict checking [NaN] or want to at which index the dot is found.
else if (myInput.value.includes('.') && CN === '.') {
// If dot is there, check with regex Metacharacters \D for any Non Digit Charachter and replace it with an empty string
console.log(myOperator.value);
CN = CN.replace(/\D/, '');
myInput.value += CN;
// In any other case, just concatenate clicked number passed into function to string
} else {
console.log('test1.3');
console.log(myOperator.value);
myInput.value += CN;
}
console.log('test1.4');
lastIsNumber = 'true';
}

//Put clicked Operator in display in #operators Container (20% width)
function onClickOperator(CO) {
console.log('test2.0');

if (lastIsNumber === 'false' && Memory === undefined) {
console.log('test2.1');
return;
} else if (lastIsNumber === 'false' && Memory != undefined) {
myOperator.value = CO;

// I TRIED TO FX UNNECESSARY CALCULATIONS AND UNDEFINED FOR 2 TIMES CLICKING ON /. WILL HAVE TO DIVE IN
// if (Memory === undefined && CO === myOperator.value) {
// myOperator.value = CO;

if (Memory === undefined) {
//I make a statement to set Memory equal to the value for the Clicked Operator and store the Memory as a Number with Unary Operator.
// Unary operators are more efficient than standard JavaScript function calls. Additionally, unary operators can not be overridden, therefore their functionality is guaranteed > In this case string data type is converted into a Number
Memory = +myInput.value;
// Set myOperator String Value (needed for Input) to clicked Operator
// Make myInput display an empty string again, which is in turn ready for a new invocation of onClickNumber()
myInput.value = '';
console.log('test2.2');
} else if (Memory === undefined) {
console.log('test2.3');

Memory = myInput.value;

myInput.value = '';

// Set Placeholder to be equal to Memory
myInput.placeholder = Memory;

lastIsNumber = 'false';
// If Memory is not undefined, skip steps above and take operator for an equals sign, by invoking onClickEquals
} else {
console.log('test2.4');
onClickEquals();
}
// Always Show Operator used in operator display
myOperator.value = CO;

// Always Assign value for Action to be equal to CO that has been initialized globally.
Action = CO;
// Check if Memory is Undefined and if true, set Memory
}

// If I use backspace and Operator.value is not equals sign, make shallow copy of myInput.value without last value, so last value is removed. Remove Operator display
function backSpace() {
if (myOperator.value != '=') {
myInput.value = myInput.value.slice(0, -1);
myOperator.value = '';
}
}

// If I use Cancel, remove everything and clear Memory
function onClickCancel() {
myInput.value = '';
myOperator.value = '';
Memory = undefined;
myInput.placeholder = 0;
}

// For calculation, wait for equals sign and use big number library because of JavaScript’s 64 bit Number type compression, causing unsatisfying result. Bignumber should make calculating for Money also a valid option.
function onClickEquals(Makes) {
let myValue = myInput.value;
if (
myOperator.value === '=' ||
(Memory === undefined && lastIsNumber === 'true')
) {
return;
} else if (
myInput.placeholder.value === undefined &&
Memory === undefined &&
lastIsNumber === 'false'
) {
myOperator.value = '=';
return;
} else if (Action === '+') {
myInput.value = parseFloat(Memory) + parseFloat(myValue);
// If = was already clicked, just return myInput.value. In an updated version I will make sure that pressing = again repeats the previous calculation
if (myOperator.value === '=') {
return myInput.value;
}
let myValue = +myInput.value;
let realMem = new Big(Memory);
// Set operator display equal to =
myOperator.value = Makes;

if (Action === '+') {
myInput.value = realMem.plus(myValue).valueOf();
} else if (Action === '-') {
myInput.value = parseFloat(Memory) - parseFloat(myValue);
myInput.value = realMem.minus(myValue).valueOf();
} else if (Action === '*') {
myInput.value = parseFloat(Memory) * parseFloat(myValue);
myInput.value = realMem.times(myValue).valueOf();
} else if (Action === '/') {
myInput.value = parseFloat(Memory) / parseFloat(myValue);
myInput.value = realMem.div(myValue).valueOf();
}
myOperator.value = Makes;
Memory = undefined;
}
</script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/big.js/2.3.0/big.min.js"
integrity="sha512-FRFtxO3b4HKkMcWJ/Yv7tQp+WwWMSPLDlAO5hn1TbNgswaE+RAFESuBbulWR/PNeTq9d4DS/hyEZbcZRAqlYwQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
></script>
</body>
</html>
</html>

0 comments on commit 1677aa0

Please sign in to comment.