example.cljs

(ns om-tutorial.core
  (:require [goog.dom :as gdom]
            [om.next :as om :refer-macros [defui]]
            [om.dom :as dom]))

(enable-console-print!)

(defmulti read om/dispatch)

; this is a better version of my read function, where I should be able to supply a key by which to filter like parent-id e.g.
(defmethod read :data
  [{:keys [state] :as env} key {:keys [parent-id] :as params}]
  (let [st @state]
    (if-let [[_ k] (find st :data)]

      {:value (filter (fn [m] (= (get m :parent-id) parent-id)) k)}

      {:value :not-found})))
  
(defmethod read :data/by-parent-id
  [{:keys [state] :as env} key {:keys [id]}]
  (let [st @state]
    (if-let [[_ k] (find st :data/by-parent-id)]

      (if-let [[v] (get k id)]
        {:value v}
        {:value :not-found}
      )
      {:value :not-found})))

(defmethod read :default
  [{:keys [state] :as env} key params]
  (let [st @state]
    (if-let [[_ v] (find st key)]
      {:value v}
      {:value :not-found})))

(defn document [props & children]
  (let [{:keys [:description :component]} props]
    (dom/div nil children)))

(defn title [props & children]
  (let [{:keys [:description :component]} props]
    (dom/h1 nil children)))

(defn unordered_list [props & children]
  (let [{:keys [:description :component]} props]
    (dom/ul nil children)))

(defn ordered_list [props & children]
  (let [{:keys [:description :component]} props]
    (dom/ol nil children)))

(defn list_item [props & children]
  (let [{:keys [:description :component]} props]
    (dom/li nil children)))

(defn section [props & children]
  (let [{:keys [:description :component]} props]
    (dom/section nil children)))

(defn header [props & children]
  (let [{:keys [:description :component]} props]
    (dom/section #js {:className "header" :id "header"} children)))

(defn component [props & children]
  (let [{:keys [:description :component]} props]
    (apply component nil children)))

(declare node)
(declare leaf)

(defui Leaf
  static om/Ident
  (ident [this {:keys [id]}]
         [:data/by-id id])
  static om/IQueryParams
  ;this is just a dummy value
  (params [this]
          {:parent-id 10})

  static om/IQuery
  (query [this]
         '[:data/by-parent-id ?parent-id])
  Object
  (render [this]
    (dom/span nil (get (om/props this) :parent-id))))

(defui Node
 static om/Ident
  (ident [this {:keys [id]}]
    [:id id])
 static om/IQuery
 (query [this]
  '[:id :description :component {:children ...}])
 Object
 (render [this]
   (let [{:keys [children] :as props} (om/props this)
         attributes (dissoc props :children)]
     (component attributes (if (empty? children) (leaf {:parent-id (get (om/props this) :id)}) (map node children))))))

;; One that expresses the node tree
(defui Document
 static om/IQuery
 (query [this]
   `[:template/name {:template/structure ~(om/get-query Node)}])
 Object
 (render [this]
  (dom/div nil
    (get (om/props this) :template/name)
    (let [structure (get (om/props this) :template/structure)]
      (node structure)))))

(def leaf (om/factory Leaf))
(def node (om/factory Node))


(def app-state (atom {:template/name      "Template Name!"
                      :data/by-parent-id  {
                                            3 [[:data/by-id 27]]
                                            9 [[:data/by-id 28]]
                                            10 [[:data/by-id 29][:data/by-id 30]]
                                          }
                      :data/by-id {
                        27 {:db/id 27 :parent-id 3 :content "Title"}
                        28 {:db/id 28 :parent-id 9 :content "Item 1"}
                        29 {:db/id 29 :parent-id 10 :content "Item 2a"}
                        30 {:db/id 30 :parent-id 10 :content "Item 2b"}
                       }
                      :template/structure {
                                           :id         1
                                           :component  document
                                           :template   "recipe"
                                           :children [
                                                         {
                                                         :id          2
                                                         :component   header
                                                         :children    [
                                                                       {
                                                                        :id          3
                                                                        :component   title
                                                                       }
                                                                       ]
                                                         }
                                                         {
                                                         :id          7
                                                         :component   section
                                                         :children    [
                                                                       {
                                                                        :id          8
                                                                        :component   unordered_list
                                                                        :children    [
                                                                                      {
                                                                                       :id          9
                                                                                       :component   list_item
                                                                                      }
                                                                                      {
                                                                                       :id          10
                                                                                       :component   list_item
                                                                                      }
                                                                          ]}]}]}}))


(def parser (om/parser {:read read}))

(def reconciler
  (om/reconciler
    {:state  app-state
     :parser parser}))

(om/add-root! reconciler Document (gdom/getElement "app"))