• 11 Posts
  • 159 Comments
Joined 2 years ago
cake
Cake day: July 22nd, 2023

help-circle

  • First, imagine a number in JavaScript. (Bit of a nail biter here, huh?)

    let i = 5
    

    Then, we will construct an incrementor. This is really simple: here is the method.

    1. Make a bracket-string-centric version of eval().
    []["filter"]["constructor"]("return i+1")()
    
    1. Reconstruct stringy eval() by using +[] as 0, +!+[] as 1, and implicit conversions as ways to create strings. For example, ‘false’ is (![]+[]), so ‘f’ is (![]+[])[+[]].
    [][
      (![] + [])[+[]] + // f
      ([![]] + [][[]])[+!+[] + [+[]]] + // i
      (![] + [])[!+[] + !+[]] + // l
      (!![] + [])[+[]] + // t
      (!![] + [])[!+[] + !+[] + !+[]] + // e
      (!![] + [])[+!+[]] // r
    ][
      ([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+ // c
      (!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+ // o
      ([][[]]+[])[+!+[]]+ // n
      (![]+[])[!+[]+!+[]+!+[]]+ // s
      (!![]+[])[+[]]+ // t
      (!![]+[])[+!+[]]+ // r
      ([][[]]+[])[+[]]+ // u
      ([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+ // c
      (!![]+[])[+[]]+ // t
      (!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+ // o
      (!![]+[])[+!+[]] // r
    ]("return i+1")()
    
    1. Draw the rest of the fucking owl. Final code:
    let i = 5; // haha yay
    
    [][
      (![] + [])[+[]] + // f
      ([![]] + [][[]])[+!+[] + [+[]]] + // i
      (![] + [])[!+[] + !+[]] + // l
      (!![] + [])[+[]] + // t
      (!![] + [])[!+[] + !+[] + !+[]] + // e
      (!![] + [])[+!+[]] // r
    ][
      ([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+ // c
      (!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+ // o
      ([][[]]+[])[+!+[]]+ // n
      (![]+[])[!+[]+!+[]+!+[]]+ // s
      (!![]+[])[+[]]+ // t
      (!![]+[])[+!+[]]+ // r
      ([][[]]+[])[+[]]+ // u
      ([][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]]+[])[!+[]+!+[]+!+[]]+ // c
      (!![]+[])[+[]]+ // t
      (!![]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+[]]]+ // o
      (!![]+[])[+!+[]] // r
    ](
      (!![]+[])[+!+[]]+ // r
      (!![]+[])[!+[]+!+[]+!+[]]+ // e
      (!![]+[])[+[]]+ // t
      ([][[]]+[])[+[]]+ // u
      (!![]+[])[+!+[]]+ // r
      ([][[]]+[])[+!+[]]+ // n
      (+[![]]+[][(![]+[])[+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[+!+[]]+(!![]+[])[+[]]])[+!+[]+[+!+[]]]+ // ' '
      ([![]]+[][[]])[+!+[]+[+[]]]+ // i
      (+(+!+[]+(!+[]+[])[!+[]+!+[]+!+[]]+[+!+[]]+[+[]]+[+[]])+[])[!+[]+!+[]]+ // +
      +!+[] // 1
    )()
    // no virus i swear. execute arbitrary code in your browser console.
    

    Anyway, that’s just everyday JS work. It’s like step 5 after resizing the button, but a bit before centering the div.

    based on this. some translation methods done differently.







  • Interesting, 18 up and 16 down as of this comment. Because this started with ~2 downvotes (the first image had terrible jpeg for a few minutes), we either have

    1. my taste did not land
    2. early downvotes beget more downvotes

    this comment is here for notetaking. let’s see if i’m a moron or if iambs are stronger than herds.





  • I forgive 'em cuz watt hours are a disgusting unit in general

    idea what unit
    speed change in position over time meters per second m/s
    acceleration change in speed over time meters per second, per second m/s/s=m/s²
    force acceleration applied to each of unit of mass kg * m/s²
    work acceleration applied along a distance, which transfers energy kg * m/s² * m = kg * m²/s²
    power work over time kg * m² / s³
    energy expenditure power level during units of time (kg * m² / s³) * s = kg * m²/s²

    Work over time, × time, is just work! kWh are just joules (J) with extra steps! Screw kWh, I will die on this hill!!! Raaah







  • Disclosure: I’ve done very little UI/UX.

    Google’s Material Design (wikipedia) is much more widely-adopted across OSes/Flutter/the web (see how many websites have that dropshadow topbar and ≡?); Microsoft’s Fluent (wikipedia) is Windows-first, but is usable anywhere.

    Both are based on responding to user actions. Fluent uses lightup acrylic (translucent) canvases (e.g. hover? border glowy.)

    while Google’s Material uses paper-esque whitespace, navbars, dropshadows, and round corners. (e.g. scrolling? dropshadow appears on nav)

    Think Microsoft Teams vs. Google Drive.

    They’re both full-fledged but Material You is way more common judging by places such as the F-Droid ecosystem on Android. As for which is “better”, Material You supposedly has better colorscheme flexibility since it ‘wants’ to adapt to e.g. user wallpapers. But other than that it’s really just preference (or whether relevant tooling exists :P). I know some devs use Material You for a predictable, unified look across Android apps, while others bend them to their will to reduce animations or whatnot.

    If you’re designing something, make sure you keep your own self in the mix too. Breezy Weather uses Material Design, but it’s more customized to have a unique feel than, say, TrackerControl (which also uses Material).



  • I love all the pleasantly deep answers in this thread.

    For my input: I’m everything I ever was, all at once.

    You know how lenses refract over each other at the optometrist? Or how colors combine when you stack transparent cups in the washer? That’s me. I have parts from everyone I ever met, and parts from everyone I ever was. There’s no mask, even if I focus on one part of the mosaic in a meeting vs. another when I nerd out w/ a buddy – it’s all equally me.

    I’m not Shrek though. Onions have layers, but I’m prismatic glass, chips and dips and all.