Add resolution scaling to canvas.

This commit is contained in:
yukirij 2024-10-13 21:48:24 -07:00
parent 86e92716be
commit ca1d661e43
2 changed files with 27 additions and 46 deletions

View File

@ -351,8 +351,8 @@ const INTERFACE = {
}, },
resize() { resize() {
let width = INTERFACE_DATA.canvas.width = INTERFACE_DATA.canvas.clientWidth; let width = INTERFACE_DATA.canvas.width = INTERFACE_DATA.canvas.clientWidth * (window.devicePixelRatio || 1);
let height = INTERFACE_DATA.canvas.height = INTERFACE_DATA.canvas.clientHeight; let height = INTERFACE_DATA.canvas.height = INTERFACE_DATA.canvas.clientHeight * (window.devicePixelRatio || 1);
INTERFACE_DATA.Render.margin.t = Math.floor(Math.min(width, height) / 96); INTERFACE_DATA.Render.margin.t = Math.floor(Math.min(width, height) / 96);
INTERFACE_DATA.Render.margin.l = 1.75 * INTERFACE_DATA.Render.margin.t; INTERFACE_DATA.Render.margin.l = 1.75 * INTERFACE_DATA.Render.margin.t;

View File

@ -238,28 +238,7 @@ const UI = {
let dusk = UI.text(record.dusk); let dusk = UI.text(record.dusk);
let moves = document.createElement("canvas"); let moves = document.createElement("canvas");
setTimeout((canvas, moves) => { setTimeout(draw_play_icons, 10, moves, record.moves);
canvas.width = canvas.clientWidth;
canvas.height = canvas.clientHeight;
let ctx = canvas.getContext("2d");
let size = canvas.height / 2;
for(let i = 0; i < moves.length; ++i) {
let piece = moves[i] & 0x7;
let promoted = (moves[i] & 0x8) >> 3;
let player = (moves[i] & 0x10) >> 4;
let color = null;
if(player == 0) { color = INTERFACE.Color.Dawn; } else { color = INTERFACE.Color.Dusk; }
let piece_name = GAME.Const.Piece[piece].name;
if(promoted) {
GAME_ASSET.Image.Promote.draw(ctx, canvas.height, [size * (1 + (2 * i)), size], INTERFACE.Color.Promote);
}
GAME_ASSET.Image[piece_name].draw(ctx, canvas.height, [size * (1 + (2 * i)), size], color);
}
}, 10, moves, record.moves);
rows.push([ rows.push([
dawn, dawn,
@ -394,28 +373,7 @@ const UI = {
} }
let moves = document.createElement("canvas"); let moves = document.createElement("canvas");
setTimeout((canvas, moves) => { setTimeout(draw_play_icons, 10, moves, record.moves);
canvas.width = canvas.clientWidth;
canvas.height = canvas.clientHeight;
let ctx = canvas.getContext("2d");
let size = canvas.height / 2;
for(let i = 0; i < moves.length; ++i) {
let piece = moves[i] & 0x7;
let promoted = (moves[i] & 0x8) >> 3;
let player = (moves[i] & 0x10) >> 4;
let color = null;
if(player == 0) { color = INTERFACE.Color.Dawn; } else { color = INTERFACE.Color.Dusk; }
let piece_name = GAME.Const.Piece[piece].name;
if(promoted) {
GAME_ASSET.Image.Promote.draw(ctx, canvas.height, [size * (1 + (2 * i)), size], INTERFACE.Color.Promote);
}
GAME_ASSET.Image[piece_name].draw(ctx, canvas.height, [size * (1 + (2 * i)), size], color);
}
}, 10, moves, record.moves);
rows.push([ rows.push([
dawn, dawn,
@ -494,4 +452,27 @@ const UI = {
b_resume.innerText = text; b_resume.innerText = text;
} }
}, },
draw_play_icons(canvas, moves) {
canvas.width = canvas.clientWidth;
canvas.height = canvas.clientHeight;
let ctx = canvas.getContext("2d");
let size = canvas.height / 2;
for(let i = 0; i < moves.length; ++i) {
let piece = moves[i] & 0x7;
let promoted = (moves[i] & 0x8) >> 3;
let player = (moves[i] & 0x10) >> 4;
let color = null;
if(player == 0) { color = INTERFACE.Color.Dawn; } else { color = INTERFACE.Color.Dusk; }
let piece_name = GAME.Const.Piece[piece].name;
if(promoted) {
GAME_ASSET.Image.Promote.draw(ctx, canvas.height, [size * (1 + (2 * i)), size], INTERFACE.Color.Promote);
}
GAME_ASSET.Image[piece_name].draw(ctx, canvas.height, [size * (1 + (2 * i)), size], color);
}
},
}; };