From 51ee683bad7074858d298f812b920dd43226f4c6 Mon Sep 17 00:00:00 2001 From: Jesse McDonald Date: Sat, 28 Mar 2020 18:24:20 -0500 Subject: [PATCH] simplify handling of piece images with CSS content attributes --- css/chess.css | 28 ++++++++++++++++++++++++++++ index.html | 35 ++++++++++++++--------------------- js/pacosako_ui.js | 10 ++++------ 3 files changed, 46 insertions(+), 27 deletions(-) diff --git a/css/chess.css b/css/chess.css index f0dc49c..3b06bec 100644 --- a/css/chess.css +++ b/css/chess.css @@ -21,6 +21,16 @@ h1 { margin-bottom: 0; } +a.plain-link { + font-family: inherit; + font-size: inherit; + font-weight: inherit; + line-height: inherit; + color: inherit; + background-color: inherit; + text-decoration: inherit; +} + .media-button-svg { width: 12pt; height: 12pt; @@ -338,4 +348,22 @@ button:disabled .silhouette { } } +img.cb-dk-piece.cb-king { content: url(../svg/Chess_kdt45.svg); } +img.cb-dk-piece.cb-queen { content: url(../svg/Chess_qdt45.svg); } +img.cb-dk-piece.cb-rook { content: url(../svg/Chess_rdt45.svg); } +img.cb-dk-piece.cb-knight { content: url(../svg/Chess_ndt45.svg); } +img.cb-dk-piece.cb-bishop { content: url(../svg/Chess_bdt45.svg); } +img.cb-dk-piece.cb-pawn { content: url(../svg/Chess_pdt45.svg); } +img.cb-lt-piece.cb-king { content: url(../svg/Chess_klt45.svg); } +img.cb-lt-piece.cb-queen { content: url(../svg/Chess_qlt45.svg); } +img.cb-lt-piece.cb-rook { content: url(../svg/Chess_rlt45.svg); } +img.cb-lt-piece.cb-knight { content: url(../svg/Chess_nlt45.svg); } +img.cb-lt-piece.cb-bishop { content: url(../svg/Chess_blt45.svg); } +img.cb-lt-piece.cb-pawn { content: url(../svg/Chess_plt45.svg); } + +#cb_board.cb-reversed img.cb-knight { + -webkit-transform: scaleX(-1); + transform: scaleX(-1); +} + /* vim: set expandtab sw=3 ts=8: */ diff --git a/index.html b/index.html index d32414e..e32d461 100644 --- a/index.html +++ b/index.html @@ -1,7 +1,7 @@ - + @@ -9,7 +9,7 @@
-

Paco Ŝako

+

Paco Ŝako

@@ -238,25 +238,18 @@
- -
diff --git a/js/pacosako_ui.js b/js/pacosako_ui.js index d4fdfea..bc59bfb 100644 --- a/js/pacosako_ui.js +++ b/js/pacosako_ui.js @@ -143,7 +143,10 @@ $(function (){ function placePiece(where, side, type, suffix) { const code = pieceCode(side, type); const piece_id = 'cb_piece_' + code + '_' + suffix; - const piece = $($('#' + piece_id)[0] || $('#cb_piece_' + code + ' img').clone()); + let piece = $('#' + piece_id); + if (piece.length < 1) { + piece = $('#cb_piece_' + code).clone().prop({ id: piece_id }); + } piece.stop(true); piece.attr('id', piece_id); piece.removeClass('cb-selected'); @@ -548,11 +551,6 @@ $(function (){ boardElem.removeClass('cb-reversed'); } - const nd_img_src = $('#cb_img_nd_' + (reversed ? 'flipped' : 'normal'))[0].src; - const nl_img_src = $('#cb_img_nl_' + (reversed ? 'flipped' : 'normal'))[0].src; - $('.cb-piece.cb-dk-piece.cb-knight').attr('src', nd_img_src); - $('.cb-piece.cb-lt-piece.cb-knight').attr('src', nl_img_src); - for (const row of rows) { const rowElem = $('#cb_row' + row); rowElem.appendTo(boardElem);