代写COM6034、代写Java，c++编程

日期：2023-07-05 09:16

COM6034 Website Engineering

Assignment 1: Programming with jQuery, Ajax and the Laravel Framework

Version 1.0, updated May 15, 2023

Assignment objectives

Restructure the lv-bookstore application (provided in Lab 3A) based on the HTML5

standard. Enhance the application by using CSS3, jQuery and AJAX. Implement an

AJAX book search function with results displayed in a locally-sortable HTML table.

Enable user authentication and implement a BookRequest module for

authenticated users to request books. Data validation must be performed during the

form submission at the server side.

Due date

July 12, 2023 (Wednesday), 23:59

Standards/Technologies involved

HTML5, CSS, jQuery, AJAX, PHP, Laravel Framework

Specifications

Part A: the following tasks (1-8) are related to Labs 1, 2 and 3A only.

1. Before you begin, download the lv-bookstore application (Lab 3A model answer)

and use it as a starting point of your application. Please unzip the file and rename

the folder from lv-bookstore3A to lv-bookstore. In the resources/views/books

folder, replace index.blade.php with the content of index2.blade.php, and replace

show.blade.php with the content of show3.blade.php.

2. Apply the CSS3 template provided in Lab 1B to the lv-bookstore application.

Restructure the HTML to make full use of the HTML5 semantic elements (header,

nav, section, article, aside and footer). You may need to modify layout.blade.php

and other view scripts.

3. Fine tune the CSS3 with anything you like and make it visually different from the

original template; specifically, please change the color, font size, fonts, and

shadow.

4. Include a “Search Box” for books as an aside section (you may place it either on

the right side or on the left side) in index.blade.php. Implement the book search

function: instead of showing the search results on another page, use the jQuery

ajax function to load the results and display it in the main article section of the

index page. You may need to implement a search method in the application

controller to handle search requests (see Resource 1).

Page 2 of 4

5. The search results should be shown in an HTML with the following

columns: title, author, publisher, price and book cover image.

6. Make the search results table locally-sortable at the client side, which is similar to

the home exercise of Lab 2. (see Resource 6).

7. When a user clicks on a book cover image, there should be a pop up window

showing a larger image. There should also be a link or button shown in that

window for closing the window. Use jQuery statements.

8. The table rows should be in zebra striping colors (3 colors to be used). (see

Resource 7).

Part B: part of the following tasks (9-13) is related to Lab 3B. You may wait until

Lab 3B before doing these.

9. Implement a BookRequest module for users to request a book and specify a

pickup date. Create a BookRequestController for this function (see Resource 2).

10. Create a BookRequest model, with migration. Customize the generated

migration and use it to create the database table. Information required for the

BookRequest model is: aliasname, mobile, email, book_name, pickup_date. Use

appropriate data types.

11. Design a Book Request form (see Resource 2). Perform form validations in the

Store action of BookRequestController before saving the data into the database

(see Resource 3). The validation rules are as below:

a. aliasname: required and at least 8 alphanumeric characters

b. mobile: required and equal to 8 numbers

c. email: required and must be a valid email pattern

d. book_name: required and at least 10 alphanumeric characters

e. pickup_date: required and must be a date format

12. Use jQuery UI DatePicker plugin for the pickup_date field of Book Request

form. (see Resource 4)

13. Enable user authentication (see Resource 5) for this application. Only

authenticated users can access the BookRequest module and submit a book

request to the server. Guests attempting to load the Book Request form should be

redirected to the user login page. For simplicity, you do not need to establish a

relationship between the users table and the book request table.

*Make sure that your HTML markup conforms to the HTML5 standard.

Page 3 of 4

Resources

Deliverables

? The final lv-bookstore.zip file with all html, php, css, js and media files you have

used.

? JPG files of screenshots. Sometimes, there are misalignments on the machine we

use for grading due to different screen resolutions.