Fork me on GitHub
#clojurescript
<
2018-05-31
>
marlenefdez01:05:04

awesome, thanks!

lilactown01:05:32

(defreact some-comp-class
  (initial-state [] {:text "foo"})
  (some-property "hallo")
  (update-text! [this ev]
                (let [text (aget ev "target" "value")]
                  (this. setState
                         #(hash-map :text text))))
  (render [this _props _children]
          (let [state (this-. state)]
            [:div
             [greet {:name (:text state)}]
             [:div [:input {:type "text"
                            :value (:text state)
                            :onChange #(this. update-text! %)}]]])))
I decided I wanted to write some JS in CLJS today 😛

marlenefdez01:05:40

@bhauman, is this your implementation of 2048?

bhauman01:05:56

I afraid not

bhauman01:05:00

that's my version and its mixed in with devcards

bhauman01:05:21

hmmm, there is a lot less code in mine

marlenefdez01:05:42

@bhauman ah thanks! also, wow! you wrote figwheel?!😮😮

marlenefdez01:05:48

thanks for the example - i'm still faily new to this all, so it's nice to be able to look at some code that's modular and follows best practices

bhauman01:05:16

@marlenefdez I would definitely start really really small

marlenefdez01:05:00

what's an example of very small?

bhauman01:05:18

render a div with some buttons on it that do things

marlenefdez01:05:33

so far, i've implemented which in Clojure

bhauman01:05:28

very cool, the clojurescript env is harder than clojure, I'd recommend lein new figwheel --react and don't add any additional libs

marlenefdez01:05:52

(which is def not webdev lol) but yeah, I think I also need to take a step back and maybe review basic web dev

👍 4
marlenefdez01:05:01

and thanks for the suggestion, i'll start there

metacritical03:05:03

In clojurescript source here https://github.com/clojure/clojurescript/blob/master/src/main/cljs/clojure/browser/dom.cljs there is a [clojure.browser.dom] namespace how can one require this namespace in clojurescript program?

theeternalpulse06:05:09

Is there a workaround to use js object functions with clojure functions that require them, juxt comes to mind, trying to call (juxt .a .b) throws an error for the dots. Is there a deferred prototype function construct in cljs?

pesterhazy10:05:59

Does Closure's goog.object contain the equivalent of select-keys for js-objs?

troglotit10:05:56

The closest one would be filter and filter by predicate “key is in set of keys” https://google.github.io/closure-library/api/goog.object.html

pesterhazy11:05:01

Looks like filter-fn has the signature (fn [key object])

pesterhazy11:05:22

Came up with this

(defn select-obj-keys
  [o ks]
  (let [r #js {}]
    (loop [ks (seq ks)]
      (if ks
        (let [k (first ks)]
          (when (goog.object/containsKey o k)
            (goog.object/set r k (goog.object/get o k)))
          (recur (next ks)))
        r))))

rnagpal13:05:37

May I know why u wanted to use goog.object instead of select-keys ?

pesterhazy11:05:22

Came up with this

(defn select-obj-keys
  [o ks]
  (let [r #js {}]
    (loop [ks (seq ks)]
      (if ks
        (let [k (first ks)]
          (when (goog.object/containsKey o k)
            (goog.object/set r k (goog.object/get o k)))
          (recur (next ks)))
        r))))

bupkis12:05:58

has anyone found any convenience functions/macros for working with Immutable.js structures from ClojureScript? Maybe I'm doing something wrong, but currently I don't seem to be able to use normal CLJS functions on, say, Immutable.js Lists - e.g. I can't do (map some-fn some-immutable-js-list-var), instead I have to do (.map some-immutable-js-list-var some-fn), etc.

bupkis13:05:37

Thanks, I'll try that

joelkuiper12:05:26

Hmm I’m trying to update to 16 of react/reagent but I have an issue with updating

(def css-transition-group
  (reagent/adapt-react-class js/ReactTransitionGroup.CSSTransitionGroup))
it gives Invalid Hiccup form: [nil {:transition-name "slide",... previously it worked fine (with the React addons)

joelkuiper12:05:46

[css-transition-group {:transition-name "slide"
                           :transition-enter-timeout 500
                           :transition-leave-timeout 300}
     ^{:key key}
     [:div.popup-holder.animated
      {:on-mouse-down (fn [e] (.stopPropagation e))
       :style {:left (:left position)
               :top  (:top position)}}
      [popup-content @popup opts]]]
basic idea

joelkuiper12:05:41

did anyone experience a similar problem while updating?

pesterhazy13:05:08

does js/ReactTransitionGroup exist? @joelkuiper

joelkuiper13:05:31

yep, although I only see CSSTransition, not CSSTransitionGroup

joelkuiper13:05:03

using [cljsjs/react-transition-group "2.3.1-0"]

joelkuiper13:05:24

thank, that works!

joelkuiper13:05:33

as in, it no longer gives an error; still doesn’t animate though 😛

pesterhazy13:05:06

happy to help half-fix this 🙂

joelkuiper13:05:09

The rest wasn’t too bad, I only used in like 3 places so porting to the new API was doable! Thank you for pointing me in the right direction 😄

rnagpal13:05:03

:deploy-repositories [["snapshots" {:url ""
                                      :username "ui-user" :password "******"
                                      :sign-releases false}]
                        ["releases" {:url ""
                                     :username "ui-user" :password "***"
                                     :sign-releases false}]]

rnagpal13:05:10

This works for me

vijaykiran13:05:11

I’m trying to add a webjar and getting

java.lang.IllegalArgumentException: No matching field found: getResult for class org.eclipse.aether.collection.UnsolvableVersionConflictException
 at clojure.lang.Reflector.getInstanceField (Reflector.java:271)

vijaykiran13:05:48

Anyone seen this before ?

thheller13:05:52

@vijaykiran webjars inherit the version range madness from npm that might explain the UnsolvableVersionConflictException

vijaykiran13:05:20

yeah seems like it 😞

bhauman16:05:36

@metacritical just require clojure.browser.dom ie. (ns my.namespace (:require [clojure.browser.dom :as dom]))

bhauman16:05:17

although you are probably better of just using goog.dom directly

metacritical16:05:19

@bhauman Thanks a lot for the reply. Actually i was trying to reuse some of the functions mentioned in dom.cljs, But i got confused when i looked at the sample app in clojurescript source called “twitterbuzz” which instead of reusing those functions copy-pasted those functions into dom-helpers.cljs https://github.com/clojure/clojurescript/blob/master/samples/twitterbuzz/src/twitterbuzz/dom-helpers.cljs but now i understand it is the same as using any other namespace.

👍 4
lilactown17:05:04

decided to try and see how much I could get close to OG React API while still using hiccup syntax: https://twitter.com/lilactown_/status/1002043921030041600

lilactown17:05:33

funny how much it starts to look like Om's API 🤷

lilactown17:05:08

urgh I didn't think it would expand the twitter link. sorry for that

thheller17:05:29

@lilactown hover the message and click the X on the left to remove (if you want)

👍 4
lilactown17:05:10

I just don't want to spam the channel 😅

thheller17:05:36

not sure I understand what the this. macro does. why not just write #(. this update-text! %)?

lilactown20:05:32

hm. the way it gets serialized when the class is created doesn’t allow that to work

thheller20:05:31

is the (render [this ...]) not creating a regular binding? now I'm scared to ask what the defreact macro does 😉

lilactown20:05:15

haha! 😂 it's just a wrapper around create-react-class

thheller20:05:54

btw you are using cursive right?

lilactown20:05:59

it's just a regular binding, yes. but when you put a method/property on the class I'm doing some munging to serialize it and so it gets put on the JS obj literally as "update-text!" instead of update_text_BANG or whatever (. this update-text! ...) tries to do

lilactown20:05:05

no, I use Emacs mostly. why>?

thheller20:05:51

ah doh. nevermind then. the indentation always bothers me, just doesn't look right. easy fix in cursive but no idea about emacs.

lilactown20:05:46

yeah, I've seen some people putting metadata on macros for that in certain contexts and was wondering about that!

lilactown20:05:31

I haven't put in any effort to research what I could do and what's supported for cursive/Emacs

thheller20:05:46

cursive has a setting to "Default to Only Indent" which is the better default imho. no idea if there is an equivalent in emacs

kurt-o-sys19:05:47

just wondering: cljs is using goog closures under the hood, right? Any particular reason to choose for goog closures and not for ES6 modules?

thheller19:05:05

ESM didn't exist when ClojureScript was released. Also ESM are not suited for actual deployment so things are usually compiled/optimized/bundled together anyways so the input format doesn't matter too much.

kurt-o-sys19:05:26

yeah, was just wondering 🙂

cjohansen20:05:26

I started on a patch to improve cljs.spec.test last week, but it hasn’t been acknowledged in any way yet. Do I need to announce it somewhere else, or just be patient? https://dev.clojure.org/jira/browse/CLJS-2758

thheller20:05:08

@christian767 there is a dedicated #cljs-dev channel where you might get a bit faster feedback but yeah "be patient"

whilo20:05:56

i am porting the CPS transform compiler of http://anglican.ml to clojurescript.

whilo20:05:46

i have succeeded in porting it to cljs on the JVM so far, but i am trying to figure out what is necessary to make macroexpansion properly work with self-hosted cljs (cljs.js)

whilo20:05:21

i think klipse or https://oakes.github.io/paren-soup/ might be a good editing environment similar to http://webppl.org/

whilo20:05:19

this will probably be most interesting to programmers, but compared to the competitors (mc-stan, edward+tensorflow, pyro on pytorch) we have to show why lisp is a good idea and make it appealing

whilo20:05:15

any wishes or good ideas of how to convey this? i thought that an adaptive (intelligent) UI might be cool, but i am not sure how practical this is

whilo20:05:08

this intersects with clojure for datascience in the sense that we have worksheets in gorilla REPL that i can parse and retarget to different presentation formats (e.g. clojupyter). it would be possible to target a pure cljs worksheet renderer as well. what is needed there is markdown+mathjax support and some interactive programming environment

whilo20:05:32

the more technical thing would be some pointers of how to deploy a complicated library like anglican with self-hosted cljs in a life coding environment. i have to be able to do a complicated macro-expansion of the CPS expressions in the browser

whilo21:05:00

this should not be too hard to do, i am right now just not sure how to properly require the namespaces in the browser

whilo21:05:53

so i think in need to provide cljs.js/load-fn (?)

mfikes21:05:02

@whilo One way to ship static source to the browser is illustrated in https://github.com/ctford/klangmeister, but you can define cljs.js/*load-fn* any way you like

whilo22:05:10

so normally i use reader conditionals in functions while in macros i use the if-cljs macro from chas emerick to distinguish between hosts

whilo22:05:30

i guess i have to now also use reader conditionals in the macros to do this distinction?

whilo22:05:40

between macro-expansion in cljs and clj