Display todo list client side with button, onclick event

project.clj

@@ -9,7 +9,9 @@
                  [compojure "1.1.5"]
                  [ring/ring-devel "1.2.0"]
                  [ring/ring-core "1.2.0"]
-                 [hiccup "1.0.4"]]
+                 [hiccup "1.0.4"]
+                 [prismatic/dommy "0.1.1"]
+                 [core.async "0.1.0-SNAPSHOT"]]
   :plugins [[lein-cljsbuild "0.3.2"]
             [lein-ring "0.8.6"]]
   :cljsbuild {

src-clj/grub/core.clj

@@ -20,17 +20,6 @@
       (send! channel {:status 200
                       :headers {"Content-Type" "text/plain"}
                       :body    "Long polling?"}))))
-(def test-grubs
-  ["8 dl water"
-   "8 whole peppercorns"
-   "2 bay leaves"
-   "1 - 2 (150 g) onions"
-   "750 g potato"
-   "600 g salmon"
-   "1 t. salt"
-   "2 dl cream"
-   "1 dl dill"])
-
 (defn index-page []
   (html5
    [:head
@@ -39,14 +28,6 @@
     (include-css "/css/bootstrap.css")
     (include-css "/css/bootstrap-responsive.css")]
     [:body
-     [:div.container
-      [:div.row-fluid
-       [:div.span8.offset2
-        [:h2 "Grub"]
-        [:table.table 
-         [:tbody
-          (for [grub test-grubs]
-            [:tr [:td [:label.checkbox [:input {:type :checkbox} grub]]]])]]]]]
      (include-js "http://code.jquery.com/jquery.js")
      (include-js "/js/bootstrap.js")
      (include-js "/js/main.js")]))

src-cljs/grub_client/core.cljs

@@ -1,3 +1,38 @@
-(ns grub-client.core)
+(ns grub-client.core
+  (:use-macros [dommy.macros :only [deftemplate sel1 node]])
+  (:require [dommy.core :as dommy]))
 
-(.log js/console "ClojureScript running")
+(defn log [& args]
+  (apply #(.log js/console %) args))
+
+(def test-grubs
+  ["8 dl water"
+   "8 whole peppercorns"
+   "2 bay leaves"
+   "1 - 2 (150 g) onions"
+   "2 dl cream"
+   "1 dl dill"])
+
+(deftemplate grub-template [grub]
+  [:tr 
+   [:td 
+    [:label.checkbox [:input {:type "checkbox"}] grub]]])
+
+(deftemplate main-template [grubs]
+  [:div.container
+   [:div.row-fluid
+    [:div.span8.offset2
+     [:h2 "Grub List"]
+     [:table.table 
+      [:tbody
+       (for [grub grubs] (grub-template grub))]]
+     [:div.input-append
+      [:input.span2#addGrubText {:type "text"}]
+      [:button.btn#addGrubButton {:type "button"} "Add"]]]]])
+
+(defn onClicked []
+  (log "onClicked"))
+
+(dommy/prepend! (sel1 :body) (main-template test-grubs))
+
+(dommy/listen! (sel1 :#addGrubButton) :click onClicked)