2d metaball

from http://www.somethinghitme.com/2012/06/06/2d-metaballs-with-canvas/

HTML

<canvas id="canvas"></canvas>
<button id="changeB" onclick="cambiarRender()">change</button>
<button id="stopB" onclick="stop()">stop/move</button>

CSS

body{background:#000;}
#changeB{ position:absolute;top:4px;left:4px;}
#stopB{ position:absolute;top:4px;left:64px;}

JavaScript

var canvas = document.getElementById("canvas"),
    ctx = canvas.getContext("2d"),
    tempCanvas = document.createElement("canvas"),
    tempCtx = tempCanvas.getContext("2d"),
    width = 412,
    height = 512,
    threshold = 210,
    colors = {r:255,g:0,b:0}, cycle = 0,
    points = [];

var conBorde=false;
var moverse=true;

function cambiarRender(){
	conBorde=!conBorde;
}
function stop(){
	moverse=!moverse;
}

canvas.width = tempCanvas.width = width;
canvas.height= tempCanvas.height= height;

for(var i = 0; i < 5; i++){
    var x = Math.random()*width,
        y = Math.random()*height,
        vx = (Math.random()*8)-4,
        vy = (Math.random()*8)-4,
        val = Math.floor(Math.random()*255);
    points.push({x:x,y:y,vx:vx,vy:vy, val:val});
                       
};

function update(){
    var len = points.length;
    tempCtx.clearRect(0,0,width,height);
    while(len--){
        var point = points[len];
        if(moverse){
          point.vx=point.x>width?-point.vx:(point.x<0?-point.vx:point.vx);
          point.vy=point.y>height?-point.vy:(point.y<0?-point.vy:point.vy);
          point.x+=point.vx;
          point.y+=point.vy;
        }
        tempCtx.beginPath();
        var grad = tempCtx.createRadialGradient(point.x, point.y, 1, point.x, point.y, 50);
        grad.addColorStop(0, 'rgba(' + point.val +',0,0,'+(point.val/255)+')');
        grad.addColorStop(1, 'rgba(' + point.val +',0,0,0)');
        tempCtx.fillStyle = grad;
        tempCtx.arc(point.x, point.y, 50, 0, Math.PI*2);
        tempCtx.fill();
    }
   ctx.putImageData(tempCtx.getImageData(0,0,width,height), 0, 0); 
   metabalize();
   setTimeout(update,10);
}


function metabalize(){
    var imageData = tempCtx.getImageData(0,0,width,height);
    var    pix = imageData.data;
    for (var i = 0, n = pix.length; i <n; i += 4) {
        if(pix[i+3]<10){ 	pix[i]=0;pix[i+3]=0;        }
        else if(pix[i+3]<50){ 	pix[i]=0; pix[i+1]=100;  pix[i+2]=200; }
        else if(pix[i+3]<90){...