Creating a Javascript Calculator: how to create a function for squaring a number, dividing a number (whichever is entered by the user) by 2, and the radius minus the number that the user enters and calculate the area.

Below are the following instructions for the assignment regarding these specific buttons/functions:

Inside an external .js file do the following

- Use the load event to wire up the buttons using the addEventListener to the following functions:

Write three named functions that respond to the click event for the bottom three buttons: (x^2, entered number divided by 2, and area)

Write a named function that will take one argument (the number in the textbox), square that number, and write the result in the text box or ERROR if the string cannot be converted to a mathematical expression. Call the eval function before you square the number in case the user has entered an expression instead of a number.

Write a named function that will take one argument (the number in the textbox), divide it by 2, and write the result in the text box or ERROR if the string cannot be converted to a mathematical expression. Call the eval function before you halve the number in case the user has entered an expression instead of a number.

Write a named function that will take one argument (the radius - the number in the textbox), calculate the area based on that, and write the result in the text box or ERROR if the string cannot be converted to a mathematical expression.

The following is what I have for my code so far:

calculator.js code -

window.addEventListener("load", function() { document.getElementById("convertBtn").addEventListener("click", convert); var numbers = document.getElementsByClassName("digit"); //will get all button values var size = numbers.length; //gets length of array of numbers/button values for (var i = 0; i < size; i++) { //loops through and adds an event listener to each of the buttons numbers[i].addEventListener("click", buildFormula); } document.getElementById("clearBtn").addEventListener("click", function() { //this will wire up the clear button to work when clicked on document.getElementById("compText").value = ""; //this will clear whatever value is in the text box }); var operators = document.getElementsByClassName("operator"); size = operators.length; for(var i = 0; i < size; i++) { operators[i].addEventListener("click", function() { document.getElementById("compText").value += " " + this.value + " "; }) } var buttons = document.getElementsByTagName("button"); //will pull for all buttons size = buttons.length; for(var i = 0; i < size; i++) { buttons[i].addEventListener("focus", function() { this.style.border = "4px #333C7C solid"; //adds border to button when it is clicked }) buttons[i].addEventListener("blur", function() { this.style.border = "4px #C2C6DF inset"; //brings border back to normal when another button is clicked }) buttons[i].addEventListener("mouseover", function() { this.style.backgroundColor = "#A89BBD"; //changes color when hovered over by mouse to show the button you are on }) buttons[i].addEventListener("mouseout", function() { this.style.backgroundColor = "#D0C8DE"; //changes back to original color when mouse cursor is no longer hovering over the button }) } }); function convert() { //this function will convert the values entered into the text box try { var calculate = eval(document.getElementById("compText").value); //eval will allow formulas to be put in and calculated var answer = calculate; document.getElementById("message").innerHTML = "the answer is " + answer.toFixed(2); //the .toFixed(2) will only display the answer with decimal places } catch(error) { document.getElementById("message").innerHTML = "Could not do conversion. Please enter number or complete formula only."; } }

function buildFormula() { //this function will allow the numbered buttons to enter in the value as they are clicked document.getElementById("compText").value += this.value; //.value will work on a text box, not .innerHTML }

The following is my html code:

calculator.html:

JS Calculator

• Home
• My Movies
• My Hobby
• Other Pages
  • Animation
  • Youth Shelter
  • Pet Competition Form
  • Ad-lib Story
  • Slideshow
  • JS Calculator

JavaScript Calculator

**If you could please tell/show me exactly where in my code that I need to add the code and in bold font I would appreciate it**

**all my other buttons work perfectly except for the square function, divide entered number by 2 (#/2), and area button (radius - number)**