notepad-with-dommy.cljs

(ns notepad.core
  (:require [dommy.utils :as utils]
            [dommy.core :as dommy])
  (:use-macros [dommy.macros :only [node deftemplate]])
  (:import [goog.ui Zippy]))

(defn create-note [item el]
  (let [data (js->clj item)]
    {:title (data "title") :content (data "content") :parent el}))

(deftemplate note-header [title]
  [:div {:style {:background-color "#EEE"}} title])

(deftemplate note-content [content]
  [:div content])

(defn note-element [header content]
  (node [:div header content]))

(defn make-note-dom [note]
  (let [header-element (note-header (:title note))
        content-element (note-content (:content note))]
    (dommy/append! (:parent note) (note-element header-element content-element))
    (Zippy. header-element content-element)))

(defn ^:export makeNotes [notes container]
    (doseq [note notes]
        (make-note-dom (create-note note container))))

notepad.cljs

(ns notepad.core
  (:require [goog.dom :as dom])
  (:import [goog.ui Zippy]))

(defn create-note [item el]
  (let [data (js->clj item)]
    {:title (data "title") :content (data "content") :parent el}))

(defn make-note-dom [note]
  (let [header-el (dom/createDom "div" 
                                 (clj->js {"style" "background-color:#EEE"})
                                 (:title note))
        content-el (dom/createDom "div" nil (:content note))
        new-note (dom/createDom "div" nil header-el content-el)]
    (dom/append (:parent note) new-note)
    (Zippy. header-el content-el)))

(defn ^:export makeNotes [notes container]
    (doseq [note notes]
        (make-note-dom (create-note note container))))