Dwitter - javascript demos in 140 characters

function u(t) {

c.width=1920 // clear the canvas
for(i=0;i<9;i++)
x.fillRect(400+i*100+S(t)*300,400,50,200) // draw 50x200 rects

} // 122/140

Please log in (or register) to post a dweet (copy-paste the code somewhere safe to save it meanwhile)


    u(t) is called 60 times per second.
    t: Elapsed time in seconds.
    S: Shorthand for Math.sin.
    C: Shorthand for Math.cos.
    T: Shorthand for Math.tan.
    R: Function that generates rgba-strings, usage ex.: R(255, 255, 255, 0.5)
    c: A 1920x1080 canvas.
    x: A 2D context for that canvas.

Try the new frontend: beta.dwitter.net
Current theme challenge: #Food

show FPS hide FPS share fullscreen

quidnovum

remix of d/888 by u/jczimm

function u(t) {

c.width=1920;q=l=>1+S(l)*S(l)
for(i=0;i<300;i++)for(j=0;j<6;j++){x.fillRect(960+200*C(i)/q(i)*S(T(t/1.1)+j/i),540+200*S(i)*C(i)/q(i),10,10)}

Mar 2 2017 6:03 PM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

show FPS hide FPS share fullscreen

veubeke

function u(t) {

t?c.width^=0:a=b=e=f=1;a+=e,b+=f;b>>3||x[k=b*8+a]&&x[k]--?f=-f:a>>3?e=-e:0;for(i=64;i--;)t?x[i]|i==k&&x.fillRect(i-i%8,i%8*8,8,8):x[i]=i>>5

Mar 3 2017 5:33 PM UTC

}// 139/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Turns out you can’t fit Breakout into 140b :D

u/iverjo

+1 for good effort :D

show FPS hide FPS share 2 remixes fullscreen

SpecialAgent

function u(t) {

c.width^=0;r=400;A=[.4,.7,1,1.5,1,2,4,7];for(n=4;n--,q=r*A[n],d=t/A[n+4];)x.arc(r*2,r,q,1,9),x.stroke(),x.fillRect(r*2+q*C(d),r+q*S(d),9,9)

Mar 2 2017 10:55 AM UTC

}// 139/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Illustrates the orbits of the first 4 planets in our solar system. The distance from the sun (not shown but expected in the center) and the orbital periods are to approximate scale. Variable A holds the planetary data, positions 0-3 indicate the distance in Astronomical Units from the sun, positions 4-7 the number of days for orbital periods. These are rounded to fit into the 140 byte limit. Earth should be 3.65, but is rounded up to 4. Not perfect but a close approximation. q is the radius of each orbit (derived from the AU distance), and d is the angle of the planet on the orbital path (derived from the days per orbital period).

u/donbright

hell yeah
u/donbright

remix to show e-v orbital resonance https://www.dwitter.net/d/1811
u/donbright

i wish i could vote twice on SpecialAgent's dweet, so cool.
u/SpecialAgent

Thank you donbright :)
u/SpecialAgent

A golfed version that tunes earth's orbital period to 360 days, and speeds up the simulation: c.width^=0;r=600;for(n=4;n--,q=r*[.2,.3,.5,.75][n],d=t*2/[1,2,3.6,7][n];)x.arc(r,r,q,1,9),x.stroke(),x.fillRect(r+q*C(d),r+q*S(d),9,9)

show FPS hide FPS share fullscreen

Memis

function u(t) {

for(i=0;i<8;i++){x.fillStyle=`hsl(${S(t/1.5)*255},100%,50%)`;x.fillRect(S(t*3.1415/4)*500+950,S(i*t/2)*500+500,5,5)}

Mar 4 2017 12:56 AM UTC

}// 116/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

show FPS hide FPS share 1 remix fullscreen

Niklas

function u(t) {

for(c.width|=0,q=100,i=q;i--;)for(a=i*.031+t*5,j=q;j--;)b=j*.031+t*5,x.fillRect(500+10*i+q*C(b),240+5*j+q*S(a),3,3);

Mar 1 2017 1:29 PM UTC

}// 116/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

u/SpecialAgent

nice cloth :)

show FPS hide FPS share fullscreen

sfz

remix of d/672 by u/aemkei

function u(t) {

for(c.width=874,b=[d=this.b||0],i=5e3;i--;x.fillText(b[i]=d?a==3|d[i]&a==2:i%7%2,i%96*9,i/9))for(a=0,j=5;e=93*(2<j--)+j;)a+=d[i+e]+d[i-e]

Mar 1 2017 7:18 PM UTC

}// 137/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Life in Bits

show FPS hide FPS share 1 remix fullscreen

sfacci

remix of d/1093 by u/sfacci

function u(t) {

c.width=1920;
for(i=0;i<400;i++)for(j=0;j<6;j++){
x.fillRect(300*(j-S(t-i/j)),
150*(j-C(j-i))*j/i*t,
10,10)}

Mar 3 2017 9:49 PM UTC

}// 108/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

show FPS hide FPS share fullscreen

veubeke

function u(t) {

r=c.offsetWidth/(c.width^=0);L=t?L.filter(l=>l[x.beginPath(),x.arc(...l,0,7),x.stroke(),2]++-70):(onmousemove=e=>L.push([e.x/r,e.y/r,5]),[])

Mar 2 2017 9:32 PM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

Note: doesn’t work in Firefox < 53 because of missing support for MouseEvent.x/y

u/iverjo

Wow, this is so cool
u/lionleaf

#interactive #whater #ripples

show FPS hide FPS share fullscreen

ClayCowgill

function u(t) {

for(j=0;j<900;j++)x.globalAlpha=.3,
i=S(t)*4,s=S(t+j),o=C(t-j),x.fillStyle=`hsl(${j-t},100%,50%)`,x.fillRect(950+j*s,500+j*i*o/3,10,10)

Mar 2 2017 7:14 AM UTC

}// 135/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

u/Purpzie

Shortened by 18 characters: for(x.globalAlpha=.3,j=900;j--;)x.fillStyle=hsl(${j-t} 99%50%),x.fillRect(960+j*S(t+j),540+j*(S(t)*4)*C(t-j)/3,9,9)
u/Purpzie

Wait, 2 more characters can be shaved off so now it's 20 characters less than yours: for(x.globalAlpha=.3,j=900;j--;)x.fillStyle=hsl(${j-t} 99%50%),x.fillRect(960+j*S(t+j),540+j*S(t)*4*C(t-j)/3,9,9)

show FPS hide FPS share fullscreen

SpecialAgent

function u(t) {

if(!t)x.translate(960,542),w=1e3,s=42;for(i=0;i<t%90;i++)X=i*s,W=w-X,x.fillStyle=`hsl(${i*t*64},99%,70%)`,x.rotate(1),x.fillRect(0,0,W,42)

Mar 4 2017 7:04 AM UTC

}// 138/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).