Dweets awesomed by u/Joachim

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 2 remixes fullscreen

veubeke

function u(t) {

for(i=1920;a=i--/400;x.fillRect(i,400+t*70+_*15,1,99))_=C(a+t)*3+C(a-t)*8+(r=i*i/t%1),
x.fillStyle=`hsl(${140-t*4+_},80%,${40-t*2-_-r*9}%)`

Mar 5 2017 5:05 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 more comments…
u/iverjo

Nice :) This reminds me of the classic Windows XP desktop background image
u/sigveseb

very nice! can we squeeze in a blue sky?
u/veubeke

I’m trying ^^
u/magna

Not enough Unicode cows. Back to work!
u/Beginner

Amazing!
u/FENRIR

windows xp start up sound went to my head
u/iverjo

#grass
u/joeytwiddle

#landscape
u/vain

Cool and interested way to draw this landscape!

show FPS hide FPS share fullscreen

p01

function u(t) {

for(c.width|=i=48;i--;x.fillText(['🐸','🌷','☁️️'][k],64*S(k?i:i/9-t),i*3*C(k||i/7-t)))x.setTransform(j=((k=i>>4)*t+48-i)%16,0,0,j,960,540)

Mar 5 2017 3:53 PM UTC

}// 137/140

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

** SPACE HARRIER **

Show more comments…
u/iverjo

LOL, nice :D
u/lienthealien

D: it's incredible. I still don't fully understand whats going on the begginning of the for.
u/p01

Thanks! Touching the width ( or height ) of a canvas resets it. c.width|=i=48; ⇒ Sets i to 48. Does a binary OR of 48 on the width of the canvas and resets ( it mostly clears it ) the canvas
u/sfz

redrawing the canvas and initializing i, nice!
u/lienthealien

p01 are you a wizard?? :v
u/donbright

doesnt seem to like firefox/ubuntu
u/iverjo

Hmm, why can one not do '🐸🌷☁️️'[k]? Is it simply because they are not single-byte characters?
u/p01

@iverjo: Exactly. Although I should have used [...'🐸🌷☁️️'][k] to save 3 bytes
u/andres

emojis exist on two planes of universes
u/AstonC

Phenomenal
u/joeytwiddle

#dragon #worm #game #tribute
u/joeytwiddle

#hiddengem
u/f8f82804

#emoji
u/stephsmith

#smokedweeteveryday
u/geb

#background

show FPS hide FPS share 2 remixes fullscreen

FireFly

function u(t) {

for(c.width|=M=Math,i=2e4;i--;x.fillRect(A*8,B*8,W=9+M.atan2(M.sqrt(1-X*X-Y*Y),X)*3-t*4&7^4-M.asin(Y)*3,W))X=(A=i%135)/67-1,Y=(B=i/135)/67-1

Mar 4 2017 6:26 PM UTC

}// 140/140

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

Raycasted rotating sphere with UV-mapping!

Show more comments…
u/sfz

... ??? !!!
u/iverjo

Impressive! I like the c.width|=M=Math hack. Apparently Math is evaluated to NaN in the process.
u/iverjo

http://stackoverflow.com/a/11037887/2319697
u/alien

god... i can't understand this yet but is awesome...
u/sigveseb

So good!
u/donbright

standing ovation
u/tomkh

great job! some tricks here really opens new possibilities
u/mxfh

you can do M.sqrt() with ES6 power operator as **.5 should yield a net gain of 2 chars
u/FireFly

Oh right! I haven't gotten used to it yet since I'm on Fx51, which doesn't seem to support ** yet. Thanks!
u/FireFly

Oh, and also thanks for all the positive responses, everyone :)
u/iverjo

#sphere
u/lionleaf

#disco
u/f8f82804

#halftone #dithering #shading

show FPS hide FPS share 3 remixes fullscreen

walsh9

function u(t) {

c.width|=Y=(d,e,a,l)=>l?(x.moveTo(d,e),x.lineTo(d+=l*9*C(a),e+=l*9*S(a)),Y(d,e,a-S(t),--l),Y(d,e,a+S(t),l)):0;Y(960,999,4.71,14),x.stroke()

Mar 4 2017 5:56 PM UTC

}// 140/140

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

fullscreen recommended

u/donbright

unbelievable!!!! wow
u/SpecialAgent

wonderful!
u/CocoMeister

#fractal

show FPS hide FPS share 3 remixes fullscreen

New_Core

function u(t) {

c.width=1920;for(i=16;i--;)x.ellipse(1e3+300*S(t+i*.1),500+50*C(t+i*.1),160*S(-i*.5)+160,50*S(i*.1)+5,1.6+.5*S(t*.5),9.5,0,6.3);x.stroke();

Mar 3 2017 3:31 PM UTC

}// 139/140

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

Show more comments…
u/sfz

wow creative!
u/sfz

reduced it by about 15 bytes in case you want to try to do something else with the extra room: c.width|=0;for(i=16;i--;)x.ellipse(1e3+300*S(t+i/9),500+50*C(t+i/9),160*S(-i/2)+160,50*S(i/9)+5,1.6+S(t)/2,9,0,7);x.stroke()
u/iverjo

So good!
u/sigveseb

