This assignment consists of TWO (2) parts, you are required to find another group member and complete both parts.

computer science

Description

Learning Outcome Assessed

 

LO1

Applying the basic syntax for writing JavaScript scripts.

LO2

Integrating between HTML and JavaScript.

LO3

Applying conditional statement, looping, function in JavaScript.

LO4

Applying HTML DOM with JavaScript to create dynamic HTML.

LO5

Creating JavaScript-based application.

 

Description of Assignment

This assignment consists of TWO (2) parts, you are required to find another group member and complete both parts. You are required to record a video to present your work. Presentation requirements will be sent in a separate file.

 

PART A [40%]

 

Question 1 (10%)

 

Write a HTML document that allow user to determine the range of a random number by using two sliders. User can specify the total number of random numbers needed within the range and specify whether the repeated random number is allowed. User can only generate one random number when clicking to a button, named as ‘Generate’. When first random number generated, the input for the total number of random numbers needed should not be changed again. The ‘Generate’ button will be disabled once all the random numbers have been generated and a ‘Reset’ button will show to reset the settings. All the random numbers must be displayed through a list and the current random number must be highlighted in red color. Prompt alert message to user when any invalid input found, such as the starting value is larger than the end value, total number of random numbers exceeds the boundaries etc. Write a JavaScript to handle the scenario that described above.

 

Question 2 (10%)

 

Write a HTML document that allow user to choose a specific date or today’s date, input a temperature (in Celsius or Fahrenheit) and weather symbol. Write a JavaScript to append for each record entered by user to the last record of a displayed table. The table should be displayed according to the given format below:

 

Date

Day

Temperature

 

 

 

28/02/2020

Tue

31

88

 

 

 

(NOTE: For the weather symbol, you need to provide basic choices, such as Sunny, Cloudy, Partly Cloudy, Thunderstorms, Drizzle, Rain, Heavy Rain, Snow, Windy and Fog into the selection list. Besides, find symbols to represent the weather are needed.)


 

Question 3 (10%)

 

Write a JavaScript to disable a checkbox to prevent the user from agreeing a ‘Terms and Conditions’ before reading it (/scrolling it) till the end. (NOTE: You can adopt any Terms and Conditions from the web, ensure the length at least 1 full page and display it in a scrollable panel to complete this question)

 

Question 4 (10%)

 

Write a HTML document that provide user to enter multiple lines of plaintexts and add a JavaScript to style the input and output them according to the format stated below:

 

You may give them the option as stated below such as bold, italic, underline etc and display the output accordingly.

 

Format

Description

Output

*this is a bolded text*

Bold

this is a bolded text

\this is an italicized text\

Italic

this is an italicized text

_this is an underlined text_

Underline

this is an underlined text

-this is a strikethrough text-

Strikethrough

this is a strikethrough text

#this is a highlighted text#

Highlight

this is a highlighted text

 

 

PART B [60%]

 

You are required to create a to-do-list in JavaScript based. This application must cover basic features, such as add, edit and remove an item from the list. Upon adding an item, user can define the priority of it (allow the user to choose). There are three different levels of priorities, which are high, medium and low priorities. Each item must be arranged according to the priority set with highlighted background color – high – red, medium – yellow and low - green). For an example, all the items that set in high priority must be placed on top of the list. The design and outlook of the list is based on your creativity, for instance, you may use three colors to differentiate the different level of priority. You can use any external open source library (with proper citation and acknowledgment required) in order to enhance the visual effect or to achieve something needed for your application. You are also encouraged to add any extra feature that suit the need of your application for rewarding some bonus marks.


Instruction Files

Related Questions in computer science category