-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.js
52 lines (40 loc) · 1.75 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
// Declare the art variable
let art;
// Declare the setup() function, which is automatically called by p5 upon load.
// Inside setup(), create a window-size Canvas with a black background. Assign the variable art to a new instance of the SmokeBrush() class.
// Before calling draw(), execute the iterate() method on art.
function setup() {
createCanvas(windowWidth,windowHeight);
background('#000000');
art = new SmokeBrush();
art.iterate();
}
// After running the setup() function, declare the draw() function, which is continuously called by p5.
// Inside draw(), calling the SmokeBrush class' .draw() method on art.
function draw() {
art.draw();
}
//Event listeners establish interaction between user actions on HTML form and modifying values of properties set out in art_refactor.js.
document.addEventListener('DOMContentLoaded', function() {
let cc = document.getElementById('colour');
function changeColour(){
let colour = document.getElementById('colour').value;
art.setColour(colour);
}
let sl = document.getElementById('segLength');
function changeSegLength(){
let segLength = document.getElementById('segLength').value;
art.setSegmentLength(segLength);
}
let sw = document.getElementById('strokeWght');
function changeStrokeWght(){
let strokeWght = document.getElementById('strokeWght').value;
art.setStrokeWght(strokeWght);
}
cc.addEventListener('change', changeColour);
sl.addEventListener('input', changeSegLength);
sw.addEventListener('input', changeStrokeWght);
let customize = document.getElementById('customize');
customize.addEventListener('submit', function (event){
event.preventDefault();});
});