emilyposting

nix type of gay

📍 melbourne australia


leftpaddotpy
@leftpaddotpy

You may know about the following completely normal behaviour in javascript from the excellent talk by Gary Bernhardt entitled "wat":

js> {} + []
0
js> {} - []
-0
js> [] - {}
NaN
js> [] + {}
"[object Object]" 

Enough about languages that are definitely not haskell[1], let's talk about nix

» nix repl
Welcome to Nix 2.11.0. Type :? for help.

nix-repl> f = a: a


ubuntor
@ubuntor
⚠️ note: please don't actually use this, use this trick (and this followup) or svg animations instead... your browser will thank you

this is spin.

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

this is what it looks like.

<div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <!-- content -->
</div>
:eggbug:
:eggbug:
(click to play/pause animations!)

we can adjust the period using animation-duration and the phase using a negative animation-delay. (this makes the animation play immediately, but offset in time.)

<div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <!-- content -->
</div>

<div style="animation: 5s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <!-- content -->
</div>

<div style="animation: 10s linear -8s infinite spin; display: flex; justify-content: center; align-items: center">
  <!-- content -->
</div>
:eggbug:
:eggbug:
:eggbug:
:eggbug:
:eggbug:
:eggbug:

we can spin the other way by using reverse.

<div style="animation: 10s linear 0s infinite reverse spin; display: flex; justify-content: center; align-items: center">
  <!-- content -->
</div>
:eggbug:
:eggbug:

if we want to move in a circle, we can move our content to the side.

<div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <div style="transform: translate(100px)">
     <!-- content -->
  </div>
</div>
:eggbug:
:eggbug:

we can adjust the radius by adjusting how much we move.

<div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <div style="transform: translate(150px)">
     <!-- content -->
  </div>
</div>
:eggbug:
:eggbug:

we can stack spins by nesting divs that use spin.

<div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
  <div style="transform:translate(100px)">
    <div style="animation: 10s linear 0s infinite spin; display: flex; justify-content: center; align-items: center">
      <div style="transform:translate(100px)">
        <!-- content -->
      </div>
    </div>
  </div>
</div>
:eggbug:
:eggbug:

now, what if we wanted motion that was different than spin? can we move in a triangle instead?

yes! if we express our target motion as a closed path in the complex plane, we can use a fourier series to approximate it using a sum of spins! (there are many good explainers out there.)

we'll sample our target motion, compute a discrete fourier transform, then pick out the largest components for our approximation.

(implementation details: we need to cancel out each rotation before applying the next one, since otherwise subsequent rotations will be affected by it. this also has the benefit of not rotating your content, like in the previous examples. spin also goes clockwise [decreasing angle], so we need to reverse it.)

here's a triangle made from only 4 spins! (well, 8, if you count the 4 extra spins to cancel those out.)

:eggbug:
:eggbug:
here's some examples! (note: might lag browser)
2 points (square wave) (20 components)
:eggbug:
4 points (20 components)
:eggbug:
sine wave (2 components)
:eggbug:
linear (triangle wave) (8 components)
:eggbug:
sawtooth wave (20 components)
:eggbug:
triangle (20 components)
:eggbug:
square (20 components)
:eggbug:
"marquee" (20 components)
you'll need to hide the bottom and maybe a bit of the sides.
:eggbug:
"dvd screensaver" (20 components)
:eggbug:
bounce (20 components)
:eggbug:
eggbug (30 components, using @nex3's vectorized eggbug)
:eggbug:
 
here's a script to generate stuff! (requires numpy)


lexi
@lexi

spent the last ~1h trying to make fizzbuzz. now you might ask "lexi what the FUCK are you doing" and that is a valid question and here's the valid answer:

  • i am building it in minecraft 1.12
    • and with only 5 blocks: piston (non-sticky), redstone block, stone block, redstone torch, redstone
    • and limited to 2d (not including the ground)
    • and it cannot be too huge (placing 20 half adders is against my rule)

and if you wonder why i place those arbitrary rules on myself:

  • i want a really hard challenge
  • it has another reason that i will tell you guys when im done with the mystery thing, and that will take a while
  • i hate myself

and it is really fucking hard lol

i have division by 3 now, but the division by 5 needs another hack to work, and i am questioning if this is even mathematically possible. but god damn thats a good challenge

(also, if you're wondering why 1.12: i am too! i originally wanted to launch 1.8 in lunar client, and then i have a memory gap, and then i was ingame in 1.12 with my wynncraft client and prism launcher is open? idk why i did that but now i started in 1.12 and am too lazy to switch (pun not intended))