let walkerG;

let walkerY;

let img;

​

let size = 10;

let minSize = 1;

let maxSize = 50;

let sizeSpeed = 0.025;

​

function setup() {

  createCanvas(600, 600);

  tint(175, 60);

  bg = loadImage('tribe-banner.jpg');

  colorMode(HSB, 360, 100, 100)

  // walkerG = new Walker(640, 0, color(255,0,0));

  // walkerY = new Walker(200, 50, color(255,0,0));

​

  walkerG = new WalkerG();

  walkerY = new WalkerY();

}

​

function draw() {

  background(bg);

​

  size = map(sin(frameCount * sizeSpeed), -1.0, 1.0, minSize, maxSize);

  noStroke();

  fill(250, 90, 90);

  ellipse(274, 269, size, size);

​

​

​

  //decides flight form

  if (walkerG.x < 600 && walkerG.y > 50) {

    //levy flight

    walkerG.step2();

  } else {

    //normal random walk

    walkerG.step1();

  }

  walkerG.render();

​

  if (walkerY.x > 150 && walkerY.y < 350) {

    // do the levy flight

    walkerY.step2();

  } else {

    // normal random walk

    walkerY.step1();

  }

  walkerY.render();

}

​

​

// Can you have one class?

// class Walker {

//   constructor(x,y,col) {

//     this.x = x;

//     this.y = y;

//     this.col = col;

//   }

// }

​

class WalkerG {

  constructor() {

    // TODO change to a position p5.Vector

    this.x = 649;

    this.y = 5;

  }

​

  render() {

    stroke(174, 179, 69);

    strokeWeight(9);

    point(this.x, this.y);

  }

  // ----- normal walk

  step1() {

    // Change the way x,y moves to 

    // let velocity = p5.Vector.random2D();

    // position.add(velocity);

    var choice = floor(random(4));

    if (choice === 0) {

      this.x--;

    } else if (choice == 1) {

      this.x--;

    } else if (choice == 2) {

      this.y++;

    } else {

      this.y++;

    }

    this.x = constrain(this.x, 0, width - 1);

    this.y = constrain(this.y, 0, height - 1);

  }

  // ----- levy flight

  step2() {

    var choice = floor(random(4));

    if (choice === 0) {

      this.x -= random(0, 5);

    } else if (choice == 1) {

      this.x += random(0, 5);

    } else if (choice == 2) {

      this.y += random(0, 5);

    } else {

      this.y -= random(0, 5);

    }

    this.x = constrain(this.x, 0, width - 1);

    this.y = constrain(this.y, 0, height - 1);

  }

}

​

class WalkerY {

  constructor() {

    this.x = 0;

    this.y = 449;

  }

​

  render() {

    stroke(0, 100, 100);

    strokeWeight(9);

    point(this.x, this.y);

  }

  // ----- normal walk

  step1() {

    var choice = floor(random(4));

    if (choice === 0) {

      this.x++;

    } else if (choice == 1) {

      this.x++; // change to --

    } else if (choice == 2) {

      this.y--;

    } else {

      this.y--; // change to ++

    }

    this.x = constrain(this.x, 0, width - 1);

    this.y = constrain(this.y, 0, height - 1);

  }

  // ----- levy flight

  step2() {

    var choice = floor(random(4));

    if (choice === 0) {

      this.x += random(0, 5);

    } else if (choice == 1) {

      this.x -= random(0, 5);

    } else if (choice == 2) {

      this.y += random(0, 5);

    } else {

      this.y -= random(0, 5);

    }

    this.x = constrain(this.x, 0, width - 1);

    this.y = constrain(this.y, 0, height - 1);

  }

}

//Cirlce Inspo from enickles (https://editor.p5js.org/enickles/sketches/BJFD1cuRQ)

//slow down interaction