CE212 ASSIGNMENT 1 2017
Introduction
You should refer to pages 39-42 of the Undergraduate Students’ Handbook for details of the University policy regarding late submission and plagiarism; the work handed in must be entirely your own. It is expected that marking of the assignments will be completed by the beginning of week 23.
The assignment comprises three independent exercises. They are not equally weighted.
Submission and Marking Criteria
Copies of all code (including CSS, JavaScript and HTML files) must be submitted to the online submission system by the deadline in a single .zip or .7z file. (Marks will be deducted for files submitted in any other format.) You will also be required to demonstrate your solutions in the lab in week 21 or week 22 – 10% will be deducted from the mark for any assignment that is not demonstrated in the lab (unless there are genuine extenuating circumstances that prevent attendance at both labs).
Other than where specific instructions have been given about coding (e.g. the use of an array of objects in exercise 2) the only criteria to be used for marking of this assignment are that the web pages have the correct behaviour, and, where appropriate, the required style. You may use JQuery but are not required to do so.
Exercise 1 – Dynamic Data Table [30%]
The requirement for this exercise is to use JavaScript (together with CSS and HTML) to produce a dynamic table of data listing conversion between distances in miles and kilometres. The web page must obtain from the user the range in miles of the distances to be displayed and produce a table showing each distance in the range alongside its equivalent in kilometres, which must be displayed to exactly three decimal places. (The miles values should be inetgers.) The JavaScript should be invoked by a button-click.
To perform the conversion note you should assume that 1 mile is equal to 1.6093 kilometres
Exercise 2 – Marking Form [30%]
This exercise requires the creation of a marking form for an assignment. Your solution should have components as shown below and also display the total mark, which should be updated as marks are entered; there should also be a Clear button, which when clicked, should clear all of the comments and reset all marks to 0. The form must be created using JavaScript. The details of sections (i.e. their names and maximum marks) must be stored in an array of objects (one section per object) so that it is easy to change these details by changing the initialisation of the array in one place in the JavaScript file; the objects in the array must not themselves be arrays. All of the HTML-generation code must obtain the necessary data from the array. You should not assume that the array will always contain details of exactly five sections. You do not have to use the section names shown below but the maximum marks must add up to 100. All of the comments fields should initially display “Enter Comments” Each drop-down menu should contain all of the integers from 0 to the maximum mark for the section.
Exercise 3 – Word Count [40%]
The requirement for this exercise is to write JavaScript code to extract the text from an external web page and count the number of occurrences of each word in the text. The results should be presented in a table displaying each word and its number of
occurrences. To gain more than 30 of the 40 available marks you must provide some facility to allow the user to select whether the results are displayed in alphabetical order or in frequency order. (One way of doing this is to respond to clicks on the column headers, another option would be to use buttons.) You may assume that the web page will be on the same file system as the web page written for the exercise. You may also assume that the web page comprises correctly-formed XHTML. A wor is to be regarded as any sequence of non-white-space characters within a text node so in the following simple web page the words are Hello , world! , Click , here , and Goodbye (with world! having two occurrences). Words are to be regarded as case sensitive so The and the should be viewed as different words; for the purpose of alphabetical ordering you may use the ASCII ordering so that words beginning with an upper-case letter will precede all words beginning with a lower-case letter.
You should refer to pages 39-42 of the Undergraduate Students’ Handbook for details of the University policy regarding late submission and plagiarism; the work handed in must be entirely your own. It is expected that marking of the assignments will be completed by the beginning of week 23.
The assignment comprises three independent exercises. They are not equally weighted.
Submission and Marking Criteria
Copies of all code (including CSS, JavaScript and HTML files) must be submitted to the online submission system by the deadline in a single .zip or .7z file. (Marks will be deducted for files submitted in any other format.) You will also be required to demonstrate your solutions in the lab in week 21 or week 22 – 10% will be deducted from the mark for any assignment that is not demonstrated in the lab (unless there are genuine extenuating circumstances that prevent attendance at both labs).
Other than where specific instructions have been given about coding (e.g. the use of an array of objects in exercise 2) the only criteria to be used for marking of this assignment are that the web pages have the correct behaviour, and, where appropriate, the required style. You may use JQuery but are not required to do so.
Exercise 1 – Dynamic Data Table [30%]
The requirement for this exercise is to use JavaScript (together with CSS and HTML) to produce a dynamic table of data listing conversion between distances in miles and kilometres. The web page must obtain from the user the range in miles of the distances to be displayed and produce a table showing each distance in the range alongside its equivalent in kilometres, which must be displayed to exactly three decimal places. (The miles values should be inetgers.) The JavaScript should be invoked by a button-click.
Table header cells must be styled differently from data calls; alternative rows must have different background colours.
Text box input fields should be used to enter values for the start and end of the range. Validation should be performed – the first value must be a positive integer and the second value (if supplied) must also be a positive integer. An error message should be displayed if the validation fails. The second value is optional – if none is supplied you should use a default of 0. The user may enter the two values in either order but in all cases the table should be displayed in ascending order (i.e. starting with the smaller of the two values).To perform the conversion note you should assume that 1 mile is equal to 1.6093 kilometres
Exercise 2 – Marking Form [30%]
This exercise requires the creation of a marking form for an assignment. Your solution should have components as shown below and also display the total mark, which should be updated as marks are entered; there should also be a Clear button, which when clicked, should clear all of the comments and reset all marks to 0. The form must be created using JavaScript. The details of sections (i.e. their names and maximum marks) must be stored in an array of objects (one section per object) so that it is easy to change these details by changing the initialisation of the array in one place in the JavaScript file; the objects in the array must not themselves be arrays. All of the HTML-generation code must obtain the necessary data from the array. You should not assume that the array will always contain details of exactly five sections. You do not have to use the section names shown below but the maximum marks must add up to 100. All of the comments fields should initially display “Enter Comments” Each drop-down menu should contain all of the integers from 0 to the maximum mark for the section.
Exercise 3 – Word Count [40%]
The requirement for this exercise is to write JavaScript code to extract the text from an external web page and count the number of occurrences of each word in the text. The results should be presented in a table displaying each word and its number of
occurrences. To gain more than 30 of the 40 available marks you must provide some facility to allow the user to select whether the results are displayed in alphabetical order or in frequency order. (One way of doing this is to respond to clicks on the column headers, another option would be to use buttons.) You may assume that the web page will be on the same file system as the web page written for the exercise. You may also assume that the web page comprises correctly-formed XHTML. A wor is to be regarded as any sequence of non-white-space characters within a text node so in the following simple web page the words are Hello , world! , Click , here , and Goodbye (with world! having two occurrences). Words are to be regarded as case sensitive so The and the should be viewed as different words; for the purpose of alphabetical ordering you may use the ASCII ordering so that words beginning with an upper-case letter will precede all words beginning with a lower-case letter.
Hello world!
Click here
Goodbye world!
2017-02-12
You should refer to pages 39-42 of the Undergraduate Students’ Handbook for details of the University policy regarding late submission and plagiarism; the work handed in must be entirely your own. It is expected that marking of the assignments will be com