ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix bug and make scaling look tight

Browse Source
This commit is contained in:
ntr
2019-02-22 14:34:55 +11:00
parent caf827e42b
commit 96f31346c5
3 changed files with 30 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/scenes/constants.js
+22 -22
View File
@@ -1,45 +1,45 @@
// POSITIONING FNS
// floors prevent subpixel rendering which looks trash
const CANVAS_WIDTH = 1600;
const CANVAS_HEIGHT = 1000;
const CANVAS_WIDTH = () => Math.floor(window.innerHeight * 1.6);
const CANVAS_HEIGHT = () => Math.floor(window.innerHeight);
const headerWidth = () => CANVAS_WIDTH;
const headerHeight = () => Math.floor(CANVAS_HEIGHT * 0.05);
const headerWidth = () => CANVAS_WIDTH();
const headerHeight = () => Math.floor(CANVAS_HEIGHT() * 0.05);
const menuCrypListWidth = () => Math.floor(CANVAS_WIDTH * 0.3);
const menuCrypListHeight = () => Math.floor(CANVAS_HEIGHT * 0.5);
const menuCrypListWidth = () => Math.floor(CANVAS_WIDTH() * 0.3);
const menuCrypListHeight = () => Math.floor(CANVAS_HEIGHT() * 0.5);
const menuCrypListX = () => 0;
const menuCrypListY = () => headerHeight();
const itemListWidth = () => Math.floor(CANVAS_WIDTH * 0.5);
const itemListHeight = () => Math.floor(CANVAS_HEIGHT * 0.5);
const itemListWidth = () => Math.floor(CANVAS_WIDTH() * 0.5);
const itemListHeight = () => Math.floor(CANVAS_HEIGHT() * 0.5);
const itemListX = () => 0;
const itemListY = () => Math.floor(CANVAS_HEIGHT * 0.5);
const itemListY = () => Math.floor(CANVAS_HEIGHT() * 0.5);
const itemBlockWidth = () => Math.floor(itemListWidth() * 0.075);
const itemBlockHeight = () => Math.floor(itemListHeight() * 0.12);
const menuNavigationWidth = () => Math.floor(CANVAS_WIDTH * 0.5);
const menuNavigationHeight = () => Math.floor(CANVAS_HEIGHT * 0.3);
const menuNavigationX = () => Math.floor(CANVAS_WIDTH * 0.5);
const menuNavigationY = () => Math.floor(CANVAS_HEIGHT * 0.7);
const menuNavigationWidth = () => Math.floor(CANVAS_WIDTH() * 0.5);
const menuNavigationHeight = () => Math.floor(CANVAS_HEIGHT() * 0.3);
const menuNavigationX = () => Math.floor(CANVAS_WIDTH() * 0.5);
const menuNavigationY = () => Math.floor(CANVAS_HEIGHT() * 0.7);
const menuMainWidth = () => Math.floor(CANVAS_WIDTH * 0.7);
const menuMainHeight = () => Math.floor(CANVAS_HEIGHT * 0.5);
const menuMainX = () => Math.floor(CANVAS_WIDTH * 0.3);
const menuMainWidth = () => Math.floor(CANVAS_WIDTH() * 0.7);
const menuMainHeight = () => Math.floor(CANVAS_HEIGHT() * 0.5);
const menuMainX = () => Math.floor(CANVAS_WIDTH() * 0.3);
const menuMainY = () => headerHeight();
const combatWidth = () => CANVAS_WIDTH;
const combatHeight = () => CANVAS_HEIGHT - headerHeight();
const combatWidth = () => CANVAS_WIDTH();
const combatHeight = () => CANVAS_HEIGHT() - headerHeight();
const combatY = () => headerHeight();
const combatX = () => 0;
const combatCrypMargin = () => Math.floor((CANVAS_HEIGHT - headerHeight()) / 4.5);
const combatTextMargin = () => Math.floor((CANVAS_HEIGHT - headerHeight()) / 35);
const combatCrypMargin = () => Math.floor((CANVAS_HEIGHT() - headerHeight()) / 4.5);
const combatTextMargin = () => Math.floor((CANVAS_HEIGHT() - headerHeight()) / 35);
const statsWidth = () => Math.floor(CANVAS_WIDTH - menuCrypListWidth());
const statsHeight = () => CANVAS_HEIGHT - headerHeight();
const statsWidth = () => Math.floor(CANVAS_WIDTH() - menuCrypListWidth());
const statsHeight = () => CANVAS_HEIGHT() - headerHeight();
const statsY = () => headerHeight();
const statsX = () => menuCrypListWidth();
const statsKnownX = () => Math.floor(statsX() + statsWidth() / 4);
client/src/scenes/cryps.js
+6 -5
View File
@@ -11,12 +11,12 @@ function renderCryps() {
// backgroundColor: '#181818',
resolution: window.devicePixelRatio,
scale: {
mode: Phaser.Scale.FIT,
width: 1600,
height: 1000,
mode: Phaser.Scale.RESIZE,
width: Math.floor(window.innerHeight * 1.6),
height: Math.floor(window.innerHeight),
max: {
width: window.innerHeight * 1.6,
height: window.innerHeight,
width: Math.floor(window.innerHeight * 1.6),
height: Math.floor(window.innerHeight),
},
},
@@ -61,6 +61,7 @@ function renderCryps() {
window.addEventListener('resize', () => {
game.scale.displaySize.maxWidth = window.innerHeight * 1.6;
game.scale.displaySize.maxHeight = window.innerHeight;
// game.scale.resize();
});