caleb531 / cougarbooks Goto Github PK

According to the prompt for phase 3 of the project:

Show the content of the tables after populating them with some sample data

As needed, you can refer to the current SQL database implementation at misc/db-implementation.png.

You should provide basic logging on users including login/logout, data added, data deleted, and so on. Make sure to provide an administrative access system to add/edit/delete users, list users/data/transactions in certain ways, etc.

• Create search.html with essentially same list of textbook ads from homepage
  • Page should have a h1 heading containing the title Search Results

Note: The completion of this task is dependent on the completion of #4

Add PHP code to implement ad search. Search SQL query should utilize the LIKE operator, combined with OR, to search across the following ad fields:

• Book Title
• Book Author
• Book Edition
• Book ISBN

Write PHP for the homepage so that a arbitrary number of most-recent ads are displayed. Note that this issue is dependent on the completion on #21, since you cannot determine which ads are most recent without such an attribute on each ad.

I have uploaded the Information Flow diagram. Please review it and give any feed back you have on it.

Diagram is in misc folder titled "information-flow-diagram.pdf"

• Make all password inputs type="password" to hide the user's password as they type
  • Currently, all password fields on the site are of type="text", which is insecure

• Create my-ads.html which lists all of the open textbook ads for the current user
  • The layout should be the same layout as the list of textbook ads on the homepage and search pages

Note: The completion of this task is dependent on the completion of #4.

Write PHP for individual Ad page such that when the ad_id is provided in the URL (e.g. ad.php?ad=4), the relevant ad info is displayed. Feel free to use the $db->get_ad() function I've already written to get this info; it accepts the ad ID as its only argument.

Each ad should have a date_added field, so users and administrators know how old an ad is.
The field must be added to:

• The Entity Relationship Diagram (ERD)
• The database implementation
  • CREATE TABLE statements
  • INSERT statements
  • SELECT queries

