diff --git a/src-cljs/com/oakmac/chessboard2/animations.cljs b/src-cljs/com/oakmac/chessboard2/animations.cljs
index 1ba5001..fe150d8 100644
--- a/src-cljs/com/oakmac/chessboard2/animations.cljs
+++ b/src-cljs/com/oakmac/chessboard2/animations.cljs
@@ -9,11 +9,12 @@
(defn animation->dom-op-add
[{:keys [duration-ms instant? on-finish piece square] :as _animation} board-state]
- (let [{:keys [animate-speed-ms board-width orientation piece-square-pct]} @board-state
+ (let [{:keys [animate-speed-ms board-width orientation pieceTheme piece-square-pct]} @board-state
new-piece-id (random-piece-id)
new-piece-html (html/Piece {:board-width board-width
:board-orientation orientation
:id new-piece-id
+ :pieceTheme pieceTheme
:hidden? true
:piece piece
:piece-square-pct piece-square-pct
@@ -38,13 +39,14 @@
;; - The answer is "yes"
(defn animation->dom-op-move
[{:keys [capture? destination duration-ms instant? on-finish piece source] :as _animation} board-state]
- (let [{:keys [animate-speed-ms board-width orientation piece-square-pct square->piece-id]} @board-state
+ (let [{:keys [animate-speed-ms board-width orientation pieceTheme piece-square-pct square->piece-id]} @board-state
current-piece-id (get square->piece-id source)
new-piece-id (random-piece-id)
new-piece-html (html/Piece {:board-width board-width
:board-orientation orientation
:id new-piece-id
:hidden? false
+ :pieceTheme pieceTheme
:piece piece
:piece-square-pct piece-square-pct
:square source
diff --git a/src-cljs/com/oakmac/chessboard2/config.cljs b/src-cljs/com/oakmac/chessboard2/config.cljs
index 6f5e75a..50c82a2 100644
--- a/src-cljs/com/oakmac/chessboard2/config.cljs
+++ b/src-cljs/com/oakmac/chessboard2/config.cljs
@@ -1,5 +1,6 @@
(ns com.oakmac.chessboard2.config
(:require
+ [clojure.string :as str]
[com.oakmac.chessboard2.util.predicates :refer [valid-position?]]
[com.oakmac.chessboard2.util.string :refer [safe-lower-case]]))
@@ -18,11 +19,20 @@
"black"
"white"))
+(defn valid-piece-theme?
+ [o]
+ (or (str/blank? o)
+ (str/includes? o "{piece}")))
+
(def config-props
{:draggable
{:default-val false
:valid-fn boolean?}
+ :pieceTheme
+ {:default-val ""
+ :valid-fn valid-piece-theme?}
+
:dropOffBoard
{:default-val "snapback"
:valid-fn valid-drop-off-board?}
diff --git a/src-cljs/com/oakmac/chessboard2/core.cljs b/src-cljs/com/oakmac/chessboard2/core.cljs
index fe749e9..9af1302 100644
--- a/src-cljs/com/oakmac/chessboard2/core.cljs
+++ b/src-cljs/com/oakmac/chessboard2/core.cljs
@@ -67,7 +67,7 @@
(defn begin-dragging!
"initialize dragging a piece"
[board-state square piece x y]
- (let [{:keys [dragging-piece-id onDragStart orientation piece-square-pct position square->piece-id]} @board-state
+ (let [{:keys [dragging-piece-id pieceTheme onDragStart orientation piece-square-pct position square->piece-id]} @board-state
;; call their onDragStart function if provided
on-drag-start-result (when (fn? onDragStart)
(let [js-board-position (clj->js position)]
@@ -103,6 +103,7 @@
:piece-square-pct piece-square-pct
:width piece-width
:x x
+ :pieceTheme pieceTheme
:y y})))
;; flag that we are actively dragging
(swap! board-state assoc :dragging? true
@@ -448,7 +449,7 @@
(defn- draw-items-instant!
"Update all Items in the DOM instantly (ie: no animation)"
[board-state]
- (let [{:keys [board-width items items-container-id orientation piece-square-pct position square->piece-id]} @board-state
+ (let [{:keys [board-width items items-container-id orientation pieceTheme piece-square-pct position square->piece-id]} @board-state
html (atom "")]
;; remove existing Items from the DOM
(doseq [item-id (keys items)]
@@ -464,6 +465,7 @@
(swap! html str (html/Piece {:board-orientation orientation
:board-width board-width
:id piece-id
+ :pieceTheme pieceTheme
:hidden? false
:piece piece
:piece-square-pct piece-square-pct
diff --git a/src-cljs/com/oakmac/chessboard2/html.cljs b/src-cljs/com/oakmac/chessboard2/html.cljs
index e434490..66dee25 100644
--- a/src-cljs/com/oakmac/chessboard2/html.cljs
+++ b/src-cljs/com/oakmac/chessboard2/html.cljs
@@ -1,14 +1,14 @@
(ns com.oakmac.chessboard2.html
"functions that return raw HTML"
(:require
+ [clojure.string :as str]
[com.oakmac.chessboard2.css :as css]
[com.oakmac.chessboard2.feature-flags :as flags]
[com.oakmac.chessboard2.pieces :refer [wikipedia-theme]]
[com.oakmac.chessboard2.util.arrows :as arrow-util]
[com.oakmac.chessboard2.util.math :refer [half]]
[com.oakmac.chessboard2.util.squares :refer [idx->alpha square->dimensions]]
- [com.oakmac.chessboard2.util.template :refer [template]]
- [goog.crypt.base64 :as base64]))
+ [com.oakmac.chessboard2.util.template :refer [template]]))
(declare piece->imgsrc)
@@ -33,7 +33,7 @@
(apply str))))
(defn DraggingPiece
- [{:keys [height id piece piece-square-pct width x y]}]
+ [{:keys [height pieceTheme id piece piece-square-pct width x y]}]
(let [piece-pct (* 100 piece-square-pct)]
(template
(str
@@ -41,7 +41,7 @@
;; FIXME: this needs to be customizable for the user
;; https://github.com/oakmac/chessboard2/issues/26
;; FIXME: need alt text here for the image
- "
"
+ "
"
"")
{:height height
:id id
@@ -139,11 +139,12 @@
:id id
:opacity opacity}))))
-;; TODO: they need the ability to override this
-;; should be able to put random things on the board, like a toaster SVG
(defn piece->imgsrc
- [piece]
- (base64/encodeString (get wikipedia-theme (name piece))))
+ [pieceTheme piece]
+ (if (str/blank? pieceTheme)
+ (str/join "" ["data:image/svg+xml;base64," (get wikipedia-theme (name piece))])
+ (str/replace pieceTheme #"\{piece\}" piece)))
+
(def piece-required-keys
#{:board-width
@@ -157,7 +158,7 @@
;; FIXME: need alt text here for the image
(defn Piece
- [{:keys [board-orientation board-width _color id hidden? piece piece-square-pct square] :as piece-config}]
+ [{:keys [board-orientation pieceTheme board-width _color id hidden? piece piece-square-pct square] :as piece-config}]
(when flags/runtime-checks?
(when (or (not= piece-required-keys (set (keys piece-config)))
(some nil? (vals piece-config)))
@@ -177,7 +178,7 @@
"'>"
;; FIXME: this needs to be customizable for the user
;; https://github.com/oakmac/chessboard2/issues/26
- "
"
+ "
"
"")))
(defn Square
diff --git a/src-cljs/com/oakmac/chessboard2/pieces.cljs b/src-cljs/com/oakmac/chessboard2/pieces.cljs
index ac61248..3b75afe 100644
--- a/src-cljs/com/oakmac/chessboard2/pieces.cljs
+++ b/src-cljs/com/oakmac/chessboard2/pieces.cljs
@@ -1,18 +1,19 @@
(ns com.oakmac.chessboard2.pieces
(:require
+ [goog.crypt.base64 :as base64]
[shadow.resource :as rc]))
(def wikipedia-theme
- {"bB" (rc/inline "pieces/wikipedia/bB.svg")
- "bK" (rc/inline "pieces/wikipedia/bK.svg")
- "bN" (rc/inline "pieces/wikipedia/bN.svg")
- "bP" (rc/inline "pieces/wikipedia/bP.svg")
- "bQ" (rc/inline "pieces/wikipedia/bQ.svg")
- "bR" (rc/inline "pieces/wikipedia/bR.svg")
+ {"bB" (base64/encodeString (rc/inline "pieces/wikipedia/bB.svg"))
+ "bK" (base64/encodeString (rc/inline "pieces/wikipedia/bK.svg"))
+ "bN" (base64/encodeString (rc/inline "pieces/wikipedia/bN.svg"))
+ "bP" (base64/encodeString (rc/inline "pieces/wikipedia/bP.svg"))
+ "bQ" (base64/encodeString (rc/inline "pieces/wikipedia/bQ.svg"))
+ "bR" (base64/encodeString (rc/inline "pieces/wikipedia/bR.svg"))
- "wB" (rc/inline "pieces/wikipedia/wB.svg")
- "wK" (rc/inline "pieces/wikipedia/wK.svg")
- "wN" (rc/inline "pieces/wikipedia/wN.svg")
- "wP" (rc/inline "pieces/wikipedia/wP.svg")
- "wQ" (rc/inline "pieces/wikipedia/wQ.svg")
- "wR" (rc/inline "pieces/wikipedia/wR.svg")})
+ "wB" (base64/encodeString (rc/inline "pieces/wikipedia/wB.svg"))
+ "wK" (base64/encodeString (rc/inline "pieces/wikipedia/wK.svg"))
+ "wN" (base64/encodeString (rc/inline "pieces/wikipedia/wN.svg"))
+ "wP" (base64/encodeString (rc/inline "pieces/wikipedia/wP.svg"))
+ "wQ" (base64/encodeString (rc/inline "pieces/wikipedia/wQ.svg"))
+ "wR" (base64/encodeString (rc/inline "pieces/wikipedia/wR.svg"))})