//2nd week tech demo

//instruction to interact -

//when the mouse move to the left - rotate counterclockwise

//when the mouse move to the right - rotate closewise

​

//setup is to initiate the whole program

//It ONLY run once

​

let gap = 10;

let cirNum = 40;

let cirSize = 20;

let angle = 0;

let ptNum = 100;

let rectSize = 580;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  angleMode(DEGREES);

}

​

//draw loops forever

function draw() {

  background('black');

  //a customized shape for mouse

  noCursor();

  noStroke();

  fill('white')

  circle(mouseX, mouseY, 5);

​

  //main graph

  push();

  translate(width / 2, height / 2);

  rotate(angle);

  angle = angle + map(mouseX, 0, width, -1, 1);

  noFill();

  stroke('white');

  strokeWeight(1);

  //for loop:

  //1.where to start, 

  //2.where to end, 

  //3.how much it increments each time

  for (let i = 0; i < cirNum; i++) {

    arc(0, 0, cirSize + gap * i, cirSize + gap * i, angle * i, 360 - angle / 2);

  }

  pop();

​

​

​

​

  //title subtitle

  push();

  translate(width / 2, height - 90);

  noStroke();

  textFont('Arial');

  textSize(15);

  textAlign(CENTER, CENTER);

  text('U.F.O', 0, 0);

  textSize(10);

  text('this is our 2nd demo', 0, 20);

  pop();

​

  //border of the album cover

  push();

  translate(width/2,height/2);

  noFill();

  stroke('white');

  strokeWeight(2);

  rectMode(CENTER);

  rect(0, 0, rectSize, rectSize);

​

  //random noise as background

  stroke('white');

  strokeWeight(1);

  for (let i = 0; i < ptNum; i++) {

    point(random(-rectSize / 2, rectSize / 2), random(-rectSize / 2, rectSize / 2));

  }

  pop();

}