Implement the days-to-go feature

Assignment Help Web Project
Reference no: EM131013563

Your Task

"Days-to-Go" is an interesting and useful feature in website design. It shows up the remaining number of days (or even with hours, minutes, and seconds) towards an event. For example, at anytime you visit the official website of Rio 2016 Olympic Game1, you will see such a feature showing the number of days, hours, minutes and seconds towards the starting date of Rio 2016. In this assignment, you are going to write a JavaScript program to implement the "Days-To-Go" feature.

The Concept of Time in JavaScript

In JavaScript a time is defined as a Date Object. Each date object stores its state as a time value, which is a primitive number that encodes a date as milliseconds since 1 January 1970 00:00:00 UTC. Thus, a date later than 1 January 1970 00:00:00 UTC will have a positive time value, whereas an earlier date will have a negative time value. On the basis of the common timeline (which we all live on), the distance between any two dates can be calculated using their time values in milliseconds. Figure 1 illustrates the concept, where C is a date earlier than 1 January 1970 00:00:00 UTC, and A and B are later with B being further than A.

2436_Difference Between Two Date Instances.jpg

Functional Requirements

Constants and Variables

Within the script section, create constants and variables following professional conventions and initialise them using right values. Some constants and variables have been suggested in the following tables. You should create more when necessary.

Table 1: Constants

Description

Value

Number of milliseconds in a day

1000*60*60*24

Number of milliseconds in an hour

1000*60*60

Number of milliseconds in a minute

1000*60

Number of milliseconds in a second

1000

Table 2: Variables

Description

Initialising value description

Type

Name of the event

The name of Rio 2016 Olympic Game

String

Year of the event

The year of Rio 2016 Olympic Game

Number

Month of the event

The month of Rio 2016 Olympic Game

Number

Day of the event

The day of Rio 2016 Olympic Game

Number

Calculation

1. Create a Date object for the date of the event by using the variables created previously.
• Send the object constructor the variables (not values) for year, month, and day of the event;
• Mind the order of arguments sent to the constructor;
• Note that month numbers begin at 0 for January, 1 for February, and so on;

2. Create a Date object for the current time.

• No arguments need to be supplied to the constructor.

3. Calculate the difference between the current time and the event time:

• Use the getTime() member function to get a Date object's time value in milliseconds
• Deduct the time value of current time by using the value of event time.

4. Calculate the number of days to the event:
• Divide the time value difference by the number of milliseconds in a day.
• Use the Math.floor() function to reduce the result number to an integer.

5. Calculate the number of hours, minutes, and seconds in the remaining time value:
(a) Mod the time value difference by the number of milliseconds in a day;
(b) Divide the mod result by the number of milliseconds in an hour;
(c) Use the Math.floor() function to reduce the number to an integer for the number of hours;
(d) Repeat Steps (a) to (c) to calculate the number of minutes and seconds. You may need to update the calculating formula accordingly.

Presentation

Figure 2 shows a sample output when running the "Days- To-Go" program. Note that

- the information should be displayed using the alert() function;
- wherever possible you should use variables in expres- sions instead of explicit values (e.g., literals and num- bers), for example, using the variable created for the event name instead of a string value of "RIO 2016";
- the layout of output may vary depending on web browsers.

Testing

887_Difference Between Two Date Instances1.jpg

Figure 2: Illustration of the Output