is that a pseudo-3D fish? super nice!
u/donbright

marvellous
u/magna

WAAAAT
u/SpecialAgent

Magnificent depth!
u/joseprio

Really impressive :)
u/Kalanchoe

Amazing!
u/ArtsyBiker1

WHOA
u/gautjac

beautiful
u/21medals

Reduced it ±20 bytes and added beginPath() without changing any values:
u/21medals

for(c.width|=i=16;a=i--/10;x.stroke())x.beginPath(),x.ellipse(1e3+300*S(t+a),500+50*C(t+a),160*S(-i/2)+160,50*S(a)+5,1.6+S(t/2)/2,9.5,0,6.3)
u/New_Core

#fish
u/joeytwiddle

#model
u/Cloud

https://www.dwitter.net/d/17352
u/vain

incredible 3d fish

show FPS hide FPS share 1 remix fullscreen

iverjo

remix of d/1791 by u/Run

function u(t) {

t*=4;c.width*=1;for(i=0;i<1550;i++)x.fillRect(X=i+S(t+i)*300,400+200*C(t+i)+200*S(X/300+t),50,50),x.fillStyle=`hsl(${X/7+t*90},80%,50%)`

Mar 2 2017 10:53 PM UTC

}// 136/140

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

u/donbright

the happiest sandworm on dune
u/iverjo

#worm
u/iverjo

#colors #rainbow
u/iverjo

#sine

show FPS hide FPS share fullscreen

ClayCowgill

function u(t) {

f=frame;for(j=1080;j--;x.fillRect(f,j,1,S(k),x.fillStyle=R(f/9,99)))for(a=f/500-2,b=j/500-1,k=35;k--&&a*a+b*b<4;a=c)c=a*a-b*b-.7,b=2*a*b+.55

Mar 2 2017 10:45 PM UTC

}// 140/140

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

I just can't get the color version down to size! i=frame;for(j=1080;j--;){a=i/500-2;b=j/500-1;for(k=75;k--&&a*a+b*b<4;)c=a*a-b*b-.7,b=2*a*b+.55,a=c;x.fillStyle=hsl(${C(k/9)*255},99%,50%);x.fillRect(i,j,1,1)}

Show more comments…
u/iverjo

Rad!
u/sigveseb

and yet the colors on this one are already beautiful!
u/sigveseb

btw you can do t*60 instead of frame
u/ClayCowgill

Thanks! That's one more saved! ;-)
u/ClayCowgill

(BTW, this is mostly based on a Mandelbrot set dweet that I can no longer find. (This is part of the Julia set instead.)
u/FireFly

Halfway there (150): for(j=2e3;j--;x.fillRect(t*60,j,1,1,x.fillStyle=hsl(${C(k/9)*255},99%,50%)))for(a=t*.12-2,b=j/500-1,k=75;k--&&a*a+b*b<4;a=c)c=a*a-b*b-.7,b=2*a*b+.55
u/FireFly

t*.12 is approx. t/8 if you're fine with it being somewhat off-centre.
u/ClayCowgill

Nice! Just six over now... for(j=2e3;j--;x.fillRect(t*60,j,1,1,x.fillStyle=hsl(${C(k/9)*99},99%,50%)))for(a=t/8-2,b=j/500-1,k=99;k--&&a*a+b*b<4;a=c)c=a*a-b*b-.7,b=2*a*b+.5
u/New_Core

the first 99 number can be put as k so still 5 to go
u/magna

You can omit the closing parenthesis of hsl() because browsers are resilient to bad CSS syntax
u/ClayCowgill

Good tips! Thanks!
u/ClayCowgill

Thanks for the help-- managed to get a high resolution/high color version going with the suggestions. :) https://www.dwitter.net/d/1896
u/katkip

Genius

show FPS hide FPS share fullscreen

sigveseb

function u(t) {

t*=5;for(c.width=s=X=64;X--;)for(Y=37;Y--;1-Q*Q-W*W>0&&x.fillRect(X,Y,1,1))for(j=40,Q=W=E=0;j--;Q=E)E=Q*Q-W*W-X/t/t+5/t,W=2*W*Q-Y/t/t+.66

Mar 2 2017 2:02 AM UTC

}// 137/140

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

u/sfz

Nice Mandelbrorshach!
u/iverjo

That's pretty impressive
u/sigveseb

#fractal #zoom
u/katkip

Awesome
u/katkip

#mandelbrot

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

FireFly

remix of d/1689 by u/FireFly

function u(t) {

for(s='0',i=6;i--;c=s[t*60|0])s=s.replace(/\d/g,i=>['+1-0-1+','-0+1+0-'][i]);c<2?x.translate(18,0,x.fillRect(0,0,18,3)):x.rotate(c+60/57.3)

Mar 1 2017 5:45 PM UTC

}// 139/140

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

L-system visualizer. Sierpiński arrowhead curve

u/donbright

brilliant.... any description of how it works?
u/donbright

n/m i see you explain it in 1688, thanks!
u/tomkh

haha... using translate/rotate is a cool hack! reminds me of LOGO turtle
u/FireFly

Hehe, it's handy to offload the job of keeping track of the turtle to the canvas.
u/katkip

#fractal

dwitter.net | Joachim (53359)