//Ahmad Dahlan Hafizh (adh10023)

//Idea: create a mass of circles / dots that dynamically changes depending on the mouse position.

​

///////////////////BEGIN CODE HERE///////////////////////

​

var pos;

let stepMultiplier = 100; //Variable to adjust step size.

let dotWeight = 6; //Variable to adjust dot size

let noiseTime = 0;

let noiseConst = 1;

​

var colorR;

var colorG;

var colorB;

​

let diameter = 10;

let s = 13;

​

let font;

​

function preload() {

  font = loadFont("SFUI.otf");

}

​

function setup() {

  createCanvas(800, 800);

  background(25);

  pos = createVector(width / 2, height / 2); //Create a vector from the middle of canvas

  prev = pos.copy(); //Copies pos and store an older location data

  colorR = 255;

  colorG = 255;

  colorB = 255;

  textFont(font);

  textSize(32);

  textAlign(CENTER, CENTER);

}

​

function draw() {

  background(255, 255, 255, 6);

​

  stroke(colorR, colorG, colorB);

  strokeWeight(dotWeight);

  //point(pos.x,pos.y);

​

  line(pos.x, pos.y, prev.x, prev.y); //Create a line between old position & new position

  prev.set(pos);

​

  //Choose a random integer 0-3

  directionList = [

    "up",

    "right",

    "left",

    "down",

    "mouse",

    "up",

    "right",

    "left",

    "down",

    "up",

    "right",

    "left",

    "down",

    "mouse",

  ];

  var r = random(directionList);

​

  //Else-if statements for choosing the direction

  switch (r) {

    case 'right':

      pos.x = pos.x + 1;

      break;

    case 'left':

      pos.x = pos.x - 1;

      break;

    case 'down':

      pos.y = pos.y + 1;

      break;

    case 'up':

      pos.y = pos.y - 1;

      break;

    case 'mouse':

      pos.y = mouseY;

      pos.x = mouseX;

      break;

  }

​

  //Adds step between each direction to create line strips

  var step = p5.Vector.random2D();

  step.mult(stepMultiplier);

  pos.add(step);

​

  //Create Noise

  //Reset position if go beyond canvas

  if (pos.y < 0 || pos.x < 0 || pos.y > height || pos.x > width) {

    pos.y = height / 2;

    pos.x = width / 2;

    colorR = map(noise(noiseTime + random(255)), 0, 1, 0, 255);

    colorG = map(noise(noiseTime + random(255)), 0, 1, 0, 255);

    colorB = map(noise(noiseTime + random(255)), 0, 1, 0, 255);

  }

​

  //Increment noise time

  noiseTime += noiseConst;

​

  //Create ellipse at the end point

  ellipse(pos.x + s / 2, pos.y + s / 2, diameter);

​

  let x = frameCount % 100;

​

  // If the mouseX > width/2,

  // decrease the frame rate & change background

  if (mouseX > width || mouseY > height) {

    frameRate(24);

    background(10, 10, 10, 100);

  } else {

    frameRate(20);

    background(100, 100, 100, 6);

  }

​

  //Create text

  push();

  stroke(0);

  strokeWeight(2);

  fill(255);

  text("Star aviatorS.", width / 2, height / 2);

  pop();

​

  stepMultiplier = float(map(noise(noiseTime), 0, 1, 0, 100));

}

​