Exercise 8. Copy ct_Ex7.html to a new file named ct_Ex8.html. Copy ct_Ex7.js to a new file named ct_Ex8.js. In this exercise, you translate your flowchart of Ex 8 of Part 1 to its equivalent JavaScript code. First lets fix some html

code. Make four changes to ct_Ex8.html, as follows:

Connect it to ct_Ex8.js by fixing the script tag in the head element.

Correct the header texts of the document to show Separating Digits of a Positive Integer

Correct the name of the event function of the button to be separateDigits()

Also, in your ct_Ex8.js,

Name of the function should be separateDigits() ()

Uncomment the line that sets the output message to number: + a + its digits:

Implement the function based on your flowchart that you drew in Part 1

Hint: in JS when you divide two integers, or two strings of numbers, such as 27/10, you get 2.7 You need the result to be 2 (but not round to 3), which is the floor of 2.7.

Hint: if you stored the digit in a string, then when you get a new digit, append the new digit in front of the string. Then output the string after the loop. Alternatively, if you output the result in each iteration, then you update the existing texts by retrieving the exiting texts, and append the new digit in front.

Once you are done, run the program, you should see the following results if you enter 1235 or 413257. Test your program with more inputs. If the program does not give the expected results, debug your code by selecting Inspect the page or

-------HTML-----

Separating Digits of a Positive Integer

(c) Author: LOL

----JAVA SCRIPT---

// For: 23w EECS1012N, York University, Lassonde School of Engineering (LAS)

// in Ex7 to Ex13, change the name of the following function properly

function separateDigits() {

var outputObj = document.getElementById("output");

// this statement receives some data and parses it to integer

var a = parseInt(prompt("Please enter a number: ", ""));

/* this statement add some message to our output Object used for Ex8

you would need to change the message to be appropriate in Ex9 to E13 */

outputObj.innerHTML = "number: " + a + " its digits: "; // uncomment this line for Ex8

// translate the rest of your flowcharts to js here:

// factorial_B(a); // for Ex11 call function factorial_B, passing a

//the following statements inform the user that the program ended

//and disable the button. Ctrol+F5 to refresh the browser in order to start over

outputObj.innerHTML = outputObj.innerHTML + " " + "program ended";

document.getElementsByTagName("button")[0].setAttribute("disabled","true");

}

// for Ex11 take input named num and computer num!

/*factorial_B (num) {

// num is the input, calculate factorial of num. Use num as variable name.

var outputObj = document.getElementById("output");

}*/

-----CSS----

* {

box-sizing: border-box;

background-color:LightGrey;

}

body {

font-family: NimbusSanL, Arial, sans-serif;

text-align: center;

color:#202020;

background-color:Silver;

}

div {

border:1px solid SlateGrey;

border-radius:5px;

margin: 20px;

}

.input {

border:none;

text-align:right;

}

p {

text-align:right;

padding: 20px;}

input, button {

font:inherit;

color:Blue;

width:100px;

padding-left: 5px;

}

button {

color:DarkSlateGrey;

width:200px

}

.strong {

font-family: NimbusSanL, Arial, sans-serif;

font-size:1.2em;

color:Green;

text-decoration:bold;

}

footer{

padding-top:10px;

text-align:center;

font-size:10px;

color:LightSlateGrey;

}

/* Responsive layout - makes the columns stack on

top of each other instead of next to each other */

[class*="column"] {

width: 80%;

display:inline-block;

height:60vh;

font-size:1.5em;

}

@media screen and (min-width:600px) {

[class*="column"] {

width:50%;

}