build input from a type specification.

YAY!

clj/clarity/cljs/clarity.cljs

@@ -8,6 +8,10 @@
  ICloneable
  (-clone [s] (js/String. s)))
(extend-type number
  ICloneable
  (-clone [n] (js/Number. n)))
; data for one node: type and optionally data
;  if data is present, fill the node with the data
;  on input, check if input conforms to data, if it
@@ -23,7 +27,21 @@
      (keyword name)
      nil)))
(defn typed-keyword [kw owner]
(defmulti make-typed-input
  (fn [_ _ {type :type} & _]
    (cond
      (sequential? type) (first type)
      (map? type) (:type type)
      :else type)))
(defmethod make-typed-input 'Number [number owner]
  (om/component
    (dom/input #js {:type "number"
                    :className "field"
                    :value (om/value number)
                    :onChange #(om/update! number (fn [_ n] n) (js/parseFloat (.. % -target -value)))})))
(defmethod make-typed-input 'Keyword [kw owner]
  (om/component
    (dom/input #js {:type "text"
                    :className "field"
@@ -33,29 +51,36 @@
                                (when (valid? (.-target ev))
                                  (om/update! kw (fn [o n] n) (read-keyword (.. ev -target -value)))))})))
(defn typed-string [string owner]
(defmethod make-typed-input 'String [string owner]
  (om/component
    (dom/input #js {:type "text"
                    :className "field"
                    :value (om/value string)
                    :onChange #(om/update! string (fn [o n] n) (.. % -target -value))})))
                    :onChange #(om/update! string (fn [_ n] n) (.. % -target -value))})))
(defmethod make-typed-input 'HMap [m owner {type :type}]
  (om/component
    (dom/div #js {:className "field"}
      (dom/span nil "{")
      (into-array
        (map (fn [[k v]]
               (dom/div #js {:className "field"}
                 (dom/label nil (str k))
                 (om/build make-typed-input v {:opts {:type (k (nth type 2))}})))
             m))
      (dom/span nil "}"))))
(def app-state
  (atom
    '{:type (HMap :mandatory {:name String, :age Number, :gender Keyword})
      :data {:name "Paul", :age 3, :gender :unknown}}))
(defn typed-input [data owner]
(defn typed-input [{:keys [type data]} owner]
  (reify
    om/IWillUpdate
    (will-update [_ p s] (prn p s))
    (will-update [_ p s] (prn (:data p) s))
    om/IRender
    (render [_]
      (dom/div nil
        (dom/span nil "{")
        (om/build typed-keyword (:kw data))
        (om/build typed-string (:str data))
        (dom/span nil "}")))))
(def app-state
  (atom
    {:kw :hello
     :str "hello"
     :many [1 2 3]}))
      (om/build make-typed-input data {:opts {:type type}}))))
(om/root app-state typed-input (.getElementById js/document "typed_input"))