 (ns chessground.ui
   (:require [cljs.core.async :as a]
             [chessground.common :as common :refer [pp]]
-            [chessground.react :as react]
             [chessground.data :as data]
             [chessground.chess :as chess]
             [chessground.premove :as premove]
-            [chessground.drag :as drag]
-            [chessground.api :as api])
+            [chessground.drag :as drag])
   (:require-macros [cljs.core.async.macros :as am]))
+
+(def ^private dom (.-DOM js/React))
+
+(def ^private div (.-div dom))
+
+(defn- class-set [obj] (-> obj js/Object.keys (.filter #(aget obj %)) (.join " ")))
 
 (defn- piece-hash [props]
   (when-let [piece (aget props "piece")]
-    (str (aget piece "color") (aget piece "role") (aget piece "draggable?"))))
+    (.join #js [(aget piece "color") (aget piece "role") (aget piece "draggable?")])))
 
 (defn- make-diff [prev next]
-  (fn [k] (not= (aget prev k) (aget next k))))
+  (fn [k] (not (== (aget prev k) (aget next k)))))
 
 (def ^private piece-component
   (js/React.createClass

                      x (inc (.indexOf "abcdefgh" (get key 0)))
                      y (js/parseInt (get key 1))
                      style-x (str (* (dec x) 12.5) "%")
                      style-y (str (* (dec y) 12.5) "%")
                      style (if white?
                              #js {"left" style-x "bottom" style-y}
                              #js {"right" style-x "top" style-y})
                      coord-x (when (= y (if white? 1 8)) (get key 0))
                      coord-y (when (= x (if white? 8 1)) y)
                      classes #js {"cg-square" true
                                   "selected" (read "selected?")
                                   "check" (read "check?")
                                   "last-move" (read "last-move?")
                                   "move-dest" (read "move-dest?")
                                   "premove-dest" (read "premove-dest?")
                                   "current-premove" (read "current-premove?")}]
                  (react/div #js {:style style
                                  :className (react/class-set classes)
                                  :data-key key
                                  :data-coord-x coord-x
                                  :data-coord-y coord-y}
                             (when-let [piece (read "piece")]
                               (piece-component piece))))))}))

(def ^private board-component
  (js/React.createClass

     :render
     (fn []
       (this-as this
                (div #js {:className "cg-board"}
                     (.map (aget (.-props this) "chess")
                           square-component))))}))

(def ^private all-keys
  (let [arr (array)]
