Tasks

Task #1 (75 points)

For the first task, you are going to set up a basic web page that will be your portfolio for this course and perhaps beyond. Under your Local/HTML-Documents directory, create a directory called WebApps. Make an index.html file in that directory. Make sure that everything is world readable and that you can see the pages you put up when you are done.

That index.html file should be a basic HTML file that will have links to your tasks and projects for this class. After the things for this class, feel free to put links to any other web based projects you might have worked on that you can link to.

You will also create an AboutMe.html file and have a link to it in index.html. As the name implies, this file should include a description of you that you would want potential employers to see. So highlight your experience and what you have done.

For this task, none of this needs to look good. That will be task #2, when you use CSS to make these pages so they don't look horrible.

Task #2 (75 points)

Add CSS to the pages you wrote for Task #1 so that they look better. Do this by putting a directory under WebApps called styles and make a tasks.css file in there that has the CSS you want to apply to what you created in Task #1. Then edit those files so they use that stylesheet.

Task #3 (100 points)

Make a page with an interactive table from Dougstats and link to it on your main WebApps page. There are several different tables on the links at the site. You can pick one. The table should have at least 3 columns and 30 rows, but could be much bigger. You get 50 points for a page where you can sort the columns by different values. You can get the additional 50 by adding other features, like possibly filtering data.

You only get points for your own code here. Using libraries written by others doesn't count. Note that JQuery is a library, so if you use JQuery, you aren't going to get full points.

Task #4 (100 points)

For this task I want you to create a page that has a canvas that does something interesting and interactive. A simple game would be a good example of this. I wrote an old-style Tron Lightcycles myself. Whatever you write can interact through the mouse, the keyboard, or both.

Task #5 (100 points)

For this task you need to make a PHP based set of pages that implements a task tracking system/todo list with a login. So each user can add or remove todo items/tasks that they have to accomplish. When they log back in, they should get the items they had from the last time. They should be able to log out. You need to send me login credentials for two users so that I can verify they have different logins and different lists of tasks.

You do not have to include the ability to add new accounts. Those can be hard coded or put in some data file/database that the site does not modify. If you host this on dias11.cs.trinity.edu, include something like the following so that outsiders can't do anything malicious.

if ($_SERVER['SERVER_NAME'] != "dias11.cs.trinity.edu") {

echo "<p>You must access this page from on campus through dias11.</p></body></html>";

die ();

}

Task #6 (100 points)

For this task, you will make a new version of your task list page, but this one will use Ajax so that there is never a full page reload. When the login information is entered, that part of the page will be replaced by the tasks for that user. When new tasks are entered, they will be sent to the server and added to your data store using Ajax without a page refresh. Basically, you are turning this into a small single page application.

Task #7 (125 points)

Redo task #3 using Play with a few changes. The data I want you to use is the Player Data. Your table should display all columns and load it from the site. A load should happen when the server starts and then any time a request is made where 8 hours has passed since the last load. That way it should always have recent data without hammering the site pulling new data on every request. You can do a standalone deploy using play by running activator on the command line and giving it the "dist" command.

To run them, execute dist in sbt and then copy the resulting zip file someplace and unzip it. When you run it, use a command like "bin/play-scala -Dhttp.port=9001" using a port number that I have assigned you on the student links page. You will also need to change the play.crypto.secret value in conf/application.conf.

Task #8 (125 points)

Redo task #5 using Play but with the ability to add new users. I want you to deploy on Dias11.

Task #9 (100 points)

Repeat task #4 with Scala.js.

Task #10 (200 points)

Write a page using Play and Scala.js that gives people on the page a shared drawing palette. You get 150 points for being able to draw anything. You can get an extra 50 points if you make it more powerful with different colors and drawing options (lines, rectangles, circles).