|
1 | | -/** |
2 | | - * Mouse Signals |
3 | | - * |
4 | | - * Move and click the mouse to generate signals. |
5 | | - * The top row is the signal from "mouseX", |
6 | | - * the middle row is the signal from "mouseY", |
7 | | - * and the bottom row is the signal from "mousePressed". |
8 | | - */ |
9 | | - |
10 | | -int xvals[640]; |
11 | | -int yvals[640]; |
12 | | -int bvals[640]; |
13 | | - |
14 | | -void setup() { |
15 | | - size(640, 360); |
16 | | - noSmooth(); |
| 1 | +let xvals = new Array(640).fill(0); |
| 2 | +let yvals = new Array(640).fill(0); |
| 3 | +let bvals = new Array(640).fill(0); |
| 4 | + |
| 5 | +function setup() { |
| 6 | + createCanvas(640, 360); |
| 7 | + noSmooth(); |
17 | 8 | } |
18 | 9 |
|
19 | | -void draw() { |
20 | | - background(102); |
21 | | - |
22 | | - // Shift values left |
23 | | - for (int i = 1; i < width; i++) { |
24 | | - xvals[i - 1] = xvals[i]; |
25 | | - yvals[i - 1] = yvals[i]; |
26 | | - bvals[i - 1] = bvals[i]; |
27 | | - } |
28 | | - |
29 | | - // Add new values |
30 | | - xvals[width - 1] = mouseX; |
31 | | - yvals[width - 1] = mouseY; |
32 | | - |
33 | | - if (_mousePressed == true) { |
34 | | - bvals[width - 1] = 0; |
35 | | - } else { |
36 | | - bvals[width - 1] = height / 3; |
37 | | - } |
38 | | - |
39 | | - fill(255); |
40 | | - noStroke(); |
41 | | - rect(0, height / 3, width, height / 3 + 1); |
42 | | - |
43 | | - for (int i = 1; i < width; i++) { |
44 | | - |
45 | | - // Draw the x-values |
46 | | - stroke(255); |
47 | | - point(i, map(xvals[i], 0, width, 0, height / 3 - 1)); |
48 | | - |
49 | | - // Draw the y-values |
50 | | - stroke(0); |
51 | | - point(i, height / 3 + yvals[i] / 3); |
52 | | - |
53 | | - // Draw the mouse presses |
54 | | - stroke(255); |
55 | | - line(i, |
56 | | - (2 * height / 3) + bvals[i], |
57 | | - i, |
58 | | - (2 * height / 3) + bvals[i - 1]); |
59 | | - } |
| 10 | +function draw() { |
| 11 | + background(102); |
| 12 | + |
| 13 | + // Shift values left |
| 14 | + for (let i = 1; i < width; i++) { |
| 15 | + xvals[i - 1] = xvals[i]; |
| 16 | + yvals[i - 1] = yvals[i]; |
| 17 | + bvals[i - 1] = bvals[i]; |
| 18 | + } |
| 19 | + |
| 20 | + // Add new values |
| 21 | + xvals[width - 1] = mouseX; |
| 22 | + yvals[width - 1] = mouseY; |
| 23 | + |
| 24 | + if (mouseIsPressed) { |
| 25 | + bvals[width - 1] = 0; |
| 26 | + } else { |
| 27 | + bvals[width - 1] = height / 3; |
| 28 | + } |
| 29 | + |
| 30 | + fill(255); |
| 31 | + noStroke(); |
| 32 | + rect(0, height / 3, width, height / 3 + 1); |
| 33 | + |
| 34 | + for (let i = 1; i < width; i++) { |
| 35 | + |
| 36 | + // Draw the x-values |
| 37 | + stroke(255); |
| 38 | + point(i, map(xvals[i], 0, width, 0, height / 3 - 1)); |
| 39 | + |
| 40 | + // Draw the y-values |
| 41 | + stroke(0); |
| 42 | + point(i, height / 3 + yvals[i] / 3); |
| 43 | + |
| 44 | + // Draw the mouse presses |
| 45 | + stroke(255); |
| 46 | + line(i, |
| 47 | + (2 * height / 3) + bvals[i], |
| 48 | + i, |
| 49 | + (2 * height / 3) + bvals[i - 1]); |
| 50 | + } |
60 | 51 | } |
0 commit comments