Dweets awesomed by u/olligobber

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

show FPS hide FPS share 1 remix fullscreen

leafyvez

function u(t) {

c.width|=w=500
for(i=3e3;i--;x.fillRect(2*w+i*(S(i-t)+2*S(2*(i-t)))/z,w+i*(C(i)-2*C(2*i))/z,10,10))z=S(i)-17,x.globalAlpha=S(3e4/i)

Nov 20 2021 9:53 AM UTC

}// 131/140

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

spiraly trefoil variation

show FPS hide FPS share fullscreen

rep_movsd

function u(t) {

eval(unescape(escape`𭁼𯀨𮀮𩡩𫁬𤡥𨱴𚁘👙🐰𛀰𛁏🐲𩐳𛁏𚐬𪰽𣑡𭁨𛡲𨑮𩁯𫐩𒡦𫱲𚁸𛡲𫱴𨑴𩐨𤀽𣰩𛁡🐭𜐮𜠴𛁣🐭𪰨𚐬𩀽𪰨𚐬𮀮𩡩𫁬𤱴𮑬𩐽𤠨𩀪𤀬𪰨𚐪𤀬𪰨𚐪𤀬𛠸𚐬𪐽𣰻𛐭𪐻𚑸𛡦𪑬𫁒𩑣𭀨𦀪𣰬𦐪𣰬𜠬𜠩𛁛𦀬𦑝👛𤰨𨐪𦐩𚱣𚡃𚁡𚡘𚐬𤰨𛑣𚡘𚐫𩀪𠰨𛑣𚡙𚑝`.replace(/u../g,'')))

Nov 11 2021 4:41 PM UTC

}// 140/140

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

Chaotic Galaxies

u/rep_movsd

#fractal #chaos #space
u/rep_movsd

Based off of the Clifford attractor

show FPS hide FPS share fullscreen

lerc

remix of d/23842 by u/sandromiccoli

function u(t) {

r=Math.random
for(i=899;i--;)R=r()*300,A=r()-t*3+R/94,x.fillRect(960+R*S(A),540+R*C(A),3,3),x.clearRect(960+R*S(A-=3),540+R*C(A),4,4)

Nov 4 2021 8:31 AM UTC

}// 133/140

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

u/magna

Very cool!
u/Xen

nice!

show FPS hide FPS share fullscreen

pavel

function u(t) {

for(a=b=u=c.width|=i=0;i++<99*t;x.fillRect(960+800*C(a+t)*S(b)/z,540+800*C(b)/z,s=20/z/z,s))a+=C(u+=i**.9%1-.5)/69,z=2+S(a+t)*S(b+=S(u)/69)

Apr 10 2019 1:23 AM UTC

}// 139/140

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

Wiggly boy

Show more comments…
u/magna

Awesome!
u/DataMeta

Cool!!
u/joeytwiddle

Bloody brilliant #sphere #perspective
u/katkip

this will get to the top
u/katkip

#d3
u/iverjo

Wow!
u/donbright

#randomwalk

show FPS hide FPS share 1 remix fullscreen

jylikangas

function u(t) {

for(c.width=i=714;i--;F(t+i/714+(i>>7)/9,-9))(F=(a,o)=>x.strokeRect(357+S(a)*290-o/(Z=C(a)+1+(t%6<3)),99+C(a*(t/6%4|0))*99/Z,o/=Z/2,o))(i,4)

Apr 17 2018 9:12 AM UTC

}// 140/140

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

CHOO CHOO! Let it run to see all the tracks. :)

Show more comments…
u/Agnes

This is your most unbelievable one so far. What the hell.
u/aemkei

Just WOW!!! I can even hear the sound
u/Galaxtone

I stil ldon't know how to make a 3d engine and a camera view that moves around in only 140 bytes
u/New_Core

Very good one...
u/stiaje

No, this is just not supposed to be possible!
u/sigveseb

so simple and elegant :))
u/magna

Dude!
u/nystrand

Outstanding!
u/Renaud___

so great OO
u/aleamb

superb!!
u/hollo47

No. This is not possible.
u/artfarnaa

He's somehow linking another JS :}}
u/lionleaf

Woah!
u/jylikangas

http://jsriffs.blogspot.fi/2018/04/making-of…
u/iverjo

This is really, really impressive!
u/prinzphi

Unbelievable!
u/lionleaf

#train #3d #camera #hashtag_testing
u/sigveseb

Nice Making-of article! <3 more of those please :))
u/sigveseb

#witchcraft
u/lionleaf

#amazing
u/lionleaf

#making_of #blog
u/aleamb

#rollercoaster
u/pythech

wtf! many thanks for the blog post
u/micahcowan

#wireframe
u/alien

WTF!!!!
u/katkip

Wow
u/f8f82804

#d3
u/donbright

YES
u/mpasula

this is just so fucking cool!
u/Tekmap

👏👏👏👏👏
u/stephanegeorget

OMG
u/vain

How? O.o I am very enthusiastic and at the same time speechless

show FPS hide FPS share fullscreen

snydej

remix of d/7060 by u/snydej

