From bc6d79b088154e2fca56b9c18ee5ea0bf17875f8 Mon Sep 17 00:00:00 2001 From: Matthias Schiffer Date: Fri, 26 Oct 2018 21:59:46 +0200 Subject: model: add mutable MapState (empty for now) --- src/index.ts | 8 +++++--- src/model/MapData.ts | 25 ------------------------- src/model/data/MapData.ts | 25 +++++++++++++++++++++++++ src/model/state/MapState.ts | 6 ++++++ src/view/MapLoader.ts | 8 ++++---- src/view/MapView.ts | 18 +++++++++--------- 6 files changed, 49 insertions(+), 41 deletions(-) delete mode 100644 src/model/MapData.ts create mode 100644 src/model/data/MapData.ts create mode 100644 src/model/state/MapState.ts diff --git a/src/index.ts b/src/index.ts index 5d70727..033e4ea 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,5 @@ -import MapData from './model/MapData'; +import MapData from './model/data/MapData'; +import MapState from './model/state/MapState'; import {loadMap} from './view/MapLoader'; import Renderer from './view/renderer/Renderer'; @@ -13,9 +14,10 @@ window.onload = () => { const xhr = new XMLHttpRequest(); xhr.addEventListener('load', async function() { - const mapDef = new MapData(JSON.parse(this.responseText)); + const mapData = new MapData(JSON.parse(this.responseText)); + const map = new MapState(mapData); - const mapView = await loadMap(renderer, mapDef); + const mapView = await loadMap(renderer, map); mapView.draw(); }); diff --git a/src/model/MapData.ts b/src/model/MapData.ts deleted file mode 100644 index c8db35c..0000000 --- a/src/model/MapData.ts +++ /dev/null @@ -1,25 +0,0 @@ -import {mapFromObject} from '../util'; - -interface Input { - readonly tiles: {[key: string]: string}; - readonly collision: string[]; - readonly layers: string[][][]; -} - -export default class MapData { - public readonly tiles: Map; - public readonly collision: string[]; - public readonly layers: string[][][]; - - public readonly width: number; - public readonly height: number; - - constructor(data: Input) { - this.tiles = mapFromObject(data.tiles); - this.collision = data.collision; - this.layers = data.layers; - - this.height = this.collision.length; - this.width = this.collision[0].length; - } -} diff --git a/src/model/data/MapData.ts b/src/model/data/MapData.ts new file mode 100644 index 0000000..0f14f50 --- /dev/null +++ b/src/model/data/MapData.ts @@ -0,0 +1,25 @@ +import {mapFromObject} from '../../util'; + +interface Input { + readonly tiles: {[key: string]: string}; + readonly collision: string[]; + readonly layers: string[][][]; +} + +export default class MapData { + public readonly tiles: Map; + public readonly collision: string[]; + public readonly layers: string[][][]; + + public readonly width: number; + public readonly height: number; + + constructor(data: Input) { + this.tiles = mapFromObject(data.tiles); + this.collision = data.collision; + this.layers = data.layers; + + this.height = this.collision.length; + this.width = this.collision[0].length; + } +} diff --git a/src/model/state/MapState.ts b/src/model/state/MapState.ts new file mode 100644 index 0000000..2931dfb --- /dev/null +++ b/src/model/state/MapState.ts @@ -0,0 +1,6 @@ +import MapData from '../data/MapData'; + +export default class MapState { + public constructor(public readonly data: MapData) { + } +} diff --git a/src/view/MapLoader.ts b/src/view/MapLoader.ts index 31e6484..290f095 100644 --- a/src/view/MapLoader.ts +++ b/src/view/MapLoader.ts @@ -1,6 +1,6 @@ import {mapValues, mapValuesAsync, nextPowerOf2} from '../util'; -import MapData from '../model/MapData'; +import MapState from '../model/state/MapState'; import MapView from './MapView'; import Renderer from './renderer/Renderer'; @@ -54,9 +54,9 @@ function mkTileTexture(gl: WebGLRenderingContext, tiles: Map { - const tiles = await loadTiles(mapData.tiles); +export async function loadMap(r: Renderer, map: MapState): Promise { + const tiles = await loadTiles(map.data.tiles); const [tileTexture, tileMap] = mkTileTexture(r.getContext(), tiles); - return new MapView(r, mapData, tileTexture, tileMap); + return new MapView(r, map, tileTexture, tileMap); } diff --git a/src/view/MapView.ts b/src/view/MapView.ts index edcbfbb..92784b7 100644 --- a/src/view/MapView.ts +++ b/src/view/MapView.ts @@ -1,6 +1,6 @@ import {nextPowerOf2} from '../util'; -import MapData from '../model/MapData'; +import MapState from '../model/state/MapState'; import Renderer from './renderer/Renderer'; export default class MapView { @@ -13,7 +13,7 @@ export default class MapView { constructor( private readonly r: Renderer, - private readonly map: MapData, + private readonly map: MapState, private readonly tileTexture: WebGLTexture, private readonly tileMap: Map, ) { @@ -22,9 +22,9 @@ export default class MapView { const tileCount = nextPowerOf2(tileMap.size); - for (let x = 0; x < map.width; x++) - for (let y = 0; y < map.height; y++) - this.addTile(vertexData, textureData, x, y, map.layers[0][y][x], tileCount); + for (let x = 0; x < map.data.width; x++) + for (let y = 0; y < map.data.height; y++) + this.addTile(vertexData, textureData, x, y, map.data.layers[0][y][x], tileCount); const gl = r.getContext(); @@ -52,7 +52,7 @@ export default class MapView { gl.bindBuffer(gl.ARRAY_BUFFER, this.textureBuffer); gl.vertexAttribPointer(this.r.getTextureCoordLoc(), 2, gl.FLOAT, false, 0, 0); - gl.drawArrays(gl.TRIANGLES, 0, 6 * this.map.width * this.map.height); + gl.drawArrays(gl.TRIANGLES, 0, 6 * this.map.data.width * this.map.data.height); } private addTile(vertexData: number[], textureData: number[], x: number, y: number, tile: string, tileCount: number) { @@ -68,11 +68,11 @@ export default class MapView { vertexData.push(x + 1); vertexData.push(y); vertexData.push(x + 1); vertexData.push(y + 1); - textureData.push((tileID) / tileCount); textureData.push(0); + textureData.push(tileID / tileCount); textureData.push(0); textureData.push((tileID + 1) / tileCount); textureData.push(0); - textureData.push((tileID) / tileCount); textureData.push(1); + textureData.push(tileID / tileCount); textureData.push(1); - textureData.push((tileID) / tileCount); textureData.push(1); + textureData.push(tileID / tileCount); textureData.push(1); textureData.push((tileID + 1) / tileCount); textureData.push(0); textureData.push((tileID + 1) / tileCount); textureData.push(1); } -- cgit v1.2.3