There’s more files types  to be posted which can’t be upload through the site so will have to email or sent thro dropboxTICKET PURCHASINGProject DescriptionBased on your great work at Creative Genius Web Design, your supervisor has assigned you to a new project to create a simple system to purchase tickets for an upcoming DMWT alumni event. Many interactive web sites use JavaScript to enable dynamic content and enhance a user’s experience using the web site.Below are some screenshot images of what your event registration system should look like when completed. These are screenshots – The images are not clickable.Figure 1: Event Registration Web pageThis is a screenshot – The image is not clickableFigure 2: Error When Putting Invalid Number of TicThis is a screenshot – The image is not clickableFigure 3: Submission Alert When Clicking “Purchase Tickets”This is a screenshot – The image is not clickableFigure 4: Alert When Timer Has ExpiredThis is a screenshot – The image is not clickableProject ComponentsA complete event registration system must feature the following components on the HTML web page:A countdown timer giving the user 10 minutes to complete the transaction, including the number of tickets they wish to purchase, their name, and their email address.Ability to purchase between 1 and 3 tickets.A calculation showing the user the total cost to purchase the ticketsInteractive design features that provide descriptive error messages and visual cues when the user has entered incomplete or incorrect informationProject FunctionalityA complete event registration system must provide the following functionality:1. JavaScript code outside of any functions (Don’t put this functionality within a JavaScript function:(a) Create a countdown timer that will run for 10 minutes from the current time, displaying only the number of minutes and sections left. When displaying a number of seconds less than 10, make sure you prepend a “0” so that the time is formatted properly (Hint: Use an if statement).(b) As each second elapses update the time remaining the user sees on the screen.(c) Once the timer runs out, clear the timer so that it stops running, display an alert to the user their timer has expired, and redirect the user back to the same page (Hint: Use location.href to help with this).2. JavaScript functions (Most likely two or three functions) for the following items:Item #1: Calculate Total(a) Calculate the total (using a fixed-format with a $ and two decimal places) based on a number of tickets purchased.(b) Perform validation to make sure the user has entered in a value that is a number for the number of tickets and the number is between 1 and 3 (Hint: Use the isNaN() function to determine if user entry is not a number).(c) Add an error message next to the input field when an invalid number of tickets has been entered and change the background color of the input field to help alert the user.(d) Display the ability to see the contactInformation section of the webpage when a valid number of tickets has been entered. Hide the contactInformation section of the webpage when a valid number of tickets has not been entered.Item #2: Complete Purchase(a) Perform validation to make sure the user entered in a value for both name and email.(b) Add an error message next to the input field when either a name or email has not been entered and change the background color of the input field to help alert the user.(c) If no errors in the input were found, provide an alert to the user thanking them for their purchase with the total amount of the purchase, and stop the timer. Otherwise, allow the user to continue to make changes until they have provided valid information.Extra Hint:You will be changing the background color for a number of different fields, depending on if an error has occurred or not. Consider making a function that allows you to pass in a field id and whether or not an error occurred to know what color to change the background color to. By doing this, the function can be called repeatedly instead of having to continuously re-write the code needed to do this in your solution.Project RequirementsThe zipped file attached to this assignment provides the folder structure that is required for this project. Instructions for how to unzip the file on a PC or a Mac can be found at http://www.wikihow.com/Extract-Files. Individual files have also been provided.Do not make any modifications to the HTML or CSS files provided. You only need to modify the event_registration.js file. Points will be deducted for modifying the HTML or CSS files.Use // to document your JavaScript code by providing comments that explain the purpose of all lines of code you writeSubmission RequirementsPlease complete the following to you Assignments Folder:Host your working event registration system online using the Nova ServerSubmit the HTML and JavaScript files you used to create the webpage to your project Assignments FolderWrite a Project Reflection (see description below)Project ReflectionAnswer the following questions when you submit your assignments files. Each question’s response must have a minimum content length of 50 words.What resources did you use to determine what type of JavaScript was needed? Include all of the specific URLs you used and what you found at each URLWhat process did you use to create your event_registration.js file? Describe what you did to create the code you submitted in the assignment. Be specific!What issues or challenges did you face completing this project? If you feel you did not face any issues or challenges in completing this project, what issues or challenges do you think someone new to JavaScript might face in completing this project?Describe another scenario that could use what you learned in completing this project. Be specific!If you could waive a magic wand and change something about this project, what would you change and why? If you do not believe anything should be changed, explain why you think this is the case.Please submit your Project Reflection as a Microsoft Word document or just copy and paste your answers in your Assignments Folder’s text box when you submit your assignment along with the rest of the required project files.HTML ValidationYour pages should validate without errors using the W3C HTML Markup Validation Service at http://validator.w3.org.How to do this:Publish your pages to NovaGo to the W3C validator and paste in the URL to your index.html pageSelect the check buttonHelpful ResourcesThis assignment will require you to combine what you have learned interacting with the DOM and performing form validation for success. The links below highlight specific concepts and topics that you will need to learn in order to complete this assignment successfully.Types of Mouse Eventshttps://www.w3schools.com/jsref/dom_obj_event.aspTargeting IDshttps://www.w3schools.com/jsref/met_document_getelementbyid.aspTargeting and Altering HTMLhttps://www.w3schools.com/jsref/prop_html_innerhtml.aspSetting Style Properties for HTML Elementshttps://www.w3schools.com/jsref/dom_obj_style.aspGetting and Passing Attributeshttps://www.w3schools.com/jsref/met_element_getattribute.aspWorking with Numbers in JavaScripthttps://www.w3schools.com/jsref/jsref_obj_number.aspCreating a Countdown Timerhttps://www.w3schools.com/howto/howto_js_countdown.aspDate Referencehttps://www.w3schools.com/jsref/jsref_obj_date.aspJavaScript Window Locationhttps://www.w3schools.com/js/js_window_location.aspJavaScript NaN (Not a Number) Propertyhttps://www.w3schools.com/jsref/jsref_number_nan.aspSubmitting Your AssignmentTo complete this project and receive full credit, you must submit your completed presentation to your Assignments Folder unless you encounter problems–discussed above)..

Do you need a similar assignment done for you from scratch? We have qualified writers to help you. We assure you an A+ quality paper that is free from plagiarism. Order now for an Amazing Discount!
Use Discount Code "Newclient" for a 15% Discount!

NB: We do not resell papers. Upon ordering, we do an original paper exclusively for you.