TASK You are to create a forum website based on the descriptions below, that allows users to
Question:
TASK You are to create a forum website based on the descriptions below, that allows users to sign up and create topics and posts on those topics. SET-UP Create a folder on http://webprog.cs.latrobe.edu.au/ for your assignment. Download the files on LMS and place in this folder. "Functions.php" contains useful functions that you will need to complete the assignment. Some other files have code provided for you. SQL Create a database and the three tables using the phpLiteAdmin (inside the database directory) as follows: Database Name as 'Forum.db' Tables The first table should be named 'User', with attributes as follows: UserID, Integer, Not Null, Autoincrement, Primary Key UserName, Text, Not Null FirstName, Text, Not Null SurName, Text, Not Null Tag, Text The second table should be named 'Topic', with attributes as follows: TopicID, Integer, Not Null, Autoincrement, Primary Key UserID, Integer, Not Null DateTime, DATETIME, Not Null Topic, Text, Not Null The third table should be named 'Post', with attributes as follows: PostID, Integer, Not Null, Autoincrement, Primary Key UserID, Integer, Not Null TopicID, Integer, Not Null DateTime, DATETIME, Not Null Post, Text, Not Null Likes, Integer, Not Null, default: 0 COLOUR SCHEME Each student is assigned a colour scheme, these schemes are provided on LMS. You must use these colours for the main elements. You may use black and white for borders, effects and text. HTML, CSS AND PHP - PART 1 For the pages: Forum.php, Homepage.php, SignIn.php, SignUp.php and Topics.php Create the divs with the appropriate ids "header", "nav", "content" and "footer" The header should be stylized such that it stands out, contains a different background color, font color, font and font size (not automatic), using h2 tag and contains "CSE4IFU" and the purpose of the page. For example: The footer should be stylized such that it stands out, contains a different background color, font color and font (not automatic), using h3 tag and contains Full name as it appears in LMS, student number and "CSE4IFU2023, Sem 1". For example:
Ensure that your pages work at this point, if they do not, then do not continue. Marks are not awarded for quantity of work, rather the quality. HTML, CSS AND PHP - PART 2 The nav bar will contain php, such as to dynamically display either 'sign up and sign in' when no user is logged in, or 'sign out and the users information' when the user is logged in. A link to the home page and topics page also need to be included. Stylize the nav bar professionally, and there must be a hover effect. See example below: This will be determined using cookies. You will notice on each content page, that 'getCookieUser' function is called at the start of the webpage. This gets the cookie named 'CookieUser'. 'CookieUser' stores the username of the currently logged in user. Once retrieved it is stored in the php variable $cookieUser. If no user is logged in, then $cookieUser stores "" (see Functions.php for implementation). How to implement if cookieUser is "" then echo the html to show the links to sign up (SignUp.php) and sign in (SignIn.php) Else echo the html to show the link to sign out (LogOutUser.php) and the cookieUser. Ensure that your pages work at this point, if they do not, then do not continue. Marks are not awarded for quantity of work, rather the quality. HTML, CSS AND PHP - PART 3 Create the html form for SignIn.php such that it asks for the username, using "POST" and directs to "LogInUser.php". Stylize professionally. An example is shown below: Create the html form for SignUp.php such that it asks for the username, firstname, surname and short tag using "POST" and directs to "AddUser.php". Stylize professionally. An example is shown below: Add some php code before the html form, that echos $cookieMessage. (This is to display any error messages we will implement later in this document) HTML, CSS AND PHP - PART 4 (Pay attention in this part, most of the code is given to help you with later sections) In AddUser.php: Check if the data from the POST was provided using 'isset', if not echo an error message (This does not need to be formatted). Else Trim all of the inputs from the POST and store in php variables, one example is shown below Prepare, bind and execute the SQL command as shown below: If there is no match, then you need to prepare, bind and execute an SQL statement to insert the user. Note that we do not add the UserID as it autoincrements. Add a cookie message stating the user has been added, and redirect to the homepage. Ensure that you can add a user, check on the admin portal, if you cannot do not continue. Marks are not awarded for quantity of work, rather the quality. HTML, CSS AND PHP - PART 5 In HomePage.php: Add some php code at the start of the content nav, that echos $cookieMessage. When adding a user, you should see your cookie message. Add some welcome information with an image, make the text and image unique (i.e. do not copy what I or other students have) Please use images from: https://unsplash.com/ See license details here: https://unsplash.com/license HTML, CSS AND PHP - PART 6 In LogInUser.php: Check if the data from the POST was provided using 'isset', if not echo an error message (This does not need to be formatted) (Note that only the username is passed this time). Connect to database using the connectToDatabase() function Trim the input from the POST and store in a php variable Prepare, bind and execute the SQL command to check if username exists (use 'COLLATE NOCASE' as done before so that it is a case insensitive search) If there is a match, this means that a user with this username exists and the users can log in. Set the username using the function "setCookieUser()" Set the cookie message to welcome back the user redirect back to the homepage If there is no match, then Set the cookie message to inform the user that the username does not exist redirect back to the sign in page Check that this works, you should see the nav bar change after logging in , if you cannot do not continue. Marks are not awarded for quantity of work, rather the quality HTML, CSS AND PHP - PART 7 In Topics.php: Create a heading "Topics" or similar Create a table (and stylize) with header row containing the columns as shown below: Inside the table you will need to add php code to add the remaining rows dynamically. Connect to the database Count the number of topics in the database by using the following code (this will be used for one of the features covered later) Prepare, bind and execute the following SQL statement. (We order by descending TopicID so the last one added appears at the top) For each row in the database, get the username, datetime and topic Then create the html to display the row in the table (note that the topic needs to be a link as shown) Under the table add the heading "Create a new topic" Add the php code to display the cookie message below this. Then, if the cookie user is "" then display "You must be logged in to create a topic" Else display a form using POST that directs to "AddTopic.php", the form should look like below HTML, CSS AND PHP - PART 8 In AddTopic.php: Check if the data from the POST was provided using 'isset', if not echo an error message (This does not need to be formatted) (Note that only the username is passed this time). Trim the input from the POST and store in a php variable Prepare, bind and execute the SQL command to check if topic already exists (use 'COLLATE NOCASE' as done before so that it is a case insensitive search) If the topic already exists then set the cookie message to indicate that the topic already exists and redirect to the Topics.php page Else Get the id of the user. Set the datetime to Melbourne time using the following code: Insert the topic into the database and then redirect back to Topics.php Check that this works, you should be able to add Topics. Marks are not awarded for quantity of work, rather the quality. HTML, CSS AND PHP - PART 9 In Forum.php: GET the topic named passed, and display this as the heading. Create a table (and stylize) with header row containing the columns as shown below: Connect to the database Get the topicID based on the topic and count the number of posts within this topic Get the posts for the topic using the following SQL statement: Add the rows to the table: Under the table add the heading "Create a new topic" Add the php code to display the cookie message below this. Then, if the cookie user is "" then display "You must be logged in to create a topic" Else display a form using POST that directs as shown below: the form should look like below HTML, CSS AND PHP - PART 10 In AddPost.php: Connect to the database Convert and trim all the inputs Get the userID and topicID (You have done both of these before) Insert the post into the database and redirect back to the forum. Check that this works, you should be able to add Posts. Marks are not awarded for quantity of work, rather the quality. FEATURES This section will now allow you to demonstrate your technical employability skills by implementing additional features. You will need to work out how to do these yourself (you can ask for help from your tutor/lecturer). Feature 1. Likes. Add an emoji next to the number of likes (only when logged in), if the user presses the emoji the number of likes should increase (stored in database) Feature 2. Most popular post Based on the number of likes, the most popular post should be shown on the homepage Feature 3. Limit number of topics and posts Only show a max of 5 topics and a max of 10 posts at one time. The user should be able to click next page to see the remaining. (Hint: Watch the url when watching the video) (Hint 2: Limit and Offset) Feature 4. Sort by name or date created Clicking on 'Topic Name' sorts the topics by name, clicking on 'Date Created' sorts the topics by date (default) (Hint: Watch the url when watching the video) Feature 5. Implement LogOutUser.php Delete the cookieUser. This should be simple and you do not need to connect to the database TESTING To show that your website works and that you can interact with it you must: Add 10 users Have 20 topics (2 per user) Have 100 posts (10 per user) Have greater than 100 likes total (randomly assigned) MARKING GUIDE Topic Task Mark SQL Set-Up User table 2 Topic table 2 Post table 2 CSS (0 marks if incorrect colour scheme) Use of colour, margins, padding and borders 6 Hover on nav 1 Userform styled 4 Tables styled 4 Fonts and font sizes 2 Base Webpage Headings 2 Footer 1 Navigation bar (dynamic) 5 SignIn and SignUp pages 4 AddUser 4 HomePage 4 LogInUser 3 Topics 4 AddTopics 4 Forum 4 AddPost 4 Features Likes 8 Most popular post 8 Limit number of topics and posts 8 Sort by name or date created 8 LogOutUser 2 Testing Users 1 Topics 1 Posts 1 Likes 1
Systems analysis and design in a changing world
ISBN: 978-1423902287
5th edition
Authors: John W. Satzinger, Robert B. Jackson, Stephen D. Burd