brush3

var points = [];

var painting = false;

var strokeNumber = 0;

var numClosePoints = 15;

var r,g,b;

var colorChoice = 0;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(250);

}

​

function mousePressed() {

  painting = true;

  strokeNumber++;

  newColor();

}

​

function newColor(){

  var pallette = [

    // [210, 70, 50],

    // [245, 225, 50],

    [50, 120, 170]

  ];

  r=pallette[colorChoice][0];

  g=pallette[colorChoice][1];

  b=pallette[colorChoice][2];

  colorChoice++;  

  if(colorChoice >= pallette.length) colorChoice=0;

}

​

function mouseReleased() {

  painting = false;

}

​

function draw() {

  if(painting){

    var p1 = new Point(mouseX,mouseY,strokeNumber,r,g,b);

    // p1.draw();

    points.push(p1);

    console.log('new point',p1);

    beginShape();

    getSortedPoints(p1).slice(0, numClosePoints).map(function(p2,i){

      var alpha = map(i,0,numClosePoints, 200,0);

      stroke(r,g,b,alpha);      

      fill(r,g,b,alpha);

      vertex(p2.x,p2.y)

    });

    endShape(CLOSE);    

  }

}

​

function getSortedPoints(pRef) {

  return points.filter(function(p){

    return p.strokeNumber == pRef.strokeNumber;

  }).sort(function(p1,p2){

    return pRef.sqDistance(p1) > pRef.sqDistance(p2) ? 1 : -1;

  })

}

class Point {

  constructor(x,y,strokeNumber){

    this.x=x;

    this.y=y;

    this.strokeNumber=strokeNumber;

  }

  sqDistance(p) {

    return pow(this.x-p.x,2)+pow(this.y-p.y,2);

  }

}

​

​