var mc;
var numTypes=12;
var colGap=360/numTypes;
var dV=500;

function setup() {
  createCanvas(windowWidth,windowHeight);
  mc=new MemoryCanvas(width/2, height*1.2, 1200, height*2, height*1.6,numTypes);
  colorMode(HSB);
}

function draw() {
  background(40);
  mc.show();
}

function MemoryCanvas(x,y,z,w,h,numTypes){
  var memcepts=[];
  var numCepts=100;
  var mcSize=w/15;
  var nextID=0;
  memcepts.push(new Memcept(nextID++, random(w-mcSize)+mcSize/2, random(h-mcSize)+mcSize/2, mcSize, floor(random(numTypes))));
  this.show=function(){
    push();
    translate(x,0);
    var tl=mapPoint(-w/2, y, z+h/2, dV);
    // console.log(tl);
    var tr=mapPoint(+w/2, y, z+h/2, dV);
    var br=mapPoint(+w/2, y, z-h/2, dV);
    var bl=mapPoint(-w/2, y, z-h/2, dV);
    // translate(x,y);
    fill(0,0,50);
    noStroke();
    // rectMode(CENTER);
    // rect(0,0,w,h,h*0.1);
    beginShape();
    vertex(tl.x, tl.y);
    vertex(tr.x, tr.y);
    vertex(br.x, br.y);
    vertex(bl.x, bl.y);
    endShape(CLOSE);
    pop();
    fill(0,0,0);
    text(memcepts.length,width-50, height-50);
    for(var i=memcepts.length-1; i>=0; i--){
      if(!memcepts[i].show(x,y,z,w,h)){
        memcepts[i].dissociate(memcepts);
        memcepts.splice(i,1);
      }
      memcepts[i].repel(memcepts);
    }
    if(memcepts.length<numCepts && random(100)<5){
      var newMem=new Memcept(nextID++, random(w-mcSize)+mcSize/2, random(h-mcSize)+mcSize/2, mcSize, floor(random(numTypes)));
      newMem.associate(memcepts);
      memcepts.push(newMem);
    }
    // console.log(memcepts.length);
  };
}

function Memcept(id, x,y,s,t){
  var self=this;
  var pos=createVector(x,y);
  this.type=t;
  this.pos=pos;
  this.pos3=createVector(x,y);
  this.id=id;
  var minDist=s*2;
  var maxDist=s*8;
  var vel=createVector(0,0);
  var decay=0.97;
  var force=0.02;
  // console.log(id);
  var displace=createVector(0,0);
  var acc=createVector(0,0);
  var ttlMax=400;
  var ttl=ttlMax;
  var linksTo=[];
  this.linksTo=linksTo;
  var linkDecay=0.001;
  var connectism=0;
  var connectMax=5;
  
  this.associate=function(others){
    others.forEach(function(other){
      if(id!==other.id){
        if(other.type===t){
          linksTo.push({
            memcept: other,
            strength: 1
          });
          other.linksTo.push({
            memcept: self,
            strength: 1
          });
        }
      }
    })
  };
  
  this.dissociate=function(others){
    linksTo.forEach(function(linked){
      // console.log(linked.memcept.id+" "+linked.memcept.linksTo.length);
      for(var i=linked.memcept.linksTo.length-1; i>=0; i--){
      // linked.linksTo.forEach(function(memcept){
        if(linked.memcept.linksTo[i].memcept.id===id){
          linked.memcept.linksTo.splice(i,1);
        }
      // });
      }
    });
  };
  
  this.show=function(sx,sy,sz,sw,sh){
    push();
    translate(sx,0);
    var pos3=mapPoint(-sw/2+this.pos.x, sy, sz-sh/2+this.pos.y, dV);
    this.pos3.x=pos3.x;
    this.pos3.y=pos3.y;
    var posElev3=mapPoint(-sw/2+this.pos.x, sy-400*connectism/connectMax, sz-sh/2+this.pos.y, dV);
    var s3=mapSize(-sw/2+this.pos.x, sy, s, sz-sh/2+this.pos.y, dV);
    var t3;
    this.s3=s3;
    // console.log(pos3.x+" "+pos3.y);
    // translate(this.pos.x,this.pos.y);
    // console.log(sx+this.pos.x+" "+sy+this.pos.y);
    // fill(t*60,80,80,0.8*ttl/ttlMax+0.2);
    fill(t*colGap,80,80,0.6*connectism/connectMax+0.1);
    stroke(t*colGap,80,80,0.5*ttl/ttlMax+0.5);
    strokeWeight(s3/20);
    ellipse(posElev3.x, posElev3.y, s3*2*connectism/connectMax);
    line(pos3.x,pos3.y, posElev3.x, posElev3.y+s3*2*connectism/connectMax/2);
    fill(t*colGap,80,80,0.7);
    // arc(pos3.x, pos3.y, s,s,0,0.001+TWO_PI*connectism/connectMax);//0.5*TWO_PI*connectism/connectMax);
    fill(0,0,0);
    // text(nf(connectism/connectMax,1,2),pos3.x, pos3.y);
    var remove=-1;
    var connectismAcc=0;
    linksTo.forEach(function(linked,i){
      stroke(t*colGap,80,80,linked.strength/4);
      strokeWeight((s3+linked.memcept.s3)/(2*20));
      line(pos3.x, pos3.y, linked.memcept.pos3.x, linked.memcept.pos3.y);
      linked.strength-=linkDecay;
      connectismAcc+=linked.strength;
      if(linked.strength<0){
        remove=i;
      }
    });
    var newConnectism=constrain(connectismAcc,0,connectMax);
    connectism+=(newConnectism-connectism)/10;
    if(remove>-1){
      linksTo.splice(remove,1);
    }
    pop();
    if(ttl>0){
      ttl--;
    }
    // return ttl>0;
    return connectism>0.1 || ttl>0;
  };
  
  this.repel=function(others){
    acc.mult(0);
    others.forEach(function(other){
      // console.log(id+" "+other.id);
      if(id!==other.id){
        // console.log(pos);
        // console.log(other.pos);
        displace=p5.Vector.sub(pos, other.pos);
        // console.log(displace.mag());
        if(displace.mag()<minDist){
          displace.setMag(force*4);
          acc.add(displace);
        } else if(displace.mag()>maxDist){
          if(t===other.type){
            displace.setMag(force/4).mult(-1);
            acc.add(displace);
          }
        } else {
          displace=p5.Vector.random2D().setMag(force);
        }
      }
    });
    vel.add(acc);
    vel.mult(decay);
    this.pos.add(vel);
  }
  
}

function mapPoint(x,y,z,dV){
  var tanThetaX=x/z;
  var tanThetaY=y/z;
  var xv=dV*tanThetaX;
  var yv=dV*tanThetaY;
  return {x: xv, y:yv};
}

function mapSize(x,y,s,z,dV){
  var h=sqrt(x*x+y*y);
  var tanThetaH=h/z;
  var ns=s*(dV*tanThetaH)/h;
  return ns;
}