collaboration-002/river_1.html at master · cha-art-dev/collaboration-002 · GitHub

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
53
54
55
56
57
<html>
<head>
  <title>Art / Dev - Collaboration 2</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.7/p5.min.js"></script>
  <script>
  var IMAGE_WIDTH = 640;    // Don't change this.
  var IMAGE_HEIGHT = 540;   // Don't change this.

  //=============== DO ALL YOUR WORK HERE =======================

  var time = 0;

  function setup() {
    createCanvas(IMAGE_WIDTH, IMAGE_HEIGHT); // don't change this
  }

  function draw() {
    time = time +1;
    //console.log(time);

    //clear();
    background(102,102,102,5);
    fill(255);
    stroke(0);
    //ellipse(mouseX,mouseY,100,100); // mouseX and Y use canvas top left as origin
    //t = [0,5,-4,-3,4,-3];
    //triangle(mouseX + t[0],mouseY+t[1],mouseX + t[2],mouseY+t[3],mouseX + t[4],mouseY+t[5])
    for (var x=0; x<IMAGE_WIDTH; x++) {
      n = noise((x+time+mouseX/IMAGE_WIDTH)/300);
      y = n*IMAGE_HEIGHT;
      m = noise(time/200);
      o = noise(time/100);
      p = noise(x/100);
      line(x,y+100*p,x,m*n*10*mouseY/2);
    }
  }

//stats!!!
  // randomGaussian(0); // normal bell curve randomGaussian(mean,stdev)
  // pow(random(),3); // random 0-1 to power of 3

//noise
  // perlin noise
  // use point, not set


  // =============== STOP WORKING HERE ==========================

  </script>
  <style>
    body { padding: 0; margin: 5% 0 0; background-color: #666;}
    canvas { margin: 0 auto; display:block; }
  </style>
</head>
<body>
</body>
</html>