- Author:
- ONC
- Twitter:
- @
- GitHub:
- Facebook:
- Google+:
- +
- Reddit:
- /r/
- Pouet:
- Website:
- olivierhuet.fr
- Compo:
- classic
- Demo link:
- https://js1k.com/2010-first/demo/759
- Shortlink:
- https://js1k.com/759
- Blog post:
- please update here!
- Bytes:
- 573
- Chars:
- 573
- Submission
with(document.body.children.c){width=height=330;C=getContext("2d")}D=C.getImageData(9,9,320,200);V=D.data;m=Math;mc=m.cos;ms=m.sin;j=0;o=.7;p=-.4;q=.8;w=.01;window.setInterval("for(i=0;i<63999;i++){a=(j+i/200)/180;d=i*4;c=mc(a);s=ms(a);V[d]=c*128+127;V[d+1]=s*128+127;V[d+2]=c*s*128+127;V[d+3]=255}k=j/99;for(u=0;u<57;u++){h=u/9;for(v=0;v<57;v++){g=v/9;t=60+20*mc(g);x=t*mc(h+k);y=t*ms(h+k)*mc(k/2);z=20*ms(g)*ms(k/2);x2=160+m.floor(o*(x-y));y2=100+m.floor(p*(x+y)+q*z);d=(y2*320+x2)*4;V[d]=V[d+1]=V[d+2]=V[d+3]=255}}C.putImageData(D,9,9);j+=2;q+=w;if(q>1.6||q<.8)w=-w",30)
- Description
- V2.1 : Added rotations (now 573 bytes)
V2.0 : Now with a living dotted Torus ;-p in 558 bytes
V1.1 : Now FF compatible but 13 bytes more long.
V1.0 : Playing with ImageData to make a very simple changing color gradient that can be used as "background" for a logo Use 280b (2 tweets ;) ) but not FF compatible (FF need a width/height for the canvas)
- Base64 encoded
d2l0aChkb2N1bWVudC5ib2R5LmNoaWxkcmVuLmMpe3dpZHRoPWhlaWdodD0zMzA7Qz1nZXRDb250ZXh0KCIyZCIpfUQ9Qy5nZXRJbWFnZURhdGEoOSw5LDMyMCwyMDApO1Y9RC5kYXRhO209TWF0aDttYz1tLmNvczttcz1tLnNpbjtqPTA7bz0uNztwPS0uNDtxPS44O3c9LjAxO3dpbmRvdy5zZXRJbnRlcnZhbCgiZm9yKGk9MDtpPDYzOTk5O2krKyl7YT0oaitpLzIwMCkvMTgwO2Q9aSo0O2M9bWMoYSk7cz1tcyhhKTtWW2RdPWMqMTI4KzEyNztWW2QrMV09cyoxMjgrMTI3O1ZbZCsyXT1jKnMqMTI4KzEyNztWW2QrM109MjU1fWs9ai85OTtmb3IodT0wO3U8NTc7dSsrKXtoPXUvOTtmb3Iodj0wO3Y8NTc7disrKXtnPXYvOTt0PTYwKzIwKm1jKGcpO3g9dCptYyhoK2spO3k9dCptcyhoK2spKm1jKGsvMik7ej0yMCptcyhnKSptcyhrLzIpO3gyPTE2MCttLmZsb29yKG8qKHgteSkpO3kyPTEwMCttLmZsb29yKHAqKHgreSkrcSp6KTtkPSh5MiozMjAreDIpKjQ7VltkXT1WW2QrMV09VltkKzJdPVZbZCszXT0yNTV9fUMucHV0SW1hZ2VEYXRhKEQsOSw5KTtqKz0yO3ErPXc7aWYocT4xLjZ8fHE8Ljgpdz0tdyIsMzAp
- Original source
with(document.body.children.c)width=height=330,C=getContext("2d");
D=C.getImageData(9,9,320,200);
V=D.data;
m=Math;
mc=m.cos;
ms=m.sin;
/*== Var for background ==*/
j=0;
/*== Var for Torus ==*/
o=.7;
p=-.4;
q=.8;
w=.01; /* q modifier */
window.setInterval(function() {
/*== Background ==*/
for(i=0;i<63999;i++) {
a=(j+i/200)/180;
d=i*4;
c=mc(a);
s=ms(a);
V[d]=c*128+127;
V[d+1]=s*128+127;
V[d+2]=c*s*128+127;
V[d+3]=255
}
/*== Torus ==*/
a=20;
R=60;
k=j/99;
for (u=0;u<57;u++){
h=u/9;
for (v=0;v<57;v++){
g=v/9;
t=R+(a*mc(g));
x=t*mc(h+k);
y=t*ms(h+k)*mc(k/2);
z=a*ms(g)*ms(k/2);
x2=160+m.floor(o*(x-y));
y2=100+m.floor(p*(x+y)+q*z);
d=((y2*320)+x2)*4;
V[d]=V[d+1]=V[d+2]=V[d+3]=255;
}
}
C.putImageData(D,9,9);
j+=2
q+=w;
if ((q>1.6)||(q<.8)) { w=-w; }
},30)
