Dweets awesomed by u/iverjo

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 fullscreen

jonathan-potter

function u(t) {

c.width+=0
r=z=>Math.random()-.5
a=this.a||[...Array(1e4)].map(z=>[4e3*r(),3e3*r(),r(),r()])
a.map(b=>x.fillRect(b[0]+=b[2],b[1]+=b[3],7,7))

Oct 26 2018 9:13 PM UTC

}// 140/140

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

random moving objects using window.a for persistence #floatingobjects

u/pavel

Js puts all vars into global namespace if you don't use 'var' or 'let' and t starts at 0 so you can do t?a.map(...):a=[...]
u/katkip

#ai

show FPS hide FPS share fullscreen

yonatan

remix of d/10705 by u/yonatan

function u(t) {

eval(unescape(escape`瑼簨挮睩摴栽㔶㠩㭣⹩湮敲䡔䵌㵠㱳癧㸼晩汴敲⁩搽显㱦敔畲扵汥湣攠扡獥䙲敱略湣礽⸰〵⁮畭佣瑡癥猽㔠⼾㱦敄楳灬慣敭敮瑍慰⁳捡汥㴤筓⡴⤪㈰ぽ㹠㭸⹦楬汔數琨砮晩汴敲㴢畲氨⍦⤢ⰰⰰ⤻;`.replace(/u(..)/g,"$1%")))

Oct 26 2018 8:13 PM UTC

}// 134/140

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

Improved performance remix (568px width)

Show more comments…
u/iverjo

How does this work?
u/yonatan

SVG perlin noise displaced by itself and used as a filter on the canvas. Time controls the displacement filter'r scale.
u/yonatan

the filltext() is required for the thing to paint itself apparently (fillRect works too)
u/yonatan

I half-guessing so if anyone has a better explanation...
u/yonatan

placing the displacement filter as a child of the turbulence node seems to feed the parent's output into both of the child's input nodes.
u/yonatan

oops, not child, sibling.
u/yonatan

tl;dr: no idea :)

show FPS hide FPS share 2 remixes fullscreen

New_Core

remix of d/10639 by u/yonatan

function u(t) {

s=c.style;s.backgroundBlendMode='difference';for(b=[i=9];i--;s.background=b)b[i]=`linear-gradient(${t*i*5}deg,#012,#350,#dff,#910)`

Oct 26 2018 6:50 PM UTC

}// 131/140

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

was fun mixing =)

u/geb

#background
u/13thptr

#oil

show FPS hide FPS share 3 remixes fullscreen

New_Core

remix of d/10639 by u/yonatan

function u(t) {

s=c.style;s.backgroundBlendMode='overlay';for(b=[i=5];i--;s.background=b)b[i]=`repeating-radial-gradient(${S(t+i)+3}%${i}%,#ffd,#012 999%)`

Oct 26 2018 5:41 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 FPS hide FPS share fullscreen

nikoloffgeorgi

function u(t) {

o=800;j=10;c.width|=a=(u,v,o)=>{g=S(u/99)*S(t*j)*j+j;x[`${o%2&1?'fill':'stroke'}Rect`](u,v,g,g)}
while(o--)a(o*o%2e3+C(t+o)*o,o+S(t+o)*o,o)

Oct 26 2018 1:11 PM UTC

}// 139/140

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

u/joeytwiddle

I don't know what this is but I like the movement. #tornado? #whirlpool?

show FPS hide FPS share 1 remix fullscreen

yonatan

function u(t) {

c.innerHTML=`<svg><filter id=f><feTurbulence baseFrequency=.01 /><feDisplacementMap scale=${t*99}>`;x.filter="url(#f)";x.fillRect(0,0,0,1)

Oct 26 2018 12:11 PM UTC

}// 138/140

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

brighter on firefox

u/joeytwiddle

dude... #plasma #oil #oil_spill
u/Xen

i'm stealing this dweet and having it as an animated desktop background :-P
u/tomxor

Nice. Ahh svg filters... I have good memories, but then they were all destroyed by browser regressions.

show FPS hide FPS share fullscreen

yonatan

remix of d/10690 by u/yonatan

function u(t) {

eval(unescape(escape`挮楮湥版呍䰽怼獶朾㱦楬瑥爠楤㵦㸼晥呵牢畬敮捥⁢慳敆牥煵敮捹㴤笱⽴素牥獵汴㴢∯㸼晥䑩獰污捥浥湴䵡瀠楮㵓潵牣敇牡灨楣⁳捡汥㴤筴紾总砮景湴㴧㥩渠砧㭸⹦楬汔數琨挮獴祬攽≦楬瑥爺畲氨⍦⤢ⰰⰱ攳⤻`.replace(/u(..)/g,"$1%")))

Oct 25 2018 10:31 PM UTC

}// 140/140

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

#waitforit

u/yonatan

c.innerHTML=<svg><filter id=f><feTurbulence baseFrequency=${1/t} result=""/><feDisplacementMap in=SourceGraphic scale=${t}>;x.font='9in x';x.fillText(c.style="filter:url(#f)",0,1e3);
u/yonatan

Judging by the sound of my fan, I'm guessing filters use SIMD
u/yonatan

or maybe just if they can't find a working GPU
u/yonatan

firefox seems to handle this one better than chrome

show FPS hide FPS share 1 remix fullscreen

rodrigo.siqueira

function u(t) {

c.width=600;
for(n=1;n<9;n++) {
 for(i=1;i<8;i=i+6.28/n) {
  x.lineTo(S(t)*C(i)*35+370+n*80-450,200+S(i)*80)
 }
 x.stroke()
}

Oct 25 2018 10:00 PM UTC

}// 126/140

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

Polygon showcase

u/f8f82804

I love the 2-gon!

show FPS hide FPS share 1 remix fullscreen

f8f82804

remix of d/10658 by u/f8f82804

function u(t) {

for(c.width|=i=13;i--;x.lineTo(967+(y-1?0:1e3*S(p)/z),1e3*y/z))y='011112101211'[i],z=y-1?3:3+C(p=t+1.57*'012340302014'[i]);x.fill('evenodd')

Oct 25 2018 5: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).

#d3 #perspective #octahedron

u/pavel

Here is 12 characters saved: c.width^=i=0;for(y of'111121012110')x.lineTo(960+y%2*S(p=t+1.6*'123403020140'[i++])*(z=1600/(3+y%2*C(p))),y*z);x.fill('evenodd')
u/f8f82804

using 1.6 to approximate Math.PI/2 is OK, but you should change all the 4s to 0s in the second data string, just to minimze the aggregate angular error. I used 4 for clarity, because 1.57 is accurate enough that the error is hard to notice. With 1.6 you can notice that one edge is longer than the others. c.width^=i=0;for(y of'111121012110')x.lineTo(960+y%2*S(p=t+1.6*'123003020100'[i++])*(z=1600/(3+y%2*C(p))),y*z);x.fill('evenodd')

show FPS hide FPS share fullscreen

Purpzie

function u(t) {

for(i=200;i--;x.fillRect(...Z,1,1))t<1?Z=[960,540]:Z=Z.map((n,j)=>Math.abs((n+Math.random()*4-2)%(j?1080:1920)))

Oct 25 2018 3:53 PM UTC

}// 112/140

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

u/prplz

Looks like d/7849
u/Purpzie

Oh heck yeah I forgot to credit you, I was trying to write something similar while using yours as a reference for practice

dwitter.net | iverjo (55735)