               :height screen-height
               :justify-content "center"
               :align-items "center"}}
-    [:div
-     {:style {:display "flex"
-              :width (min screen-width screen-height)
-              :height (min screen-width screen-height)
-              :padding "10%"
-              :justify-content "center"
-              :align-items "center"}}
-     (for [location game-board
-           :let [[position tile] location
-                 [x y] (position->coordinates position)]]
-       ^{:key (hash location)}
-       [:div {:style {:position "absolute"
-                      :background-color "orange"
-                      :border-width 1
-                      :display "flex"
-                      :font-color "black"
-                      :border-style "solid"
-                      :justify-content"center"
-                      :align-items "center"
-                      :font-size 20
-                      :left x
-                      :top y
-                      :width tile-width
-                      :height tile-width
-                      }}[:a (::value tile)]])]]))
+     [:div
+      {:style {:display "flex"
+               :width (min screen-width screen-height)
+               :height (min screen-width screen-height)
+               :padding "10%"
+               :justify-content "center"
+               :align-items "center"}}
+      (for [location game-board
+            :let [[position tile] location
+                  [x y] (position->coordinates position)]]
+        ^{:key (hash location)}
+        [:div {:style {:position "absolute"
+                       :background-color "orange"
+                       :border-width 1
+                       :display "flex"
+                       :font-color "black"
+                       :border-style "solid"
+                       :justify-content"center"
+                       :align-items "center"
+                       :font-size 20
+                       :left x
+                       :bottom y
+                       :width tile-width
+                       :height tile-width
+                       }}[:a (str position tile)]])]]))
 
 (defn game []
   (reagent/create-class {:reagent-render (fn [_] [game-board])
-                   :component-did-mount (fn [_] (watch-keys!))}))
+                         :component-did-mount (fn [_] (watch-keys!))}))
 
 (defn home-page []
   [:div "TEST"])


(defonce app-db (reagent/atom (initial-state)))

(s/fdef move-direction
        :args (s/cat :board ::game-board :direction ::direction)
        :ret ::game-board)

(defn move-direction
  [board direction]
  (gen/generate (s/gen ::game-board)))

(defn correct-number-of-positions?
  [current-position direction-to-move]

  )

(s/fdef positions-to-move
        :args (s/cat :current-position ::position
                     :move-direction ::direction)
        :ret (s/coll-of ::position))



(defn positions-to-move
  [[x y] move-direction]
  (case move-direction
    ::up (map (fn [yy] [x yy]) (reverse (range 0 y))))
  )

(defn update-state
  [state [event-type & params]]
  (case event-type
    ::move-direction (let [[direction] params] (update state ::game-board #(move-direction % directions)))))

(defn dispatch-event!
  [event]
  (swap! app-db update-state event))

(def key-code->direction
  {38 ::up


(defn init! []
  (mount-root))

(st/instrument)
