From 342af3b087f922c65f25a40b650bb104aa9b9362 Mon Sep 17 00:00:00 2001 From: Matthias Schiffer Date: Thu, 7 Jan 2016 19:21:52 +0100 Subject: MapView: scale view --- src/view/MapView.ts | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/src/view/MapView.ts b/src/view/MapView.ts index 31305d7..a12d9d4 100644 --- a/src/view/MapView.ts +++ b/src/view/MapView.ts @@ -64,6 +64,7 @@ export default class MapView { private canvas: HTMLCanvasElement; private ctx: CanvasRenderingContext2D; + private scale: number; private tiles: {[key: string]: HTMLImageElement}; private entitySprites: {[key: string]: HTMLImageElement}; @@ -106,6 +107,9 @@ export default class MapView { this.canvas.width = w; this.canvas.height = h; + var pixels = Math.max(w/20, h/15.0); + this.scale = Math.ceil(pixels / tileSize); + this.redraw() } @@ -113,7 +117,7 @@ export default class MapView { if (!tile) return; - this.ctx.drawImage(tile, x, y); + this.ctx.drawImage(tile, x*this.scale, y*this.scale, tileSize*this.scale, tileSize*this.scale); } private drawEntity(e: EntityPosition, time: number): boolean { @@ -127,8 +131,8 @@ export default class MapView { sprite, tiles(e.direction), 0, tileSize, tileSize, - tiles(p.x), tiles(p.y), - tileSize, tileSize + tiles(p.x)*this.scale, tiles(p.y)*this.scale, + tileSize*this.scale, tileSize*this.scale ); return !!e.transition; @@ -141,7 +145,7 @@ export default class MapView { var h = this.canvas.height; this.ctx.translate(Math.round(w/2), Math.round(h/2)); - this.ctx.translate(-tiles(origin.x + 0.5), -tiles(origin.y + 0.5)); + this.ctx.translate(-tiles(origin.x + 0.5)*this.scale, -tiles(origin.y + 0.5)*this.scale); } private draw(time: number) { @@ -158,6 +162,11 @@ export default class MapView { this.setOrigin(time); + (this.ctx).mozImageSmoothingEnabled = false; + (this.ctx).webkitImageSmoothingEnabled = false; + (this.ctx).msImageSmoothingEnabled = false; + (this.ctx).imageSmoothingEnabled = false; + this.map.layers.forEach((layer) => { let y = 0; -- cgit v1.2.3