This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2016-03-21
Channels
- # admin-announcements (4)
- # aleph (1)
- # beginners (15)
- # boot (55)
- # braveandtrue (5)
- # cider (20)
- # clara (10)
- # cljs-dev (13)
- # cljsrn (8)
- # clojure (52)
- # clojure-austin (30)
- # clojure-brasil (2)
- # clojure-india (1)
- # clojure-italy (2)
- # clojure-nl (1)
- # clojure-russia (72)
- # clojure-sdn (9)
- # clojure-taiwan (2)
- # clojure-uk (45)
- # clojurebridge (3)
- # clojured (1)
- # clojurescript (46)
- # core-matrix (1)
- # cryogen (1)
- # cursive (43)
- # datascript (12)
- # datomic (57)
- # devcards (54)
- # emacs (6)
- # funcool (21)
- # hoplon (335)
- # jobs (15)
- # jobs-rus (40)
- # ldnclj (2)
- # lein-figwheel (20)
- # off-topic (59)
- # om (157)
- # onyx (29)
- # parinfer (2)
- # pedestal (26)
- # proton (9)
- # protorepl (2)
- # reagent (3)
- # ring-swagger (4)
- # spacemacs (2)
- # untangled (17)
@urbanslug: in the the previous version of Om, owner
is the backing React component
@dnolen: Thanks, I expected that because that’s what the docs say. I guess reading someone’s code gets a little confusing. When we talk about a cursor being an atom that maintains path information to the app state what do we mean exactly?
@urbanslug: it doesn’t know what the component wants
cursors are just wrappers around maps / vectors so that you can pass around “slices” of the entire app state to components
So a cursor is just the subset of a map(this map being the app-state) that we pass to the component?
in this way components can update the app state without explicitly sharing path information
Oh I see, the cursor is a data structure that is a "pointer" to a part app-state. Therefore changes in this “pointer" affect the app-state and the component only cares about what it sees. It will not care about the app-state.
I wonder how much it hurts for Nolen to repeat this every time for beginners, maybe there’s a need for #om-beginners ?
Last question, do sub cursors maintain path info the the parent cursor or the root atom i.e app-state
@urbanslug: I think for that reason we can write docs, blog posts and so on to help people to digest how it does work.
@thiagofm: I have updated the docs a little going by my understanding of what I am learning and to help other almost 100% beginners.https://github.com/omcljs/om/wiki/Cursors#overview
I'm personally not the best person to judge om docs, as I'm mostly only toying around with om next which you don't have to use cursors
I wonder if cursors are more a clojure thing than a Om thing -- I've used other kinds of libraries where you can use a cursor for example to navigate through a configuration data structure.
thiagofm: ‘cursor’ also has meaning in SQL databases https://en.wikipedia.org/wiki/Cursor_(databases)
@matthavener: I think there are many areas in computing that use the term, like mouse cursor and so on.
michaelr: I think the component needs to be created via om, because component?
checks if its an om component, not just any React component
hrm, actually I think I’m wrong, or confused that seems like it should work
I think set-query! is meant to be used inside the HelloWorld component, like (om/set-query! this ...)
And (component?) might be only true in that case. Maybe check the source code for the component? function?
@michaelr: that code should return true if the instance was created
om/factory
calls React.createElement
inside
by calling (hello)
you are calling React.createElement
. we don't have control over when the instance is actually created
so when i want to set the query params of a component, that component should already be rendered?
@michaelr: you can see that this returns true: (om/component? (HelloWorld.))
but you should not be doing that. It'll break things.
@michaelr: if you want to define the params of a component without being rendered, doesn't defining it in the params
function work for you?
not sure what :chat-id
is, but isn't that something that could be put in an ident
?
sounds like ident should do it, though i still don't understand how to use it.. will get back to the tutorial
@anmonteiro: thanks
Hi. Question on Om Next source: can anyone explain what this line is doing? https://github.com/omcljs/om/blob/master/src/main/om/next.cljs#L1824 Wouldn't it be calling (instrument instrument)
, having instrument
not to be nil
?
@andrewboltachev: it's not calling a function, but creating it
@anmonteiro: Thanks. I'll try to macroexpand
once again
@andrewboltachev: just try running this at the REPL
(def x 3)
(cond-> x (not (nil? x)) (fn [x] (inc x)))
you get a function back
yep I did it like this... but doesn't it do (-> x (fn [x] (inc x)))
?
which is (fn x [x] (inc x))
ah, and x would be name?
I'm working on an Om (classic) app, and cannot seem to bind to onplay events on a video element. onclick and all other events work, and if I bind plain JS to the video tag it fires, yet nothing in Om. I can't find any known bugs about it in react or Om, anyone see this before?
Ah... it's just like @wraps
in Python. I.e. this function would have the same name as original one had, but would be ran in another environment (i.e. with instrument
bind to nil
). Bingo!
(and this would be useful for stacktraces etc)
@shofetim: How do you bind plain JS? Can you show the code?
@anmonteiro: not sure whether om/Ident will help in my case. i have a list of items, the user clicks on one of the items and then i should display a detailed view of that item only..
so i have the item id when the user clicks on it, now i was thinking to set the detailed view's query params to that id
@michaelr: I'm not sure if it would help, but you might check how I did routing example with set-query!
https://github.com/andrewboltachev/omnext-routing-one/
@andrewboltachev: This works https://gist.github.com/b7ee7bf902e573827fe3 though it ugly to use the did mount and JS interopt...
@shofetim: Would this work in React btw? onplay
attribute?
@andrewboltachev: I haven't tried it in plain React, it aught to work (clearly the onplay event is firing, and is part of the spec https://dev.w3.org/html5/spec-author-view/video.html it just isn't passed through either Om's or React's event system.
@shofetim: Specs ofc have it. Here's what: https://facebook.github.io/react/docs/events.html#supported-events
@shofetim: There's huge, Slack-like React community on some platform... I just fogertting the name of it every time (it's not Slack). You should ask there, telling that you ain't using JSX, but JS functions directly (they don't know about Clojure) and they should tell on how to workaround this attribute. Please share your experience with us then.
@michaelr: Did it help btw?
@michaelr: to answer your question: if your root component doesn't need queries, you should either:
a) place the query of the child on the root, the child should be a function. In this case the child doesn't actually need a query.
b) compose the child's query in the root with a join
-query
I would go with a)
, too many joins to make queries compose give you some extra work in the parser
for example my router composes everything with [{:route-root [...subquery]}]
This has some disadvantages, like things merge under :route-root
this is just an arbitrary chosen name to compose queries
In most parser methods I have (get-in @state [:route-root :real-key])
:route-root
pollutes my app-state...
Ofcourse this is a situation where you can't do it without a join
has anyone made any demo of cljsjs react-motion and om.next? Nevermind, found one here: https://github.com/bendyorke/dinosaurus-rex/blob/4fd5035496f076bc864b0a660ea4133c032841fe/src/dinosaurus_rex/core.cljs
(defui ^:once Code static om/IQueryParams (params [this] {:language "haskell"}) static om/IQuery (query [this] '[(:code {:query ?language})]) Object (render [this] (let [{:keys [code]} (om/props this)] (om/set-query! this {:params {:language "ruby"}}) (dom/div #js {:id "code"} code)))) I get: next.cljs?rel=1458501277272:1149 Uncaught #error {:message "No queries exist for component path (haxlife.components.window/Window haxlife.components.code/Code)", :data {:type :om.next/no-queries}}
@thiagofm: replace Ruby with Python and it would work You rather try to use set-query!
on root component, there's metadata and some other little things in play
@thiagofm: I can also suggest to check this example of mine: https://github.com/andrewboltachev/omnext-routing-one Code isn't that pretty, though
But probably yes — on Root comp only. It's even worse in fact — I don't know, would child queries be used or not at all
'cause that's you who passes data to them: (render [this] ... ((om/factory ChildComponent) mydata))
For me it seems like that now
You might ask more experienced guys though
Aha, so you've got the same feeling
I'm now going through Om Next's source code, but it's not that easy. and would take some time to do
I hope I would be able to understand it better/implement my own ideas or even contribute then
@thiagofm: the error you get, is from an invalid query that doesn't compose
I posted something about this yesterday here on Slack
scroll back for a longer explanation
andrewboltachev: thanks for sending me the example, i think i understood it. though right now it would be great if someone knowledgeable could confirm that this is the way to implement the master-detail
@iwankaramazow: routing, and query composition is my yesterday's question
@michaelr: Yep I agree. Thanks for sharing your experience with it
today i'm trying to figure out the right way to implement master-detail, such that a user clicks on an item in a list and a detailed screen is displayed for that item. not sure what's the right way to pass item id to the details screen.. or should i say, how to pass it to the query?
@michaeldr: So it's sounds like you're maybe trying to do things in the components that you should be doing in the parser- My impression is that you'd want to have the detail component just have its own branch inside the parent (like named :detail
) and then the detail component just automagically gets the stuff it needs to do its job, because the parser functions take care of the id resolution. If you really need the ID in there (like because it's needed to create a mutation in the detail component) then it is just one of the properties inside the :detail
branch of the query tree
@michaeldr: So a SINGLE entity in the state may have MULTIPLE entities in the UI tree (i.e. the master entity with a branch inside it for the detail entity)
it's funny i was about to write that that i think i found what i need, switched tabs and there you wrote it too
@michaeldr: Yeah, I think that's the same sort of idea: The important thing is to make the components STUPID and the parsers SMART.
hey how do you deal with a websocket connection in om next? do you use a core async channel or do you do everything through the reconciler
because I was thinking about initializing a websocket and a core async channel, then for each of the callbacks (onerror, onopen, onmessage, etc) have a channel. That way the callback would just relay the work over to the core async channel and I don’t need to worry about the socket at all
and this fails: (om/set-query! (om/app-root omnext/reconciler) {:query [{(in/get-name component) (om/get-query component)}]})
this does something: (om/set-query! omnext/reconciler {:query [{(in/get-name component) (om/get-query component)}]})
Server streaming is all explained here: https://github.com/omcljs/om/wiki/Server-Streaming (Someday hopefully )
it just says soon
Unfortunately true... I've been looking forward to the designers' thoughts about it since last November...
@adamkowalski: Though your core.async approach sounds pretty sensible
and this works too: (om/set-query! (om/class->any omnext/reconciler something.core/AppRoot) {:query '[:whatssss]})
@drcode: actually i just tried making a basic demo which didn’t even use core async and it was surprisingly simple
essentially i would start with a state atom that had a websocket key and a nil value
then I would have a mutation called open socket, which would handle setting up the socket and registered callbacks for the different events
those events would actually call another transaction based on the event that had happened
for example onmessage would trigger a transaction with the message as the parameter, so everything is fully decoupled
finally I have a close socket mutation which handles tearing everything down and sets the websockets value in the state map back to nil