CS 207, Lab #7

1 March 2019 -- Focus on safety and abuse -- or a new start

By now, you are all working on your own unique projects, so I can't say, in general, ""Do an IFRAME this week." So, using the philosophy of "incremental development," decide what the next thing you can do that will make your site more useful, and next week, the thing after that...  Hopefully you have some goal in mind.

Tell me about what you did new this week, using the form below.

In brief:

  1. Add some style or functionality to your site, which wasn't there before. (This is an ongoing requirement!) Tell me what it is, and how to use it.
  2. Improve your style, if you are not totally happy about it. However, if your pages look great, focus on the functionality.
  3. Correct html. Your index.html must pass the validator this week.
  4. Be safe against SQL injection and abuse
  5. Fill in the Form below! No form, no credit.

Add style

This week, consider the colors and fonts you want to use on your pages.
It is a good idea to put all (or most) of your styles in a separate file, and LINK it to your pages.
How about defining some DIV's or other block elements, and positioning them?

Add functionality

Example: To realistically allow a logged in customer to order a music CD, You would need a page that lists all or part of the available ones, and also has access to the identity of the customer. This might entail changes to your database, or setting a cookie, or creating a form to search the product table.

Suppose you have some used books for sale. It doesn't help much if a client has to type the exact title and author, one would be more likely to find something by searching for "mystery" or "computer"

Ease of site navigation

From a user point of view, is the site accessible? Maintaining a menu on each page is one good way. A logged-in user may well have more options.

IFRAME and partial changes.

See lab 6
To have a link open in a frame, or to break out of a frame, you'll need to give the link a TARGET, such as target = "myiframe" or target="_top" 

Validation of HTML & CSS Valid HTML 4.01 Transitional

See lab 5 or 6
I will use validator.w3.org/ on your main page (index.html). I expect it to pass. This means that you need to start the file with <doctype html> (if you use any HTML 5) or another doctype.

SQL Injection

You should be using pg_query_params() whenever dealing with user data. If not, Scarlet O'Hara will probably not be able to use your form, and you don't

Guard against abuse!

If you are going to post user comments on your pages, you shouldn't allow just anything! If html tags come in, and you don't escape them, it could really mess up your page. And I don't want you to leave your page unattended if spammers can put links to other pages there.
So, if you have any kind of guest log or chat, I require you to include my function abuse() and use it on any database value that allows more than 40 characters (for example, varchar(200) or text)

require_once ("/home/jensen/abuse.php");
abuse($comment);	// for example

A example is to be found in the Poetry page on osiris https://osiris.ubishops.ca/jensen/oct16.html

Or, perhaps you need a new start.

 Just in case you are stuck, with nowhere to go on. (There is more to life than ordering pizzas.)  If you created some pages just to try out SQL, it may be time to do something more interesting. But I recognize it may be hard to think of something, so I have two suggestions:

1. You could go back to your cs 203 pages and forms, and convert the logging of information from appending to a file to storing (and retrieving selectively) from a database.

2. Don't like to set up SQL tables? In some miderrms, I have suggested the idea of a newspaper, which has many items each day, and for a few of them, the editor may want to ask a survey question, for another few it might be appropriate to allow readers to sign a petition.

Accordingly, I have set up the database "survey" on osiris, with the following tables:
	newsitem (headline, reporter, leadin, more, date, id, newspaper)
	question (question, yes, no, id)
	petition (whereas, resolved, id)
	signatures (name, id)

The tables join on id. Each id has at most 1 question and 1 petition.
"newspaper" can be null, it would be useful in case you want to select only "your" items, since this table is useable by the whole class.

You could in successive weeks:
  1. Create a page that will show the articles by headline, and indicate which ones have a petition or a question.
  2. Then in the following week, another page to show the complete article and petition for any chosen one. and
  3. A page for the action, once someone actually signs a petition.
  4. Also, there is still the matter of answering a question
  5. The results. We'd like to see how people answered the survey, or the names on the petitions.
  6. Try to prevent someone from answering or signing the same thing more than once.

Want to create your own news item?

Ah, I have a page of forms for that, it is in my private folder, but you know the password for that!
/jensen/private/newsitem.html

Tell me what you have done this week

Your Linux code
Name of a page: where I should start looking for what's new.
Only what follows youracct/ (50 char limit, Should be a page with style or a form, rather than it's action.)
What you did new this week: