In this fourth part of a six-part series on building a web page calculator, we'll delve more deeply into the functions. We start with the operator(ID) function, and then take a closer look at events. We'll wrap up by starting to show how to use the keyboard with the calculator.
//clear the evalString so that operation can continue using Input Text Control value
evalString = "";
break;
}
The switch statement uses the ID of the button to know which statement was clicked. The operator() function takes this ID as an argument.
The first case appends the + character to the evalString string variable and then sets the toClearDisplay variable to true. When the toClearDisplay variable is set to true, the next time you type a digit (number), any number that was on the display is erased before you see the digit. This is how physical calculators operate. The showNum(ID) function uses this variable to erase the display.
The next three cases behave in a similar way, but for their particular operators.
When you press the M+ button (case "BMP":), you save the number on the display to the calculator memory; that is how the user sees it. However, you and me know that this is not really correct. We know that the basic code, including values to variables, even data structures, has to be in memory before the calculator can function. Instructions and data are sent to the CPU for execution, and the results of the execution are sent back to the memory. So for us, programmers, the memory as seen by the user is just a variable. The variable name is memVar. When you click the M+ button, a copy of the number on the display is given as a value to this variable.
The first line for the case for the M+ button reads the number from the display and assigns it to the memVar variable. The next line sets the toClearDisplay variable to true, so that the next digit button you type will make the display erase and the digit appear. This case also clears the evaluation string by setting the evalString value to "". In this way you annul any computation that was in progress. I took this decision for convenience.
When you press the C button (case "BMM":) you set the number of the display to zero. The first line of the case does this. There are other things associated with it. The next line sets the showNumCalledOnce to false. This is because computation has to start afresh. This case also clears the evaluation string by setting the evalString value to "". In this way you annul any computation that was in progress.
When you click the equal Sign (case "BEQ":), the content of the evalString is evaluated, with the eval(evalString) expression. The result is shown on the display. The first line of the case for the equal sign does this. The second and last line of the case clears the evaluation string by setting the evalString value to "".
After pressing the equal sign, you see the result on the display. What we want to happen is if you then press a digit button, the result will be erased and you see only that digit and any further digits you type. So add the following line at the bottom of the equal sign case:
toClearDisplay = true;
Wow! We have come to the end of the first phase of the project. I hope you have found it interesting. You can now write software for a calculator. In the next phase, we shall learn things that are complementary to what we have done. We shall start by seeing how to use the keyboard to press a digit button on our calculator. Next we will add scientific buttons and functions.
HTML 
Coding a Web Page Calculator
