Background:

This assignment goals are: 1) Understand the basics of lists manipulation using arrays and traversal mechanics. 2) Understand implementation of basic statistical data using said lists. 3) Populate, process and create data within the document using loops and arrays.

Directions:

Please read carefully all of the following subsections. Completing the skeleton file For this assignment, you will complete the missing code parts of the provided skeleton_a8.html file. Along the document, you will find all the required sections marked in between comments sections, for example: or /* Complete code under this comment */

Goal:

Functionality:

When the page is loading, the only function which will run it init(). This will call 3 other functions: 1) generateGrades() 2) populateStudentsTable() 3) computeStats() Your job is to implement the body of this functions based on the given information: studentNames and an empty grades arrays. There is also a totalPoints global vairiable which you do not need to change, it is to calculate the C+ grade. Note that EVERY TIME the page is reloaded, all the data will be recalculated.

Instructions:

1) generateGrades() will, for each student of the studentNames array, populate the already declared global array grades, with random grades from 1-100, each value rounded to two decimal places. HINT: a random number can be easily created with the built-in function Math.random() - this returns a pseudo-random real number from [0,1] - a good way to create a random number within a range is to multiply the result of random() by the desired upper bound and then add the lower bound. e.g. - try ((Math.random() * 5) + 1).toFixed(2); and see which numbers you get. LAST BUT NOT LEAST - Make sure you insert NUMBERS into the array. Might save you a headache or two.

2) Once all the grades are in the array, populateStudentsTable() will generate the elements in the page. Each index in grades, corresponds to the student with the same index of the studentNames array; for example, grades[0] is the grade for student studentNames[0]. By the time the document is fully loaded, the table students must be completely populated with all the students from the aforementioned array and its newly generated grades. Every even-number cell, must be of the studentNameEven class e.g. <... class=... > - this will need to be generated with code, cant be done manually. HINT: For creating the HTML, you will need the following functions: var el = document.createElement - return a new HTML element and stores it in el el.setAttribute(attribute-name,attribute-value); - adds attribute to the HTML el el.appendChild(el2); - adds the HTML element to the el hierarchy e.g. - table > tr // tr is a child of table The following code will create a div element and add a p to it. Add text to the p and then append the p into the div var d = document.createElement(div); var paragraph = document.createElement(p); paragraph.innerHTML = Hello, world!; d.appendChild(paragraph); You will need to do a similar process within a loop in order to create all the row and cells required for the table.

3) Finally, you will compute basic course statistics in the computeStats() function. Mean - sum of all grades divided by the number of grades. Median - if odd, the element which has the same number of items on the left and the right of the array. Otherwise, the average of the two middle elements. e.g - [1 2 3 4 5] median is 5 / [ 1 2 3 4 ] median is 2.5 Standard Deviation - Here is the reference with process explained (Square root of the variance) C+ Curve Grade And populate the specific sections of the stats box: meanBox medianBox sdBox cPlusBox - percentage of points as per the mean These are all the inputs below the table. Just setting the values will suffice. HINT: You will need the following functions: sort(array) sort an array of values in ascending order (this was implemented for you) var array = [7,3,4,5]; sort(array); // now array is [3,4,5,7] .floor() var a = 3.7; a.floor() 3 .toFixed() var a = 3.87765; a.toFixed(3) 3.877 Math.sqrt(val) Math.sqrt(9) 3 Math.round(val)

Considerations and References:

1. DO NOT CHANGE ANY UNREQUESTED PIECE OF CODE (just the indicated functions) 2. All javascript chapters in Fluency 6 textbook - including arrays and loops. 3. To convert a text value into a number type, look at: http://www.w3schools.com/jsref/jsref_number.asp 4. You can use some built-in Math functions such as: http://www.w3schools.com/jsref/jsref_min.asp 5. You can check if a value is a number with: http://www.w3schools.com/jsref/jsref_isnan.asp

Total Points: 500

Student Name	Course Grade

Mean	Median	Standard Deviation	C+ Grade