                    :stroke (get-in app [:shape :Fill]) 
                    :d (to-svg-attr (get-in app [:shape :PathElements]))}))))
 
-(defmethod shape "Image" [app owner]
-  (let [style (dict->js (extract-style (:shape app)))]
-    (dom/img #js {:style style
-                  :draggable false
-                  :src (get-in app [:shape :url])})))
-
 (defmethod shape "Path" [app owner]
-  (let [style (extract-style (:shape app))]
+  (let [style (extract-shape-css app)]
       (dom/div #js {:style (dict->js style) :className "Morph Path"} 
         ; we render a svg sub-tag into which we place a 
         ; <path> that covers the given PathElements
         (render-path-node app owner)
         (render-submorphs app))))
-  
-(defmethod shape "Ellipse" [app owner]
-  (let [style (extract-style (:shape app))]
-    ;; we apply some customizations to the style, to make the shape elliptical
-    (let [ellipse-style (assoc style 
-                          "border-radius" (str (style "width") " /" (style "height")))]
-      (dom/div #js {:style (dict->js ellipse-style)} (render-submorphs app)))))
+
+; TEXT MORPH
+
+;;; spec-property -> css translation
+
+(defn get-font-family-css [family-name]
+  {"fontFamily" family-name})
+
+(defn get-font-size-css [size]
+  {"fontSize" (str size "pt")})
+
+(defn get-max-text-height-css [height]
+  {"maxHeight" (str height "px")})
+
+(defn get-max-text-width-css [width])
+
+(defn get-min-text-height-css [height])
+
+(defn get-min-text-width-css [height])
+
+(defn get-text-color-css [color]
+  {"textColor" color})
+
+(defn extract-text-css [->self]
+     (apply merge 
+       (map (fn [[prop value]]               
+          (let [value value]
+             (case prop 
+               :FontFamily (get-font-family-css value)
+               :FontSize (get-font-size-css value)
+               :MaxTextHeight (get-max-text-height-css value)
+               :MaxTextWidth (get-max-text-width-css value)
+               :MinTextHeight (get-min-text-height-css value)
+               :MinTextWidth (get-min-text-width-css value)
+               :TextColor (get-text-color-css value)
+               ; :Padding ... this is actually default?
+               :WordBreak ()
+                ;   _WhiteSpaceHandling: {/*...*/},
+               ;; more to come... 
+                nil))) (get @->self :morph))))
+
+;;; event handling
+
+(defn handle-input [e owner app]
+  (let [span (om/get-node owner "myInput")]
+    (prn (.-innerText span))
+    (om/update! app [:morph :TextString] (.-innerText span) :update)))
+
+(defn save-input [e owner app]
+  (prn (.-key e))
+  false)
+
+;;; rendering
+
+(defn create-text-node [->text-morph owner]
+    (dom/span #js {:className "visible Selection"
+                  :contentEditable (nil? (get-in ->text-morph [:morph :AllowInput]))
+                  :onMouseDown #(swap! clicked-morph (fn [_] @->text-morph :id))
+                  :onInput #(handle-input % owner ->text-morph)
+                  :style (dict->js (extract-text-css ->text-morph))
+                  ; :onKeyDown #(when (.-metaKey %) (save-input % owner app))} (dom/span #js {
+                    :ref "myInput"} (get-in ->text-morph [:morph :TextString])))
 
 (defmethod shape "Text" [app owner]
   (prn "Rendering Text Shape")
-  (let [style (extract-style (:shape app))]
+  (let [style (extract-shape-css app)]
     (let [text-style (assoc style "cursor" "default")]
       (dom/div #js {:style (dict->js text-style)
                     :className "Morph Text"} (create-text-node app owner)))))
 
-(defmethod shape :default [app owner]
-  (let [style (extract-style (:shape app))]
-    (dom/div #js {:style (dict->js style)} (render-submorphs app))))+(defmethod morph "Text" [app owner]
+  (reify
+    om/IRender
+    (render [this]
+            (let [style (dict->js (extract-morph-css app))]
+        (dom/div  #js {:style style
+                       :className "morphNode" } (shape app owner))))))
+
+

   "width" (:x value)})

(defn get-border-width-css [value]
  {"border-width" value
   "border-style" "solid"})

(defn get-border-color-css [value]
  {"border-color" value
   "border-style" "solid"})

; translation from morph data to CSS style prop

(defn dict->js [dict]
  (apply js-obj (apply concat (seq dict))))

(defn extract-style [state]
  (apply merge 
        (map (fn [[prop value]] 
            (case prop 
              :Fill (get-fill-css value)
              :Position (get-position-css value)
              :Extent (get-extent-css value)
              :BorderWidth (get-border-width-css value)
              :BorderColor (get-border-color-css value)
              ;; more to come... 
              nil
              )) state)))

; morph component + rendering functions

(defmulti shape (fn [app owner] (get-in app [:shape :ShapeClass])))
(defmulti morph (fn [app owner] (get-in app [:morph :MorphClass])))

; utilities

(defn render-submorphs [app]
  (dom/div #js {:className "originNode"}
    (apply dom/div nil
      (om/build-all morph (get app :submorphs) {:state {:owner-morph app}}))))

; property accessors