• Create data by users
• Update data by users
• Delete data by users
• Search data by users
• Listing data
• User Interface
• Validation
• Source control
• Coding style and comments
• User and login management (related to #22)
• Administrative backend (also related to #22)

@evancausey, @sasfirane, @kevinmata, @Enlumis, @morenocortes:

What we discussed and agreed on at today's meeting:

@evancausey

• Will redesign the ERD and database schema/implementation, posting them to GitHub by Thursday night

Once Evan posts the revised ERD on GitHub, everyone needs to check GitHub and give their feedback on the design. Once we come to agreement, we can proceed with:

• Illustration SELECT queries (#16)
• Description of how webpages will work with database (#14)
• Tables populated with dummy data (#15)

To make PHP database interaction easier, create a Database PHP class (perhaps under assets/php/database.php, assuming you include() file in head.php). Database class must use PDO to interact with database; see my demo for example usage.

Minimum required functionality

• Connect to database
• Run any arbitrary query; it may be desirable to integrate automatic variable interpolation and sanitization/escaping for convenience
• Close database connection

• Create ad.html which displays the information for an individual textbook ad
  • Page should contain dummy textbook information and screenshot
  • Poster's contact information should be listed at the bottom of the page

Add PHP code for a basic user sign-in/sign-out system, including:

• Signing in
• Signing out
• Password storage
  • Only a salted SHA256 representation of the password should be stored in the DB
  • Possible choices for salt could be auto-incremented user ID, email address, etc.
• Logging this information per #22
• Navigation and page controls should be displayed (or not) depending on the sign-in state (i.e. user is signed in or not).

The ID of the signed-in user, as well as a flag indicating that someone is signed-in in general, will need to be made accessible somehow (variable or property or whatnot) so other pages can access them.

• Add PHP and SQL for fields on Post New Ad page
• Implement upload functionality for the "Book Photo" upload input (in post.php). The file should be uploaded to some directory on the server (where all uploaded images will be stored). The path to the photo will be stored on the ad table for that particular ad entry.

Write the PHP for the Account page such that:

• The fields are populated with the data of the currently signed-in user
• The fields can be changed and saved to the database
  • Create a file under assets/php/ called account.php which will process the form data (should be via $_POST)
• The page should display an error message (via PHP if the page is accessed by a user who is not signed in ($_SESSION['signed_in'] === false)

See the PHP for other pages on the site to learn the style/organizational conventions we've adopted.

• Add HTML for textbook ad listings to the homepage
  • Use placeholder (dummy) text for the titles, descriptions
  • Use external image URLs of dummy textbook covers for the textbook screenshots
  • Entry should have h2 heading containing book title (with other fields listed underneath heading)
  • Heading must contain link (<a>) pointing to ad.html
• Style textbook ad list and list items using CSS
  • Maybe use display: inline-block with a fixed width for each ad so we can fit up to two on the same line

• Create an information flow diagram which models how data flows between the database and the front-end website.
  • Place the finished IFD image in the misc/ directory as info-flow-diagram.png (.jpg is fine, too)

Attached below are some slides from the lecture, for reference:

@evancausey: you're our database guru, so are you up for taking on this task?

Thanks,
Caleb

• Add a new Description field to the form on the "Post New Ad" page, allowing the user to enter a short description of anything else potential buyers should know about the book.
  • Add <textarea> with appropriately-named id
  • Add associated <label> element
  • Field should be the last field in the form

• Add a price field with a dummy price for every book
  • index.html
  • search.html
  • my-ads.html
  • ad.html
  • post.html

From the prompt for phase 3 of the project:

(create) an illustration on how your test SELECT queries actually work with the table(s) on MySQL

As needed, you can refer to the current SQL database implementation at misc/db-implementation.png.

• Add form field to post.html containing an upload input (<input type="file" />) where the user can upload a photo of the book they are posting.

• The following form fields should have validation using the following regular expression patterns
  • Fields
    • Email (pages: register.html, sign-in.html, account.html)
    • Phone (pages: register.html, account.html)
    • Book ISBN (pages: post.html)
• The following form fields should be required (non-empty) for form submission (using the HTML5 required attribute on the respective <input>):
  • Markup or styling should be added to required fields to indicate that they are required
    • Perhaps an asterisk next to each required field's label (possibly a red asterisk), along with a message above or below form indicating that the asterisk indicates a required field
  • Fields
    • First Name
    • Last Name
    • Email
    • Password / Change Password / Confirm Password
    • Book Title
    • Book Author
    • Book ISBN

Example

<input class="email-field" type="text" pattern="\s*[^@]+@[^@]+\s*" required />

The documentations of previous phases should be summarized into your final report to be turned in along with your complete Web pages and the previously submitted phases of the project in a zip file as an attachment in your Cougar Course submission. Your final project report must be in a word processor format and consist of the following sections:

• Project description
• Specifications
• User’s Manual
• Web Pages and Their Interrelationships
• Database Design and Implementation
• Web Design Issues such as resolved difficulties, possible future improvements and enhancements
• Web Implementation Details including all the directories, names, passwords, etc.
• The individual contribution of each member

From the prompt for phase 3 of the project:

(write) a description on how some of your Web pages are supposed to interact with your database(s), i.e., what queries will be posted from which pages and how the results will be displayed in those pages

As needed, you can refer to the current SQL database implementation at misc/db-implementation.png.

• Create description of database interaction

• Add a phone number field, where the user can input a contact phone number (this is displayed with all textbook ads the user has posted)
  • Register page
  • Account page

• Add a page named sign-out.html which contains a message to the user indicating that they have been signed out

  • The page HTML should have a meta refresh which redirects the user to the Sign In page after 3 seconds:

  <meta http-equiv="refresh" content="3; url=index.html">

Write PHP for My Ads page such that the page only lists ads for the logged-in user. Until the sign-in functionality is written, you can use an arbitrary user ID for testing (e.g. user_id = 2).

P.S. To get the path to the book image (for use in <img src="...">), use:

AD_PHOTO_PATH_BASE . '/' . $ad['path_to_picture'];
// where $ad is the associative array with the ad's attributes

The alt attribute for the book img should be set to the book's book_title.

Due Date: Thursday, December 8 (presentation and submission)

You will present your project at 2:30 – 3:45 pm on Thursday, December 8, 2016. The presentation is worth 10 points of the project. Each team will be given about 10 minutes to present the project and answer questions during the last class period. During the presentation, you first share the problem to be solved with the class, identify the environment, and explain the input and output of the problem. A few Web transactions need to be demonstrated and explained. Attending all presentations is required and counted as part of the grade. All presentation materials including the Powerpoint file must be submitted on Cougar Course by 2:30 pm on Thursday, December 8, 2016.

Things to pay attention to:

• Powerpoint presentation including major points in your final report
• Explanation of your project
• Possible enhancements
• Demonstration of your system
• Contributions of each group member

During the project presentation, every member of a group must take turns to present the part of the project he or she is the main contributor.