Clojurians Log v2

@flyboarder the simple on! defmethod worked in the case I was asking about (attribute providers)

(defmethod on! :dragstart
  [elem event callback]
  (let [e (js/jQuery elem)]
    (.on e "dragstart" callback)))

seems like compound attribute names like :drag-start were giving me an error

is that the correct name of the event?

@chromalchemy you shouldn’t need to implement that

all the default events are natively supported

https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API#Drag_Events

(h/div :dragstart #(my-callback @%)) should be all you need

Oh, I thought only the jquery ones

(h/div :drag-start #(...)) wont work because drag-start isnt an event

So all the jquery and native javascript events are implemented by default?

yes

well there is a default handler

all attributes which have a fn as their value are considered an event

the default handler is similar to this:

(defmethod on! ::default
  [elem event callback]
  (let [e (js/jQuery elem)]
    (.on e (name event) callback)))

so provided the attribute key is a valid event name it will attach to that event

Ok, thanks for the clarification. So in practice the both the jquery and native events "handle" with the same syntactic convention

correct

same goes for jquery touch

those events are included for free just by including jquery touch into the app

O, nice!!! 👍

Ok another think I think should be simple? How can I get dom attributes as clojure values within an element definition?

(defelem reference-size
 [attr kids]
 (let
   [elem
      (div attr kids)
    width (cell= (.-width elem))
    height (cell= (.-height elem))]
   (elem
     (cell= (str width "/" height)))))

Why would you ever do that?

state flows into an element I dont recommend pulling state from an element

I want the rendered width and height as values to compute distances between drag event mouse coordinate output, and also render lines connecting "nodes" in a graph diagram

I can probably get the drag -> new position values from mouse events

in your example you have an element not attached to the dom and you are asking for it’s dimensions

it has none

as it’s not in the dom

it’s placed into the dom at runtime when rendered

so that kind of state you want to be setting on the element

not asking the element for it

What about when size changes from changing text content?

what about it?

I know that example is broken, just fishing around ...

how do you usually know when a dom element has changed size?

So text changes -> box size changes -> maybe need to know size to compute drag reposition?

I'm picturing graph nodes that can be variable size depending on text content

And also the lines between them may need to be recomputed?

Like, how would I draw a line between elements (svg underlayer?), but have it end at the borders of the elements

there is no concrete answer here, hoplon is lisp dom elements

how do you usually draw a line with html?

or recompute something with HTML?

you dont

like graphviz diagrams, but dynamic input, selection, dragging

Stack overflow examples indicated dom elements, with an SVG underlayer..

I think you should try to actually build the thing you are thinking of

you would probably want something like d3 for that

I am, I was just thinking that I might need the size of a dynamically sized element, to compute all the positions

I will check d3. I remember someone recommending a subset of that. But I dont want to lose the hoplon interactivity patterns I know.

Also hoplon encompases SVG right?

you can include hoplon with svg yes

https://google.github.io/closure-library/api/goog.style.html

^this is probably more what you are looking for