Team:Cornell/javascripts/mycodraw

From 2013.igem.org

(Difference between revisions)
 
(72 intermediate revisions not shown)
Line 1: Line 1:
-
function mycoDraw(){var e=document.getElementById("mycodraw");if(navigator.userAgent.indexOf("Firefox")!=-1){e.style.display="none";document.getElementById("fallback").style.display="block";return}w=e.children[0].width;h=e.children[0].height;e.width=w;e.height=h;drawc=e.getContext("2d");drawc.fillStyle="#F2F2F2";drawc.fillRect(0,0,e.width,e.height);drawi=drawc.getImageData(0,0,w,h);draw=drawi.data;var t=document.createElement("canvas");t.width=w;t.height=h;var n=t.getContext("2d");n.drawImage(e.children[0],0,0);food=n.getImageData(0,0,w,h).data;cx=w/2;cy=h/2;tips=new Array;trls=new Array;dirs=new Array;trns=new Array;spts=new Array;jins=new Array;tins=new Array;trqs=new Array;trcs=new Array;trailCounts=new Array;ts=new Array;for(var r=0;r<100;r++){tips.push([Math.random()*w,Math.random()*h]);trls.push(new Array(l));dirs.push(Math.floor(Math.random()*360));trns.push(Math.random()>.5);spts.push(10);trailCounts.push(0)}var i=100;var s=0;for(var o=0;tips.length>0&&s<1e3;o=l>0?(o+1)%l:0){s++;ts.push(o);setTimeout(updateTips,Math.floor(i+.5));i=i*.999}}function updateTips(){var e=ts.shift();for(var t=tips.length-1;t>=0;t--){var n=tips[t];var r=trls[t];if(l>0)r[e]=n.slice(0);spts[t]=spts[t]-1;var i=colorPoint(n,null,1,dirs[t]);var s=i[0];if(s>.45){var o=n[0]-cx;var u=n[1]-cy;var a=Math.floor(Math.abs(Math.atan(u/o)/Math.PI*180));if(o>0==u<0){a=180*(o>0?1:2)-a}if(o>0&&u>0){a=a+180}dirs[t]=a}var f=i[1];var c=[i[2],i[3],i[4]];if(trailCounts[t]==0&&Math.random()<P_TRAIL&&i[3]>.4&&i[4]>.5&&(Math.abs(i[2]-bleedHue)<.05||Math.abs(Math.abs(i[2]-1)-bleedHue)<.05)){trailCounts[t]=l;jins.push(0);tins.push(e)}else{trailCounts[t]=Math.max(trailCounts[t]-1,0)}if(Math.random()<P_TURN*f*f*f*f){trns[t]=!trns[t]}if(Math.random()<P_SPLIT*f*256/(tips.length/50)&&spts[t]<1){spts[t]=10;trls.push(trls[t].slice(0));tips.push(n.slice(0));dirs.push(dirs[t]);trns.push(!trns[t]);spts.push(10);trailCounts.push(0)}if(s<.1&&Math.random()<P_DIE*(1-f)){tips.splice(t,1);trls.splice(t,1);dirs.splice(t,1);trns.splice(t,1);spts.splice(t,1);trailCounts.splice(t,1)}else{var h=Math.floor(Math.random()*5);dirs[t]=(dirs[t]+(trns[t]?h:-1*h))%360;var p=f*Math.cos(dirs[t]/180*Math.PI);var d=f*Math.sin(dirs[t]/180*Math.PI);tips[t]=[n[0]+p,n[1]+d]}}if(l>0){for(var t=tins.length-1;t>=0;t--){colorPoint(trqs[t][(tins[t]+(l-1)-jins[t])%l],trcs[t],trailStrength*(1-1*jins[t]/(1*l)),0);jins[t]=jins[t]+1;if(jins[t]==l){jins.splice(t,1);tins.splice(t,1);trqs.splice(t,1);trcs.splice(t,1)}}}drawc.putImageData(drawi,0,0)}function colorPoint(e,t,n,r){var i=new Array(5);if(e==null)return i;var s=e[0]-.5;var o=e[0]+.5;var u=e[1]-.5;var a=e[1]+.5;var f=Math.floor(s-(s<0?1:0));var l=Math.floor(o-(o<0?1:0));var c=Math.floor(u-(u<0?1:0));var p=Math.floor(a-(a<0?1:0));var d=[l,f,f,l,f-1,f,l,l+1];var v=[p,p,c,c,0,0,0,0];var m=(f+l)/2+.5;var g=(c+p)/2+.5;var y=(o-m)*(a-g);var b=(m-s)*(a-g);var E=(o-m)*(g-u);var S=(m-s)*(g-u);var x=[y,b,E,S,0,0,0,0];if(0<=r&&r<90||180<=r&&r<270){v[4]=p;v[5]=p+1;v[6]=c-1;v[7]=c;x[4]=b*overEat;x[5]=b*overEat;x[6]=S*overEat;x[7]=S*overEat}else{v[4]=c;v[5]=c-1;v[6]=p+1;v[7]=p;x[4]=E*overEat;x[5]=E*overEat;x[6]=y*overEat;x[7]=y*overEat}if(!antialias){var T=new Array;for(var N=0;N<4;N++)T.push(x[N]);T.sort();for(var N=0;N<4;N++)if(x[N]==T[3])x[N]=1;else x[N]=0}var C=new Array;var k=0;var L=0;if(t==null){C.push(getPixel(food,l,p));C.push(getPixel(food,f,p));C.push(getPixel(food,f,c));C.push(getPixel(food,l,c));var A=0;var O=0;var M=0;for(var N=0;N<4;N++){var _=RGBtoHSB(C[N]);A+=_[0]*x[N];O+=_[1]*x[N];M+=_[2]*x[N]}i[2]=A;i[3]=O;i[4]=M;var D=0;var P=0;var H=0;for(var N=0;N<4;N++){D+=x[N]*Math.floor(C[N][0]);P+=x[N]*Math.floor(C[N][0]);H+=x[N]*Math.floor(C[N][0])}var B=Math.floor(D);var j=Math.floor(P);var F=Math.floor(H);k=Math.min(256,Math.floor((B+j+F)/3)+25.6);L=k/256;if(false)L=1-L}var I=new Array(8);for(var N=0;N<8;N++){I[N]=d[N]<w&&v[N]<h;I[N]=I[N]&&d[N]>=0&&v[N]>=0;if(I[N]){if(t==null){var q=getPixel(food,d[N],v[N]);var R=addRGB(q,myc,x[N]);var U=subRGB(R,q,1);var z=getPixel(food,d[N],v[N]);for(var W=0;W<3;W++)z[W]=R[W];setPixel(food,z,d[N],v[N]);if(N<5){z=getPixel(draw,d[N],v[N]);var X=subRGB(z,U,1);for(var W=0;W<3;W++)z[W]=X[W];setPixel(draw,z,d[N],v[N])}}else{var z=getPixel(draw,d[N],v[N]);var U=addHSB(z,t,n);for(var W=0;W<3;W++)z[W]=U[W];setPixel(draw,z,d[N],v[N])}}}var V=0;for(var N=0;N<4;N++)if(!I[N])V+=.25;i[0]=V;i[1]=L;return i}function addRGB(e,t,n){return[Math.min(e[0]+Math.floor(t[0]*n+.5),255),Math.min(e[1]+Math.floor(t[1]*n+.5),255),Math.min(e[2]+Math.floor(t[2]*n+.5),255)]}function subRGB(e,t,n){return[Math.min(e[0]-Math.floor(t[0]*n+.5),255),Math.min(e[1]-Math.floor(t[1]*n+.5),255),Math.min(e[2]-Math.floor(t[2]*n+.5),255)]}function addHSB(e,t,n){hd=RGBtoHSB(e);hr=RGBtoHSB(t);return HSBtoRGB([bleedHue,Math.max((hd[1]+hr[1]*n)/(1+n),hd[1]),hd[2]])}function RGBtoHSB(e){var t=e[0]/255;var n=e[1]/255;var r=e[2]/255;var i=Math.min(t,n,r);var s=Math.max(t,n,r);var o=s-i;var u=new Array(3);u[2]=s;if(o==0){u[0]=0;u[1]=0}else{u[1]=o/s;var a=((s-t)/6+o/2)/o;var f=((s-n)/6+o/2)/o;var l=((s-r)/6+o/2)/o;if(t==s)u[0]=l-f;else if(n==s)u[0]=1/3+a-l;else if(r==s)u[0]=2/3+f+a;if(u[0]<0)u[0]=u[0]+1;if(u[0]>1)u[0]=u[0]-1}return u}function HSBtoRGB(e){var t=e[0];var n=e[1];var r=e[2];var i=r;var s=r;var o=r;if(n!=0){var u=t*6;if(u==6)u=0;var a=Math.floor(u);var f=r*(1-n);var l=r*(1-n*(u-a));var c=r*(1-n*(1-(u-a)));if(a==0){i=r;s=c;o=f}else if(a==1){i=l;s=r;o=f}else if(a==2){i=f;s=r;o=c}else if(a==3){i=f;s=l;o=r}else if(a==4){i=c;s=f;o=r}else{i=r;s=f;o=l}}return[Math.floor(i*255),Math.floor(s*255),Math.floor(o*255)]}function getPixel(e,t,n){var r=(t+n*w)*4;return[e[r],e[r+1],e[r+2],e[r+3]]}function setPixel(e,t,n,r){var i=(n+r*w)*4;for(var s=0;s<3;s++)e[i+s]=t[s]}function pausecomp(e){e+=(new Date).getTime();while(new Date<e){}}var P_TURN=.1;var P_SPLIT=.1/256;var P_TRAIL=.1;var P_DIE=.01;var mc=68;var myc=[mc,mc,mc];var invertFood=false;var invertMyc=true;var antialias=true;var l=50;var trailStrength=.1;var bleedHue=0;var overEat=1;var w;var h;var food;var draw;var drawi;var drawc;var cx;var cy;var tips;var trls;var dirs;var trns;var spts;var jins;var tins;var trqs;var trcs;var trailCounts;var ts
+
var P_TURN = 0.1;
 +
