mnml/client/src/scenes/cryps.js
2018-12-28 15:41:47 +10:00

74 lines
2.0 KiB
JavaScript

const Phaser = require('phaser');
const Header = require('./header');
const Menu = require('./menu');
const Combat = require('./combat');
function renderCryps() {
const config = {
type: Phaser.AUTO,
backgroundColor: '#181818',
resolution: window.devicePixelRatio,
// antialias: true,
width: 1600,
height: 1000,
physics: {
default: 'arcade',
arcade: {
debug: false,
gravity: { y: 0 },
},
},
scene: [
Header,
],
};
const game = new Phaser.Game(config);
function changeData(parent, key, data) {
if (key === 'menu') {
if (data) return game.scene.add('Menu', Menu, true);
}
if (key === 'game') {
if (!data || game.registry.get('inGame')) return false;
return game.scene.add('Combat', Combat, true);
}
return true;
}
game.registry.events.on('changedata', changeData);
game.registry.events.on('setdata', changeData);
function resize() {
const canvas = document.querySelector('canvas');
if (!canvas) return setTimeout(resize, 50);
const windowWidth = window.innerWidth;
const windowHeight = window.innerHeight;
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`;
} else {
canvas.style.width = `${(windowHeight * gameRatio)}px`;
canvas.style.height = `${windowHeight}px`;
}
return true;
}
window.addEventListener('mouseup', () => game.registry.set('pan', false));
window.addEventListener('mousedown', () => game.registry.set('pan', true));
window.addEventListener('resize', resize, true);
resize();
return game;
}
module.exports = renderCryps;