function u(t) {

for(T(0,i=4e3,.06);r=--i**4.3;T(t**(i<9?9:i<30)*200+r,a=r%5*S(i+t)**2,51*a))T=(w,s,a)=>x.fillRect(w*2%2e3,w%1079,s,s,x.fillStyle=R(a,a,a,a))

Feb 24 2018 2:52 AM UTC

}// 140/140

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

Golfed this one better and added a few details, like differing star sizes.

Show more comments…
u/DirtyDan

Cool!
u/snydej

Feature request: When in fullscreen center the canvas and fill unused space with black. I'm guessing the white background is there in case the dweet has transparency. Would it be possible to put the canvas in a div with a white background and put a black background behind that?
u/New_Core

Did you want t?0:c.height=2e3 infront of your dweet and expand the w%1079 number by a few 100?
u/snydej

It'd be nice but I don't have the room to add it to this dweet. I'm sure some dweets do that and so I tried to suggest a fix that wouldn't break that behavior.
u/AnnanFay

"When in fullscreen center the canvas and fill unused space with black" This seems like it would break many dweets.
u/snydej

By unused space I mean the space OUTSIDE the canvas. This is pretty standard behavior when fullscreening anything.
u/snydej

For instance, d/6967. On my monitor the canvas does not extend to the bottom of the screen in fullscreen mode and there is a white bar running along the bottom. This makes the dweet look cut off. If it were a black bar it would look fine because the screen would just look dark there. This is how everything from TVs to YouTube deal with fullscreening when the source material that has a different aspect ratio from the screen.
u/snydej

by d/6967 above I meant https://www.dwitter.net/d/6967 I think the period messed up the link
u/snydej

Actually it looks like the canvases already their background color set to white (I had assumed that the background was not set and that setting it would change the rendering of some dweets, but it looks like that's not the case.) So you wouldn't even need the additional div that I suggested originally.
u/Renaud___

Beautiful
u/aleamb

amazing
u/joeytwiddle

I think the canvas is transparent by default, the white is just the page behind it.
u/snydej

Nope, that's what I thought too. The image data within the canvas is initially transparent (this affects the rendering of dweets that call x.drawImage(c, ... ) but there is also a background css property on the canvas that is set to white and this causes transparent areas of the canvas to show up as white regardless of what's behind them. You can try this out by locally tweaking the css for the body element that contains the canvas. On most dweets you don't see any part of this element unless the dweet is fullscreened but there are exceptions like d/7084 . I don't know what the best way to handle that would be.
u/donbright

:)
u/iverjo

#stars
u/joeytwiddle

#landscape #scene
u/larzuk

quite impressive!
u/vain

nice night sky with shooting stars. just incredible work

show FPS hide FPS share fullscreen

aleamb

function u(t) {

c.width=512;b=136;for(y=b;e=0.7*y,f=y-60,f*=f,y-=2;)for(m=b;m--;)d=m-70,z=S(t)*b*Math.exp(-1e-3*(f+d*d)),x.fillRect(m+e+b,-z+e+100,1,1)

Feb 14 2018 1:37 AM UTC

}// 135/140

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

Shorter version: c.width=512;b=136;h=60;for(a=b*b;a--;)m=a%b-h,y=a/b-h,e=0.7*y,x.fillRect(m+e+100,S(t)*b*Math.exp(-1e-3*(y*y+m*m))+e+150,1,1)

u/iverjo

Further, 0.7 can be replaced with .7
u/aleamb

#function #p3d
u/aleamb

#math
u/aleamb

#d3

show FPS hide FPS share 1 remix fullscreen

loni_art

function u(t) {

p=(d)=>(127*(1+C(6*d+t)))
c.width|=a=100
for(i=9;i--;x.fillRect((5+i+S(t))*a,(5+C(i-t))*a,a/2,a))
x.fillStyle =   R(p(i),p(.1+i),p(.2+i),1)

Feb 13 2018 3:32 PM UTC

}// 139/140

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

procedural palette

u/loni_art

taken from here: http://www.iquilezles.org/www/articles/palet…
u/aleamb

nice
u/joeytwiddle

#colors

show FPS hide FPS share fullscreen

New_Core

remix of d/6866 by u/41407

function u(t) {

x.fillStyle=`hsla(${t*60},100%,50%,.02)`
a=b=e=S(t/2)*1300
for(i=1e3;i-=1;a=960+S(i*t)*e,b=500+C(t)*C(i*t)*e)~t%4!=0?x.fillRect(a,b,20,20):0

Feb 12 2018 6:51 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/41407

That's so cool!
u/Apex

T̛͙̻͓̠̘͙H͔͚̯͕͘E҉̮͓̖ ̸̟E҉̖̻̳Y̹͚̦E͕̯̥̱

show FPS hide FPS share fullscreen

AnnanFay

remix of d/6857 by u/olligobber

function u(t) {

c.width|=i=8
for(m=200,r=t;i--;m=-m)x.stroke(new Path2D(`M960,${520-m*13/8}l${p=m*S(r)},${m}l${(q=m*S(r+=.79))-p},${m*5/4}h${m*C(r)-q}`))

Feb 11 2018 3:42 PM UTC

}// 137/140

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

u/Yogeshp3

It's one of those things that you can't tell whether it's rotating clockwise or anticlockwise

dwitter.net | olligobber (3817)