//Creative Coding Assignment 1: Sol LeWitt 

​

//Set up variables

let firstframeHW=400; //set up width and height for each frame

let secondframeH=400;

let secondframeW=1200;

let thirdframeH=1200;

let thirdframeW=400;

let fourthframeHW=1200;

​

var a=0;

​

function setup() {

  createCanvas(800, 800);

  angleMode(DEGREES); //change angle mode to degrees because i hate pi

​

}

​

function draw() {

  background('#F7F3E7'); //set background to cream wall color

  //set up gridline as a guide

  /*

  line(0,height/2,width,height/2);

  line(height/2,0,height/2,width);

  */

  //call functions

  //1 

  star(firstframeHW/2,firstframeHW/2,60,160,5,0,mouseX/200);

  //2

  star(secondframeW/2,secondframeH/2,90,160,6,'#fbd603',mouseY/200);

  //3

  star(thirdframeW/2,thirdframeH/2,112,160,7,'#E63454',mouseX/200);

  //4

  star(fourthframeHW/2,fourthframeHW/2,123,160,8,'#369BC3',mouseX/200);

}

​

​

//set up star function with 7 parameters - x&y point, inside&outside radius, number of points, color, and rotatespeed

function star(x,y,insradius,outradius,npoints,color,rotatespeed){

  //create two variables

  var angle = 360 / npoints;

  var halfAngle = angle/2.0;

  //create parameter

  fill(color);

  noStroke();

  //use push & pop matrix to rotate stars

  push();

  //create parameter

  translate(x,y);

  //call variable and use it as a parameter for rotation speed

  a += rotatespeed;

  rotate(a);

  //use star function found from p5js example

  //create custom shape

  beginShape();

  //use a for loop to populate star angles

  for (var i = 0; i < 360; i += angle) {

    var sx = 0 + cos(i) * outradius;

    var sy = 0 + sin(i) * outradius;

    vertex(sx, sy);

    sx = 0 + cos(i+halfAngle) * insradius;

    sy = 0 + sin(i+halfAngle) * insradius;

    vertex(sx, sy);

  }

  endShape(CLOSE);

  pop();

}

​

function mousePressed(){

    console.log(mouseX,mouseY);

}

​

​

//original function before adding in rotate

/*

function star(x,y,insradius,outradius,npoints,color){

  var angle = 360 / npoints;

  var halfAngle = angle/2.0;

  fill(color);

  noStroke();

  beginShape();

  for (var i = 0; i < 360; i += angle) {

    var sx = x + cos(i) * outradius;

    var sy = y + sin(i) * outradius;

    vertex(sx, sy);

    sx = x + cos(i+halfAngle) * insradius;

    sy = y + sin(i+halfAngle) * insradius;

    vertex(sx, sy);

  }

  endShape(CLOSE);

}

*/

​

​