CSE383 HW #7 Javascript solution

Description

Objective: The objective of this exercise is to:
1. Continue working with JavaScript
2. Learn and implement JavaScript methods
3. Learn and implement JavaScript canvas
4. Translate other language constructs into JavaScript
Submit: screenshots, your word document, html files and links to your web page(s)
You may discuss the concepts with your fellow students
You may not show or share code with your fellow students
You may not show or share code with internet sources
You may discuss this with your instructor or TA.
Part #1: Create GitLab project
Estimated time: 10 minutes
Exercise:
 Gitlab
o Create project cse383_hw7 in your account.
Part #2: Draw in Canvas
Estimated time: 30-60 minutes
Exercise:
 Create a html/JavaScript file called part2.html that will use the HTML canvas function
and will draw 20 random sized triangles of random size and random color. I would
prefer that the triangles are randomly placed on the canvas similar to my example.
 Note: yours will be different than mine due to randomness
 Get a screen grab showing the page with the triangles
Page 1 of 3
CSE383 HW #7 Javascript
Part #3: Moving Divs
Estimated time: 30-60 minutes
Exercise:
 Create a html/JavaScript file called part3.html that will consist of 3 divs.
 Each one is absolutely positioned on the page in a random start position.
 Use a JavaScript timer to make each div move “slowly” off of the screen. It should take
about 50 seconds for all of the blocks to move off the screen.
 Get a screen grab while they are still on the screen
Note: Height and width
const width = window.innerWidth ||
document.documentElement.clientWidth ||
document.body.clientWidth;
const height = window.innerHeight||
document.documentElement.clientHeight||
document.body.clientHeight;
Part #5: Write a new Word Document
Estimated time: 15 minutes
Exercise:
 Always make sure it includes your name, class, assignment etc.…
 Explain in full sentences (relating to this assignment):
o what worked
o what didn’t
o how long it took
o What you liked
o What you didn’t
Page 2 of 3
CSE383 HW #7 Javascript
SUBMIT:
 Word Document
 Screenshots (may be inside word or separate)
o Attach a screenshot showing GitLab with changes submitted
o Attach a screenshot of your fully functional web pages (including output)
 File
o Attach the 2 html files
 Paste the URL of your pages into the submission as a comment
Page 3 of 3