wbabic/match-game

prototype symmetry matching game using clojurescript, core.async, and canvas.

Match Game

A clojurescript webapp to exercise core.async library by sending keyborad events to an input channel while also allowing sending commands from a browser connected repl.

For demo see: http://wbabic.github.io/match-game/

Overview

Use an event stream input channel to transform a source object to match a target object. Events can come from browser as well as from a browser connected repl. Events are transformed into commands to separate GUI events from the application.

Usage

cljs

lein cljsbuild auto dev
lein cljsbuild once advanced

clojure repl

From within Eamcs, M-x cider-jack-in. see https://github.com/clojure-emacs/cider (formerly nrepl.el)

browser repl

(in-ns 'async-play.web.play)
@vertices
(sigma)
(position :v1 square)

using cljsbuild

lein trampoline cljsbuild repl-listen

see https://github.com/emezeske/lein-cljsbuild

using piggieback

from a clojure repl

user=> (require 'cljs.repl.browser)
user=> (cemerick.piggieback/cljs-repl :repl-env (cljs.repl.browser/repl-env :port 9000))

from the browser repl:

cljs.user=> (.log js/console "hello")
cljs.user=> (js/alert "Hello from a browser connected repl")

see https://github.com/cemerick/piggieback

web server

simple server

start simple server from shell:

$ cd resources/public
$ python -m SimpleHTTPServer 8888

then go to: http://localhost:8888/hello.html

clojure server

Resources

core.aync

• https://github.com/clojure/core.async
• https://github.com/swannodette/async-tests
• http://dimagog.github.io/blog/clojure/clojurescript/2013/07/12/making-http-requests-from-clojurescript-with-core.async/
• https://github.com/Dimagog/AsyncGET
• http://tech.puredanger.com/2013/07/10/rps-core-async/
• http://rigsomelight.com/2013/07/18/clojurescript-core-async-todos.html

cljs

• https://github.com/magomimmo/modern-cljs/blob/master/doc/tutorial-02.md
• https://groups.google.com/forum/#!topic/clojure/6H-hooiAW3I

canvas

• http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/HTML-canvas-guide/Introduction/Introduction.html#//apple_ref/doc/uid/TP40010542-CH1-SW1
• http://www.html5canvastutorials.com/kineticjs/html5-canvas-kineticjs-regular-polygon-tutorial/
• http://fabricjs.com/controls/
• https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#rgba()
• https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations
• https://github.com/learnboost/node-canvas

License

Copyright © 2013 Walter P Babic

Distributed under the Eclipse Public License either version 1.0 or (at your option) any later version.