s to the DOM
(dom-util/set-inner-html! root-el (html/BoardContainer board-cfg))
;; calculate width / height
- (api/resize! board-state)))
-
-;; recommend they style the coordinate text using CSS
-;; the chessboard API can support the "on/off" and position stuff
-(def default-coords
- {:bottom {:position "outside", :show? false, :type "letters"}
- :left {:position "outside", :show? false, :type "numbers"}
- :right {:position "outside", :show? false, :type "numbers"}
- :top {:position "outside", :show? false, :type "letters"}})
+ (api/resize! board-state)
+ (update-coords! board-state coords)))
(def default-animate-speed-ms 80)
; (def default-animate-speed-ms 2500)
@@ -904,12 +941,9 @@
(if (= "white" (:orientation new-state))
(set-white-orientation! board-atom)
(set-black-orientation! board-atom)))
- ;; FIXME: coordinate config change
- ;; show / hide coordinates
- (when-not (= (:show-coords? old-state) (:show-coords? new-state))
- (if (:show-coords? new-state)
- (remove-class! (dom-util/get-element (:container-id new-state)) "hide-notation-cbe71")
- (add-class! (dom-util/get-element (:container-id new-state)) "hide-notation-cbe71")))
+ ;; coordinate config change
+ (when-not (= (:coords old-state) (:coords new-state))
+ (update-coords! board-atom (:coords new-state)))
;; fire their onChange event
(let [on-change-fn (:onChange new-state)
old-position (:position old-state)
@@ -1019,7 +1053,7 @@
;; FIXME: implement these
;; https://github.com/oakmac/chessboard2/issues/25
"coordinates" #() ;; FIXME: returns the current state with 0 arg, allows changing with other args
- "getCoordinates" #() ;; FIXME: returns the config object
+ "getCoordinates" (partial js-api/get-coordinates board-state)
"hideCoordinates" (partial hide-coordinates! board-state)
"setCoordinates" #() ;; FIXME: sets the config object (do we need this? just use .setConfig() ?)
"showCoordinates" (partial show-coordinates! board-state)
diff --git a/src-cljs/com/oakmac/chessboard2/css.cljs b/src-cljs/com/oakmac/chessboard2/css.cljs
index d4661f1..9c0d432 100644
--- a/src-cljs/com/oakmac/chessboard2/css.cljs
+++ b/src-cljs/com/oakmac/chessboard2/css.cljs
@@ -1,5 +1,11 @@
(ns com.oakmac.chessboard2.css)
+(def coords->css
+ {:top "coordinates-top-f30c9"
+ :right "coordinates-right-7fc08"
+ :bottom "coordinates-bottom-ac241"
+ :left "coordinates-left-183e9"})
+
;; TODO: probably convert this to a map
(def orientation-white "orientation-white-4de03")
diff --git a/src-cljs/com/oakmac/chessboard2/html.cljs b/src-cljs/com/oakmac/chessboard2/html.cljs
index e434490..b3cde0d 100644
--- a/src-cljs/com/oakmac/chessboard2/html.cljs
+++ b/src-cljs/com/oakmac/chessboard2/html.cljs
@@ -12,24 +12,38 @@
(declare piece->imgsrc)
-(defn NotationFiles
- [_cfg]
+(defn FileCoordinates
+ [position custom-fn]
(let [num-files 8
- files (range 0 num-files)]
+ files (range 0 num-files)
+ html-fn (if (fn? custom-fn)
+ custom-fn
+ str)]
(->> files
(map
(fn [f]
- (str "
" (idx->alpha f) "
")))
+ (template
+ (str "
{fileHTML}
")
+ {:file (idx->alpha f)
+ ;; FIXME: this function also should receive the position (top, right, bottom, left)
+ :fileHTML (html-fn (idx->alpha f))})))
(apply str))))
-(defn NotationRanks
- [_cfg]
+(defn RankCoordinates
+ [position custom-fn]
(let [num-ranks 8
- ranks (range 0 num-ranks)]
+ ranks (reverse (range 1 (inc num-ranks)))
+ html-fn (if (fn? custom-fn)
+ custom-fn
+ str)]
(->> ranks
(map
(fn [r]
- (str "
" r "
")))
+ (template
+ (str "
{rankHTML}
")
+ {:rank r
+ ;; FIXME: this function also should receive the position (top, right, bottom, left)
+ :rankHTML (html-fn r)})))
(apply str))))
(defn DraggingPiece
@@ -204,11 +218,11 @@
@html))
(defn BoardContainer
- [{:keys [container-id orientation show-notation? items-container-id squares-container-id] :as opts}]
+ [{:keys [container-id orientation items-container-id squares-container-id] :as opts}]
(template
(str
- "
"
- "
"
+ "
"
+ "
"
"
"
"
{Squares}"
"
" ;; end .squares-2dea6
- "
{NotationFiles}
"
- "
{NotationRanks}
"
+ ; "
{FileCoordinates}
"
+ ; "
{RankCoordinates}
"
+ ; "
{FileCoordinates}
"
+ ; "
{RankCoordinates}
"
"
" ;; end .board-container-41a68
"
") ;; end .chessboard-21da3
{:container-id container-id
+ ; :FileCoordinates (FileCoordinates opts)
:items-container-id items-container-id
- :NotationFiles (NotationFiles opts)
- :NotationRanks (NotationRanks opts)
- :show-notation (if show-notation? "" " hide-notation-cbe71")
+ ; :RankCoordinates (RankCoordinates opts)
:Squares (Squares opts)
:squares-container-id squares-container-id}))
+
+;; TODO: pass their custom rank / file function here
+(defn CoordinateRow
+ [trbl-position]
+ (template
+ "
{items}
"
+ {:cssClass (get css/coords->css trbl-position)
+ :items (case trbl-position
+ (:top :bottom) (FileCoordinates (name trbl-position) nil)
+ (:left :right) (RankCoordinates (name trbl-position) nil))}))
diff --git a/src-cljs/com/oakmac/chessboard2/js_api.cljs b/src-cljs/com/oakmac/chessboard2/js_api.cljs
index 212b3fd..7587bef 100644
--- a/src-cljs/com/oakmac/chessboard2/js_api.cljs
+++ b/src-cljs/com/oakmac/chessboard2/js_api.cljs
@@ -146,6 +146,11 @@
(apply merge))
{}))
+; (defn parse-set-coordinates-arg
+; "TODO: write me :-)"
+; [arg]
+; nil)
+
;; FIXME: handle 0-0 and 0-0-0, user will have to specify white or black
;; FIXME: the .move() method should support pieces or item-ids
;; .movePiece() --> only Pieces
@@ -310,3 +315,34 @@
(string? arg1) (set-config board-state arg1 arg2)
(goog/isObject arg1) (set-config board-state arg1 nil)
:else (warn-log "Invalid args passed to config():" arg1 arg2)))))
+
+(defn get-coordinates
+ "Returns a JS Object of the current coordinates config."
+ [board-state]
+ (clj->js (:coords @board-state)))
+
+(defn set-coordinates
+ "Set the coordinate config."
+ [board-state js-coords-cfg])
+ ;; FIXME: validate js-coords-cfg here
+
+(defn toggle-coordinates
+ [board-state])
+ ;; FIXME: write me
+
+(defn coordinates
+ "Get or Set the coordinates."
+ [board-state])
+ ;; FIXME: write me
+ ; (let [js-args (array)]
+ ; (copy-arguments js-args)
+ ; (.shift js-args)
+ ; (let [arg1 (aget js-args 0)]
+ ; ; arg2 (aget js-args 1)]
+ ; (cond
+ ; (not arg1) (get-config board-state)
+ ; (string? arg1) (set-config board-state arg1 arg2)
+ ; (goog/isObject arg1) (set-config board-state arg1 nil)
+ ; :else (warn-log "Invalid args passed to config():" arg1 arg2)))))
+
+;; TODO: actually add or remove coordinate elements from the DOM
diff --git a/src-cljs/test/chessboard2/js_api_test.cljs b/src-cljs/test/chessboard2/js_api_test.cljs
index 69df423..77f489e 100644
--- a/src-cljs/test/chessboard2/js_api_test.cljs
+++ b/src-cljs/test/chessboard2/js_api_test.cljs
@@ -2,7 +2,10 @@
(:require
[cljs.test :refer [deftest is]]
[com.oakmac.chessboard2.constants :refer [animate-speed-strings->times start-position]]
- [com.oakmac.chessboard2.js-api :refer [parse-constructor-second-arg parse-move-args parse-set-position-args]]
+ [com.oakmac.chessboard2.js-api :refer [parse-constructor-second-arg
+ parse-move-args
+ parse-set-coordinates-args
+ parse-set-position-args]]
[com.oakmac.chessboard2.util.fen :refer [fen->position]]))
(def ruy-lopez-fen "r1bqkbnr/pppp1ppp/2n5/1B2p3/4P3/5N2/PPPP1PPP/RNBQK2R")
@@ -111,3 +114,41 @@
(let [callback-fn1 (fn [] 1)]
(is (= (parse-set-position-args [212 (js-obj "onComplete" callback-fn1)])
{:animateSpeed 212, :onComplete callback-fn1}))))
+
+;; TODO: make this work
+; (deftest parse-set-coordinates-args-test
+; (is (= (parse-set-coordinates-args nil)
+; {}))
+; (is (= (parse-set-coordinates-args "")
+; {}))
+; (is (= (parse-set-coordinates-args "tl")
+; {:top {:type "ranks"}
+; :left {:type "files"}}))
+; (is (= (parse-set-coordinates-args "trbl")
+; {:top {:type "ranks"}
+; :right {:type "files"}
+; :bottom {:type "ranks"}
+; :left {:type "files"}}))
+; (is (= (parse-set-coordinates-args "tlaz")
+; {:top {:type "ranks"}
+; :left {:type "files"}})
+; "invalid TRBL values are ignored")
+; (is (= (parse-set-coordinates-args (array))
+; {}))
+; (is (= (parse-set-coordinates-args (array "left" "bottom"))
+; {:left {:type "files"}
+; :bottom {:type "ranks"}}))
+; (is (= (parse-set-coordinates-args (array "bottom" "left"))
+; {:left {:type "files"}
+; :bottom {:type "ranks"}})
+; "order does not matter")
+; (is (= (parse-set-coordinates-args (array "left" "bottom" "foo"))
+; {:left {:type "files"}
+; :bottom {:type "ranks"}})
+; "invalid TRBL values are ignored")
+; (is (= (parse-set-coordinates-args (js-obj "left" (js-obj "style" "font-size: 13px; color: blue;")
+; "bottom" (js-obj "style" "text-transform: uppercase;")))
+; {:left {:type "files"
+; :style "font-size: 13px; color: blue;"}
+; :bottom {:type "ranks"
+; :style "text-transform: uppercase;"}})))
diff --git a/src-css/chessboard2.css b/src-css/chessboard2.css
index c931784..f8766a4 100644
--- a/src-css/chessboard2.css
+++ b/src-css/chessboard2.css
@@ -107,15 +107,25 @@
border-radius: 100%;
}
-.hide-notation-cbe71 .notation-files-c3c0a {
- display: none;
+.coordinates-top-f30c9 {
+ top: -20px;
+ display: flex;
+ flex-direction: row;
+ left: 0;
+ position: absolute;
+ right: 0;
}
-.hide-notation-cbe71 .notation-ranks-d3f97 {
- display: none;
+.coordinates-right-7fc08 {
+ bottom: 0;
+ display: flex;
+ flex-direction: column;
+ position: absolute;
+ right: -20px;
+ top: 0;
}
-.notation-files-c3c0a {
+.coordinates-bottom-ac241 {
bottom: -20px;
display: flex;
flex-direction: row;
@@ -124,13 +134,13 @@
right: 0;
}
-.notation-ranks-d3f97 {
- bottom: -15px;
+.coordinates-left-183e9 {
+ bottom: 0;
+ left: -15px;
display: flex;
flex-direction: column;
position: absolute;
- right: -15px;
- top: 15px;
+ top: 0;
}
.file-44ae4 {