Build a Website

Create a client-side web application that enables a user to search holiday resorts by: Destination (The Alps, Europe, Africa, The Caribbean, Indian Ocean, North and Central America, South America, Asia) Comfort level (Comfort 3star, Premium 4star, Luxury 5 star) Activities (Water skiing, Sailing, Tennis, Scuba Diving, Golf, Hiking, Horse riding, Spa*) Available Date Price The form for the user to enter their search criteria should be written in HTML5 and make use of jQuery UI widgets to ensure consistency, reliability and accessibility. The search criteria will be used to search properties from a JSON file. A JSON file has been created for you to contain 2 holiday resorts. You will add an additional 5 resorts to cover a range of resorts (destination, comfort, activities, price and available dates), to allow the search to return a range of results. Make use of jQuery UI widgets on your form to enhance ALL your form elements. Display the resorts that correspond to the search made by the user on the search page. 10% for search functionality – 10% for the displaying the results in an effective and pleasing way (picture, short description, price). Each holiday resort listed on the result page should have a link that allows the user to visit the corresponding resort page. The resort page should contain a large image, thumbnail images, and a short description of the resort (comfort, activities, price, destination/location). Using your own code or a plugin of your choice, add the facility to view all the resort images. You should have 6 to 8 pictures for each resort. Using jQuery UI tabs, display the resort long description, the accommodation, and a map using google maps (not a picture of a map). Add the facility to save the resort to your favorite list of resorts by dragging the resort to a favorites list on the side, or pressing a “favorite” button or icon. Ensure each resort can only be added once. The user should also be able to remove a resort from the favorite list (by dragging it out of the list or pressing a delete button and clear the favorite list. Add the facility to display your favorite resort list on the search page. Make your search page and your resort page responsive by changing the layout on smaller devices, using hand-written media queries. You are required to have two layouts: large screen and smaller than iPad landscape width (1 breakpoint = 5 per page) Pay attention to Aesthetics, as described below: - the inclusion of visual clues based on groupings; related items or links are grouped together while unrelated items are separated. - use of headings and subheadings to allow visual scanning of content. - use of headings, subheadings, font sizes, bold fonts and italic fonts in proportion to the importance of the item. - alignment of elements on a page so that they are all visually connected; size all elements on the page to create balance and unity; nothing should look out of place unless you have a specific reason for the effect. - choose a font style that supports the site atmosphere and stick to it; limit styles to 2 at the most. - use images and photos for visual appeal and to communicate ideas. - use one set of design elements across your website. - direct the users attention to the important information - harmony and balance