Assignment 3 CMPUT 410 (Fall 2004) Due Date (by e-mail): October 29th, 2004 11:59pm Percentage overall grade: 5% Penalties: 20% off a day for late assignments Maximum Marks: 10 You are asked to implement a hotel selection page using a drag-n-drop capability. The page will present the images of 5 hotels. These hotels could be dragged to and dropped on an image of a suitcase to be selected. When a hotel is dropped on the suitecase, the specification of the hotel are displayed in a table. Also on the same table, a user could enter the number of nights to stay at the hotel. When confirmed (by pressing the confirm button) the hotel is added to a second table and a total is adjusted. A hoitel cannot be twice in the list. The latest entry replaces the previous one. If the number of nights is 0, the hotel is removed from the list. The following snapshot shows a mock-up of this interface. If you visit the projector comparison page by InFocus, you will notice that they use a table in which you can drag and drop projectors for comparison. The table is filled dynamically based on the projector dragged and dropped. This interesting inteface built with JavaScript, works on both browsers IE and Netscape (with some problems on Netscape). The goal of this assignment is to develop a web page with Javascript that would allow a user to drag objetcs identifying these hotels. Your script should work well on both browsers (IE and Netscape). The images for your interface can be found here (you can use others): http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/suitcase.gif http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/hotel1.jpg http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/hotel2.jpg http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/hotel3.jpg http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/hotel4.jpg http://www.cs.ualberta.ca/~zaiane/courses/cmput410-04/work/hotel5.jpg There are many javascript packages and examples on-line for draging and dropping objetcts. Some are cross-browsers and some are specific for some browsers. Here are some examples: Example 1 (complete package with many features) Example 2 (simple and very short example) Example 3 and example 4 (Not really a drag-n-drop but same effect with simple click) Deliverables: This assignment is to be submitted via email to your TA. Send only one tar file that contains all that you are submitting: HTML file JavaScript files if necessary If you use Javascript packages that you downloaded from the Internet, clearly indicate which packages you used and the source. You sould also inlude them in your tar file. If you are using images, do not send them but link them from your HTML/Javascript to your web directory.