Top dweets by u/joeytwiddle

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: #Opposites

show FPS hide FPS share fullscreen

joeytwiddle

function u(t) {

eval(unescape(escape`睩瑨⡸⥦潲⡣⹷楤瑨簽椽ㄲ㭩ⴭ㭦楬汒散琨〬〬椽㴹㼱㈺ⴶⱱ㽩㸹㼴㨱㨭㈲⤩獥瑔牡湳景牭⠹ⰰⱱ㵩㸸ⰹⰵ〰⬴〪椪⠳⵱⤬焿㐰〭㍥㐯琪⨳㨶㐰⤬愽琭椯㌬氽椼㌿ㄮ㔺椼㠿㈮㠭⸴⩩㨰Ⱳ潴慴攨愾〦♓⡡㱬㽡㩬⤩`.replace(/u(..)/g,"$1%")))

May 26 2021 10:39 PM UTC

}// 140/140

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

#default #dominoes #dominoesnt #dealwithit

u/erin

noooo
u/tomxor

XD

show FPS hide FPS share 2 remixes fullscreen

joeytwiddle

remix of d/2723 by u/donbright

function u(t) {

x.fillRect(0,0,W=c.width=500,W);for(j=72;x.shadowBlur=j--/2;x.fillRect(150+j%9*25+75*S(t),99,9,50))x.fillStyle=x.shadowColor=R(W,W-15*j,W)

Sep 2 2018 5:24 PM UTC

}// 138/140

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

#default #glow

Show more comments…
u/joeytwiddle

Shouts to donbright and username. This dweet took over a year!
u/joeytwiddle

You can also try j--*2 or j--*T(t) for a larger glow
u/katkip

woow
u/username

Did not even notive I inspired someone. My most recent version of the glow sticks is d/9643 I also actually did not know about the other older dweet. I thought I was the first one haha.
u/username

#glowsticks
u/joeytwiddle

Yep, you inspired me to finally trim this down! Of course, donbright's original dweet was also inspired by a *retro* video he saw. Everything is a remix! https://www.youtube.com/watch?v=nJPERZDfyWc
u/aleamb

great, joey
u/donbright

https://www.youtube.com/watch?v=ckrOWokh6rU
u/donbright

this is just awesome, i cant believe it... amazing work.
u/joeytwiddle

Well it was your idea to begin with!
u/donbright

man this is still one of my favorites.... just looks so darn cool
u/joeytwiddle

Same effect in CSS: https://codepen.io/FelixRilling/pen/qzfoc

show FPS hide FPS share fullscreen

joeytwiddle

function u(t) {

c.width=2e3;for(i=0;i<9;i++)for(j=0;j<40*(1+S(i+9*t)*C(i+t))*i;j+=90)x.fillStyle=R(j,500-j,0,1),x.fillRect(1400-i*99,900-j/2,69,30)

Apr 3 2017 4:56 PM UTC

}// 131/140

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

u/nonce

I can hear the music in my head.
u/sfz

bass is thumpin
u/ilSilvano

I hear the Outrun soundtrack in my mind, and you?
u/joeytwiddle

Modern style spectrum: d/5576

show FPS hide FPS share fullscreen

joeytwiddle

remix of d/3266 by u/joeytwiddle

function u(t) {

eval(unescape(escape`挮獴祬攮晩汴敲㵠楮癥牴⠱⥠㭦潲⡩㵣⹷楤瑨㴱攳㭩ⴭ㬩堽椪⨳┳㈭ㄶ⭃⡩⭴⨲⤬娽椯ㄵ〬夽⡩⨪㌥㤳⭴⨲⤥ㄳⴹⱆ㴨娭㈩⨪㈬砮杬潢慬䅬灨愽ㄯ䘬砮晩汬剥捴⠵ㄲ⬹㤪堯娬㐰〫㈰〪夯娬圽⠹⭆⨴⤯娬圩`.replace(/u([^D].)/g,'$1%')))

Dec 12 2022 9:05 AM UTC

}// 140/140

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

#snow #focus

u/magna

Amazing!
u/jorduino

The code you have provided is a JavaScript program that uses the u() function to draw an animation on an HTML canvas element. The u() function is called 60 times per second, and uses the elapsed time t as a parameter to create the animation. The code uses a number of shorthand functions and variables to simplify the implementation of the u() function. The S, C, and T variables are shorthand for the Math.sin(), Math.cos(), and Math.tan() functions, respectively. The R() function is used to generate rgba color strings, and the c and x variables represent the canvas element and its 2D context, respectively. The u() function uses a loop to iterate over a range of values for i, and uses these values to calculate the X, Y, and Z coordinates for each iteration. The X and Y coordinates are used to draw a rectangle on the canvas using the fillRect() method, and the Z coordinate is used to scale the rectangle and create the illusion of depth. The globalAlpha property is used to set the transparency of the rectangles, and the style.filter property is used to invert the colors of the canvas. Overall, this code appears to be a simple example of how the canvas element and the u() function can be used to create an animation in JavaScript. It uses some advanced features of the language, such as shorthand functions and the canvas element, to create a visually interesting effect.
u/joeytwiddle

