leif/lexys-labyrinth
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Take inventory into account when auto-scaling the game

Browse Source
This commit is contained in:
Eevee (Evelyn Woods) 2020-09-16 19:46:39 -06:00
parent 063d9f9ef9
commit ede7dbf424
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
js/main.js
View File

@ -801,9 +801,10 @@ class Player extends PrimaryView {
// Auto-size the game canvas to fit the screen, if possible // Auto-size the game canvas to fit the screen, if possible
adjust_scale() { adjust_scale() {
// TODO make this optional // TODO make this optional
// The base size is the size of the canvas, i.e. the viewport size // The base size is the size of the canvas, i.e. the viewport size times the tile size --
// times the tile size // but note that horizontally we have 4 extra tiles for the inventory
let base_x = this.conductor.tileset.size_x * this.renderer.viewport_size_x; // TODO if there's ever a portrait view for phones, this will need adjusting
let base_x = this.conductor.tileset.size_x * (this.renderer.viewport_size_x + 4);
let base_y = this.conductor.tileset.size_y * this.renderer.viewport_size_y; let base_y = this.conductor.tileset.size_y * this.renderer.viewport_size_y;
// The main UI is centered in a flex item with auto margins, so the // The main UI is centered in a flex item with auto margins, so the
// extra space available is the size of those margins // extra space available is the size of those margins
@ -814,9 +815,9 @@ class Player extends PrimaryView {
} }
let extra_x = parseFloat(style['margin-left']) + parseFloat(style['margin-right']); let extra_x = parseFloat(style['margin-left']) + parseFloat(style['margin-right']);
let extra_y = parseFloat(style['margin-top']) + parseFloat(style['margin-bottom']); let extra_y = parseFloat(style['margin-top']) + parseFloat(style['margin-bottom']);
// The total available space, then, is the current size of the // The total available space, then, is the current size of the canvas (and inventory, when
// canvas plus the size of the margins // appropriate) plus the size of the margins
let total_x = extra_x + this.renderer.canvas.offsetWidth; let total_x = extra_x + this.renderer.canvas.offsetWidth + this.inventory_el.offsetWidth;
let total_y = extra_y + this.renderer.canvas.offsetHeight; let total_y = extra_y + this.renderer.canvas.offsetHeight;
let dpr = window.devicePixelRatio || 1.0; let dpr = window.devicePixelRatio || 1.0;
// Divide to find the biggest scale that still fits. But don't // Divide to find the biggest scale that still fits. But don't
@ -830,7 +831,6 @@ class Player extends PrimaryView {
// resolution and giving us nice, clean pixels. // resolution and giving us nice, clean pixels.
scale /= dpr; scale /= dpr;
// FIXME the above logic doesn't take into account the inventory, which is also affected by scale
this.scale = scale; this.scale = scale;
this.root.style.setProperty('--scale', scale); this.root.style.setProperty('--scale', scale);
} }