        (sort-by :key)))
 
 ;; A Game component will wrap SquareBoard and supply it with the tile sequence
-;; it expects from a board and a phase. It will also render a message when the
-;; game ends.
+;; it expects from a board and a phase. Remember we want to render new and
+;; synthesized tiles on the :reveal phase, but not on :slide. The component will
+;; also be responsible for showing a message when the game ends.
 
 (q/defcomponent Game
   [{:keys [board phase]}]


;; # UI

;; A map suffices to represent a tile, the UI's core element. As you may recall
;; from section 'Board and tiles', if we want to add a tile to the board we need
;; a function that returns it. Every new tile contains the following keys and
;; corresponding values:
;; - :val, the number 2 or 4
;; - :key, some keyword that uniquely identifies the tile
;; - :new, the boolean true
;; The same function will also take two tiles and return the result of merging
;; them together, that is, a new tile described by:
;; - :val, the sum of the :val of the source tiles
;; - :key, some keyword that uniquely identifies the tile
;; - :src, a vector containing the source tiles, responsible for originating
;;   this one

;; ## Specification

(defn build-tile
  "Returns a map with :val associated to val and :key to an unique keyword. If
   no val is supplied, it defaults to 2 most of the time but it might default to
   4, and the key :new is mapped to true. Alternatively, when applied to two
   tiles, x and y, the result is the same as calling it with the sum of the
   tiles :val and associng the key :src to a vector containing x and y."
  ([] (assoc (build-tile (if (< (rand) 0.8) 2 4)) :new true))
  ([val] {:val val :key (keyword (gensym ""))})
  ([x y] (assoc (build-tile (+ (:val x) (:val y))) :src [x y])))

;; such details in a render function.

(defn render
  "Renders the Game component to the DOM node with the 'game' id passing board
   and and phase as its values."
  [board phase]
  (q/render (Game {:board board :phase phase})
            (.getElementById js/document "game")))
