CSE 160 -- Fall 2019

CSE 160 -- Prog 2

Early if time stamp is before midnight Oct 26, 2019.
On time if time stamp is before midnight Oct 27, 2019.
Late submissions will not be accepted/graded.

Objectives:

Flesh out the tree and add perspective projection. Also save scenes to file and load scenes from a file.

Description:

The key requirement for this assignment is to replace the line segments in your 3D skeleton tree with the tapered cylinder that you made in Lab 2. You can download and use the generated vertices for trees with recursive levels 1, 2, 3, 4, 5 and 6 from the links here trees.js, trees1.js. Align the skeleton with the main axis of the cylinder. Since the line segments are of different lengths, you will also need to scale the cylinder to the length of the line segment. If all is done properly, your tree should now have girth instead of just a stick figure.

Details:

Projection. Add a new toggle to switch between perspective and orthographic projection.
Load/Save buttons. Allow the user to load a scene from file and save a scene to file. When your program is executed, the user will have the option of creating a new scene or loading in a scene. An easy way to do this is to provide two buttons: one for Loading a scene and another one for Saving a scene. The default mode would be to create a new scene. A scene can contain 1 or more trees.
If the user decides to read/load in a scene, s/he will be prompted for the filename of the scene. The file is read and scene is displayed using the current rendering mode -- either wireframe or flat shading.
If the user decides to create a new scene, the user is presented with the interface for creating a scene, which is similar to the Lab1 assignment (i.e. blank canvas and GUI to track left and right mouse clicks). As the scene is being created, trees are rendered using the current render more -- either wireframe or flat shading. If the Save button is clicked, s/he will be prompted for the filename to save the scene.
Optional. There should probably be an option for users to delete a tree. Or perhaps after creating and saving a scene, have the option to create/save another scene. If you do this or some other options, please document it and highlight in your features.html file to alert our graders.

Resource:

Check out the parser in OBJViewer code from the Matsuda-Lea book.

PerspectiveView code from the Matsuda-Lea book.

Input types handled by HTML5. Try out the button and range input types for use with your toggles and sliders.

Grading:

Rubric:

You start off with 100 points.  You earn additional credit by turning in your assignment
early and/or implementing additional features.  You lose credit for missing functionality,
incorrect results, poorly documented or formatted code, or not following instructions.

Below is a partial list:

- up to 10 points off for poor features.html file
- up to 10 points off for inadequate comments or hard-to-read code
- up to 10 points off for not following instructions
- up to 10 points off for special handling to grade your homework (usually
  because you did not check that it runs on the computers in the lab first).
- functionality points depending on importance

Make sure you:
a.  submit the right files you want us to grade,
b.  have tested your code on the browsers in the lab.
c.  follow the general instructions described in overview.html

Who graded your assignment based on your login name:

Adam Filiz:	A - G
Alfred Lam:	H - M
Issei Mori:	N - Z

Submission:

See course overview for instructions on what to submit and what not to submit.

Put materials in a folder named prog2 and zip it up. Submission must be done using Canvas.