Hello,
investigating the use of clojurescript, om for state management, ReactJS for
simple parts of my apps, but also need to use foreigh libraries such as dgrid
(one of the dojo's excellent Grids).
I have setup Om/Clojurescript and can run a simple app (that I copied from one
of the David Nolan's issue tickets).
I am new to this whole stack (also wrote bunch of stuff in dojotoolkit several
years back).
I am running into some difficulties, so wanted to ask if what I am attempting
to do is the right 'direction'.
1) My application with Om/Clojurescript compiles and runs if I specifiy
optimization: none: or simple:. However if I specifiy advanced, the web page
does not work and I cannot see any errors with Opera's Dragonfly debugger.
Is :advanced mode supported with Om?
2) As soon as add the Dojo dgrid into the required section, my programs stops
working (but no errors either during the ocmpile or on Dragonfly)
I had an intersting error early on, when my Clojurescript namespace was named
'app', and a therewas a <div> in index.html with id="app"
That created a silent error. That took me a while to figure out.
If there is a similar 'namespace conflict' somewhere betweein om/clojurescript
and dgrid/dojo I will not be able to figure this out
My question, is use of Om (and therefore react) compatible with libraries such
as dojo in the sense that they can be used in one single-page app ?
And if yes, does anybody have, perhaps an example of such use in particular
with dojo or dgrid.
Thx in advance
my project.clj
-------
(defproject lighttable-repl "0.1.0"
:jvm-opts ^:replace ["-Xmx512m" "-server"]
:source-paths ["src"]
:dependencies [
[org.clojure/clojure "1.5.1"]
[org.clojure/clojurescript "0.0-2138"]
; [om "0.1.0-SNAPSHOT"]
[om "0.1.4"]
[sablono "0.1.5"]
[org.clojure/core.async "0.1.267.0-0d7780-alpha" :scope "provided"]
[com.facebook/react "0.8.0.1"]
]
:plugins [[lein-cljsbuild "1.0.1"]]
:cljsbuild
{:builds [{
:id "dev-dbg"
:source-paths ["src/"]
:compiler {:optimizations :simple
:pretty-print true
:source-map "out/main.js.map"
:output-dir "out"
:output-to "out/main.js"
:foreign-libs [{:file "dojo/js/dgrid/OnDemandGrid.js"
:provides ["dojo.js.dbgrid.OnDemandGrid"]},
{:file "dojo/js/dgrid/Keyboard.js" :provides
["dojo.js.dgrid.Keyboard"]},
{:file "dojo/js/dgrid/Selection.js" :provides
["dojo.js.dgrid.Selection"]},
{:file "dojo/js/dojo/_base/declare.js"
:provides ["dojo.js.dojo.base.declare"]},
{:file "dojo/js/dojo/store/Memory.js"
:provides ["dojo.js.dojo.store.Memory"]},
{:file "dojo/js/dojo/domReady.js" :provides
["dojo.js.dojo.domReady"]}
]
}}]})
---------
---------
my test application app.cljs
----
; -*- mode: Clojure; eval: (auto-fill-mode 1); -*-
(ns app ; make sure that the name here does not conflict with any dom elements
(:require
; [clsj.core.async :refer [put! <! chan]]
[om.core :as om :include-macros true]
[om.dom :as dom :include-macros true]
[sablono.core :as html :refer [html] :include-macros true]
; including dojo causes nothing to render on the page
;=================================
; [dojo.js.dbgrid.OnDemandGrid :as dbgrid.OnDemandGrid]
; [dojo.js.dgrid.Keyboard :as dgrid.Keyboard]
; [dojo.js.dgrid.Selection :as dgrid.Selection]
; [dojo.js.dojo.base.declare :as dojo.base.declare]
; [dojo.js.dojo.store.Memory :as dojo.store.Memory]
; [dojo.js.dojo.domReady :as dojo.domReady]
[app.world :as world]
))
(enable-console-print!)
(defn vspwidget [data]
(om/component
(dom/div nil "vsp33 Hello world!")))
; (om/root {} vspwidget (.getElementById js/document "app1"))
(extend-type string
ICloneable
(-clone [n] (js/String. n)))
(defn rand-value []
(let [possible-values
"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"]
(rand-nth possible-values)))
(defn gen-list [n]
(vec (repeatedly n rand-value)))
(defn test-list-item [item owner opts]
(reify
om/IRender
(render [_]
(dom/li nil item))))
(defn test-list [items owner]
(reify
om/IWillMount
(will-mount [_]
(js/setInterval
#(om/transact! items [0] (constantly (rand-value)))
1000))
om/IRender
(render [_]
(dom/div nil
(dom/span nil (get items 0))
(dom/ul nil
(om/build-all test-list-item items))))))
(def items (gen-list 15))
(om/root items test-list (.getElementById js/document "app1"))
----
----
--- index. html ---
<!DOCTYPE html>
<html>
<body>
<div id="app1"></div>
<script src="http://fb.me/react-0.8.0.js";></script>
<script src="out/goog/base.js" type="text/javascript"></script>
<script src="out/main.js" type="text/javascript"></script>
<script type="text/javascript">goog.require("app");</script>
</body>
</html>
----
---
--
Note that posts from new members are moderated - please be patient with your
first post.
---
You received this message because you are subscribed to the Google Groups
"ClojureScript" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/clojurescript.
