clojurescript 2022-04-19

Good morning!

How do you pass contextAttributes when creating canvas context? e.g. in JS the code is

const gl = canvas.getContext('webgl', {
  antialias: false,
  depth: false
});

saidone06:04:42

tried several options like (set! ctx (.getContext (.getElementById js/document "canvas") "2d" {:alpha false}))

saidone06:04:32

but whitout success as subsequent getContextAttributes show alpha still true for example

thheller06:04:06

it needs a js object but {:alpha false} is a cljs map. to create an object you use #js {:alpha false} instead

saidone06:04:26

many thanks, will try now! 🙂

thheller06:04:52

or if you have some nested data in it there is clj->js, so (clj->js {:alpha false})

👍 2

saidone06:04:43

it worked of course, 🙂 thanks again!

cjohansen06:04:11

I would suggest always using clj->js for the reason @thheller mentioned. I always end up tripping on #js not being recursive and regret using it 😅

👍 1

pinkfrog12:04:46

Hi, looking at the doc of reagent/rswap! https://cljdoc.org/d/reagent/reagent/1.1.1/doc/tutorials/-wip-managing-state-atoms-cursors-reactions-and-tracking#:~:text=but%20using%20swap!%20in%20React%E2%80%99s%20event%20handlers%20may%20trigger%20warnings%20due%20to%20unexpected%20return%20values%2C%20and%20may%20cause%20severe%20headaches%20if%20an%20event%20handler%20called%20by%20emit%20itself%20emits%20a%20new%20event%20(that%20would%20result%20in%20lost%20events%2C%20and%20much%20confusion). , what’s the lost event and how does rswap! help here?

p-himik13:04:35

The docstring of rswap! explains it. You can't recursively call swap!, even indirectly.

pinkfrog13:04:48

How’s that related to the lost event?

p-himik13:04:53

If you call swap! in swap!, things will not go according to plan. One of such potential things is code not being executed at all, IIRC. Or being executed multiple times - which is exactly the reason why the function you pass to swap! must be free of side effects.

p-himik13:04:12

In general, don't dwell too much on it, unless you want to go deep into the implementation details of CLJS/CLJ or maybe even JavaScript/JVM. Calling swap! within swap! is unequivocally undefined behavior, so it simply must not be done. Regardless of whether some events get missed, duplicated, mutated, or sent to your rivals.

pinkfrog13:04:20

I see, the events are synchronus: https://stackoverflow.com/a/23603901/855160. and nested swap! is disallowed, hence causing exception and therefore lost event handling.

pinkfrog13:04:56

Just working through the reagent docs and sounds a little opaque.

sova-soars-the-sora15:04:47

This is why tonsky's https://github.com/tonsky/rum is great Reagent is designed to trickle UI updates in response to atoms being set/reset/swap'd to a new value. If you think about it like a cascade of changes, if something down the line issues a new change, it might not "make it all the way up the waterfall" to trigger a commensurate new cascade

sova-soars-the-sora15:04:04

at least that's my mental ideation of it. I just use rum and regret nothing 😄

pinkfrog15:04:15

Haven’t played with RUM, just looked at its docs. Is there any fundamental difference between reagent and rum?

pinkfrog05:06:19

@U3ES97LAC Have you played with https://github.com/lilactown/helix/blob/master/docs/motivation.md ? How do you feel?

sova-soars-the-sora03:06:10

simplicity, rum is I think Helix exposes too much of React for my taste. I don't need to know all that stuff 😅

sova-soars-the-sora14:04:33

Hi, I want to create custom pause/play buttons for a video (mp4) using cljs. Can someone kindly point me to an example of doing this in clojurescript?

mruzekw15:04:48

I think you'll be hard-pressed to find a tutorial so specific. I would look into something like https://videojs.com/ or <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video%7CHTML5 <video>> and https://lwhorton.github.io/2018/10/20/clojurescript-interop-with-javascript.html and start from there.

sova-soars-the-sora18:04:33

Cool. Ty @U1RCQD0UE

victorb16:04:46

Is there any way I can get JS for ... in .. statement from CLJS code? Looking to enumerate keys from a JS obj whose keys are inherited

victorb16:04:05

or maybe there is a suitable google closure library function call for it

victorb16:04:10

Ah yes, goog.object/getAllPropertyNames does the trick. Thanks Victor

👍 1

sova-soars-the-sora18:04:00

the goog closure has many treasures :first_place_medal:

2022-04-19

Channels