monet ?

[boz jennings]

Hi,

Can someone give me pointers on using monet?

I'm trying to get to know Clojurescript. Just cloned cljs-start and put in dependencies and changes that I hope will work for monet https://github.com/rm-hull/monet
But I get this when compiling

WARNING: Wrong number of args (2) passed to monet.canvas/add-entity at line 17 /Users/boz/dev/clojure/cljs-start-001/src/cljs/cljs_start_001/core.cljs

Here's the code in cljs_start_001/core.cljs. It's basically just a copy from the monet README.md...

(ns cljs-start-001.core
(:require [monet.canvas :as canvas]))

(canvas/add-entity :background
(canvas/entity {:x 0 :y 0 :w 600 :h 600}
nil ;;update function
(fn [ctx box]
(-> ctx
(canvas/fill-style "#191d21")
(canvas/rect box)))))
(canvas/init (.get ($ :#canvas) 0))

monet's add-entity looks like this....

(defn add-entity [mc k ent]
(aset (:entities mc) k ent))

But I have no idea what mc k and ent are supposed to be.

Thanks!
,boz

[Nikita Beloglazov]

Hi Boz

I believe that mc stands for 'monet-canvas' which is created by 'init' function and example from README is incorrect. You need to get monet-canvas first from 'init' function and then add entity to it. Try this:

(def mc (canvas/init (.get ($ :#canvas) 0)))

(canvas/add-entity mc :background

(canvas/entity {:x 0 :y 0 :w 600 :h 600}
nil ;;update function
(fn [ctx box]
(-> ctx
(canvas/fill-style "#191d21")
(canvas/rect box)))))

Nikita

[boz jennings]

Thanks Nikita!

That helps. Now I read the monet code again and see mc all over the place :)
Wasn't able to get it working with the cljs-start yet. Haven't had much time to do it. Hopefully do more today.

Looks like the monet docs assume jayq is used too (that $). Does monet have a jayq dependency? Or is it OK to use this?
(def mc (canvas/init (.getElementById js/document "canvas") 0))

,boz

[Nikita Beloglazov]

I'd say feel free to use getElementById. But you don't need to pass 0 in this case. In former example (.get ... 0) was used to get actual dom element from array returned by JQuery. In your case you get dom element in the first place and don't need to get 0-st element.

--
Note that posts from new members are moderated - please be patient with your first post.
---
You received this message because you are subscribed to a topic in the Google Groups "ClojureScript" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/clojurescript/fnf33iMsFdY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to clojurescrip...@googlegroups.com.
To post to this group, send email to clojur...@googlegroups.com.
Visit this group at http://groups.google.com/group/clojurescript.

[boz jennings]

getElementById without the 0 compiles fine (thanks!) and I get no errors in the repl console or the JS console ... yet the colored rectangle doesn't show up. hmmm

Seems like the canvas element isn't in the repl-ized window or something...

cljs.user=> (def mc (canvas/init (.getElementById js/document "canvas")))
"Error evaluating:" (def mc (canvas/init (.getElementById js/document "canvas"))) :as "cljs.user.mc = canvas.init.call(null,document.getElementById(\"canvas\"));\n"
#<ReferenceError: canvas is not defined>
ReferenceError: canvas is not defined
at eval (eval at <anonymous> (http://localhost:63402/560/repl/start:1463:318), <anonymous>:1:80)
at eval (eval at <anonymous> (http://localhost:63402/560/repl/start:1463:318), <anonymous>:5:3)
at http://localhost:63402/560/repl/start:1463:313
at clojure.browser.repl.evaluate_javascript (http://localhost:63402/560/repl/start:1464:338)
at Object.callback (http://localhost:63402/560/repl/start:1472:82)
at goog.messaging.AbstractChannel.deliver (http://localhost:63402/560/repl/start:1340:393)
at goog.net.xpc.CrossPageChannel.xpcDeliver (http://localhost:63402/560/repl/start:1433:350)
at Function.goog.net.xpc.NativeMessagingTransport.messageReceived_ (http://localhost:63402/560/repl/start:1392:389)
at goog.events.Listener.handleEvent (http://localhost:63402/560/repl/start:1072:102)
at Object.goog.events.fireListener (http://localhost:63402/560/repl/start:1087:448)
nil
cljs.user=>

Maybe I need to start with something simpler than cljs-start. I don't understand all what it's doing yet.

,boz

[Nikita Beloglazov]

Did you require monet.canvas like this: (require '[monet.canvas :as canvas]) ?

Anyway you can try use full namespace:

(def mc (monet.canvas/init (.getElementById js/document "canvas"))) 

[boz jennings]

Silly me.
I was using the browse-repl URL instead of just going to localhost:3000 ... localhost:3000 does show the canvas!

Play time! ... Thanks Nikita!
,boz

[boz jennings]

I'll have to figure out how to get the monet dependencies in the browser-repl, I guess.
Need to go read some docs. Any recommendations?

[boz jennings]

Read https://github.com/clojure/clojurescript/wiki/The-REPL-and-Evaluation-Environments

Got the monet dependencies in the repl but if I try to init the canvas in the repl I get an error that doesn't happen in the page when it runs. Looks like it tries to resolve something to pass in as the first arg to monet.canvas.init.call but it ends up null in the repl.

The code is....

(ns cljs-start-001.core
(:require [monet.canvas :as canvas]))

(def mc (canvas/init (.getElementById js/document "canvas")))

(canvas/add-entity mc :background
(canvas/entity {:x 0 :y 0 :w 600 :h 600}
nil ;;update function
(fn [ctx box]
(-> ctx
(canvas/fill-style "#191d21")

When I load it in the repl with load-file I get this....

"Error evaluating:" (def mc (canvas/init (.getElementById js/document "canvas"))) :as "cljs_start_001.core.mc = monet.canvas.init.call(null,document.getElementById(\"canvas\"));\n"
#<TypeError: Cannot call method 'getContext' of null>
TypeError: Cannot call method 'getContext' of null
at get_context (eval at <anonymous> (http://localhost:53913/3201/repl/start:1463:318), <anonymous>:6:77)
at monet_canvas (eval at <anonymous> (http://localhost:53913/3201/repl/start:1463:318), <anonymous>:363:41)
at monet.canvas.init.init__delegate (eval at <anonymous> (http://localhost:53913/3201/repl/start:1463:318), <anonymous>:370:168)
at monet.canvas.init.init (eval at <anonymous> (http://localhost:53913/3201/repl/start:1463:318), <anonymous>:376:23)
at eval (eval at <anonymous> (http://localhost:53913/3201/repl/start:1463:318), <anonymous>:1:44)
at http://localhost:53913/3201/repl/start:1463:313
...

[Brandon Adams]

In your repl, can you verify that (.getElementById js/document "canvas") actually returns a <canvas>? Under the hood, init is trying to grab a context off that canvas, which doesn't seem to exist.

If you don't have a canvas there, try adding a <canvas id="canvas"></canvas> to your page.

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 clojurescrip...@googlegroups.com.