Program cgs4854pgm2_6Summer2021 CGS 4854 - Website Construction and Management Professor: Michael Robinson e-mail : michael.robinson@cs.fiu.edu ****************************************************************************** * !!!!*** USE THE TOOLS THAT WE HAVE LEARNED IN OUR CLASS ONLY ***!!!! * ****************************************************************************** -------------------------------------------------------------------------------- Worth 6 Points - Make sure your program is properly documented and aligned uniformally, looking professionally, I will take points off if it is not. - Include the following documentation in EVERY web page: Purpose of this program: ------------------------------ - Create this assignment using an editor only, NO TEMPLATES OR IDES ALLOWED. - Extend your current website, creating the new pages described below, using HTML, CSS and PHP. 1 - Create a NEW header page named YourLastName_header.php save it inside your includes folder, displaying the following (centered): ====This is a Teaching Website==== Your Full Name ______________________________________________________________________________________ The First line can be any color, any font, any size Your Full name can be any color, any font, any size The horizontal line MUST BE green Any background color is allowed, if you want to use one. 2 - In your index.html, add two NEW html hyper links. - The first hyperlink named Home will execute you index.html file, - The second hyperlink named program2.php saved in your includes folder and displayed as Program 2, to the right of your current pgm1 label, - and rename your pgm1 label to Program 1, LEAVING THREE SPACES BETWEEN EACH LINK to display the following hyperlinks menu (centered): Home Program 1 Program 2 a) When you press your "Home" hyperlink, it will reload your Home page b) When you press your "Program 1" hyperlink, it will load your pgm1.html c) When you press your "Program 2" hyperlink, it will load a NEW page named program2.php located in your includes folder. 3 - a) Create a new page named mainMenu.php. Save it in your includes folder, which will contain your NEW CSS dropdown menu See the instructions to create your dropdown menu, learned in class at: http://users.cis.fiu.edu/~mrobi002/teaching/cgs4854/CSS/cssDropdownMenu.html Note: Not all the code in the previous cssDropdownMenu.html code sample is needed for this step, Make sure you can call all the pages created in program one, from this new CSS3 menu. Choose whatever colors, fonts and sizes you want for your mainMenu.php This mainMenu.php is to be called from anywhere in your webpages using the following command: b) This new CSS3 dropdown menu, LEAVING THREE SPACES BETWEEN EACH LINK, should look as follows: Home Program 1 Program 2 c) When you hover over the Program 1 CSS link, it will show a dropdown menu that will have ALL the Program 1 links you had in your index.html file, but this time we are creating them using CSS dropdown links as follows: program 1 page1 page2 page3 page4 Home Each one of the CSS dropdown links MUST take us to their corresponding pages, that where used in the html hyperlinks in pgm1. d) When you press the Program 2 CSS link, this link will load your new page named program2.php located in your includes folder. 4 - Creating program2.php located in the includes folder (see question 1). a) Call your YourLastName_header.html program leave one empty row b) Call your mainMenu.php program leave one empty row c) Create the following Front End page using: 1) 9 Regular Text Input fields leave one empty row 2) Create the four Input Radio Buttons shown on the front end below 3) Create the four Input Checkboxes shown on the front end below leave one empty row 4) Create the dropdown input field shown on the front end below leave one empty row 5) Create the TextArea Input field shown on the front end below leave one empty row 6) Centered, display the word $message leave one empty row 7) Create 4 Regular Submit buttons (Save Find Modify Delete), leaving 4 spaces in between 8) Create one ClearScreen button that will clear the screen ONLY, leaving 4 spaces before it leave one empty row 9) Display your mainMenu.php program In the following order: ====This is a Teaching Website==== Joe Smith _______________________________________________________________________________ Home Program 1 Program 2 Telephone ________________ Email _______________________ Last Name _______________________ First Name _______________________ Address _____________________________ City _____________ State _____________ Country _____________ Zip _________ Coffee o Light o Cuban o Sweet o Decaf Major [] IT [] CS [] Robotics [] Cyber Dropdowns ___________________^ Comments ---------------- | | | | ---------------- $message Save Find Modify Delete ClearScreen Home Program 1 Program 2 - MAKE SURE THAT YOUR ENTIRE FRONT END IS TOTALLY ALIGNED AS SHOWN ABOVE. - On your html Title tag display your last name, first name initial, and Program 2 5) When you press any of the first four(4) buttons (Save Find Modify Delete), call a new page named Controller2.php, located in the includes folder, and display the following: a) This is controller2.php b) Called from program (the program you called it from) Home, Program 1 or Program 2 c) Display ALL labels from program2.php front end with all the inputed corresponding data d) Display the name of the submit button that was pressed on the front end of Program 2 example: "You pressed the Save Button" "You pressed the Find Button" "You pressed the Modify Button" "You pressed the Delete Button" 6) When you press the ClearScreen button, it will ONLY clear the screen Special Instructions: --------------------- - Additional code examples to help you with this program: http://users.cis.fiu.edu/~mrobi002/databases/cgs4854/ https://users.cs.fiu.edu/~mrobi002/teaching/cgs4854/CSS/cssDropdownMenu.html Submission of program 2: ------------------------ 1 - Zip your public_html folder and rename it as follows: your last name, first initial of your first name, pgm2, zip and upload it to CANVAS when this program is due, or before. If you have any questions, please 1 - Email me at anytime, at michael.robinson@cs.fiu.edu using your FIU email *** PLEASE REMEMBER, WE ARE HERE TO HELP YOU ***