Canvas Experiments 006

Canvas Experiments 006.markdown

Canvas Experiments 006

A Pen by Peter Briers on CodePen.

License.

index.jade

div#frame
  canvas#cv

script.babel

"use strict";

console.clear();

let cv, ctx, fps, mouse;

class Position {
  
  constructor(coords) {
    this.coords = [];
    for(let i = 0; i < coords.length; i++) {
      this.coords.push(coords[i]);
    }
    console.log(this.coords);
  }
  
  static lerp(a, b, t) {
    var len = a.length;
    if(b.length != len) return;
    var x = [];
    for(var i = 0; i < len; i++) {
      x.push(a[i] + t * (b[i] - a[i]));
    }
    return x;
  }
  
  getCoord() {
    return [
      Math.random()*cv.width,
      Math.random()*cv.height
    ];
  }
  
}

class Particle {
  
  constructor() {
    this.posStart = new Position(1, 2, 4);
    this.posEnd = new Position(3, 6, 5, 8);
    this.speed = Math.random();
  }
  
  update() {
    
  }
  
  draw() {
    
  }
  
}

function bootstrap() {
  cv = document.getElementById('cv');
  cv.width = window.innerWidth;
  cv.height = window.innerWidth;
  let i;
  for(i = 0; i < 10; i++) {
    let p = new Particle();
  }
}

function draw() {
  requestAnimationFrame(draw);
  loop();
}
  
function loop() {
  
}

bootstrap();
draw();

style.scss

html, body {
  height: 100%;
}
body {
  background-color: #000;
  margin: 0;
  color: #FFF;
  font-family: helvetica, arial, sans-serif;
  font-weight: 700;
}

#cv {
  display: block;
}