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

contone

remix of d/22584 by u/contone

function u(t) {

c.width|=0
for(i=2e3;i--;)
x.fillStyle=`hsl(${i*99},99%,50%)`,
x.fillRect(960+S(u=i/23.8)*900,(C(u)+S(4*t-i/4))*20+i*2*245.06%1e3,52,40)

Apr 21 2021 9:48 PM UTC

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

rodrigo.siqueira

remix of d/22574 by u/rodrigo.siqueira

function u(t) {

c.width=880
for(β=300;β--;c.style.filter='invert()')𝛾=(S(β)*(β-360))/C(β*β+t*3),x.lineTo(β*3,220*(K=.7+frame%2)+S(β/𝛾)*80*S(𝛾)/K)
x.stroke()

Apr 21 2021 2:59 PM UTC

}// 140/140

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

Gamma (𝛾) and Beta (β) brain waves while composing a Dweet.

u/EliteDaMyth

you can save 2 chars by removing the brackets around the multiplication/division. for(c.width=880,β=300;β--;c.style.filter="invert()")𝛾=S(β)*(β-360)/C(β*β+3*t),x.lineTo(3*β,220*(K=.7+frame%2)+80*S(β/𝛾)*S(𝛾)/K);x.stroke()

show FPS hide FPS share fullscreen

lars-erik

remix of d/22613 by u/lars-erik

function u(t) {

c.width=w=128,f=Math.floor,o=f(t*20),b=f((t+10)*2)
for(z=w;z--;)for(y=96;y--;)if(f((z+o)*y)%b==0)x.fillRect(z-1,y,4,4)

Apr 24 2021 1:45 AM UTC

}// 118/140

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

I have no idea what I'm doing™ #5 #waitforit

show FPS hide FPS share 2 remixes fullscreen

lars-erik

remix of d/22612 by u/lars-erik

function u(t) {

c.width=w=128,f=Math.floor,o=f(t*20),b=30
c.style.filter=`invert(90%)`
for(z=w;z--;)for(y=96;y--;)if(f((z+o)*y)%b==0)x.fillRect(z-o,y,4,4)

Apr 24 2021 1:34 AM UTC

}// 139/140

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

I have no idea what I'm doing™ #4

show FPS hide FPS share fullscreen

lars-erik

remix of d/22610 by u/lars-erik

function u(t) {

c.width=w=128
c.style.filter=`invert(90%) blur(5px)`
for(z=w;z--;)for(y=96;y--;)if(Math.floor(z+t*y)%30==0)x.fillRect(z, y, 4, 4)

Apr 24 2021 1:02 AM UTC

}// 130/140

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

I have no idea what I'm doing™ #2

show FPS hide FPS share fullscreen

lars-erik

remix of d/22593 by u/lars-erik

function u(t) {

eval(unescape(escape`𨰮𭱩𩁴𪁼👺🐵𝠰𒡦🐨𫠩🐾𞐶𜀫𮠪𠰨𫠯𜐸𚐫𮠪𠰨𫠩𚡩𛰱𜠸𒡧🐨𫠩🐾𝐴𜀫𮠪𤰨𫠯𜐸𚐫𮠪𤰨𫠩𚡩𛰱𜠸𒡦𫱲𚁩🐶𝀻𪐭𛐻𮀮𩡩𫁬𚀩𚑢👴𚡩𛰱𝠬𮀮𫁩𫡥𥁯𚁦𚁡👢𚱴𚐬𩰨𨐩𚑼𚁸𛡦𪑬𫁓𭁹𫁥👠𪁳𫀨𙁻𚁴𚠱𜀩𙐳𝠰𯐬𞀰𙐬𜰰𙐬𛠰𜐩𨀩`.replace(/u../g,'')))

Apr 22 2021 11:25 PM UTC

}// 135/140

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

Fake lights and impressions #WaitForIt 3

u/lars-erik

c.width|=z=560 f=(n)=>960+z*C(n/18)+z*C(n)*i/128 g=(n)=>540+z*S(n/18)+z*S(n)*i/128 for(i=64;i--;x.fill())b=t*i/16,x.lineTo(f(a=b+t),g(a))|(x.fillStyle=hsl(${(t*10)%360},80%,30%,.01))

show FPS hide FPS share fullscreen

robbyg

remix of d/22586 by u/contone

function u(t) {

for(c.width=i=2e3;i--;x.fillRect(960+S(u=i/63)*900,C(t-u/7)*400+550,20,50))x.fillStyle=`hsl(${i},99%,50%)`

Apr 22 2021 9:18 PM UTC

}// 106/140

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

Quick play

show FPS hide FPS share fullscreen

awfwef

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

Apr 23 2021 9:14 PM UTC

}// 113/140

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

u/erin

creative!

show FPS hide FPS share 1 remix fullscreen

rodrigo.siqueira

function u(t) {

K=3.5
if(!t){for(b=-K;b<=K;b++)for(C=-K;C<=K;C++)for(a=-K;a<0;a++)for(X=680;X--;x.fillRect(X*1.7+380,540+Y,2,2))Y=(C*120+a*(X-340))/b*1.5}

Apr 19 2021 4:20 PM UTC

}// 138/140

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

Cover of "Computers And Automation And People" magazine, January, 1973. I was able to recreate the image based on a small description (in page 5): "Front Cover Picture: The front cover drawing, called "Phropase", was produced by an Algol 60 program, drawing straight lines ax + by + c = 0, where a, b and c were "stepped arithmetically in nested loops". The computer used was an ICL 1904A, driving a Calcomp 1934/6 plotter. The programmer artist is Nihan Lloyd-Thurston.

u/rodrigo.siqueira

Here is the full journal with it's cover artwork and description: https://archive.org/details/bitsavers_comput… "Computers And Automation And People", Jan., 1973
u/smtsjhr

thats so cool and well done! I find this kind of exercise to be very inspiring : )

show FPS hide FPS share fullscreen

taupelink

remix of d/22467 by u/taupelink

function u(t) {

for(i=h=k=210;i--;x.fillRect(k*X,k*Y,-i*p>>t,-i>>t))f=i*t,X=f*f%12,Y=X*f%6,h=i/3*S(Y*S(p=Y%t*Y*3)+X*S(Y*p)),x.fillStyle=R(i/2,h*4,h*p,9/p)

Apr 20 2021 2:09 AM UTC

}// 138/140

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

d/22568

Show more comments…
u/magna

OH MY GOD
u/lars-erik

🤯👌
u/UEZ

Excellent! 1/Y/2 as alpha channel gives a softer water surface imho. :-)
u/UEZ

Even better: x.fillStyle=R(i/2,h*4,h*p,1/Y/6)
u/taupelink

thanks all--and yes, I like that variant!
u/magna

u/taupelink how much of your work is intention versus happy accidents? It would be lovely to see a blog post from you explaining your process...
u/taupelink

far, far closer to happy accidents. lots and lots of trial and error to see what works. with that said, it's not just throwing darts blindly. maybe like panning for gold?
u/taupelink

in any case, i will think about writing up some kind of essay on it!
u/DaSpider

Reminds #monet #impressionism
u/tomxor

#waitforit