var P_SPLIT = 0.1;
 +
var P_TRAIL = 0.1;
 +
var P_DIE = 0.01;
 +
var mc = 0x44;
 +
var myc = [mc, mc, mc];
 +
var invertFood = false;
 +
var invertMyc = true;
 +
var antialias = true;
 +
var l = 50;
 +
var trailStrength = 0.1;
 +
var bleedHue = 0;
 +
var overEat = 1;
 +
 
 +
var w;
 +
var h;
 +
var food;
 +
var draw;
 +
var drawi;
 +
var drawc;
 +
var cx;
 +
var cy;
 +
 
 +
var tips;
 +
var trls;
 +
var dirs;
 +
var trns;
 +
var spts;
 +
var jins;
 +
var tins;
 +
var trqs;
 +
var trcs;
 +
var trailCounts;
 +
 
 +
var ts;
 +
 
 +
function mycoDraw()
 +
{
 +
var canvas = document.getElementById("mycodraw");
 +
 
 +
if(navigator.userAgent.indexOf('Firefox') != -1 || navigator.userAgent.indexOf('MSIE') != -1)
 +
{
 +
canvas.style.display = "none";
 +
document.getElementById("fallback").style.display = "block";
 +
return;
 +
}
 +
 
 +
w = canvas.children[0].width;
 +
h = canvas.children[0].height;
 +
canvas.width = w;
 +
canvas.height = h;
 +
drawc = canvas.getContext("2d");
 +
drawc.fillStyle = "#F2F2F2";
 +
drawc.fillRect(0, 0, canvas.width, canvas.height);
 +
drawi = drawc.getImageData(0, 0, w, h);
 +
draw = drawi.data;
 +
for(var d = 0; d < 32; d++)
 +
{
 +
var dt = 31-d;
 +
for(var y = d; y < h; y = y + h - 2*d)
 +
{
 +
for(var x = d; x < (w-d); x++)
 +
{
 +
var i = (x + y*w)*4;
 +
draw[i+3] = 256-(dt*dt/4);
 +
}
 +
}
 +
for(var x = d; x < w; x = x + w - 2*d)
 +
{
 +
for(var y = d; y < (h-d); y++)
 +
{
 +
var i = (x + y*w)*4;
 +
draw[i+3] = Math.min(draw[i+3], 256-(dt*dt/4));
 +
}
 +
}
 +
}
 +
 
 +
 +
var src_canvas = document.createElement('canvas');
 +
src_canvas.width = w;
 +
src_canvas.height = h;
 +
var foodc = src_canvas.getContext("2d");
 +
foodc.drawImage(canvas.children[0], 0, 0);
 +
food = foodc.getImageData(0, 0, w, h).data;
 +
 
 +
cx = w/2;
 +
cy = h/2;
 +
 
 +
tips = new Array();
 +
trls = new Array();
 +
dirs = new Array();
 +
trns = new Array();
 +
spts = new Array();
 +
jins = new Array();
 +
tins = new Array();
 +
trqs = new Array();
 +
trcs = new Array();
 +
trailCounts = new Array();
 +
ts = new Array();
 +
 +
for(var i = 0; i < 100; i++)
 +
{
 +
tips.push([Math.random()*w,Math.random()*h]);
 +
trls.push(new Array(l));
 +
dirs.push(Math.floor(Math.random()*360));
 +
trns.push(Math.random() > 0.5);
 +
spts.push(10);
 +
trailCounts.push(0);
 +
}
 +
var speed = 100;
 +
var limit = 0;
 +
var bt = 0;
 +
for(var t = 0; tips.length > 0 && limit < 1000; t = (l > 0 ? (t+1)%l : 0))
 +
{
 +
limit++;
 +
ts.push(t);
 +
ts.push(bt);
 +
if(t == 0)
 +
bt = (bt + 1)%10;
 +
// updateTips();
 +
setTimeout(updateTips, Math.floor(speed + 0.5));
 +
speed = speed * 0.999;
 +
}
 +
}
 +
 
 +
