From af04cbe3592656cf6981232550a460f1b10e2560 Mon Sep 17 00:00:00 2001 From: Matthias Schiffer Date: Wed, 31 Oct 2018 14:24:38 +0100 Subject: view: refactor generic parts of MapView into a TileView --- src/view/MapView.ts | 80 +++++++++++++++-------------------------------------- 1 file changed, 22 insertions(+), 58 deletions(-) (limited to 'src/view/MapView.ts') diff --git a/src/view/MapView.ts b/src/view/MapView.ts index 1061196..a5af8f7 100644 --- a/src/view/MapView.ts +++ b/src/view/MapView.ts @@ -1,74 +1,38 @@ import MapState from '../model/state/MapState'; -import {TileMap} from './MapLoader'; +import { TileMap } from './MapLoader'; import Renderer from './renderer/Renderer'; +import { TileView, TileViewBuilder } from './tile'; export default class MapView { - private readonly vertexBuffer: WebGLBuffer; - private readonly textureBuffer: WebGLBuffer; + private static addTile(builder: TileViewBuilder, tileMap: TileMap, x: number, y: number, tile: string) { + if (tile === ' ') + return; + + const tilePos = tileMap.tiles.get(tile); + if (!tilePos) + throw new Error('invalid tile specifier in map data'); + + builder.addTile([x, y, x + 1, y + 1], tilePos); + } + + private readonly tileView: TileView; constructor( - private readonly r: Renderer, - private readonly map: MapState, - private readonly tileMap: TileMap, + r: Renderer, + map: MapState, + tileMap: TileMap, ) { - const vertexData: number[] = []; - const textureData: number[] = []; + const builder = new TileViewBuilder(r, tileMap.texture); for (let x = 0; x < map.data.width; x++) for (let y = 0; y < map.data.height; y++) for (const layer of map.data.layers) - this.addTile(vertexData, textureData, x, y, layer[y][x]); - - const gl = r.getContext(); + MapView.addTile(builder, tileMap, x, y, layer[y][x]); - this.vertexBuffer = r.createBuffer(); - gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertexData), gl.STATIC_DRAW); - - this.textureBuffer = r.createBuffer(); - gl.bindBuffer(gl.ARRAY_BUFFER, this.textureBuffer); - gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureData), gl.STATIC_DRAW); + this.tileView = builder.build(); } - public draw(): void { - const gl = this.r.getContext(); - - gl.clear(gl.COLOR_BUFFER_BIT); - - gl.activeTexture(gl.TEXTURE0); - gl.bindTexture(gl.TEXTURE_2D, this.tileMap.texture); - gl.uniform1i(this.r.getSamplerLoc(), 0); - - gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer); - gl.vertexAttribPointer(this.r.getVertexPosLoc(), 2, gl.FLOAT, false, 0, 0); - - 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.data.width * this.map.data.height); - } - - private pushTile(buf: number[], coords: [number, number, number, number]) { - const [x1, y1, x2, y2] = coords; - - buf.push(x1); buf.push(y1); - buf.push(x2); buf.push(y1); - buf.push(x1); buf.push(y2); - - buf.push(x1); buf.push(y2); - buf.push(x2); buf.push(y1); - buf.push(x2); buf.push(y2); - } - - private addTile(vertexData: number[], textureData: number[], x: number, y: number, tile: string) { - if (tile === ' ') - return; - - const tilePos = this.tileMap.tiles.get(tile); - if (!tilePos) - throw new Error('invalid tile specifier in map data'); - - this.pushTile(vertexData, [x, y, x + 1, y + 1]); - this.pushTile(textureData, tilePos); + public render(): void { + this.tileView.render(); } } -- cgit v1.2.3