App.ts
1 import m from 'mithril' 2 3 import { computeAppSize } from './Game' 4 import { ImageManager } from './ImageManager' 5 import { ChooseLevelScreen } from './screen/ChooseLevelScreen' 6 import { EndGameScreen } from './screen/EndGameScreen' 7 import { GameScreen } from './screen/GameScreen' 8 import { HelpScreen } from './screen/HelpScreen' 9 import { HomeScreen } from './screen/HomeScreen' 10 import { OptionsScreen } from './screen/OptionsScreen' 11 import { CreditsScreen } from './screen/CreditsScreen' 12 13 import imgBackground from './assets/img/background.png' 14 import imgPlayer from './assets/img/player.png' 15 import imgTiles from './assets/img/tiles.png' 16 import imgTilesHighContrast from './assets/img/tiles-high-contrast.png' 17 18 export class App { 19 private readonly app: HTMLElement 20 21 public constructor() { 22 const imagesLoader = ImageManager.load({ 23 'background': imgBackground, 24 'player': imgPlayer, 25 'tiles': localStorage.getItem('high-contrast') == '1' ? imgTilesHighContrast : imgTiles, 26 }) 27 28 this.app = document.getElementById('app') 29 30 Promise.all(imagesLoader).then(() => { 31 this.init() 32 }) 33 } 34 35 public init(): void { 36 window.addEventListener('resize', App.resize) 37 38 m.route(this.app, '/', { 39 '/': HomeScreen, 40 '/options': OptionsScreen, 41 '/help': HelpScreen, 42 '/credits': CreditsScreen, 43 '/choose-level': ChooseLevelScreen, 44 '/level/:level': GameScreen, 45 '/end-game': EndGameScreen, 46 }) 47 48 App.resize() 49 } 50 51 public static resize(_e: UIEvent | null = null): void { 52 const app = document.getElementById('app') 53 const game = document.getElementById('game') 54 55 const appSize = computeAppSize(game ? true : false) 56 const height = window.innerHeight 57 58 app.style.width = `${appSize.size.width}px` 59 app.style.height = `${height}px` 60 } 61 }