This assignment will make use of the following WebGL programming features, all of

which are represented in recent course example files as well as in the PowerPoints:

$$ Menu and button controls

$$ Window resizing $($with canvas resized to adapt to window size$)$

$$ Mouse clicks $($to specify vertex locations$)$

II$.$ Objective

Your program will implement several features recently

covered in class. Your final program is a triangle$-$

drawing app $($an example is shown at right$).$ For full

credit, your program must implement all features

described here. A complete example will be

demonstrated in class.

$$ Each mouse$-$click adds one additional vertex by

pushing its coordinates onto the verts array.

$$ Each vertex has a color, selected in rotation

from a list of colors; when a new vertex is

pushed onto the vertex array, its color is also

pushed onto the colors array.

$$ A button is provided to clear the screen and

start over with a fresh set of vertices. This is

accomplished by resetting the verts and

colors arrays each to be the empty array $[].$

$$ In the render$()$ function, the vertices are

drawn either as triangles; as a triangle fan; or

as a triangle strip. The drawing mode is chosen

by the user from a menu created through the use of the select HTML tag. $($A

select menu may either be a scrolling menu or a drop$-$down list; the drop$-$down is

preferred but the scrolling list is OK if appropriately sized.$)$

$$ The graphics canvas will resize with the window such that the canvas and all user

controls $($button$,$ menu$)$ are always fully visible in the browser window. The

canvas must adapt to the initial window size, even before any resizing has

occurred.

please write the javascript and html files for this assigment