core.cljs

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

;; Problem:
;; the search input reader (:search/result) will get called 2 times with each query update.


(enable-console-print!)

(def init-data
  {:root {:id 0
          :title "My input box:"
          :search {:id 2
                   :result "il"}}})

(defmulti read om/dispatch)

(defmethod read :root
  [{:keys [state query] :as env} _ _]
  (let [st @state]
    (println "root reader")
    {:value (om/db->tree query (:root st) st)}))

(defmethod read :search/result
  [{:keys [state]} _ {:keys [query]}]
  (println "search reader: " query)
  {:value (clojure.string/join [query "+X"])})

(defui Search
       static om/IQueryParams
       (params [this]
               {:query ""})
       static om/IQuery
       (query [this]
              '[(:search/result {:query ?query})])
       Object
       (render [this]
               (let [{:keys [search/result]} (om/props this)
                     {:keys [query]} (om/get-params this)]
                 (println "results, query: " result query)
                 (dom/div nil
                          (dom/input
                            #js {:onKeyUp
                                        (fn [e]
                                          (om/set-query! this
                                                         {:params {:query (.. e -target -value)}}))})))))

(def search (om/factory Search))

(defui Menu
       static om/IQuery
       (query [this]
              `[{:root [:id :title]}])
       Object
       (render [this]
               (println "render menu: " (om/props this))
               (let [{:keys [title]} (-> this om/props :root)]
                 (dom/div nil
                         (dom/h3 nil title)
                         (search)))))

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

(def r
  (om/reconciler
    {:state   init-data
     :parser  p
     :pathopt true}))

(om/add-root! r
              Menu (gdom/getElement "app"))