Assignment 1

Submission

Due: January 29, 2017, Midnight,
A special 0% penalty for submitting by January 31, 2017, Midnight. Normally this is 20%.
Not accepted after January 31, 2017.

Groups

Work in groups of size 2. Both members of the group get the same mark.

Marking

We will be looking for (among other things)...

Simple, clean, clear MVC PHP code. The code does not repeat itself unnecessarily.
Validation of inputs client side (see HTML validation)
Effecive use of HTML5
Validation server side (look into turning off client side validation in the browser to test this). This will include re-population of form fields when appropriate.
Prepopulation of forms where appropriate, for example when updating the profile.
Simple DB schema and effective use of SQL (simple clear queries)
Use of prepared statements
A good strategy to track recent 'iGetIt' or 'iDontGetIt' in the application. This strategy should somehow take into account that some students may re-click frequently, some may not. Take a look at adding a timestamp to the database entries, keeping track of when the user clicked last etc.
Use of some advanced techniques, for example, to template your website, so there is less repeated code in the views.
Great use of form inputs, and of different types.
10% of your mark on this assignment will be as a result of competition between groups. For this, you should add additional features, and clearly identify them to the TAs. Your marks for this part will be based on how interesting, difficult and effective your additional features are.
Your pages should display well under all current browsers, FireFox, Safari, Edge.
An install script should be provided so we can simply install your application in our cs website, using our own postgresql db. It seems to me that we should be able to unzip your application, enter our database location and credentials in one spot, load your schema and run.

Starter Code

Can be found here

Postgresql

You will be using postgresql for this assignment. Andrew Wang has this setup on a special database server for you. You can only reach this server from cs or cslinux. Postgresql database credentials: utorid/last 5 digits of barcode, excluding last three control digits. So for 21761012413912000 ... the password is 13912 ssh -Y [UTORID]@cs.utm.utoronto.ca psql -h mcsdb.utm.utoronto.ca -d [UTORID]_309 -U [UTORID] drop table appuser; create table appuser ( username varchar(20) primary key, password varchar(20), otherinfo varchar(20) ); \dt select * from appuser; insert into appuser (username, password, otherinfo) values('arnold', 'spiderman', 'something'); insert into appuser (username, password, otherinfo) values('jane', 'wonderwoman', 'another thing'); select * from appuser; select otherinfo from appuser where username='arnold'; select * from appuser where username='arnold' and password='zzzz'; select count(*) from appuser where username='arnold' and password='spiderman'; <ctrl-d> to quit

Outline

Your job is to create the iGetIt application outlined in the mockup. This application allows an instructor to create a class by providing a class name and a classroom secret code. The code is used to prevent voting for those not in the actual classroom. The students join the class by selecting the class and providing the code. Students can then click on either "i Get It" or "i Don't Get It" during the class. These clicks are recorded in the postgresql relational database. The current level of understanding is displayed repeatedly on the instructors console.

Page Flow For Instructor

login for the first time. They are taken to the profile page. After they create a profile, and declare themselves as an instructor, they are taken to the instructor create class page. If they create a class, by entering class name and code, they are taken to the instructor current class page, where they can watch the progress of their ongoing class.
login again. They are taken to the instructor create class page. If they create a class, by entering a class name and code, they are taken to the instructor current class page, where they can watch the progress of their ongoing class.
instructor current class periodically refreshes itself. See the appropriate meta tag.
Clicking the Class navigation on the left takes them to instructor create class.

Page Flow for Student

login for the first time. They are taken to the profile page. After they create a profile, and declare themselves as a stdudent, they are taken to the student join class page. If they join a class, by selecting the class name, and entering the code, they are taken to the student current class page where they can click either the red or green button periodically to let the instructor know of their understanding.
login again. They are taken to the student join class page. If they join a class, by selecting the class name, and entering the code, they are taken to the student current class page where they can click either the red or green button periodically to let the instructor know of their understanding.
Clicking on the Class navigation on the left takes them to student join class.

All Pages

References

Learn HTML at Mozilla
HTML Elements
HTML5 Forms
Basic HTML5 website structure
HTML5 Validation
HTML5 Forms
Note: Switch on novalidate to check server side validation
HTML5 Semantics

Questions and Answers

Question:: Can we use a framework like bootstrap etc?
Answer:: No
Question:: How does a new user register?
Answer:: Forgot to put a link to 'register' on the main login page. This takes them to a something that looks like the profile page.
Question:: For templating the website, are we suppose to come up with ways to do that using vanilla php or can we use some sort of templating engine?
Answer:: Write your own. That is, try to have the structure of the webpages not repeat in code everywhere. The goal is to have single places to modify sitewide things.
Question:: Can we use Javascript?
Answer:: No
Question:: Can we modify the look, css of the website?
Answer:: Yes, but not for marks this time.
Question:: Will sanitizing SQL queries be expected, or considered extra features?
Answer:: Not sure what they are asking. You should use prepared statements. You should always check the inputs on the backend.
Question:: Should we validate in HTML?
Answer:: Yes.
Question:: What about semantic elements in HTML?
Answer:: Yes, try to use the HTML5 elements properly. HTML5 form elements properly, labels etc.
Question:: How do I connect to the db in php?
Answer:: where XXXXX is last 5 digits of barcode, excluding last three control digits. So for 21761012413912000 ... the password is 13912
Question:: Can I work alone?
Answer:: Yes, but you will be expected to achieve the same result.
Question:: Do I have to check inputs in the backend?
Answer:: Yes.
Question:: What if a user tries to register an account that is already registered?
Answer:: They should not be allowed to do that.
Question:: How do I list my extra features? How do I list the members?
Answer:: Please submit a file iGetIt/features.txt. I have added it to the iGetIt.zip, but you can just take this one and add the file yourself. Also, I already have the iGetIt/members.txt file.