CSE 160 -- Lab 1
Early if time stamp is before midnight Oct 5, 2019.
On time if time stamp is before midnight Oct 6, 2019.
Late submissions will not be accepted/graded.
Objectives:
Coordinate frame and basic mouse events.
Description:
For this assignment you will provide users the functionality to
draw simple predefined geometric shapes with mouse clicks.
Requirements:
-
Create a blank (white) canvas at least 400 x 600 in dimension.
Notice whether the canvas is wider, or taller;
and whether the origin is in the middle of the canvas or elsewhere.
-
Recognize left and right mouse clicks.
Echo the mouse positions for each mouse click (use console.log).
-
Maintain a list of points representing positions of mouse clicks (both left and right).
-
When a left click is detected, draw a filled red circle centered at the mouse
position and with radius of 10.
-
When a right click is detected, draw a filled blue square centered at the mouse
position and with a side of length 10.
-
When a both left and right clicks are detected at the same position,
the two shapes are drawn on top of each other.
If the sequence is left followed by right clicks, only the blue square will be visible.
If the sequence is right followed by left clicks, the red circle is visible over the blue square.
The latest mouse click at the same position will determine what's visible there.
Resource:
Check out the
ClickedPoints
and online resource on
mouse events.
Grading:
-
Rubric:
You start off with 100 points. You earn additional credit by turning in your assignment
early and/or implementing additional features (not applicable to this assignment).
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 LAST 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 lab1 and zip it up.
Submission must be done using Canvas.
Last modified
Sunday, 06-Oct-2019 20:38:52 PDT.