const step = 1

function setup() {
  createCanvas(400, 400);
  noFill()
}

function draw() {
  background(220);
  beginShape()
  
  for(let x = 0; x < width; x += step) {
    let y = height/2 + 100*sin(x/10 + frameCount)
    vertex(x, y)
  }

  endShape()
}

const step = 10
const amp = 100

function setup() {
  createCanvas(400, 400);
  noFill()
}

function draw() {
  background(220);
  translate(width/2, height/2)

  for (let a = 0; a < PI * 2; a += PI * 2 / 500) {
    push()
    rotate(a)
    beginShape()
    for (let x = 0; x < width/2; x += step) {
      let y = amp * (noise(x / 100 - frameCount / 10, a*2) * 2 - 1)
      vertex(x, y)
    }
    endShape()
    pop()
  }

}

// random()

const stepX = 20
const stepZ = 5
const amp = 10

function setup() {
  createCanvas(400, 400, WEBGL)
  noFill()
}

function draw() {
  background(220);

  let x
  for (let dx = -100; dx < 100; dx += stepX) {
    beginShape()
    for (let z = -1000; z < 510; z += stepZ) {
      x = amp * sin(z / 10) + dx
      let y = 100
      vertex(x, y, z)
    }
    endShape()
  }

}

const amp = 150
const freq = .05

function setup() {
  createCanvas(400, 400)
  fill(0)
}

function draw() {
  background(220)
  translate(width / 2, height / 2)

  for (let a = 0; a <= PI * 2 * (frameCount / 100 % 1); a += PI * 2 / 200) {
    let x = amp * sin(a)
    let y = amp * cos(a)
    line(0, 0, x, y)
  }
}

const step = 10
const amp = 10
const freq = .02

function setup() {
  createCanvas(400, 400, WEBGL)
  noFill()
}

function draw() {
  background(220)

  for (let z = -1000; z < 200; z += step) {
    let x = amp * sin(z * freq + frameCount/10)
    line(x - 100,-1000, z, x - 100, 100, z)
    line(x + 100,-1000, z, x + 100, 100, z)
  }

  for (let dx = -100; dx <= 100; dx += 20) {
    beginShape()
    for (let z = -1000; z < 200; z += step) {
      let x = amp * sin(z * freq + frameCount/10) - dx
      vertex(x, 100, z)
    }
    endShape()
  }

}