Fix knight hints, convert tile border from stroke to fill.

This commit is contained in:
yukirij 2024-08-16 16:53:29 -07:00
parent c0df79f056
commit c98a4cf1da

View File

@ -263,8 +263,8 @@ const INTERFACE = {
INTERFACE.resize();
INTERFACE.resolve_board();
let width = canvas.width;
let height = canvas.height;
let width = canvas.width * window.devicePixelRatio;
let height = canvas.height * window.devicePixelRatio;
let gui_margin = INTERFACE_DATA.Ui.margin;
let gui_offset = INTERFACE_DATA.Ui.offset;
@ -312,6 +312,25 @@ const INTERFACE = {
let piece = null;
if(tile.piece !== null) { piece = GAME_DATA.board.pieces[tile.piece]; }
// Draw border
ctx.fillStyle = INTERFACE.Color.TileBorder;
if(tile.piece !== null) {
if(GAME_DATA.board.pieces[tile.piece].player == GAME.Const.Player.Dawn) { ctx.fillStyle = INTERFACE.Color.DawnDark; }
else { ctx.fillStyle = INTERFACE.Color.DuskDark; }
}
switch(border_state) {
case INTERFACE.TileStatus.Valid: ctx.fillStyle = INTERFACE.Color.HintValidBorder; break;
case INTERFACE.TileStatus.Threat: ctx.fillStyle = INTERFACE.Color.HintThreatBorder; break;
case INTERFACE.TileStatus.Invalid: ctx.fillStyle = INTERFACE.Color.HintInvalidBorder; break;
case INTERFACE.TileStatus.Opponent: ctx.fillStyle = INTERFACE.Color.HintOpponentBorder; break;
}
if(is_hover) {
ctx.fillStyle = INTERFACE.Color.HintHover;
}
ctx.beginPath();
draw.hex();
ctx.fill();
// Draw background.
// Select indicator color or default to tile color.
switch(MATH.mod(coord.x + coord.y, 3)) {
@ -332,28 +351,9 @@ const INTERFACE = {
ctx.fillStyle = INTERFACE.Color.HintSelect;
}
ctx.beginPath();
draw.hex();
draw.hex(0.94);
ctx.fill();
// Draw border
ctx.strokeStyle = INTERFACE.Color.TileBorder;
if(tile.piece !== null) {
if(GAME_DATA.board.pieces[tile.piece].player == GAME.Const.Player.Dawn) { ctx.strokeStyle = INTERFACE.Color.DawnDark; }
else { ctx.strokeStyle = INTERFACE.Color.DuskDark; }
}
switch(border_state) {
case INTERFACE.TileStatus.Valid: ctx.strokeStyle = INTERFACE.Color.HintValidBorder; break;
case INTERFACE.TileStatus.Threat: ctx.strokeStyle = INTERFACE.Color.HintThreatBorder; break;
case INTERFACE.TileStatus.Invalid: ctx.strokeStyle = INTERFACE.Color.HintInvalidBorder; break;
case INTERFACE.TileStatus.Opponent: ctx.strokeStyle = INTERFACE.Color.HintOpponentBorder; break;
}
if(is_hover) {
ctx.strokeStyle = INTERFACE.Color.HintHover;
}
ctx.beginPath();
draw.hex();
ctx.stroke();
// Draw tile content
if(piece !== null) {
// Draw border hints
@ -392,22 +392,22 @@ const INTERFACE = {
ctx.save();
ctx.translate(gui_x, gui_y);
// Draw border
if(is_select || is_hover || INTERFACE_DATA.player == (GAME_DATA.turn & 1) || (INTERFACE_DATA.player == 2 && player_identity == (GAME_DATA.turn & 1))) {
if(is_hover) { ctx.fillStyle = INTERFACE.Color.HintHover; }
else { ctx.fillStyle = player_color; }
ctx.beginPath();
draw.hex();
ctx.fill();
}
// Draw background if indicator is present.
if(is_select) { ctx.fillStyle = INTERFACE.Color.HintSelect; }
else { ctx.fillStyle = INTERFACE.Color.TileDark; }
ctx.beginPath();
draw.hex();
draw.hex(0.94);
ctx.fill();
// Draw border
if(is_select || is_hover || INTERFACE_DATA.player == (GAME_DATA.turn & 1) || (INTERFACE_DATA.player == 2 && player_identity == (GAME_DATA.turn & 1))) {
if(is_hover) { ctx.strokeStyle = INTERFACE.Color.HintHover; }
else { ctx.strokeStyle = player_color; }
ctx.beginPath();
draw.hex();
ctx.stroke();
}
// Draw image
ctx.drawImage(GAME_ASSET.Image.Piece[i][+(player_identity == 1)], -icon_radius * 0.55, -icon_radius * 0.8, icon_radius * 1.6, icon_radius * 1.6);
@ -431,22 +431,22 @@ const INTERFACE = {
ctx.save();
ctx.translate(gui_x, gui_y);
// Draw border
if(is_select || is_hover || (INTERFACE_DATA.player == 2 && player_identity != (GAME_DATA.turn & 1))) {
if(is_hover) { ctx.fillStyle = INTERFACE.Color.HintHover; }
else { ctx.fillStyle = opponent_color; }
ctx.beginPath();
draw.hex();
ctx.fill();
}
// Draw background if indicator is present.
if(is_select) { ctx.fillStyle = INTERFACE.Color.HintSelect; }
else { ctx.fillStyle = INTERFACE.Color.TileDark; }
ctx.beginPath();
draw.hex();
draw.hex(0.94);
ctx.fill();
// Draw border
if(is_select || is_hover || (INTERFACE_DATA.player == 2 && player_identity != (GAME_DATA.turn & 1))) {
if(is_hover) { ctx.strokeStyle = INTERFACE.Color.HintHover; }
else { ctx.strokeStyle = opponent_color; }
ctx.beginPath();
draw.hex();
ctx.stroke();
}
// Draw image
ctx.drawImage(GAME_ASSET.Image.Piece[i][+(player_identity != 1)], -icon_radius * 0.55, -icon_radius * 0.8, icon_radius * 1.6, icon_radius * 1.6);
@ -548,10 +548,11 @@ const INTERFACE = {
this.scale = scale;
}
hex() {
this.ctx.moveTo(INTERFACE.HexVertex[5].x * this.scale, INTERFACE.HexVertex[5].y * this.scale);
hex(scale=1) {
scale *= this.scale;
this.ctx.moveTo(INTERFACE.HexVertex[5].x * scale, INTERFACE.HexVertex[5].y * scale);
for(let i = 0; i < INTERFACE.HexVertex.length; ++i) {
this.ctx.lineTo(INTERFACE.HexVertex[i].x * this.scale, INTERFACE.HexVertex[i].y * this.scale);
this.ctx.lineTo(INTERFACE.HexVertex[i].x * scale, INTERFACE.HexVertex[i].y * scale);
}
}
@ -564,6 +565,10 @@ const INTERFACE = {
for(let mask = BITWISE.lsb(moves); moves > 0; mask = BITWISE.lsb(moves)) {
let move = BITWISE.ffs(mask);
if(move >= 12) {
move = Math.floor((move - 12) / 2) + 6;
}
let nmove = move % 12;
this.ctx.strokeStyle = (piece.player == GAME.Const.Player.Dawn)? INTERFACE.Color.Dawn : INTERFACE.Color.Dusk;
@ -697,8 +702,10 @@ const INTERFACE = {
},
uninit() {
MAIN.removeChild(INTERFACE_DATA.canvas);
INTERFACE_DATA = null;
if(INTERFACE_DATA !== null) {
MAIN.removeChild(INTERFACE_DATA.canvas);
INTERFACE_DATA = null;
}
},
message(code, data) {