HTML代写:CS219 Developing the Course Site Generator App

代写一个课程网站的前端GUI,纯粹使用HTML构建网站。

Requirement

In this assignment you’ll continue to work on the TA Manager application you worked on in HW 1. If you like, you can use your own solution as your starting point, or you may download a solution and work from that.

TA Manager - Required Functionality

The TA Manager that we’ve been working with provides some basic functionality for editing TA office hours, now we’ll make it even more useful. Once completed your application should do all of the following:

  1. Email validation - so far we’ve allowed any old text, including just spaces, for our email addresses, but now we want to be a bit smarter. Use a regular expression to verify that an email address is in the proper format. Note, you may use code from the provided example.

  2. Editing Existing TAs - at the moment we can add TAs and delete them, but not edit them. Change this such that when a TA is clicked in the table, that TA’s name and email are loaded into the proper text fields and the Add TA button is changed to read Update TA. Pressing this button should change the loaded TAs name/email accordingly, including in the office hours grid (if the name changes).

  3. Add a Clear Button - next to the Add/Update TA button, add a button that simply reads Clear. When pressed, it would clear out the name and email text fields and toggle the Update TA text on the button back to Add TA. It should then give focus to the name text field so that the user may enter data for a new TA.

  4. Start and End Time Combo Boxes - at the moment the start and end times for our office hours grid are fixed. Add two labeled combo boxes to the right of the Office Hours Grid such that they look nice and neat, aligned to the right. Each combo box should have all times from 12am to 11:30pm with all 1/2 hour increments, so this means 48 options each, such that we can save using the same JSON format and it can load into our Web page. Each combo box should have all times on the hour from 12am to 11pm, with 1 hour increments, so this means 24 options each. The user should be able to change the start and end times for the currently edited office hours in the grid by selecting values in these combo boxes. Note a few important things:

    • Load these properly from files - when office hours from a file are loaded these combo boxes must also load properly

    • Start Time must be before End Time - do not allow the user to pick a start time after the current end time or an end time before the current start time

    • Validate Start/End Times that affect office hours - should the user pick a start or end time that would affect current office hours, removing those office hours must be verified by the user via a dialog box. So, for example, if a TA has office hours scheduled in the grid at 9am and the user changes the start time to 10am, it would require that change to be verified with the user via a dialog box before just removing those office hours.

  5. Undo and Redo - the user should be able to Undo and Redo any operation, like adding a TA, removing a TA (and all their hours), changing TA info, changing start and end times, etc. Every edit that effects change should be undoable. Undo should work via CTRL-Z. Redo should work via CTRL-Y. Note that Undo should be scoped per session, meaning you do not have to save your transactions to a file. Note that I have provided you with the jTPS Framework, which can manage transactions for you, but note that you’ll have to define all of your own transaction objects in order to get this to work.

  6. Save As - add another button to the file toolbar such that you’ll now have Save and Save As buttons. Note that the icons are already included in the project. The Save button should not ask the user for a file name each time one saves, the Save As button does, in order to make a new file.

  7. Export Syllabus - add an Export button to your file toolbar which when pressed, prompts the user for a directory, and once the user does so, exports the full contents of the TAManagerTester’s public_html directory, so this means the syllabus.html file and all referenced directories and files. Note that the one file that would be different with each export would be the OfficeHoursGridData.json file, which would contain the contents of whatever office hours file is currently being edited. Note that regardless of what the current office hours grid json file name is, it has to be exported as OfficeHoursGridData.json so that the Web page’s JavaScript loader can find it.

  8. More Fool Proof Design - note that controls that are not currently usable should be disabled. This is something you’ll need to be concerned with for your newly added controls

  9. Attractive, Bug-Free Application - make sure any new controls you add look nice and suit the User Interface.

Version Control

Again, you are still required to make use of version control. Be sure to commit your work to BitBucket after every major revision, meaning early and often. Be sure to provide good messages specifying what changes you’ve made.

Handin Instructions

When you are done, zip up and submit all projects you made changes to. Note that you should add your name as a co-author to any source file you make changes to.

Grading

Note that grading for this assignment will be done using the HW 2 Grading Criteria spreadsheet, which will be posted one week before the due date. Most of grading will be based on program performance and will only be done by appointment with each student’s prescribed Teaching Assistant. This part of your grade will be based on how well your program performs specific required tasks. Additional points may include proper use of tools and code documentation.