This gives a better distribution of particles: Y=((i-.1)**5+t*2)%13-9 no more grid, but a few clusters

show FPS hide FPS share fullscreen

joeytwiddle

remix of d/14827 by u/joeytwiddle

function u(t) {

c.width=600
d=(r,T)=>x.fillText(T,300+r*S(a=i/9.55),172-r*C(a))
for(i=N=t|0;i;i--)
for(N%i||d(90+i/4,i),k=75;k--;)N%i||d(k,'*')

Jul 15 2019 7:15 AM UTC

}// 127/140

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

Divisors on a clock (second hand version) #math

u/katkip

awesome
u/aleamb

love it!
u/donbright

super cool
u/joeytwiddle

Shouts to u/donbright and u/taupelink

show FPS hide FPS share fullscreen

joeytwiddle

function u(t) {

c.width=600;x.scale(20,20);[...'🎈💝🎈🎉💃🎈🍹🎉🎂🍰🎤🍸🎁'].forEach((c,i)=>x.fillText(c,10-2*(p=(t+i/5)%3)*(11**i%9-4),30-20*S(p)))

Aug 15 2018 8:35 AM UTC

}// 119/140

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

Happy Birthday! :-D

Show more comments…
u/katkip

How did you know it's my birthday
u/d0n.key

It isn't your birthday, katkip.
u/joeytwiddle

Multiple birthdays at the same time has become a ... problem ;-)
u/joeytwiddle

https://en.wikipedia.org/wiki/Birthday_probl…
u/katkip

It was.
u/aleamb

love it!

show FPS hide FPS share 1 remix fullscreen

joeytwiddle

remix of d/3634 by u/joeytwiddle

function u(t) {

r=Math.random,w=700,a=w*r()**.6,p=w*r(),x.fillRect(p&7?960+a/2*C(p):960+99*C(p),p&7?980-a-a/6*S(p):90+200*r()+30*S(p),.2,.2),t<9&&u(t+.002)

Apr 12 2018 6:33 AM UTC

}// 139/140

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

Example of looping with recursion, trailing off as time goes by

u/joeytwiddle

For the first 9 seconds it calls u() 250 times per frame (on average), after that just once per frame
u/hollo47

Looks like these M.C. Escher lithographies, I love the feel of it!

show FPS hide FPS share 2 remixes fullscreen

joeytwiddle

function u(t) {

r=Math.random;p=(X,Y,S,D,k)=>D&&(x.globalAlpha=.01,x.fillRect(X,Y,S,S),k=_=>p(X+2*S*r()-S,Y+S*r()/2,S*.8,D-1),k(),k());t||p(900,0,500,18)

May 15 2017 8:38 AM UTC

}// 137/140

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

Random cloud generator

u/joeytwiddle

You can click on the code and hit Space to see more clouds
u/jick

I would love to see a breakdown of how this works.
u/joeytwiddle

It's a fractal using recursion. p draws a square with the given parameters. Then it calls p again twice to draw slightly smaller squares, offset from the parent.
u/joeytwiddle

Like this but more random (and with 2 children instead of ~7): http://neuralyte.org/~joey/hwimirror/hwi.ath…

show FPS hide FPS share 1 remix fullscreen

joeytwiddle

remix of d/9666 by u/joeytwiddle

function u(t) {

c.width=99;for(j=288;x.shadowBlur=j--/9;x.fillRect(45+15*C(j%9-t),9*T(j%9+t),5,5))x.fillStyle=x.shadowColor=R();c.style.filter='contrast(30'

Feb 25 2023 9:25 AM UTC

}// 140/140

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

Again with the #metaballs

u/joeytwiddle

contrast(${T(t/5)} is interesting; less focus = more clarity

show FPS hide FPS share 1 remix fullscreen

joeytwiddle

remix of d/12003 by u/joeytwiddle

function u(t) {

for(c.width|=j=20+t|0;j-->t;)for(g=(j-t)*120,i=W=99;i--;)x.fillRect(i?g+i*i/70*S(1e3/i-t*8+j**3):g,700+!!i*i*4,-W-80*S(j*j),i?6:-300-W*S(j))

Apr 5 2020 11:50 AM UTC

}// 140/140

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

River cruise remix #water

u/KilledByAPixel

👍

dwitter.net | joeytwiddle (2443)