Test your program by comparing its calculating results to the Days-To-Go feature on the official website of Rio 2016 (https://www.rio2016.com/en). Note that due to different locality settings on your computer and the Rio 2016 server, your calculation result could be slightly different from that shown on the Rio 2016 website. For example, in a test when my program said "182 DAYS" to go, the Rio 2016 website showed "183 DAYS" - Australia is in almost one day ahead of Rio de Janeiro. Such a difference is not an error and is acceptable.

Non-functional Requirements

Structure of the Source Code

- All code should appear in the script section in the head of the HTML document.

- Do not write any code in the HTML body. All functionality are delivered by JavaScript.

- In the script order your code as follows:

(a) Constants;

(b) Variables and objects (declared and initialised);

(c) Other statements.

Comments

- You are required to add at least three comments to the source code.

- Do not comment every single line, instead, comment on blocks of code with a common purpose.

- Do not simply translate the syntax into English for comments, instead, describe the purpose of blocks of code.

Reference no: EM131013563

Questions Cloud

Write a function that computes distance between two people : Person B starts 200 miles north of the origin and moves south at 70 MPH. Write a function that computes the distance between the two people as a function of t in minutes.
How do find magnetic flux crossing an infinitesimal surface : For what orientation of the infinitesimal surface relative to the magnetic flux density vector is the magnetic flux crossing the surface a maximum?
Explain what a diverse classroom means to you : How will you use student assessment to inform (make decisions) about your teaching?
How do you find the exact value of the line integral : How do you find the work done in moving a test charge by an infinitesimal distance in an electric field? What is the amount of work involved in moving a test charge normal to the electric field?
Implement the days-to-go feature : "Days-to-Go" is an interesting and useful feature in website design. It shows up the remaining number of days (or even with hours, minutes, and seconds) towards an event.
Write the expression for the scalar field : A number equal to the sum of its coordinates is assigned to each point in a rectangular room having three of its contiguous edges as the coordinate axes. Draw a sketch of the constant-magnitude surfaces for the number field generated in this manne..
Draw the new cost function on the graph : Both revenue and cost are in dollars. If the fixed costs to manufacture the cups increases by $100.00, the cost function will change. Draw the new cost function on the graph.
How the united states is viewed by that culture and why : Recommend and support strategies that the first time visitor from the United States can employ to learn about and deal with those norms and perceptions.
Find the distance from the origin to the plane : Write the expression for the differential length vector d l at the point (1, 2, 8) on the straight line y = 2x, z = 4y, and having the projection dx on the x-axis.

Reviews

Write a Review

Web Project Questions & Answers

  Create a complete hi-fidelity prototype using fluid-ui

Create an application that demonstrates competence at using lists and create a sketch, and refine it further to create a hi-fi prototype. Undertake a heuristic usability on this hi-fi prototype.

  Create a basic web page about favorite hobby using html

Create a basic web page about your favorite hobby using HTML.

  Access between dsl and cable modem service

Discover some reliable information telling you about the penetration of broadband service in any nation. The information should indicate a breakdown of access in DSL and Cable modem service

  Describe the differences in developing user interfaces

Describe the differences in developing user interfaces for different application environments and compare and contrast the different types of interactive environments.

  How this system balanced security and usability

A large, fast-food chain unveiled a new touch screen register for its franchises. Each cashier was assigned a user id and password combination to log in to the register.

  What command can combine multiple columns into one

What command can combine multiple columns into one?

  Creating page layouts with css

Creating Page Layouts with CSS," of Adobe® Dreamweaver® CC Digital Classroom this is what I need afew sentences about

  Examine various qualitative and quantitative analytics

Examine various qualitative and quantitative analytics and Conduct an Internet search for a report that compares different analytics tools. The report must not be more than three years old

  Website navigation and development plan

Assignment- Website Navigation and Development Plan, Individual Assignment: Website Navigation and Development Plan

  Write a xml with database with book details

Write a XML with database with book details (BOOK ID, Title, Author, subject, publisher year, language, vendor, and price)

  To produce just the border of the whole table with borders

Trying to make a table with uneven cell sizes. I have made the cells and 2 tables which I'm trying to combine into 1 table and then make borders around that table (and around the cells as well).

  Difference between web applications and a static web site

What is the difference between Web Applications and a static web site and what are the main functions of Web Application Pool Administration?

Free Assignment Quote

Assured A++ Grade

Get guaranteed satisfaction & time on delivery in every assignment order you paid with us! We ensure premium quality solution document along with free turntin report!

All rights reserved! Copyrights ©2019-2020 ExpertsMind IT Educational Pvt Ltd