function updateTips()
 +
{
 +
var t = ts.shift();
 +
var bt = ts.shift();
 +
 +
for(var i = tips.length-1; i >= 0; i--)
 +
{
 +
var p = tips[i];
 +
var trl = trls[i];
 +
if(l > 0) trl[t] = p.slice(0);
 +
spts[i] = spts[i] - 1;
 +
 +
var vals = colorPoint(p, null, 1.0, dirs[i]); //the main strand-coloring call
 +
 
 +
var out = vals[0];
 +
if(out > 0.45) //turns the tips around if they hit the edge
 +
{
 +
var dx = p[0] - cx;
 +
var dy = p[1] - cy;
 +
var theta = Math.floor(Math.abs((Math.atan(dy/dx)/Math.PI)*180));
 +
if(dx > 0 == dy < 0)
 +
{ theta = 180*(dx > 0 ? 1 : 2) - theta; }
 +
if(dx > 0 && dy > 0)
 +
{ theta = theta + 180; }
 +
dirs[i] = theta;
 +
}
 +
var wp = vals[1];
 +
var ref = [vals[2], vals[3], vals[4]];
 +
 
 +
if(trailCounts[i] == 0 && Math.random() < P_TRAIL &&
 +
vals[3] > 0.4 && vals[4] > 0.5 &&
 +
( Math.abs(vals[2] - bleedHue) < 0.05 ||  
 +
Math.abs(Math.abs(vals[2]-1.0) - bleedHue) < 0.05)
 +
)
 +
{
 +
trailCounts[i] = l;
 +
jins.push(0);
 +
tins.push(t);
 +
trqs.push(trls[i].slice(0));
 +
trcs.push(ref);
 +
}
 +
else
 +
{ trailCounts[i] = Math.max(trailCounts[i]-1, 0); }
 +
 +
if(Math.random() < P_TURN*wp*wp*wp*wp) { trns[i] = !trns[i]; }
 +
if(Math.random() < (P_SPLIT*wp)/(parseFloat(tips.length)/50.0) && spts[i] < 1.0)
 +
{
 +
spts[i] = 10;
 +
trls.push(trls[i].slice(0));
 +
tips.push(p.slice(0));
 +
dirs.push(dirs[i]);
 +
trns.push(!trns[i]);
 +
spts.push(10);
 +
trailCounts.push(0);
 +
}
 +
if(out < 0.1 && Math.random() < P_DIE*(1.0-wp))
 +
{
 +
tips.splice(i, 1);
 +
trls.splice(i, 1);
 +
dirs.splice(i, 1);
 +
trns.splice(i, 1);
 +
spts.splice(i, 1);
 +
trailCounts.splice(i, 1);
 +
}
 +
else
 +
{
 +
var turn = Math.floor(Math.random()*5);
 +
dirs[i] = (dirs[i] + (trns[i] ? turn : -1*turn))%360;
 +
var xd = wp*Math.cos(((dirs[i])/180.0)*Math.PI);
 +
var yd = wp*Math.sin(((dirs[i])/180.0)*Math.PI);
 +
tips[i] = [p[0] + xd, p[1] + yd];
 +
}
 +
}
 +
if(l > 0) //trail-coloring
 +
{
 +
for(var i = tins.length - 1; i >= 0; i--)
 +
{
 +
colorPoint(trqs[i][(tins[i]+(l-1)-jins[i])%l], trcs[i], trailStrength*(1.0-((1.0*jins[i])/(1.0*l))), 0);
 +
jins[i] = jins[i]+1;
 +
if(jins[i] == l) //this trail is completed
 +
{
 +
jins.splice(i, 1);
 +
tins.splice(i, 1);
 +
trqs.splice(i, 1);
 +
trcs.splice(i, 1);
 +
}
 +
}
 +
}
 +
drawc.putImageData(drawi, 0, 0);
 +
}
 +
 
 +
