Does anyone here have experience with OpenLayers or Leaflet with Reagent? I was just wondering if I should spend some time evaluating react wrappers such as ‘react-leaflet’ or head directly to js/interop path like this https://github.com/Day8/re-frame/blob/master/docs/Using-Stateful-JS-Components.md#example-using-google-maps

I need to do mapping with several layers and I also need to be able to draw new features.

Quick question, what's the difference between #js and #object types? Also, why does (object?) return true for #js but false for #object?

@valtteri, I'm using react-leaflet with Reagent and I'm pretty happy with it. Not doing anything advanced, though.

@miikka cool! 1.x or 2.x? Are you using any plugins or just the core library?

2.x, just the core library. Basically I just added cljsjs/react-leaflet as a dependency and then wrapped the components like this:

(def leaflet-map (r/adapt-react-class react-leaflet/Map))
(def leaflet-tile-layer (r/adapt-react-class react-leaflet/TileLayer))
(def leaflet-marker (r/adapt-react-class react-leaflet/Marker))
(def leaflet-popup (r/adapt-react-class react-leaflet/Popup))
;; ....

I think I’m going to also need this plugin where upgrade to 2.x has been suspiciously hanging for 3 months https://github.com/alex3165/react-leaflet-draw/pull/49

@priornix #object should never be used directly. its a fallback for an "unprintable" object.

Heh, that's an annoying situation. I assume that plugin would work just fine with Reagent, though.

Yep, I’ll see if the PR gets merged and try the other approach meanwhile. Thanks for the input @miikka!

@thheller I see, but what's the nuanced difference between #object and #js from a Clojurescript or Javascript perspective? The #object is generated by a JS library but it's methods is still callable from Clojurescript.

@priornix anything printed as #object is a JavaScript instance with its own prototype/class. so not {} but something new Thing(...)

specifically complex ones - neither arrays nor any of the primitives will display as #object but newer native classes like Promises and Maps/Sets will, as will any with a custom constructor, to tell you what it is.

the #js just indicates it's a JS object/array rather than a clojurescript data structure, mirroring the #js reader macro

Thanks @thheller @jesse.wertheim I wonder if (js->clj) should be updated to work with #objects

no it should not. the objects are inherently unprintable. you can extend the IPrintWithWriter protocol for those classes

if you just want to see the object you can use (js/console.log the-thing) but you can't just print arbitrary classes since you can't know what to print

True that, I was thinking more of property/method access rather than printing. For which, there is: https://stackoverflow.com/questions/32467299/clojurescript-convert-arbitrary-javascript-object-to-clojure-script-map/32583549#32583549

Of course, (console.log) would give you the reflection.

And (aget) / oops is the recommended method for method invocation

same thing. sure you can pull out any random properties but that doesn't mean that you can do anything useful with that

there is the IEncodeClojure protocol if you want to get fancy

Hi

anyone here familiar with figwheel proxy problem?

im trying to run dev server separately

I have luminus service server on 3000 and figwheel on 3449

id like to proxy request from figwheel to luminus, but no luck…

tried to use ring-proxy, ring-handler but couldn’t set up them correctly

anyone can point to the right direction? thanks.

@kaki.tk you don’t need to proxy

well normally you don’t need to proxy

@kaki.tk why do you want to proxy?

coz i don’t run ring server for api calls on figwheel

i want to run multipurpose ring server on other port

and CORS calls are not allowed

so i cant call POST from 3449 to 3000

@kaki.tk OK I want to understand your situation, but I’m not really clear on it. First I will tell you what most people do.

Figwheel works with CORS

if you run your main application server and serve the compiled ClojureScript assets from your main application server

Figwheel is going to work by default

yes but im on developement

i do not want to copy paste my compiled js

i need it on dev stage

b4 i will transfer it on server with nginx on prod

on nginx id just proxy any endpoint thats not the problem

problem is dev

yes

ok

yup

but you can still do this

so on react you can just add “proxy” key on package.json

oh

figwheel does not have that option

no i cant

hold on

okidoky

I still don’t know what your situation is

when you say you are on development what do you mean?

wow I talk with you… jesus

never thought wed talk

I mean… I’m on dev stage and first started figwheel project with lein new figwheel etc…

and by default it does not have ring server in it

nor configuration for it

yes

it have only cljs files…

on clj

nor folders for them… and does not start from clj.

so i have to make my own ring server “in” my fighweel app

or serve it outside

from luminus

I just chose to use luminus

so now i want to have my code updated live on figwheel… with figwheel… and on luminus with luminus

so thers 2 projects

figwheel and luminus on dev stage of my project.

in the end ill serve my figwheel with nginx and proxy my calls to luminus server

you have two different folders and two project.clj files?

yes 2 projects, 1 server (api services) 2 frontend (fighweel project)

1 is luminus, 2 is figwheel

and i want to connect them 🙂

someway

ok you should be able to configure luminus to serve the ../front-end/resources/public directory

as well

hm… ok thanks

sounds like a plan

much easier

👍 thanks for figwheel!

my pleasure, I hope I was able to help

tyty have a good day

I have been struggling for two weeks on getting Slickgrid to work in my CLJS project. How difficult would it be to reimplement in pure CLJS: 1. Table header resizing 2. Draggable column headers 3. Sortable columns 4. Filterable columns 5. Hideable columns 6. Select all. 7. Pagination. 8. Ajax loading

