/ src / App.ts
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  }