Description
Problem: Use WebGL to implement an online program called BuildingBlocks that allows a user to build something meaningful from the following six building blocks.
- Red disk
- Green disk
- Blue disk
- Magenta square
- Cyan square
- Yellow square
The program starts with a canvas with no building blocks. A user can add, move and delete building blocks on the canvas.
- To add a building block, a user needs to first hold down the corresponding number key. Then click the left mouse button at the target location. For example, to add a magenta square, click the left mouse button while the ‘4′ key is held down. The new building block will be centered at the cursor position at the time of clicking.
- To move a building block, use the left mouse button to drag it.
- To delete a building block, hold down the SHIFT key and then click the left mouse button at the building block.
Create a directory called project2 under your cs435 home directory. Move into that directory and create two files: buildingblocks.html and buildingblocks.js to complete this project.
Submission Requirements:
-
Make sure the project2 directory contain the two files: buildingblocks.html and buildingblocks.js. (Here we assume the Common directory is located in the same directory as the project2 directory, and you do not need to submit the Common directory.)
-
The title of buildingblocks.html should contain your name, CS435 or CS435, Project #2.
-
The buildingblocks.js file should contain the following information at the beginning: CS435 or CS535, Project #2, your name, a description of the program. Add other necessary comments whenever a part of the code is not obvious.
-
Compress the project2 directory into project2.zip and submit the compressed file as an attachment on Blackboard.