function colorPoint(p, ref, strength, dir)                                                
 +
{                                                                                                                          
 +
var rets = new Array(5);
 +
if(p == null)
 +
return rets;
 +
var dx1 = p[0]-0.5;
 +
var dx2 = p[0]+0.5;
 +
var dy1 = p[1]-0.5;
 +
var dy2 = p[1]+0.5;
 +
var x1 = Math.floor(dx1 - (dx1 < 0 ? 1 : 0));
 +
var x2 = Math.floor(dx2 - (dx2 < 0 ? 1 : 0));
 +
var y1 = Math.floor(dy1 - (dy1 < 0 ? 1 : 0));
 +
var y2 = Math.floor(dy2 - (dy2 < 0 ? 1 : 0));
 +
var x = [x2, x1, x1, x2, x1-1, x1, x2, x2+1];
 +
var y = [y2, y2, y1, y1, 0, 0, 0, 0];
 +
var mx = ((x1+x2)/2.0) + 0.5;
 +
var my = ((y1+y2)/2.0) + 0.5;
 +
var p1 = (dx2-mx)*(dy2-my);
 +
var p2 = (mx-dx1)*(dy2-my);
 +
var p3 = (dx2-mx)*(my-dy1);
 +
var p4 = (mx-dx1)*(my-dy1);
 +
var pj = [p1, p2, p3, p4, 0, 0, 0, 0];
 +
if((0 <= dir && dir < 90) || (180 <= dir && dir < 270))
 +
{
 +
y[4] = y2;
 +
y[5] = y2+1;
 +
y[6] = y1-1;
 +
y[7] = y1;
 +
pj[4] = p2*overEat;
 +
pj[5] = p2*overEat;
 +
pj[6] = p4*overEat;
 +
pj[7] = p4*overEat;
 +
}
 +
else
 +
{
 +
y[4] = y1;
 +
y[5] = y1-1;
 +
y[6] = y2+1;
 +
y[7] = y2;
 +
pj[4] = p3*overEat;
 +
pj[5] = p3*overEat;
 +
pj[6] = p1*overEat;
 +
pj[7] = p1*overEat;
 +
}
 +
if(!antialias)
 +
{
 +
var ps = new Array();
 +
for(var j = 0; j < 4; j++)
 +
ps.push(pj[j]);
 +
ps.sort();
 +
for(var j = 0; j < 4; j++)
 +
if(pj[j] == ps[3])
 +
pj[j] = 1.0;
 +
else
 +
pj[j] = 0.0;
 +
}
 +
var rgb = new Array();
 +
var wd = 0.0;
 +
var wp = 0.0;
 +
if(ref == null)
 +
{
 +
rgb.push(getPixel(food, x2, y2));
 +
rgb.push(getPixel(food, x1, y2));
 +
rgb.push(getPixel(food, x1, y1));
 +
rgb.push(getPixel(food, x2, y1));
 +
var hue = 0;
 +
var saturation = 0;
 +
var brightness = 0;
 +
for(var j = 0; j < 4; j++)
 +
{
 +
var hsb = RGBtoHSB(rgb[j]);
 +
hue += hsb[0]*pj[j];
 +
saturation += hsb[1]*pj[j];
 +
brightness += hsb[2]*pj[j];
 +
}
 +
 
 +
rets[2] = hue;
 +
rets[3] = saturation;
 +
rets[4] = brightness;
 +
 
 +
var dr = 0;
 +
var dg = 0;
 +
var db = 0;
 +
for(var j = 0; j < 4; j++)
 +
{
 +
dr += pj[j]*parseFloat(Math.floor(rgb[j][0]));
 +
dg += pj[j]*parseFloat(Math.floor(rgb[j][0]));
 +
db += pj[j]*parseFloat(Math.floor(rgb[j][0]));
 +
}
 +
var r = parseFloat(Math.floor(dr));
 +
var g = parseFloat(Math.floor(dg));
 +
var b = parseFloat(Math.floor(db));
 +
 +
wd = Math.min(256.0, parseFloat(Math.floor(((r + g + b)/3.0))) + 25.6);
 +
wp = wd/256.0;
 +
 +
if(false) wp = 1.0 - wp; //invertFood
 +
}
 +
var inside = new Array(8);
 +
for(var j = 0; j < 8; j++)
 +
{
 +
inside[j] = x[j] < w && y[j] < h;
 +
inside[j] = inside[j] && x[j] >= 0 && y[j] >= 0;
 +
 +
if(inside[j])
 +
{
 +
if(ref == null) // if this is a strand-drawing call
 +
{
 +
var origColor = getPixel(food, x[j], y[j]);
 +
var addColor = addRGB(origColor, myc, pj[j]);
 +
var addedColor = subRGB(addColor, origColor, 1.0);
 +
var imgd = getPixel(food, x[j], y[j]);
 +
for(var k = 0; k < 3; k++) imgd[k] = addColor[k];
 +
setPixel(food, imgd, x[j], y[j]);
 +
if(j < 5)
 +
{
 +
imgd = getPixel(draw, x[j], y[j]);
 +
var subbedColor = subRGB(imgd, addedColor, 1.0);
 +
for(var k = 0; k < 3; k++) imgd[k] = subbedColor[k];
 +
setPixel(draw, imgd, x[j], y[j]);
 +
}
 +
}
 +
else //if this is a trail-drawing call
 +
{
 +
var imgd = getPixel(draw, x[j], y[j]);
 +
var addedColor = addHSB(imgd, ref, strength);
 +
for(var k = 0; k < 3; k++) imgd[k] = addedColor[k];
 +
setPixel(draw, imgd, x[j], y[j]);
 +
}
 +
}
 +
}
 +
var out = 0;
 +
for(var j = 0; j < 4; j++)
 +
if(!inside[j]) out += 0.25;
 +
rets[0] = out;
 +
rets[1] = wp;
 +
return rets;                                                                                                       
 +
}  
 +
 
 +
