Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 | 1x 1x 13x 13x 13x 13x 13x 13x 1x 1x 1x 1x 1x 6x 36x 36x 17x 36x 36x 1x 1x 1x 2x 2x 1x 1x 1x 1x 2x 2x 1x 1x 40x 40x 40x 1x 1x 1x 1x | /**
* @author Antonio Raúl Guijarro Contreras <alu0101100494@ull.edu.es>
* @file Declaración de la clase Rectangle. hereda de Shape y simboliza la forma de un rectángulo
* @copyright Antonio Raúl Guijarro Contreras 2020
* @since 01.05.2020
*/
'use stric'
import Box from './Box.js';
import Point from './Point.js';
/**
* Clase Board. Representa un tablero. Cada ranura del tablero es un Box.
*/
class Board {
/**
* @static
* Representa los únicos valores de las columnas dentro del tablero
*/
static column = ['a','b','c','d','e','f','g','h','i','j','k','l',
'm','n','o','p','q','r','s','t','u','v','w','x','y','z'];
/**
* Constructor de la clase Board
* @param {Number} width Ancho de las cuadrículas
* @param {Number} height Alto de las cuadrículas
* @param {Number} horizontalBoxes Número de cajas horizontales
* @param {Number} verticalBoxes Número de cajas verticales
*/
constructor(horizontalBoxes, verticalBoxes) {
this.width = 0;
this.height = 0;
this.horizontalBoxes = horizontalBoxes;
this.verticalBoxes = verticalBoxes;
this.elements = {};
}
/**
* Construye el tablero.
* @param {Number} width Ancho del tablero
* @param {Number} height Alto del tablero
* @param {Array} pattern Array de colores en formato CSS. Se imprimirán en orden ciclico.
* @param {Number} horizontalBoxes Número de cajas horizontales
* @param {Number} verticalBoxes Número de cajas verticales
*/
build(width, height, pattern = ['red', 'blue'], horizontalBoxes = this.horizontalBoxes, verticalBoxes = this.verticalBoxes) {
this.width = Math.round(width / horizontalBoxes);
this.height = Math.round(height / verticalBoxes);
let index = 0;
for (let i = 0; i < this.horizontalBoxes; i++) {
for (let j = 0; j < this.verticalBoxes; j++) {
let auxBox = new Box('unknown', null,
new Point(this.width * (j), this.height * i),
this.width, this.height);
if (index >= pattern.length) {
index = 0;
}
auxBox.fillStyle = pattern[index++];
this.elements[this.translate(i, j)] = auxBox;
}
}
}
/**
* @param {Array} standarPatern Array de colores CSS. En base a los colores dados hace un patrón:
* color1 color2 color3 ... colorN en bucle hasta completar el tamaño horizontal del tablero. Después,
* inserta el mismo patrón que el anterior pero invertido.
* @return {Array} Array de colores CSS
*/
makeAsimetricPatern(standarPatern) {
let patern = [];
let index = 0;
let last;
// Caso simétrico
for (let i = 0; i < this.horizontalBoxes; i++) {
Iif (index >= standarPatern.length) index = 0;
patern.push(standarPatern[index++]);
}
last = patern.length - 1;
index = last;
// Caso asimétrico
Iif (this.verticalBoxes % 2 != 0 && this.horizontalBoxes % 2 != 0) index--; // Si es un tablero cuadrático impar
for (let i = 0; i < this.horizontalBoxes; i++) {
Iif (index < 0) {
if (this.verticalBoxes % 2 != 0 && this.horizontalBoxes % 2 != 0) index = last - 1; // Si es un tablero cuadrático impar
}
patern.push(patern[index--]);
}
return patern;
}
/**
* Introduce elementos importables mediante un json
* @param {String} src Ruta de fichero JSON para insertar elementos imagen
* a sus cajas correspondientes
*/
importElements(json) {
for (const key in json) {
this.elements[json[key].pos].id = key;
this.elements[json[key].pos].element = new Image();
this.elements[json[key].pos].element.src = json[key].src;
}
}
/**
* Inserta un elemento dentro de una posición del tablero.
* @param {Number} colum Columna del tablero
* @param {Number} row Fila del tablero
* @param {*} element Elemento a insertar
*/
setElement(row, colum, element) {
this.elements[this.translate(row, colum)].element = element;
}
/**
* Traduce las coordenadas númericas a algebráicas
* @param {Number} colum Columna del tablero
* @param {Number} row Fila del tablero
* @return {String} Cadena en formato algebráico
*/
translate(row, colum) {
let positionKey = '';
positionKey = Board.column[colum] + (row + 1)
return positionKey;
}
/**
* TODO: Para hacer el Ajedrez
* @param {*} element Un elemento de los elementos del tablero
* @param {*} to Posición a cambiar de posición en notación algebráica
* @return {boolean} Retornará si se pudo hacer el movimiento o no.
*/
move(element, to) {
let isPosible = false;
return isPosible;
}
/* istanbul ignore next */
/**
* Se encarga de dibujar la figura que representa la clase
* @param {Context} ctx Contexto del canvas, preferiblemente '2d'
*/
draw(ctx) {
const colRegex = /^\w1$/; // Variables situacionales
const rowRegex = /a\d+/; // Variables situacionales
Iif (ctx != null) {
ctx.font = '12px Arial';
for (let key in this.elements) {
this.elements[key].draw(ctx);
if (colRegex.test(key) || rowRegex.test(key)) { // Condicional situacional
ctx.fillStyle = 'black';
ctx.fillText(key, this.elements[key].start.x + 5, this.elements[key].start.y + 12);
}
}
}
}
}
export default Board; |