Flight booking dummy with JS/jQuery

We need a very simple booking prototype using localStorage. You will use canvas to draw the Squares representing the seats. No databases, nothing, only using localstorage. You will create a page with a booking system for a flight with 18 available places, the six first being dedicated to business class and other economy classes. All data in the reservation system must be saved using sessionStorage. This means that you can "jump" between the pages while the current data is retained (persistent)! You must divide the booking page vertically into two parts. When loading the page, a table of three columns and six lines (3x6) should be drawn in the right hand side to represent the aircraft seats. Here it should be stated which seats are available by giving these cells a GREEN background and booked places must have a RED background. In the left part there must be entry fields for first name, last name, social security number (YYYY-MM-DD-XXXX) and class labels (ie business or economy class) and location number. The visitor should be able to click on a free space, that is to say. a GREEN box and then it will change color to BLUE. At the same time, labels for class and place number must be changed to the place chosen and the class in question. The application should check that you can not select an already booked (busy) location and that the plane can not be overbooked! The reservation is saved in an array where the aircraft seats are represented by rows of three places in each row. The design of the array you decide on yourself! In the booking form (left side) you must be able to enter first name, last name and social security number. There must be two buttons, one to complete the booking and one to clear all selections (including seat selection)! When booking, a boardingcard must be printed to a new window. This boarding card must contain first and last name, social security number, place number, and class. Content must be adapted for printing (media print). Boardingcard should be created completely dynamically, so there should be no template file for this, but created from the main document using JavaScript. The generated page (boardingcard) must be validated in accordance with HTML5! Once the button has been pressed to book and the current boardingcard is printed, the flight deck table (right side) must be updated prior to booking the next customer. The form on the left side of the page should be "reset" so the fields for first name, last name and social security number will be blank. All functionality, i.e. JavaScript code, should use addEventListener. When we want to run JS code after the page has been loaded, registration of the window event load must last in your JS file. As a good programmer, you should always define a function before it is used. Avoid writing anonymous functions when registering events when they can not be unregistered from an event easily, without defining the function first, then registering an event with the name of the function! SEATS 1-6 Bussinessclass SEATS 7-18 ECONOMYCLASS