Apols for the newbie query. I'm wanting to use a cljsjs packaged library in Reagent, have done the relevant requires etc and the docs then say 'in order to call a function do (js/GlobalName.someFunction) '- where should I rummage to find the relevant 'GlobalName'

Really only the first six.

@steve613 yeah it's basically rummage-time

usually the name is easy to guess

what I do is I open the app in chrome with the pseudo-ns required

then check if there is window.CamelCasedVersionOfLibName

e.g. for react-select I would check for window.ReactSelect in the chrome devtools

does that make sense?

@pesterhazy thanks ... so it's a library-defined name rather than Reagent

it's defined in the cljsjs packaging code

great, thanks for help - happy rummaging ahead!

some lib packaging scripts do it manually: https://github.com/cljsjs/packages/blob/bbbc2005d6c6da11e04f97c34d5f7f8eda8a17e6/xlsx/resources/main.js#L2 - others do it implicitly somehow I assume

@its.ramzi what problems were you encountering?

I could only render the Slickgrid when I imported the javascript serverside and passed it to the client.

If I had a page loaded on the client, I could load the Slickgrid source into a <script> DOM element, but I couldnt run it.

there’s just no reason Slickgrid should not work - if you can make it work with regular JavaScript, then it will work with ClojureScript

I think reimplementing all the functionality will take a long time

Can you work with me to get a Slickgrid example working in a fresh Reagent project?

that said, I don’t know if Slickgrid is the answer - maybe there’s another one

sorry I cannot help you except at a high level

but two weeks seems like a long time to not be able to even invoke it from ClojureScript …

I would put together something minimal that isn’t working and paste it here

it has been very frustrating

I’m assuming this is not first library you’ve tried to integrate?

or is it?

the minimal thing is starting from scratch

no, i have experience

oh k, just double-checking - yeah then maybe it is a Slickgrid issue - one bad sign is that it appears abandoned - though are you using the active fork?

i am. the issue is a standard HTML/js one

i think

here let me make a new clean project for you to look at

well can you get it working with just JavaScript

I would do that first

okay, i have it super minimal

So, when you run that, you should see a div called myGrid, and an import for my-grid.js

just paste it somewhere please

did you not see the attachment?

I don’t want to d/l a gz to review something - make a paste

Can I use alias in ClojureScript?

does not seem to work

cljs.core.alias.call(null,new cljs.core.Symbol(null,"ba","ba",679581229,null),burst_events_fn.api)
                ^

TypeError: Cannot read property 'call' of undefined

hello, can someone help me 🙂 i dont know how to deal with promises in clojurescript for e.x. js/fetch

@puremonad you can access to then and catch like this: (-> (js/fetch ....) (.then #(println %)))

sorry let me get rid of the -> macro

(.then (js/fetch ....) #(println %))

the .fn-name syntax means "call whatever method" on the instance of the first parameter

wow

which for you is a js/Promise

thank that was easy 😉

it is 😄

don't forget the #, which is very often confusing...

@richiardiandrea no alias is not supported in cljs

hashtag sad panda 😢

is it contributable or already discarded for reasons @thheller

im new here and just started to studing clojure its really fun 🙂

I have one more question, whats different between #(println %) VS (fn [x] (println x)) 🙂

less characters. nothing else.

thanks 😉

@puremonad you can stick a name into fn, so when things blowup inside it, you'll find it faster.

(map #(/ % 0) [1 2])
java.lang.ArithmeticException: Divide by zero
	at user$eval22300$fn__22301.invoke(form-init7112164857516660938.clj:1)
                      ^^^
(map (fn foo [x] (/ x 0)) [1 2])
java.lang.ArithmeticException: Divide by zero
	at user$eval22315$foo__22316.invoke(form-init7112164857516660938.clj:1)
                      ^^^

@puremonad If you evaluate

'#(println %)

(fn* [p1__624#] (println p1__624#))

if someone passes a {:table to a function, how can I get the rows from it?

@its.ramzi what is the shape of that data?

It would be an html table

done in hiccup

@its.ramzi Do you have an example of a Hiccup table value?

[:table [:tr [:td 1

@its.ramzi i’ve used specter to successfully path into hiccup before

let me see if i can find a snippet…

Thx

this is probably pretty obscure, but i can give an example: https://gist.github.com/spieden/92a41ac80361c2cdaa68306efbb1cfba

@its.ramzi is this what you want?

(spr/select [(child-tag :table)
             (child-tag :tr)
             (spr/subselect (child-tag :td)
                            BODY)]
            [[:table
              [:tr [:td "foo"] [:td "bar"]]
              [:tr [:td "bam"] [:td "boom"]]]])
=> [["foo" "bar"] ["bam" "boom"]]

had to def this path too:

(def BODY
  (spr/if-path [1 map?] 2 1))

@its.ramzi You're probably not wanting to be doing what you're doing though. To render your table, you should be pulling the data for the table out of some state management thing (like an atom) somewhere. Like, you could be using a vector in there somewhere, which you then use to populate your hiccup table with. In the event that you want to also put that data somewhere else, you don't want to pull that data out of the hiccup form. You want to pull it directly from the state management system (like, from an atom) instead.

oh, yeah true — might be an X/Y problem =)

But, if you really want to be digging into and passing around hiccup forms... what @spieden said 😉

my use case was transforming some hiccup as part of generating a static website

hiccup was generated from user markdown

That looks pretty good.