Fork me on GitHub

@flyboarder I think I have figured out how to build a reasonable version of ProseMirror, but I am having some issues figuring out how to expose it to ClojureScript.


@mac good to hear! What is the current issue?


indeed, it would be really awesome to have prose mirror available from hoplon


@flyboarder I have a file that imports all the needed parts. It contains a section that looks like this:

 = {
    ProseMirror: ProseMirror,
    schema: schema,
    exampleSetup: exampleSetup,
    buildMenuItems: buildMenuItems,
    tooltipMenu: tooltipMenu,
    menuBar: menuBar


At the same time I have:

(cljs :compiler-options {:foreign-libs [ {:file "src/prosemirror.js"
                                             :provides ["pm"]


@flyboarder in my build.boot. Is this the correct way to do it and what is the way to access the lib from Hoplon?


@flyboarder At the moment I am seeing a lot of weird behaviour, things changing on reload that should not etc.


Ok, try generating externs for your file here, also I think the foreign lib setup will need to change a bit, just jumping in the shower then I'll be back :)


@mac by reload you mean boot-reload right? 1st i wouldn't add that to the mix, because that complicates things further.


@onetom No, just saving which triggers a recompile by Hoplon. Sorry should have been more precise.


@flyboarder Tried using the externs generator from file shared on dropbox and github, nothing happens.


@mac must be a file which serves it with the correct mime type, GitHub raw doesn't do this


@flyboarder Ah, Google Drive perhaps?


@flyboarder So got the file loaded using RawGit .-) It asks which object to extern?


@mac well "save triggers a recompile by Hoplon" means the builtin watch task re-runs all the other task following it in your task pipeline:

(speak)   (hoplon)   (reload)   (cljs-repl)   (cljs)   (serve :port 8000)
out of these the reload task - which is provided by the mentioned boot-reload package - tells the browser which files to reload. since your index page probably depends on all of your other files, it will run again, triggering a regeneration of your whole page. so if you put any kind of init code there, it will run again. some external libraries complain about being loaded twice, so you probably want to avoid this


@mac you probably want 'pm' as the object


@onetom I think the reload issue is a big part of the problem. I thought with-init! took care of it.


@mac the with-init! only solves the correct initialization order problem. hot-code-reloading while your app is running in the browser is a whole different issue. that's really something which most external libraries didn't prepare for.


@onetom Is it safe to cobine with-init! and defonce?


@mac I don't think that will solve the problem, when a namespace is reloaded all the things that depend on or use that ns will be reloaded, including things that are defonce per my understanding


Applications don't assume parts of them will be regenerated once they are compiled


@flyboarder No, I think I have to suspend reload.


Many JS things I have noticed don't work right when reloaded because they rely on Dom ready and other events which are not triggered


@flyboarder Indeed. If I have a cell that needs to be defined inside a with-init! how do I then define the output, eg (p cell-defined-in-with-init!). Right now it is just empty and remains so because it only exists after with-init! has run.


You should make the cell global in the ns and set the value in with-init


@flyboarder How do that with a prop-cell?


Via a lense cell, there is a section on them in the javelin read me


@flyboarder If I have a js property access expression like (. -baz)in my with-init! how would I then go about using a Lense cell?


By having it write to the global one


Wait that may not actually work, what you may actually want is just an anonymous cell that updates the global one


Can you post your with-unit


@flyboarder sure

  (let [c  (array (.config js/pm.exampleSetup (js-obj "menuBar" js/true)))
        place (.querySelector js/document "#editor")
        content (.querySelector js/document "#content")]
  (defonce pmed (js/pm.ProseMirror.
                   (js-obj "place" place
                           "doc" (.parseDOM js/pm.schema content)
                           "plugins" c))))
  (set! (. js/window -pmed) pmed)
  (print (. pmed.selection -from))
  (def sel-from (prop-cell (. pmed.selection -from)))


@flyboarder incl messy debug stuff


Yeah I think just a formula cell could then update a global cell


@flyboarder Something like this (defc= updater @sel-from (set-cell! global-cell @sel-from))


@flyboarder I don't think I understand how to make with-init cell set the value of the global cell


(let [reset (partial reset! global-cell)] (cell= (when prop (reset prop))) something like that


@flyboarder prop being sel-from from with-init or the property expression


@flyboarder I clearly need to read the javelin docs again tomorrow


@flyboarder 🙂 turns out (set-cell!= global-cell sel-from) in with-init! does the trick


@flyboarder Thanks for all your help, really appreciate it.


@mac No prob sorry I'm running around right now, slow reply


@flyboarder defonce does work with boot-reload as expected. see my example repo and the source code of defonce:

(core/defmacro defonce
  "defs name to have the root value of init iff the named var has no root value,
  else init is unevaluated"
  [x init]
  `(when-not (exists? ~x)
     (def ~x ~init)))
@mac don't put that defonce into with-init!. and in general putting def anything within some other scope than the root scope of the namespace is very rarely necessary. it means the symbol u want to define won't exist until the page is loaded, so you can only refer to it from code which only runs after the page is loaded...


@onetom: thanks good to know


@flyboarder I know, but it appears to be necessary for ProseMirror to work.


@mac if you look at the definition of with-init! which then calls thru add-initfn!, then you can see it's just a thin wrapper around jQuery.ready():

defn add-initfn!  [f] (js/jQuery #(with-timeout 0 (f)))
imagine when your code containing with-init! reloads, the reloaded code immediately runs again. that will run with-init! too, which becomes a simple synchronous operations, because the dom is already ready. (though as the source above shows, hoplon makes it async anyway with that with-timeout)


@onetom Got it. I have disabled reload for now. Much simpler.


it's a very complicated booting model if you step out of the module system provided by the google closure library, so you are better of properly packaging your external lib for it


@onetom thanks for the ui info