Please suggest me to complete this assignment.

Please check the css, html, .js files

Countdown To...

Event Name: Event Date:

----------------

.js FILE:

-----------

"use strict"; $(document).ready(function(){ $("#countdown").click( function() { var event = $("#event").val(); var dt = $("#date").val();

//make sure task and due date are entered if (event.length === 0 || dt.length === 0) { $("#message").text( "Please enter both a name and a date." ); return; } //make sure due date string has slashes and a 4-digit year if (dt.indexOf("/") === -1) { $("#message").text( "Please enter the date in MM/DD/YYYY format." ); return; } var year = dt.substring(dt.length - 4); if (isNaN(year)) { $("#message").text( "Please enter the date in MM/DD/YYYY format." ); return; } //convert due date string to Date object and make sure date is valid var date = new Date(dt); if (date.toString() === "Invalid Date") { $("#message").text( "Please enter the date in MM/DD/YYYY format." ); return; }

//calculate days var today = new Date(); var oneDay = 24*60*60*1000; // hours * minutes * seconds * milliseconds var days = ( date.getTime() - today.getTime() ) / oneDay; days = Math.ceil(days);

//create and display message if (days === 0) { $("#message").text( "Hooray! Today is ".concat(event.toLowerCase(), "! (", date.toDateString(), ")") ); } if (days 0) { $("#message").text( days.toString().concat(" day(s) until ", event.toLowerCase(), "! (", date.toDateString(), ")") ); } }); $("#event").focus(); });

CSS:

body {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 100%;

background-color: white;

width: 510px;

margin: 0 auto;

border: 3px solid blue;

padding: 0 2em 1em;

}

h1 {

font-size: 150%;

color: blue;

margin-bottom: .5em;

}

label {

float: left;

width: 8em;

}

input {

width: 20em;

margin-left: 1em;

margin-bottom: 1em;

}

#message {

font-weight: bold;

color: red;

}

This exercise asks you to enhance the Countdown application from chapter 13 so it uses objects and libraries Countdown To... Event Name D Event Date: 4 49 day(s) until tax dayt (Mon Apr 17 2017 Open, test, and review the application . Use your text editor or IDE to open the JavaScript file in this folder davaacript jquerylexercises\ch17 countdown 2. Run the application in Chrome, add an event name and event date, and click he Countdown button to see how it works. Then, review the code in the event handler for the click event of the Countdown button. Note that the code is relatively difficult to read and understand Add three JavaScript library files Add three JavaScript files to the application. Name them library event library, validation, and library messages Add script elements to the head element of the index.html file to include these new files. For now,don't worry about the order of the files Use a constructor to create an Event object type in the event library file 5. In the event library file, code a constructior function named Event that accepts two parameters named name and date String Store the values of these purameters in properties of the same name Add another property named date. Set this property's value to a new Date object, passing it the value of the dateString parameter Back in the event handler for the click event of the Countdown button, find he code that loads the data entered by the user into variables named event and date. Replace this code with a new instance of the Event object. Be sure to pass the values entered by the user to the constructor Replace all the code in the event handler thuses the event or date variables with code that uses the name, dateString, or date property of the instance of the Event object. Then, test the application to make sure it still works correctly 6. 7. 8. 9 Add another property named days to the Event constructor This exercise asks you to enhance the Countdown application from chapter 13 so it uses objects and libraries Countdown To... Event Name D Event Date: 4 49 day(s) until tax dayt (Mon Apr 17 2017 Open, test, and review the application . Use your text editor or IDE to open the JavaScript file in this folder davaacript jquerylexercises\ch17 countdown 2. Run the application in Chrome, add an event name and event date, and click he Countdown button to see how it works. Then, review the code in the event handler for the click event of the Countdown button. Note that the code is relatively difficult to read and understand Add three JavaScript library files Add three JavaScript files to the application. Name them library event library, validation, and library messages Add script elements to the head element of the index.html file to include these new files. For now,don't worry about the order of the files Use a constructor to create an Event object type in the event library file 5. In the event library file, code a constructior function named Event that accepts two parameters named name and date String Store the values of these purameters in properties of the same name Add another property named date. Set this property's value to a new Date object, passing it the value of the dateString parameter Back in the event handler for the click event of the Countdown button, find he code that loads the data entered by the user into variables named event and date. Replace this code with a new instance of the Event object. Be sure to pass the values entered by the user to the constructor Replace all the code in the event handler thuses the event or date variables with code that uses the name, dateString, or date property of the instance of the Event object. Then, test the application to make sure it still works correctly 6. 7. 8. 9 Add another property named days to the Event constructor