Clojurians Log v2
hoplon
I am working through the "Get Started" tutorial now, and have a couple of questions about Hoplon:
1. how do you do sequences of actions? I thought I'd try to add a "console.log" to the mouseover action: (h/h1 :mouseover #(swap! hello-message str "?") (js/console.log color) hello-message) . This does not result in a console.log message every time a mouseover happens.
2. is there / where is the documentation for swap!? I can't find anything in the wiki. Was trying to make sense of it in my head through experimentation.. My current hypothesis right now is that it basically takes as the first argument a cell (e.g. hello-message), as the 2nd argument a function which will work on the cell (say str).. and then any more arguments to swap! are basically passed on as additional arguments to that argument (`str`). Is this correct?
3. as an experiment instead of (h/text "The message has ~{message-char-count} chars.") I do (h/text (str "The message has ~{message-char-count} chars.")). I thought this would be equivalent... but now instead of h/text doing interpolation, it leaves ~{message-char-count} alone as actual raw text. Why is this?
4. Can I ask for the "Get Started" entry to get another review? I found an error earlier and fixed it (https://github.com/hoplon/hoplon/wiki/Get-Started/_compare/84118aba392df151e16487e45273a041427e7dd2...69aad6c66ca253c79c57819dff5c2eef45175bda)... but I need help:
a. https://github.com/hoplon/hoplon/wiki/Get-Started#making-a-sequence mentions a "def clicks". Is this a typo and it is now (def hello-message ...)?
b. the tutorial says that (j/cell= (js/console.log history)) "pretty-prints the value of history to the JavaScript console as its value changes". Actually it prints the object to the console; it is up to you to try to find the history within the object. How can this be fixed? I tried (js/console.log history.tail), and (js/console.log history["tail"]); no luck with both.
c. it would be good at the end of the tutorial to have a complete code listing, so we can check our own work
1. You want to do
(h/h1 :mouseover #(do (swap! hello-message str "?") (js/console.log color)) hello-message)
#() is syntax sugar for creating an anonymous function and the :mouseover attribute needs to be a function. The way you did you passed #(swap! hello-message str "?") as the :mouseover parameter and then you added (js/console.log color) to the body of the function (but as it returns nil it will not show on the page.
2. swap! is a clojure.core function. clojuredocs has an explanation with examples: https://clojuredocs.org/clojure.core/swap%21. Javelin cells have the same interface for changes as clojure.core atoms so you use swap! and reset! to change cell values.
3. h/text is a macro that does analysis on the string received as argument at macro time. If you pass something else (like a function returning a string) it will not be able to do the analysis to discover what are the cell dependencies to know how to update when those change.
4. Thank you for fixing that.
4.a Yeah, you are right, it should be (def hello-message ...)
4.b Are you using google chrome? If you go to the preferences inside the dev tools you can check the box Enable custom formatters and after that you will see the pretty printed version.
4.c This is a good idea, I will try to add that soon.
🙂 I am using Firefox actually. (js/console.log history) prints the full object, right? I am attaching a screenshot so you can see what I see (the actual history is only part of the object printed, and is in the tail attribute):
I think we got custom formatters for firefox also, let me check.
https://github.com/binaryage/cljs-devtools/blob/master/docs/installation.md#in-firefox
thank you this works for me. Did not know about custom formatting and am reading about it and learning something new. Thanks!
And an interactive getting stated would be better than the current one, I need to find some time to work on it.