function addRGB(c1, c2, weight)
 +
{
 +
return [Math.min(c1[0] + Math.floor(c2[0]*weight + 0.5), 0xFF),
 +
Math.min(c1[1] + Math.floor(c2[1]*weight + 0.5), 0xFF),
 +
Math.min(c1[2] + Math.floor(c2[2]*weight + 0.5), 0xFF)];
 +
}      
 +
 
 +
function subRGB(c1, c2, weight)
 +
{
 +
return [Math.min(c1[0] - Math.floor(c2[0]*weight + 0.5), 0xFF),
 +
Math.min(c1[1] - Math.floor(c2[1]*weight + 0.5), 0xFF),
 +
Math.min(c1[2] - Math.floor(c2[2]*weight + 0.5), 0xFF)];
 +
}
 +
 
 +
function addHSB(cd, cr, weight)
 +
{
 +
hd = RGBtoHSB(cd);
 +
hr = RGBtoHSB(cr);
 +
return HSBtoRGB([bleedHue,
 +
Math.max((hd[1] + hr[1]*weight)/(1.0+weight), hd[1]),
 +
hd[2]]);
 +
}
 +
 
 +
function RGBtoHSB(rgb)
 +
{
 +
var r = rgb[0]/255;
 +
var g = rgb[1]/255;
 +
var b = rgb[2]/255;
 +
var min = Math.min(r, g, b);
 +
var max = Math.max(r, g, b);
 +
var del = max - min;
 +
var hsb = new Array(3);
 +
hsb[2] = max;
 +
if(del == 0)
 +
{
 +
hsb[0] = 0;
 +
hsb[1] = 0;
 +
}
 +
else
 +
{
 +
hsb[1] = del/max;
 +
 +
var delR = (((max - r)/6) + (del/2))/del
 +
var delG = (((max - g)/6) + (del/2))/del
 +
var delB = (((max - b)/6) + (del/2))/del
 +
 +
if(r == max) hsb[0] = delB - delG;
 +
else if(g == max) hsb[0] = (1/3) + delR - delB;
 +
else if(b == max) hsb [0] = (2/3) + delG + delR;
 +
 +
if(hsb[0] < 0) hsb[0] = hsb[0] + 1;
 +
if(hsb[0] > 1) hsb[0] = hsb[0] - 1;
 +
}
 +
return hsb;
 +
}
 +
 
 +
