wk10 assignment

//divide the canvas into 4

//randomize position of text with correlation to direction of 

//randomize color of indiviual ellipse shape

//randomize color of text

//randomize the scale of the entire canvas

​

​

let angle = 0;

let arcWidth = 0;

let arcHeight = 0;

let n = 0; //dice variable

let wobble;

let wobblee;

let colorChoice;

let colorsChoice;

let colorsChoicee;

let color = ['#ffffff'];

let colors = ['#E81416', '#FFA500', '#faeb36', '#79c314', '#487de7', '#4b369d', '#c9184a', '#bde0fe', '#acfcd9'];

let tx1 = 150;

let ty1 = 100;

let tx2 = 350;

let ty2 = 450;

let p; //scale

let rot;

let freq=6;

let amp = 10;

function setup() {

  createCanvas(500, 700);

  background(23, 30, 20);

  //ellipseMode(CENTER);

  angleMode(DEGREES);

  //noLoop();

  //frameRate(60);

  rot =random(100,480);

}

​

​

function draw() {

  //clear();

  background(23, 30, 20);

  //elipse(x-pos,y-pos,width,height)

​

  arcWidth = 20 * 6; //random(50,100);

  arcHeight = 80 * 6; //random(100,150);

  wobble = rot + (sin(frameCount * freq) * amp);

  //print(wobble);

  //scale(n);

  noFill();

  if (n == 0) {

    /*colorChoice = floor(random(0));

    colorsChoice = floor(random(0, 9));

    colorsChoicee = floor(random(0, 9));*/

    //backgroundChoice  = floor((random(0,5));

    //textMode(CENTER);

    textSize(40);

    textFont('Georgia');

    fill(255);

    text('Click on a, e or s', width / 2 - 150, height / 2);

​

​

​

    //rotateX(60);

  }

  else if (n == 1) {

    arcSpirograph();

    textsOnPageTwo();

  } else if (n == 2) {

    ellipseSpirograph();

    textsOnPage();

  }

​

  //ellipseSpirograph();

  //textsOnPage();

​

​

  //THE SECOND IDEA

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

  let circum = 10;

  let ih  = height/2 +70;

  for(i=0; i<20; i++){

    //circle(width/2, ih+(i*5), circum+(i*4));

    ellipse(width/2, ih-(i*5), circum+(i*10));

ih-=15;

    if(i>10){

      ih +=25;

    }

    //ih -=5;

  }

  /*ellipse(width/2, height/2, circum);

  ellipse(width/2, height/2, circum*30);

  ellipse(width/2, height/2, circum*25);

  ellipse(width/2, height/2, circum*20);

  ellipse(width/2, height/2, circum*15);

  ellipse(width/2, height/2, circum*10);

  ellipse(width/2, ih, circum*30);

  ellipse(width/2, ih, circum*20);*/

  //changing frame count

  if (frameCount%200 == 0) {

    // print('hey',frameCount);

    rot =random(100,480);

    freq = random(2,9);

    amp = random(10,20);

  }

​

}

​

function arcSpirograph() {

  //ellipse(width/2,height/2, 20,80);

  //ellipse(width/2,height/2, 20,80);

  //arc(width/2, height/2,20,80,180,0);

  //arc(width/2, height/2,20,80,0,180);

  //pop();      

​

​

​

  strokeWeight(3);

  for (i = 0; i < 14; i++) {

    push();

    translate(width / 2, height / 2);

    rotate(angle);

    //ellipse(0,0, 20,80);

    //wobble = 30 + (20 * sin(frameCount * 0.05*i));

    //wobblee effect

    /*wobblee = rot + (sin(frameCount * freq) * amp*i);

    stroke(colors[colorsChoicee]);

    arc(0, 0, arcWidth, wobblee, 180, 0);

    stroke(colors[colorsChoice]);

    arc(0, 0, arcWidth, wobblee, 0, 180);*/

    //wobble effect

    stroke(colors[colorsChoicee]);

    arc(0, 0, arcWidth, wobble, 180, 0);

    stroke(colors[colorsChoice]);

    arc(0, 0, arcWidth, wobble, 0, 180);

    angle -= 7; //this controls the direction of the ellipses. switch between the + and -

    pop();

  }

  angle = 0;

}

​

function ellipseSpirograph() {

  //scale(2);

  strokeWeight(3);

  //wobble = arcHeight + (20 * sin(frameCount * 0.05));

  for (i = 0; i < 14; i++) {

    push();

    translate(width / 2, height / 2);

    rotate(angle);

    //wobblee effect

    wobblee = rot + (sin(frameCount * freq) * amp*i);

    if (i % 2 == 0) {

​

      stroke(colors[colorsChoice]);

      ellipse(0, 0, arcWidth, wobblee);

      //arc(0,0,arcWidth,arcHeight,0,180);

    }

    if (i % 2 != 0) {

​

      stroke(color[colorChoice]);

      ellipse(0, 0, arcWidth, wobblee);

      //arc(0,0,arcWidth,arcHeight,0,180);

    }

    //wobble effect

    /*

    if (i % 2 == 0) {

​

      stroke(colors[colorsChoice]);

      ellipse(0, 0, arcWidth, wobble);

      //arc(0,0,arcWidth,arcHeight,0,180);

    }

    if (i % 2 != 0) {

​

      stroke(color[colorChoice]);

      ellipse(0, 0, arcWidth, wobble);

      //arc(0,0,arcWidth,arcHeight,0,180);

    }*/

    angle += 7; //this controls the direction of the ellipses. switch between the + and -

    pop();

  }

  angle = 0;

}

​

function textsOnPage() {

  //for ellipse

​

  textAlign(RIGHT);

  //noFill();

  textFont('TAHOMA');

  textSize(25);

  fill(colors[colorsChoice]);

  noStroke();

  text('HOW TO\nLIVE SAFELY\nIN A\nSCIENCE\nFICTIONAL\nUNIVERSE', tx1, ty1);

​

  fill(color[colorChoice]);

  textAlign(LEFT);

  text('A \nNOVEL \nBY \nCHARLES \nYU', tx2, ty2);

}

​

function textsOnPageTwo() {

  //for arc

  textAlign(LEFT);

  //noFill();

  textFont('TAHOMA');

  textSize(25);

  //fill(247,247,28);

  fill(colors[colorsChoice]);

  noStroke();

  text('HOW TO\nLIVE SAFELY\nIN A\nSCIENCE\nFICTIONAL\nUNIVERSE', tx2, ty1);

  textAlign(RIGHT);

  fill(colors[colorsChoicee]);

  text('A\nNOVEL \nBY \nCHARLES \nYU', tx1, ty2);

}

​

function keyPressed() {

  if (key == 'a') {

      rot =random(100,480);

      freq = random(2,9);

      amp = random(10,20);

    colorChoice = floor(random(0));

    colorsChoice = floor(random(0, 9));

    colorsChoicee = floor(random(0, 9));

      n = 1;

      draw();

  }

  if (key == 'e') {

    rot =random(100,480);

    freq = random(2,9);

    amp = random(10,20);

    colorChoice = floor(random(0));

    colorsChoice = floor(random(0, 9));

    colorsChoicee = floor(random(0, 9));

    n = 2;

    draw();

  }

​

​

  if (key == 's') {

    save('export.jpg');

  }

}