Dweets awesomed by u/StarStep

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

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

magna

remix of d/6493 by u/magna

function u(t) {

x.fillRect(0,0,2e3,2e3);for(i=64;i--;)for(x.setTransform(1,0,0,1,i%8*240,(i>>3)*135),j=99;j--;)x.clearRect(120+C(t+j/4)*50,67+S(j*i)*50,3,3)

Jan 26 2018 1:14 AM 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/donbright

!!!!!!!!!!
u/donbright

man this is... unbelievable
u/aleamb

fucking awesome!
u/magna

thanks! there's a lot of room to play around with variations with this idea. go nuts!
u/sandstedt

Amazing!
u/zanella

I didn't know computers could do such thing. :D
u/rikardlindstrom

Wowwowowow
u/Qwitter

!!!!!!!!!!!!!!!!!
u/Qwitter

This makes me just eant to give up a qwit
u/sigveseb

Really nice :D
u/sigveseb

64-in-1 dweet value megapack ^^
u/diceroll123

how do i give you Dwitter Gold™️?
u/magna

I only take Dwittercoin, but thanks for the thought!
u/Qwitter

Have a Dwitcoin <svg height="40" width="40"><circle cx="10" cy="15" r="9" stroke="#999900" stroke-width="2" fill="#bfbf22" /><text x="7" y="20" fill="#cfcf00">$</text><text x="5" y="20" fill="#eeee00">D</text></svg>
u/bepisTM

wait what, dwitter comments support tags?
u/Qwitter

<del>no</del>
u/bepisTM

<span style="color:#f06">test</span>
u/Qwitter

<svg height="20" width="40"> <text x="5" y="10" fill="red" transform="rotate(30 0,0)">P</text> <text x="10" y="10" fill="red" transform="rotate(20 0,0)">A</text> <text x="15" y="20" fill="red" transform="rotate(-20 0,0)">S</text> <text x="20" y="35" fill="red" transform="rotate(-30 0,0)">S</text> </svg>
u/StarStep

pass
u/lionleaf

#multi_dweet #awesome #visualization
u/lionleaf

#multidweet
u/rodrigo.siqueira

A collection of Lissajous patterns
u/vain

Lissajous patterns in 140 chars? top!

show FPS hide FPS share 1 remix fullscreen

nystrand

function u(t) {

with(x)for(i=c.width|=0;h=T(i/32^1)-17,i;translate(0,h),rotate(C(t+i/359)/n/9,fillRect(-n/2,0,n,h)))n=i--%32||setTransform(6,0,0,1,i,1120)

Jan 14 2018 9:39 PM UTC

}// 138/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/dogspace

WOW
u/aemkei

super nice! 🌴
u/myxoh

This one's amazing.
u/Xaviaro

great!
u/iverjo

Yes!
u/lionleaf

#tree #trees #palm #palm_tree
u/joeytwiddle

#organic #landscape #grass
u/katkip

#nature

show FPS hide FPS share 2 remixes fullscreen

coderkid

function u(t) {

c.width|=0;for(s=19;s--;)for(a=10;a--;){x.beginPath();x.arc(s*100+50,a*100+50,Math.abs(S(t+s+a)*50),0,2*Math.PI);x.fill();}

Jan 8 2018 12:52 AM UTC

}// 123/140

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

u/Xen

lots of nice dweets, keep up the good work!

show FPS hide FPS share 5 remixes fullscreen

p01

function u(t) {

for(i=h=c.width=432;i--;)C(t-i)>0&&x.fillText('.⬤'['榁翻꺿듻ퟝ믭󫥤큰삗⢠挎ᩐ肦䰠椉䠊ᑒꊐࢀင'.charCodeAt(i/16)>>i%16&1],192+(i*h-i*i)**.5*S(t-i)/2,i/2+9)

Jan 5 2018 8:35 PM UTC

}// 137/140

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

AND THE WORLD GOES ROUND 🌏🌍🌎

Show more comments…
u/Xen

nice :-)
u/xem

what an achievement!
u/aemkei

You made it! 🙇
u/nystrand

W🌎W !
u/sigveseb

up to the top of the frontpage you go!
u/lowpoly

Wow, your work always inspired me :)
u/trupples

Wow, congratz! I tried doing this but failed miserably lol. Awesome work
u/Renaud___

Nice work !! :)
u/donbright

beautifuyl
u/aemkei

Now with color: d/5747 by u/corruptio.
u/iverjo

#sphere #earth #globe
u/vain

Wow! Insane! Nice to see you here, P01 :-) greetz

show FPS hide FPS share 2 remixes fullscreen

hoplite

function u(t) {

x.fillRect(0,0,i=w=c.width=2e3,w);x.fillStyle="#fff";for(;i--;)T=t*99,z=w*99/(i-T%1),a=i+T-T%1,x.fillRect(C(a*a)*z+1e3,C(a*w)*z+500,w/i,w/i)

Jan 1 2018 11:14 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/eyalcohen4

Starwarsy
u/iverjo

#stars
u/zbstof

Reminds me of Windows 3.11 #screensaver - Starfield

show FPS hide FPS share 5 remixes fullscreen

ben

function u(t) {

function v(a,b,g,r){if(r>1){x.fillRect(a+=r*S(g),b-=r*C(g),2,2)
v(a,b,g-1+C(t),r*=.7)
v(a,b,g+.5+S(t),r)}}c.width=500
v(250,270,0,80)

Dec 28 2017 9:28 PM UTC

}// 133/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/Xen

LOVE IT!
u/ben

trying to make a swaying tree but requires too many characters to draw the branches
u/Xen

join the chat and show your code... :-)
u/sigveseb