function HSBtoRGB(hsb)
 +
{
 +
var h = hsb[0];
 +
var s = hsb[1];
 +
var v = hsb[2];
 +
 
 +
var r = v;
 +
var g = v;
 +
var b = v;
 +
 +
if(s != 0)
 +
{
 +
var sh = h*6;
 +
if(sh == 6) sh = 0;
 +
var hi = Math.floor(sh);
 +
var v1 = v * (1 - s);
 +
var v2 = v * (1 - s * (sh - hi));
 +
var v3 = v * (1 - s * (1 - (sh - hi)));
 +
 +
if ( hi == 0 ) {r = v; g = v3; b = v1; }
 +
else if ( hi == 1 ) {r = v2; g = v; b = v1; }
 +
else if ( hi == 2 ) {r = v1; g = v; b = v3; }
 +
else if ( hi == 3 ) {r = v1; g = v2; b = v; }
 +
else if ( hi == 4 ) {r = v3; g = v1; b = v; }
 +
else {r = v; g = v1; b = v2; }
 +
}
 +
return [Math.floor(r*255), Math.floor(g*255), Math.floor(b*255)];
 +
}
 +
 
 +
function getPixel(data, x, y)
 +
{
 +
var i = (x + y*w)*4;
 +
return [data[i], data[i+1], data[i+2], data[i+3]];
 +
}
 +
 
 +
function setPixel(data, pix, x, y)
 +
{
 +
var i = (x + y*w)*4;
 +
for(var j = 0; j < 3; j++)
 +
data[i+j] = pix[j];
 +
}
 +
 
 +
function pausecomp(ms)
 +
{
 +
ms += new Date().getTime();
 +
while (new Date() < ms){}
 +
}

Latest revision as of 23:09, 18 June 2013

var P_TURN = 0.1; var P_SPLIT = 0.1; var P_TRAIL = 0.1; var P_DIE = 0.01; var mc = 0x44; var myc = [mc, mc, mc]; var invertFood = false; var invertMyc = true; var antialias = true; var l = 50; var trailStrength = 0.1; var bleedHue = 0; var overEat = 1;

var w; var h; var food; var draw; var drawi; var drawc; var cx; var cy;

var tips; var trls; var dirs; var trns; var spts; var jins; var tins; var trqs; var trcs; var trailCounts;

var ts;

