This commit is contained in:
ntr 2018-12-14 12:49:38 +11:00
parent 35d4f11881
commit f770e2fbf8
2 changed files with 20 additions and 52 deletions

View File

@ -1,60 +1,27 @@
// POSITIONING FNS
// floors prevent subpixel rendering which looks trash
// const menuWidth = () => window.innerWidth;
// const menuHeight = () => Math.floor(window.innerHeight * 0.05);
const menuWidth = () => window.innerWidth;
const menuHeight = () => Math.floor(window.innerHeight * 0.05);
// const combatWidth = () => window.innerWidth;
// const combatHeight = () => window.innerHeight - menuHeight();
// const combatY = () => menuHeight();
// const combatX = () => 0;
// const crypListWidth = () => Math.floor(window.innerWidth * 0.2);
// const crypListHeight = () => window.innerHeight - menuHeight();
// const cryplistRowHeight = cryps => crypListHeight() / cryps.length;
// const crypListY = () => menuHeight();
// const crypListX = () => 0;
// const gameListWidth = () => Math.floor(window.innerWidth * 0.2);
// const gameListHeight = () => Math.floor(window.innerHeight / 10);
// const gameListX = () => crypListWidth();
// const gameListY = i => menuHeight() + (gameListHeight() * i);
// const gameListRowY = i => menuHeight() + (gameListHeight() * (i + 2));
// const statsWidth = () => Math.floor(window.innerWidth - crypListWidth() - gameListWidth());
// const statsHeight = () => window.innerHeight - menuHeight();
// const statsY = () => menuHeight();
// const statsX = () => crypListWidth() + gameListWidth();
// const statsKnownX = () => Math.floor(statsX() + statsWidth() / 4);
// const statsLearnableX = () => Math.floor(statsX() + statsWidth() / 2);
// const statsTextMargin = () => 24;
// const logWidth = () => combatWidth();
// const logHeight = () => combatHeight() * 0.3;
// const logY = () => menuHeight() + (combatHeight() * 0.7);
// const logX = () => combatWidth() * 0.6;
const menuWidth = () => 1600;
const menuHeight = () => 25;
const combatWidth = () => 1600;
const combatHeight = () => 1000 - menuHeight();
const combatWidth = () => window.innerWidth;
const combatHeight = () => window.innerHeight - menuHeight();
const combatY = () => menuHeight();
const combatX = () => 0;
const crypListWidth = () => Math.floor(1600 * 0.2);
const crypListHeight = () => 1000 - menuHeight();
const crypListWidth = () => Math.floor(window.innerWidth * 0.2);
const crypListHeight = () => window.innerHeight - menuHeight();
const cryplistRowHeight = cryps => crypListHeight() / cryps.length;
const crypListY = () => menuHeight();
const crypListX = () => 0;
const gameListWidth = () => Math.floor(1600 * 0.2);
const gameListHeight = () => Math.floor(1000 / 10);
const gameListWidth = () => Math.floor(window.innerWidth * 0.2);
const gameListHeight = () => Math.floor(window.innerHeight / 10);
const gameListX = () => crypListWidth();
const gameListY = i => menuHeight() + (gameListHeight() * i);
const gameListRowY = i => menuHeight() + (gameListHeight() * (i + 2));
const statsWidth = () => Math.floor(1600 - crypListWidth() - gameListWidth());
const statsHeight = () => 1000 - menuHeight();
const statsWidth = () => Math.floor(window.innerWidth - crypListWidth() - gameListWidth());
const statsHeight = () => window.innerHeight - menuHeight();
const statsY = () => menuHeight();
const statsX = () => crypListWidth() + gameListWidth();
const statsKnownX = () => Math.floor(statsX() + statsWidth() / 4);
@ -66,7 +33,6 @@ const logHeight = () => combatHeight() * 0.3;
const logY = () => menuHeight() + (combatHeight() * 0.7);
const logX = () => combatWidth() * 0.6;
module.exports = {
TEXT: {
NORMAL: { fontFamily: 'monospace', fontSize: 16, color: '#ffffff' },

View File

@ -8,9 +8,9 @@ function renderCryps() {
type: Phaser.AUTO,
backgroundColor: '#181818',
resolution: window.devicePixelRatio,
antialias: true,
width: 1600,
height: 1000,
// antialias: true,
width: window.innerWidth,
height: window.innerHeight,
physics: {
default: 'arcade',
arcade: {
@ -28,7 +28,7 @@ function renderCryps() {
game.scene.sleep('Combat');
function resize() {
const canvas = document.querySelector("canvas");
const canvas = document.querySelector('canvas');
if (!canvas) return false;
@ -37,12 +37,14 @@ function renderCryps() {
const windowRatio = windowWidth / windowHeight;
const gameRatio = game.config.width / game.config.height;
if (windowRatio < gameRatio) {
canvas.style.width = windowWidth + "px";
canvas.style.height = (windowWidth / gameRatio) + "px";
canvas.style.width = `${windowWidth}px`;
canvas.style.height = `${(windowWidth / gameRatio)}px`;
} else {
canvas.style.width = (windowHeight * gameRatio) + "px";
canvas.style.height = windowHeight + "px";
canvas.style.width = `${(windowHeight * gameRatio)}px`;
canvas.style.height = `${windowHeight}px`;
}
return true;
}
window.addEventListener('mouseup', () => game.registry.set('pan', false));