JavaScript

// Loads the init function when the broser window is opened
window.onload = init();

// Declares the init() function
function init() {
	
	// Declares the calcButtons variable and sets it equal to the element calcButton
	var calcButtons = document.getElementsByClassName("calcButton");
	
	// Loops through calcButtons and runs the buttonClick() function when a button is clicked
	for (var i = 0; i < calcButtons.length; i++) {
		calcButtons[i].onclick = buttonClick();
	}
	
	// Runs the calcKeys function when a key is pressed within the calcWindow element
	document.getElementById("calcWindow").addEventListener(onkeydown, calcKeys());
}

// Declares the buttonClick() function
function buttonClick(e) {
	
	
	// Declares variables calcValue, calcDecimal and buttonValues
	var calcValue = document.getElementById("calcWindow").value;
	var calcDecimal = document.getElementById("decimals").value;
	var buttonValue = e.target.value;
	
	// Begins a switch-case structure to assign events to each button pressed
	switch(buttonValue) {
		case "del":
		calcValue = "";
		break;
		case "bksp":
		calcValue = eraseChar(calcValue);
		break;
		case "enter":
		calcValue = " = " + evalEq(calcValue, calcDecimal) + "\n";
		break;
		case "prev":
		calcValue = lastEq(calcValue);
		calcValue = calcValue + buttonValue;
		break;
	}
}


document.getElementById("calcWindow").value = calcValue;
document.getElementById("calcWindow").focus();


// Declares the calcKeys() function
function calcKeys(e) {
	
	var calcValue = document.getElementById("calcWindow").value;
	var calcDecimal = document.getElementById("decimals").value;
	
	
	// Begins a switch-case structure, assigning values to each of the buttons below (delete, enter, arrow up) when pressed
	switch(e) {
		case "Delete": 
		calcValue = "";
		break;
		case: "Enter":
		calcValue = " = " + evalEq(calcValue, calcDecimal);
		break;
		case "ArrorUp":
		calcValue = lastEq(calcWindow.value);
		break;
		
		e.preventDefault();
	}
	

	document.getElementById("calcWindow").value = calcValue;
	
}







/* ===================================================================== */

function eraseChar(textStr) { 
   return textStr.substr(0, textStr.length - 1);
}

function evalEq(textStr, decimals) {
   var lines = textStr.split(/\r?\n/);
   var lastLine = lines[lines.length-1];
   var eqValue = eval(lastLine);
   return eqValue.toFixed(decimals);
}  

function lastEq(textStr) {
   var lines = textStr.split(/\r?\n/);
   var lastExp = lines[lines.length-2];
   return lastExp.substr(0, lastExp.indexOf("=")).trim();
}

ghazabaz wrote:

I am following the example shown in the text. E is the buttonValue(e) function's parameter ?

ghazabaz wrote:

window.onload = init();
...
calcButtons[i].onclick = buttonClick();
...
document.getElementById("calcWindow").addEventListener(onkeydown, calcKeys());

window.addEventListener("load", init);
...
calcButtons[i].addEventListener("click", buttonClick);
...
document.getElementById("calcWindow").addEventListener("keydown", calcKeys);

	// Loops through calcButtons and runs the buttonClick() function when a button is clicked
	for (var i = 0; i < calcButtons.length; i++) {
		calcButtons[i].addEventListener("click", buttonClick);
	}
	
	// Runs the calcKeys function when a key is pressed within the calcWindow element
	document.getElementById("calcWindow").addEventListener("keydown", calcKeys);
}

// Declares the buttonClick(e) function
function buttonClick(e) {
	
	
	// Declares variables calcValue, calcDecimal and buttonValues
	var calcValue = document.getElementById("calcWindow").value;
	var calcDecimal = document.getElementById("decimals").value;
	var buttonValue = e.target.value;
	
	// Begins a switch-case structure to assign events to each button pressed
	switch(buttonValue) {
		case "del":
		calcValue = "";
		break;
		case "bksp":
		calcValue = eraseChar(calcValue);
		break;
		case "enter":
		calcValue = " = " + evalEq(calcValue, calcDecimal) + "\n";
		break;
		case "prev":
		calcValue =  + lastEq(calcValue) ; 
		calcValue = calcValue + buttonValue;
		break;
	}

document.getElementById("calcWindow").value = calcValue;
document.getElementById("calcWindow").focus();

}

ghazabaz wrote:

calcValue = + lastEq(calcValue) ;

// Append the function result to something, and replace the value:
calcValue = SOMETHING + lastEq(calcValue); 

// Append the function result to the current value:
calcValue += lastEq(calcValue); 

// Replace the value with the function result:
calcValue = lastEq(calcValue); 

switch (buttonValue) {
    ...
    case "prev":
        calcValue = ??? + lastEq(calcValue) ; 
        calcValue = calcValue + buttonValue;
        break;
    
    default:
        calcValue = calcValue + buttonValue;
        break;
}

Quote:

