Fork me on GitHub
#hoplon
<
2016-02-24
>
thedavidmeister10:02:31

is there a “hoplon way” to store data on elements, or should I just use data attributes?

dm310:02:15

hoplon way is storing data in vars simple_smile

thedavidmeister10:02:13

how do i get user input into vars?

dm311:02:28

(let [value (cell nil)]
   (input :type "text" :keyup #(reset! value @%)))
?

thedavidmeister11:02:22

sure, so if i use a datascript db to build a bunch of inputs

thedavidmeister11:02:49

and i want to reference something in the db by entity id

thedavidmeister11:02:13

i’d need to know, at the time the event is triggered, what input matches what id

thedavidmeister11:02:44

so, your example gives me a value, but what about the key?

dm311:02:08

(loop-tpl [[input-key input-value] (cell= (as-key-value-map (d/q ...)))]
   (input :type "text", :keyup #(input-changed! input-key %@), :value input-value))
would something like that work?

thedavidmeister11:02:29

that direct example would be buggy

thedavidmeister11:02:33

based on my experience

dm311:02:56

probably simple_smile but the Hoplon way is to store info in immediate closures

thedavidmeister11:02:20

because there seems to be some weird race conditions between changing cells on :keyup or :input or :keydown and the way the DOM reflows

dm311:02:40

yeah, might be a good idea to debounce

thedavidmeister11:02:43

but sometimes i’ll see some of the attributes on inputs change, but missing values, etc.

dm311:02:46

through an intermediate cell

dm311:02:01

haven't run into that though

thedavidmeister11:02:12

what i’m trying at the moment, is running a timeout on keyup

thedavidmeister11:02:23

then a query to flush all the “invalid” entities from the db

thedavidmeister11:02:32

which reflows the DOM consistently AFAICS

thedavidmeister11:02:42

or at least, i haven’t been able to make it bug out

thedavidmeister11:02:04

but i want to re-insert focus back into the DOM just before the removed input

thedavidmeister11:02:19

so, get the highest entity id lower than the one i removed, and select that

thedavidmeister11:02:52

I think your suggestion might work for that

thedavidmeister11:02:55

i’ll try it out

thedavidmeister11:02:11

i also have to learn how the queries work, lol

dm311:02:33

you can use the datoms api if your db is simple

dm311:02:38

think of the contents of the db as arrays

dm311:02:47

indexed in different orders

dm311:02:15

(arrays of datoms [:entity-id :attribute :value :tx])

dm311:02:41

so you have :aevt which is sorted by :attribute, then :entity-id, then :value

dm311:02:55

:eavt and :vaet

dm311:02:09

and this is much faster than query

thedavidmeister11:02:32

i don’t totally understand it just from that

thedavidmeister11:02:37

where do i put the db cell?

dm311:02:40

like in (d/datoms db ...) ? not sure I understand

thedavidmeister11:02:13

(take 10 (d/datoms :avet :post/timestamp)) that’s an example

thedavidmeister11:02:27

that’s different to what you just said?

dm311:02:34

it has to accept a db

dm311:02:39

probably a mistake in wiki

thedavidmeister11:02:53

yeah, it’s like that all the way through

thedavidmeister11:02:00

the datascript docs aren’t great tbh

thedavidmeister11:02:03

they just link to datomic

thedavidmeister11:02:07

which is what i’m reading through

thedavidmeister11:02:27

@dm3: just tried your approach to sending through the id

thedavidmeister11:02:18

@dm3: works well, i just have to remember to deref so i get the value before the db is purged and not when i happen to use it simple_smile

dm311:02:07

not animated 😞

thedavidmeister11:02:49

kk, so i have something like this

thedavidmeister11:02:51

(prn (d/q '[:find ?id :where [?id :data ?data] [(< ?id 250)]] @conn))

thedavidmeister11:02:08

but (prn (d/q '[:find ?id :where [?id :data ?data] [(< ?id id)]] @conn)) does not

thedavidmeister11:02:31

i think because the makes id not be the id as a number in that scope

thedavidmeister11:02:38

i feel i’m missing something obvious 😛

dm311:02:21

you need to either unquote id or pass it as a parameter to d/q

dm311:02:02

(d/q '[:find ?e :in $ ?id :where [?e :data ?data] [(< ?e ?id)]] @conn id)

thedavidmeister11:02:02

pass as a parameter to d/q ey?

thedavidmeister12:02:24

ooooh i think that worked

thedavidmeister12:02:00

now i have the highest ID that was less than the ID of the thing that was invalid

thedavidmeister12:02:11

how do I select that in the DOM without a data attribute?

dm312:02:35

you have a cell that always computes the ID of that elemnet

dm312:02:04

and the :focus attribute of the element is set to that cell?

dm312:02:08

would that work?

dm312:02:46

something like (input :focus (cell= (= input-id highest-input-id)))

thedavidmeister12:02:33

dunno? i’ll try 😛

thedavidmeister12:02:39

so :focus moves the cursor to the input, to the end

thedavidmeister12:02:53

select() from jquery actually selects all the text in the input

thedavidmeister12:02:07

i wonder if there’s something like :focus for selecting

thedavidmeister12:02:58

@dm3: so is the idea that if i pass :focus something true it will trigger focus, otherwise if i pass it a function it will trigger that function when it gets focus?

dm312:02:17

I don't know, just guessed there's an attribute like that

dm312:02:36

you'll have to make your own destiny from now on

thedavidmeister12:02:19

something is certainly happening

thedavidmeister12:02:32

it does trigger focus/select

thedavidmeister12:02:57

but then after it does that i want it to clear out the cell containing what needs to be focused/selected

thedavidmeister12:02:50

but I can’t put a cell= that might be a boolean and also an event handler on a single attribute

thedavidmeister12:02:41

so close to being able to get rid of the data attribute

thedavidmeister12:02:45

gotta keep going >.<

thedavidmeister12:02:27

(input
        :select (cell= (= id select-id))
        :focusin #(select-id! :none)

thedavidmeister12:02:58

(defc select-id :none)
(defn select-id! [id] (reset! select-id id))

thedavidmeister12:02:13

assuming this doesn’t turn out to be buggy

thedavidmeister12:02:16

this is very cool simple_smile

thedavidmeister12:02:22

although, i got lucky this time, it does appear that in general it would be limiting to not be able to both bind and trigger a given event on an element...

thedavidmeister12:02:31

@dm3 thanks heaps for your help simple_smile

roti18:02:06

Hi, I am trying to figure out how to best bind a cell to a jqueryui widget.

roti18:02:59

(defmethod do! :dialog [elem _ opts] (with-init! (.dialog (js/jQuery elem) (clj->js opts))))

roti18:02:22

How could I bind a cell to open and close the dialog here?

raywillig23:02:36

@roti you might want to structure your dialog as a defelem which can take cell attributes