Very good!
u/itsjustmustafa

recursive functions in under 140, love it!
u/Bendoman

Best thing on here by far.
u/FrankMoren27

awesome
u/iverjo

#recursive
u/lionleaf

#fractals
u/vain

incredible

show FPS hide FPS share fullscreen

nystrand

function u(t) {

for(i=w=3e3,a=b=g=333*T(t%9/7);j=(i^a*a)%4,i--;x.fillRect(a+=g+C(j*5+t)*g-a/2-w+g,b+=g+S(j*9+t)*g-b/2-w,s,s),w=2)x.fillStyle=R(s=w*9,w,s,.1)

Dec 28 2017 2:50 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/sigveseb

This one is fantastic! Good job indeed
u/Bendoman

Brilliant!
u/Xen

very very impressive!
u/magna

HOW ON EARTH
u/nic

MIND:=BLOWN
u/lowpoly

Gawd, I learnt a lot today
u/Citiral

Since when does Javascript support black magic?
u/sigveseb

Needs more upvotes!
u/doof

this was such a delight to unpack :)
u/Lazy1337

wow
u/aleamb

amazing
u/iverjo

I'm awestruck
u/xem

unbelievable
u/trapkid

lol
u/aleamb

epic! one of the greatest dwitter
u/ThreeNPlusOne

sierpinski triangle :D
u/xem

It'd be nice to have a blog post explaining it :) (please?)
u/trupples

I didn't look much into it but it might have to do with a thing I read about once where if you have a point that "walks" half the distance towards a random corner of a triangle you'll end up drawing a sierpinski triangle sorta like you can see in https://www.dwitter.net/d/5097
u/trupples

And according to http://distrustsimplicity.net/articles/sierp… if you were to use 4 points instead of 3 you'd get a tetrahedron like in this dweet. Fascinating stuff
u/stiaje

#witchcraft
u/lionleaf

#top_of_the_year
u/Scaledish

wow
u/Tekmap

👏👏👏👏👏
u/vain

that's not from this world! incredible code / 3d fx and blur
u/rodrigo.siqueira

3D flying #sierpinski pyramid #fractal

show FPS hide FPS share 1 remix fullscreen

New_Core

function u(t) {

for(x.fillRect(0,0,i=b=2e3,q=1080-t);i--;x.fillRect(a*i%b+a/3*S(t*i/a/3),(i/5*t+i*50)%b%q,5,5))x.fillStyle=R(a=i*9%255,a,a)

Dec 24 2017 12:12 PM UTC

}// 123/140

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

Let it snow, let it snow, let it snow....

Show more comments…
u/Xen

Perfect :-)
u/donbright

brilliant
u/donbright

brilliant
u/donbright

brilliant
u/ballotcan

http://i.prntscr.com/_aJutdekROaWdQKYy75nTw.… if you wonder the end
u/iverjo

Cool! Much better than my snow dweet ^^ https://www.dwitter.net/d/338
u/sigveseb

gotta love how the snow accumulates!
u/alien

no way... the snow is accumulating...
u/darrencearnaigh

Lovely seasonal golf.
u/snydej

Wow! This is excellent!
u/iverjo

#snow
u/vain

excellent snowflakes movements

show FPS hide FPS share 3 remixes fullscreen

FireFly

function u(t) {

for(i=2e3;!t&&i--;Math.random()>(X**2+(Y-4)**2)**.5/6&&f(7)+f(-7))X=i&3,Y=i>>2&7,f=m=>x.fillRect(240*(i>>5&7)+120-X*m,180*(i>>8)+50+Y*7,7,7)

Aug 20 2017 3:53 PM UTC

}// 140/140

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

Spritegen! Generates 48 random sprites each time the dweet is run (make a change to rerun the dweet)

Show more comments…
u/sigveseb

I love this!
u/alien

wait WHAT !!
u/alien

D: What is going on here!! how
u/iverjo

How does it work?
u/FireFly

It's a dweetification of an older sprite generator of mine. The idea is to take a "mask" of 0..1 floats and filter a grid of random numbers for when num<mask. In this case the mask is based on euclidean distance from centre. This is done for half the sprite, and then the other half is just mirrored
u/FireFly

(You could also view it as flipping a biased coin for each mask value, with the bias given by the mask)
u/FireFly

The same principle would work just as well with larger sprites too, and more exotic/interesting mask shapes. The same rid of random numbers could be applied to different masks, or to an animated mask, to produce an animation between sprites, too!
u/nystrand

so cool!
u/joeytwiddle

Awesome. I love it. Every single one looks like a space invader!
u/iverjo

Interesting technique. Thanks for explaining :) Also, I agree with joeytwiddle
u/jick

Got a link to the original sprite generator?
u/FireFly

I never really wrote it to be shared, so it's all hardcoded and with really ugly code. I put together this animation though: https://twitter.com/FireyFly/status/80072288…
u/statenlogic

Simple, but effective! Makes me want to play 8-bit games again.
u/donbright

genius
u/joeytwiddle

#hiddengem
u/stiaje

#witchcraft
u/tomxor

#bitmap #sprite
u/KilledByAPixel

#generative pixelart
u/KilledByAPixel

#pixelart

dwitter.net | StarStep (3499)