. Click within the calculator window and, using the keyboard, directly type a mathematical expression. Verify that pressing the Enter key evaluates the current expression and moves the cursor to a new line. Show that you can copy the previous expression by pressing the Enter key followed by the up-arrow key on your keyboard. Finally verify that pressing the Delete key clears the contents of the calculator window. Note: Keyboard commands might not work in the Safari browser since Safari does not support the key property at the time of this writing.

Quote:

Otherwise, append the calculator button character to the calculator window by letting, calcValue equal calcValue plus buttonValu

switch(buttonValue) {
		case "del":
		calcValue = "";
		break;
		case "bksp":
		calcValue = eraseChar(calcValue);
		break;
		case "enter":
		calcValue = + " = " + evalEq(calcValue, calcDecimal); // Here
		break;
		case "prev":
		calcValue = lastEq(calcValue);  // This one
		default:
		calcValue = calcValue + buttonValue;
		break;
	}

// Begins a switch-case structure, assigning values to each of the buttons below (delete, enter, arrow up) when pressed
	switch(e) {
		case "Delete": 
		calcValue = "";
		break;
		case "Enter":
		calcValue = + " = " + evalEq(calcValue, calcDecimal);  // This one
		break;
		case "ArrowUp":
		calcValue +=  lastEq(calcWindow.value); // This one but it is exacly as the instructions ask for:

// "iii.	For "ArrowUp", add the following expression to calcValue
// lastEq(calcWindow.value)"


		break;
		case "ArrowUp":
		e.preventDefault();
		break;
	}

"use strict";

/*	
   Functions List:

   init()
      Initializes the contents of the web page and sets up the
      event handlers
      
   buttonClick(e)
      Adds functions to the buttons clicked within the calcutlor
      
   calcKeys(e)
      Adds functions to key pressed within the calculator window 
      
   eraseChar(textStr)
      Erases the last character from the text string, textStr
      
   evalEq(textStr, decimals) 
      Evaluates the equation in textStr, returning a value to the number of decimals specified by the decimals parameter

   lastEq(textStr) 
      Returns the previous expression from the list of expressions in the textStr parameter

*/

// Loads the init function when the broser window is opened
window.addEventListener("load", init);

// Declares the init() function
function init() {
	
	// Declares the calcButtons variable and sets it equal to the element calcButton
	var calcButtons = document.getElementsByClassName("calcButton");
	
	// Loops through calcButtons and runs the buttonClick() function when a button is clicked
	for (var i = 0; i < calcButtons.length; i++) {
		calcButtons[i].addEventListener("click", buttonClick);
	}
	
	// Runs the calcKeys function when a key is pressed within the calcWindow element
	document.getElementById("calcWindow").addEventListener("keydown", calcKeys);
}

// Declares the buttonClick(e) function
function buttonClick(e) {
	
	
	// Declares variables calcValue, calcDecimal and buttonValues
	var calcValue = document.getElementById("calcWindow").value;
	var calcDecimal = document.getElementById("decimals").value;
	var buttonValue = e.target.value;
	
	// Begins a switch-case structure to assign events to each button pressed
	switch(buttonValue) {
		case "del":
		calcValue = "";
		break;
		case "bksp":
		calcValue = eraseChar(calcValue);
		break;
		case "enter":
		calcValue = + " = " + evalEq(calcValue, calcDecimal) + "\n";
		break;
		case "prev":
		calcValue = lastEq(calcValue);
		default:
		calcValue = calcValue + buttonValue;
		break;
	}

document.getElementById("calcWindow").value = calcValue;
document.getElementById("calcWindow").focus();

}


// Declares the calcKeys(e) function
function calcKeys(e) {
	
	var calcValue = document.getElementById("calcWindow").value;
	var calcDecimal = document.getElementById("decimals").value;
	
	
	// Begins a switch-case structure, assigning values to each of the buttons below (delete, enter, arrow up) when pressed
	switch(e) {
		case "Delete": 
		calcValue = "";
		break;
		case "Enter":
		calcValue = + " = " + evalEq(calcValue, calcDecimal);
		break;
		case "ArrowUp":
		calcValue +=  lastEq(calcWindow.value) ;
		break;
		case "ArrowUp":
		e.preventDefault();
		break;
	}
	

	document.getElementById("calcWindow").value = calcValue;
	
}


/* ===================================================================== */

function eraseChar(textStr) { 
   return textStr.substr(0, textStr.length - 1);
}

function evalEq(textStr, decimals) {
   var lines = textStr.split(/\r?\n/);
   var lastLine = lines[lines.length-1];
   var eqValue = eval(lastLine);
   return eqValue.toFixed(decimals);
}  

function lastEq(textStr) {
   var lines = textStr.split(/\r?\n/);
   var lastExp = lines[lines.length-2];
   return lastExp.substr(0, lastExp.indexOf("=")).trim();
}

ghazabaz wrote:

calcValue = + " = " + evalEq(calcValue, calcDecimal) + "\n";

ghazabaz wrote:

case "prev":
    calcValue = lastEq(calcValue);
default:

var escaped = "<img src=\"an_image.png\">";
var single_quotes = '<img src="another_image.png">';