Add resolution scaling to canvas.
This commit is contained in:
parent
86e92716be
commit
ca1d661e43
@ -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;
|
||||||
|
69
www/js/ui.js
69
www/js/ui.js
@ -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);
|
||||||
|
}
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user