function mycoDraw() { var canvas = document.getElementById("mycodraw");

if(navigator.userAgent.indexOf('Firefox') != -1 || navigator.userAgent.indexOf('MSIE') != -1) { canvas.style.display = "none"; document.getElementById("fallback").style.display = "block"; return; }

w = canvas.children[0].width; h = canvas.children[0].height; canvas.width = w; canvas.height = h; drawc = canvas.getContext("2d"); drawc.fillStyle = "#F2F2F2"; drawc.fillRect(0, 0, canvas.width, canvas.height); drawi = drawc.getImageData(0, 0, w, h); draw = drawi.data; for(var d = 0; d < 32; d++) { var dt = 31-d; for(var y = d; y < h; y = y + h - 2*d) { for(var x = d; x < (w-d); x++) { var i = (x + y*w)*4; draw[i+3] = 256-(dt*dt/4); } } for(var x = d; x < w; x = x + w - 2*d) { for(var y = d; y < (h-d); y++) { var i = (x + y*w)*4; draw[i+3] = Math.min(draw[i+3], 256-(dt*dt/4)); } } }


var src_canvas = document.createElement('canvas'); src_canvas.width = w; src_canvas.height = h; var foodc = src_canvas.getContext("2d"); foodc.drawImage(canvas.children[0], 0, 0); food = foodc.getImageData(0, 0, w, h).data;

cx = w/2; cy = h/2;

tips = new Array(); trls = new Array(); dirs = new Array(); trns = new Array(); spts = new Array(); jins = new Array(); tins = new Array(); trqs = new Array(); trcs = new Array(); trailCounts = new Array(); ts = new Array();

for(var i = 0; i < 100; i++) { tips.push([Math.random()*w,Math.random()*h]); trls.push(new Array(l)); dirs.push(Math.floor(Math.random()*360)); trns.push(Math.random() > 0.5); spts.push(10); trailCounts.push(0); } var speed = 100; var limit = 0; var bt = 0; for(var t = 0; tips.length > 0 && limit < 1000; t = (l > 0 ? (t+1)%l : 0)) { limit++; ts.push(t); ts.push(bt); if(t == 0) bt = (bt + 1)%10; // updateTips(); setTimeout(updateTips, Math.floor(speed + 0.5)); speed = speed * 0.999; } }

function updateTips() { var t = ts.shift(); var bt = ts.shift();

for(var i = tips.length-1; i >= 0; i--) { var p = tips[i]; var trl = trls[i]; if(l > 0) trl[t] = p.slice(0); spts[i] = spts[i] - 1;

var vals = colorPoint(p, null, 1.0, dirs[i]); //the main strand-coloring call

var out = vals[0]; if(out > 0.45) //turns the tips around if they hit the edge { var dx = p[0] - cx; var dy = p[1] - cy; var theta = Math.floor(Math.abs((Math.atan(dy/dx)/Math.PI)*180)); if(dx > 0 == dy < 0) { theta = 180*(dx > 0 ? 1 : 2) - theta; } if(dx > 0 && dy > 0) { theta = theta + 180; } dirs[i] = theta; } var wp = vals[1]; var ref = [vals[2], vals[3], vals[4]];

if(trailCounts[i] == 0 && Math.random() < P_TRAIL && vals[3] > 0.4 && vals[4] > 0.5 && ( Math.abs(vals[2] - bleedHue) < 0.05 || Math.abs(Math.abs(vals[2]-1.0) - bleedHue) < 0.05) ) { trailCounts[i] = l; jins.push(0); tins.push(t); trqs.push(trls[i].slice(0)); trcs.push(ref); } else { trailCounts[i] = Math.max(trailCounts[i]-1, 0); }

if(Math.random() < P_TURN*wp*wp*wp*wp) { trns[i] = !trns[i]; } if(Math.random() < (P_SPLIT*wp)/(parseFloat(tips.length)/50.0) && spts[i] < 1.0) { spts[i] = 10; trls.push(trls[i].slice(0)); tips.push(p.slice(0)); dirs.push(dirs[i]); trns.push(!trns[i]); spts.push(10); trailCounts.push(0); } if(out < 0.1 && Math.random() < P_DIE*(1.0-wp)) { tips.splice(i, 1); trls.splice(i, 1); dirs.splice(i, 1); trns.splice(i, 1); spts.splice(i, 1); trailCounts.splice(i, 1); } else { var turn = Math.floor(Math.random()*5); dirs[i] = (dirs[i] + (trns[i] ? turn : -1*turn))%360; var xd = wp*Math.cos(((dirs[i])/180.0)*Math.PI); var yd = wp*Math.sin(((dirs[i])/180.0)*Math.PI); tips[i] = [p[0] + xd, p[1] + yd]; } } if(l > 0) //trail-coloring { for(var i = tins.length - 1; i >= 0; i--) { colorPoint(trqs[i][(tins[i]+(l-1)-jins[i])%l], trcs[i], trailStrength*(1.0-((1.0*jins[i])/(1.0*l))), 0); jins[i] = jins[i]+1; if(jins[i] == l) //this trail is completed { jins.splice(i, 1); tins.splice(i, 1); trqs.splice(i, 1); trcs.splice(i, 1); } } } drawc.putImageData(drawi, 0, 0); }

function colorPoint(p, ref, strength, dir) { var rets = new Array(5); if(p == null) return rets; var dx1 = p[0]-0.5; var dx2 = p[0]+0.5; var dy1 = p[1]-0.5; var dy2 = p[1]+0.5; var x1 = Math.floor(dx1 - (dx1 < 0 ? 1 : 0)); var x2 = Math.floor(dx2 - (dx2 < 0 ? 1 : 0)); var y1 = Math.floor(dy1 - (dy1 < 0 ? 1 : 0)); var y2 = Math.floor(dy2 - (dy2 < 0 ? 1 : 0)); var x = [x2, x1, x1, x2, x1-1, x1, x2, x2+1]; var y = [y2, y2, y1, y1, 0, 0, 0, 0]; var mx = ((x1+x2)/2.0) + 0.5; var my = ((y1+y2)/2.0) + 0.5; var p1 = (dx2-mx)*(dy2-my); var p2 = (mx-dx1)*(dy2-my); var p3 = (dx2-mx)*(my-dy1); var p4 = (mx-dx1)*(my-dy1); var pj = [p1, p2, p3, p4, 0, 0, 0, 0]; if((0 <= dir && dir < 90) || (180 <= dir && dir < 270)) { y[4] = y2; y[5] = y2+1; y[6] = y1-1; y[7] = y1; pj[4] = p2*overEat; pj[5] = p2*overEat; pj[6] = p4*overEat; pj[7] = p4*overEat; } else { y[4] = y1; y[5] = y1-1; y[6] = y2+1; y[7] = y2; pj[4] = p3*overEat; pj[5] = p3*overEat; pj[6] = p1*overEat; pj[7] = p1*overEat; } if(!antialias) { var ps = new Array(); for(var j = 0; j < 4; j++) ps.push(pj[j]); ps.sort(); for(var j = 0; j < 4; j++) if(pj[j] == ps[3]) pj[j] = 1.0; else pj[j] = 0.0; } var rgb = new Array(); var wd = 0.0; var wp = 0.0; if(ref == null) { rgb.push(getPixel(food, x2, y2)); rgb.push(getPixel(food, x1, y2)); rgb.push(getPixel(food, x1, y1)); rgb.push(getPixel(food, x2, y1)); var hue = 0; var saturation = 0; var brightness = 0; for(var j = 0; j < 4; j++) { var hsb = RGBtoHSB(rgb[j]); hue += hsb[0]*pj[j]; saturation += hsb[1]*pj[j]; brightness += hsb[2]*pj[j]; }

rets[2] = hue; rets[3] = saturation; rets[4] = brightness;

var dr = 0; var dg = 0; var db = 0; for(var j = 0; j < 4; j++) { dr += pj[j]*parseFloat(Math.floor(rgb[j][0])); dg += pj[j]*parseFloat(Math.floor(rgb[j][0])); db += pj[j]*parseFloat(Math.floor(rgb[j][0])); } var r = parseFloat(Math.floor(dr)); var g = parseFloat(Math.floor(dg)); var b = parseFloat(Math.floor(db));

wd = Math.min(256.0, parseFloat(Math.floor(((r + g + b)/3.0))) + 25.6); wp = wd/256.0;

if(false) wp = 1.0 - wp; //invertFood } var inside = new Array(8); for(var j = 0; j < 8; j++) { inside[j] = x[j] < w && y[j] < h; inside[j] = inside[j] && x[j] >= 0 && y[j] >= 0;

if(inside[j]) { if(ref == null) // if this is a strand-drawing call { var origColor = getPixel(food, x[j], y[j]); var addColor = addRGB(origColor, myc, pj[j]); var addedColor = subRGB(addColor, origColor, 1.0); var imgd = getPixel(food, x[j], y[j]); for(var k = 0; k < 3; k++) imgd[k] = addColor[k]; setPixel(food, imgd, x[j], y[j]); if(j < 5) { imgd = getPixel(draw, x[j], y[j]); var subbedColor = subRGB(imgd, addedColor, 1.0); for(var k = 0; k < 3; k++) imgd[k] = subbedColor[k]; setPixel(draw, imgd, x[j], y[j]); } } else //if this is a trail-drawing call { var imgd = getPixel(draw, x[j], y[j]); var addedColor = addHSB(imgd, ref, strength); for(var k = 0; k < 3; k++) imgd[k] = addedColor[k]; setPixel(draw, imgd, x[j], y[j]); } } } var out = 0; for(var j = 0; j < 4; j++) if(!inside[j]) out += 0.25; rets[0] = out; rets[1] = wp; return rets; }

function addRGB(c1, c2, weight) { return [Math.min(c1[0] + Math.floor(c2[0]*weight + 0.5), 0xFF), Math.min(c1[1] + Math.floor(c2[1]*weight + 0.5), 0xFF), Math.min(c1[2] + Math.floor(c2[2]*weight + 0.5), 0xFF)]; }

function subRGB(c1, c2, weight) { return [Math.min(c1[0] - Math.floor(c2[0]*weight + 0.5), 0xFF), Math.min(c1[1] - Math.floor(c2[1]*weight + 0.5), 0xFF), Math.min(c1[2] - Math.floor(c2[2]*weight + 0.5), 0xFF)]; }

function addHSB(cd, cr, weight) { hd = RGBtoHSB(cd); hr = RGBtoHSB(cr); return HSBtoRGB([bleedHue, Math.max((hd[1] + hr[1]*weight)/(1.0+weight), hd[1]), hd[2]]); }

function RGBtoHSB(rgb) { var r = rgb[0]/255; var g = rgb[1]/255; var b = rgb[2]/255; var min = Math.min(r, g, b); var max = Math.max(r, g, b); var del = max - min; var hsb = new Array(3); hsb[2] = max; if(del == 0) { hsb[0] = 0; hsb[1] = 0; } else { hsb[1] = del/max;

var delR = (((max - r)/6) + (del/2))/del var delG = (((max - g)/6) + (del/2))/del var delB = (((max - b)/6) + (del/2))/del

if(r == max) hsb[0] = delB - delG; else if(g == max) hsb[0] = (1/3) + delR - delB; else if(b == max) hsb [0] = (2/3) + delG + delR;

if(hsb[0] < 0) hsb[0] = hsb[0] + 1; if(hsb[0] > 1) hsb[0] = hsb[0] - 1; } return hsb; }

function HSBtoRGB(hsb) { var h = hsb[0]; var s = hsb[1]; var v = hsb[2];

var r = v; var g = v; var b = v;

if(s != 0) { var sh = h*6; if(sh == 6) sh = 0; var hi = Math.floor(sh); var v1 = v * (1 - s); var v2 = v * (1 - s * (sh - hi)); var v3 = v * (1 - s * (1 - (sh - hi)));

if ( hi == 0 ) {r = v; g = v3; b = v1; } else if ( hi == 1 ) {r = v2; g = v; b = v1; } else if ( hi == 2 ) {r = v1; g = v; b = v3; } else if ( hi == 3 ) {r = v1; g = v2; b = v; } else if ( hi == 4 ) {r = v3; g = v1; b = v; } else {r = v; g = v1; b = v2; } } return [Math.floor(r*255), Math.floor(g*255), Math.floor(b*255)]; }

function getPixel(data, x, y) { var i = (x + y*w)*4; return [data[i], data[i+1], data[i+2], data[i+3]]; }

function setPixel(data, pix, x, y) { var i = (x + y*w)*4; for(var j = 0; j < 3; j++) data[i+j] = pix[j]; }

function pausecomp(ms) { ms += new Date().getTime(); while (new Date() < ms){} }