randomness: this.options["randomness"],
between: [{p1: 'k', p2: 'r'}],
diffCol: ['b'],
- flags: ['r', 'k']
+ flags: ['r']
}
);
return {
else
this[arrName] = ArrayFun.init(this.size.x, this.size.y, null);
if (arrName == "d_pieces")
- this.marks.forEach(([i, j]) => addPiece(i, j, arrName, "mark"));
+ this.marks.forEach((m) => {
+ const formattedSquare =
+ (this.size.x - parseInt(m.substring(1), 10)).toString(36) +
+ (m.charCodeAt(0) - 97).toString(36);
+ const mCoords = V.SquareToCoords(formattedSquare);
+ addPiece(mCoords.x, mCoords.y, arrName, "mark");
+ });
};
if (this.marks)
conditionalReset("d_pieces");
padding: 0 10px;
overflow: auto;
}
+.full-rules figure.show-pieces {
+ max-width: 90%;
+ text-align: center;
+ margin: 0 auto;
+}
+.full-rules figure.show-pieces > img {
+ max-width: 100px;
+}
.full-rules > div {
margin-bottom: 20px;
}
.full-rules .right {
float: right;
}
+@media screen and (max-width: 550px) {
+ .full-rules .left {
+ float: none;
+ margin-bottom: 10px;
+ }
+ .full-rules .right {
+ float: none;
+ margin-top: 10px;
+ }
+}
.full-rules figcaption {
display: block;
text-align: center;
.chessboard {
position: absolute;
cursor: pointer;
- min-width: 200px;
- min-height: 200px;
}
piece {
position: absolute;
function getDiagSize(elt) {
const baseWidth = Math.min(window.innerWidth, 800);
let multFact = 1;
- if (elt.classList.contains("left") || elt.classList.contains("right"))
- multFact = 0.45;
+ if (elt.classList.contains("left") || elt.classList.contains("right")) {
+ if (baseWidth >= 551)
+ multFact = 0.45;
+ else
+ multFact = 0.7;
+ }
else if (baseWidth > 630)
multFact = 0.5;
else
element: "diag_" + i,
fen: diagrams[i].dataset.fen,
marks: diagrams[i].dataset.mks
- ? JSON.parse('[' + diagrams[i].dataset.mks + ']')
+ ? diagrams[i].dataset.mks.split(',')
: undefined,
color: diagrams[i].dataset.col || 'w',
options: {},
randomness: this.options["randomness"],
between: [{p1: 'k', p2: 'r'}],
diffCol: ['b'],
- flags: ['r', 'k']
+ flags: ['r']
}
);
let pawnLines = {
<h3>The Colorbound Clobberers</h3>
-<figure class="showPieces text-center"><img src="/images/pieces/Cwda/bd.svg"/><img src="/images/pieces/Cwda/ww.svg"/><img src="/images/pieces/Cwda/bf.svg"/><img src="/images/pieces/Cwda/wc.svg"/></figure>
+<figure class="show-pieces"><img src="/pieces/Cwda/c_black_rook.svg"/><img src="/pieces/Cwda/c_white_knight.svg"/><img src="/pieces/Cwda/c_black_bishop.svg"/><img src="/pieces/Cwda/c_white_queen.svg"/></figure>
<ul>
<li>Rook = bishop + dabbabah = "bede" (D),</li>
<figure>
<div class="diag left"
- data-fen='8/8/8/3D4/8/8/8/8 ...',
- data-mks='a8,b7,c6,e4,f3,g2,h1,c4,b3,a2,e6,f7,g8,f5,d3,b5,d7'>
+ data-fen='8/8/8/3D4/8/8/8/8 w 0 {"armies":"CC","flags":"8888","enpassant":"-"}',
+ data-mks="a8,b7,c6,e4,f3,g2,h1,c4,b3,a2,e6,f7,g8,f5,d3,b5,d7">
</div>
<div class="diag right"
- data-fen='8/8/8/4w3/8/8/8/8 ...',
+ data-fen='8/8/8/4w3/8/8/8/8 w 0 {"armies":"CC","flags":"8888","enpassant":"-"}',
data-mks="e6,f5,e4,d5,c7,g7,g3,c3">
</div>
<figcaption>