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 1 remix fullscreen

AnnanFay

remix of d/6716 by u/silver_bear

function u(t) {

c.width|=i=0,y=S(t*13),w=500
with(x)for(fillStyle='#FE0',moveTo(w,w),arc(w,w,w/2,y*.8,6.3-y);i<9;fill())fillRect(2*w+w*i+++t*-w%w,w,w/9,w/9)

Feb 4 2018 6:11 PM UTC

}// 140/140

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

6.3 is pretty much 2*PI. Putting fill() where it is causes it to fill the pacman in 9 times but saves a byte. Using with saves another 1-2 bytes.

Show more comments…
u/AnnanFay

#FFEE00 is also supposedly the official Pacman colour.
u/silver_bear

Wow, you're quite a bit more advanced than me. Very nice! :)
u/lionleaf

Cool! Similar to one of the really old dweets by u/iverjo : d/312 . :)
u/21medals

you can save 2 bytes by moving "w=500" to the moveTo()
u/AnnanFay

You can also replace 2*w+w*i+++t*-w%w with 2*w+w*i++-t*w%w for 1 byte, you can save 2 bytes by adding i=2 and w*i++-t*w%w which puts us at 135 bytes
u/AnnanFay

One thing I'd like to fix is the rate which pac-man bites down at. It would be nice if it synchronised with the squares.
u/AnnanFay

Improved: https://www.dwitter.net/d/6738

show FPS hide FPS share fullscreen

Apex

function u(t) {

for(c.width|=i=0;i<4;C=S(8*-t+i)*80,T=S(t)*64,x.fillStyle=R(0,T*2,T),x.fillRect(785+i*100,C<0.1?440:440-C,50,C<0.1?200:200+C*2),i++);//hi :D

Feb 4 2018 9:27 PM UTC

}// 140/140

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

u/Apex

Inspired by Google's loading bars animation. It could be golfed further but I was just looking for enough room to put a nice comment
u/Apex

(It changes color, just watch it)

show FPS hide FPS share fullscreen

DirtyDan

function u(t) {

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

Feb 5 2018 2:02 AM UTC

}// 138/140

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

u/katkip

#default

show FPS hide FPS share 1 remix fullscreen

DirtyDan

remix of d/6645 by u/DirtyDan

function u(t) {

for(i=1;i<360;i++)x.fillStyle=`hsl(${i},99%,50%)`,R=532*S(t+i/180),x.fillRect(960+R*C(t+i)-4,540+R*S(t+i)-4,8,8)

Feb 4 2018 7:23 AM UTC

}// 112/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

TheSchaeff

function u(t) {

c.width+=0
b=(2+T(t)*-50)+80
x.fillRect(0,900,1920,8)
x.fillRect(b+1630,760-b,8,200)
x.font='90px a'
x.fillText("LOADING", b+1200, 880)

Feb 4 2018 2:24 AM UTC

}// 137/140

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

first time

show FPS hide FPS share fullscreen

BirdsTweetCodersDweet

function u(t) {

with(x)for(c.width=a=2e3;a--;beginPath(stroke()))b=255,d=C(a)*20,strokeStyle=R(b*S(a)+b,25*d,99+d,.5),arc(960+b*C(a+t),540+b*C(a),70+d,0,7)

Feb 4 2018 11:25 AM UTC

}// 139/140

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

Credit to u/joeytwiddle for making my rainbow donut fit and still be awesome.

show FPS hide FPS share 1 remix fullscreen

ellisk1

remix of d/5317 by u/ellisk1

function u(t) {

x.fillStyle=R(t%4/7*(q=t%1*1500),150-t%4*q,0,.5),x.beginPath(),x.arc(600+q*C(a=6*Math.random()),600+q*S(a),q/2+20,e=3+a,e+.8+t%1/3),x.fill()

Feb 3 2018 6:19 PM UTC

}// 140/140

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

Rose Petals

u/jonathan_b

cool design!

show FPS hide FPS share fullscreen

loni_art

function u(t) {

c.width|=w=40
f=Math.floor;l=Math.log;
for(i=10*w;i--;(-1<(l(i/3*w)/l(2)-(3*(i%w+t)+i/w))%2)?x.fillRect((i%w)*w,f(i/w)*w,w,w):0);

Feb 5 2018 7:44 PM UTC

}// 129/140

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

is random? is it not?

u/loni_art

note: this was an attempt of using tupper's formula to show a very special thing, but sadly, it didn't work, so i turned into a itneresting thing
u/iverjo

Cool, I actually had the same idea after seeing a tweet about Tupper's formula

show FPS hide FPS share fullscreen

21medals

remix of d/6678 by u/21medals

function u(t) {

for(c.width=i=96;i--;)for(j=54;j--;x.fillRect(i,j,1,1))x.fillStyle=R((d=S(t*((i-48)**2+(j-27)**2)**.5*2))*1e4/++i,d*4.7*j,d*2.7*--i)

Feb 3 2018 10:33 PM UTC

}// 132/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

unts-unts-unts-unts

function u(t) {

c.width|=0
x.translate(960,540)
for(i=120;i--;){
x.fillStyle=R(i*3,128*S(t),5*i)
x.rotate(t/30)
x.fillRect(-13*i,-13*i,26*i,26*i)}

Feb 5 2018 7:20 PM UTC

}// 130/140

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