From 4fa246628bd9e5911ae998162f0bdc724cc739d2 Mon Sep 17 00:00:00 2001 From: Matthias Schiffer Date: Wed, 6 Jan 2016 08:52:06 +0100 Subject: Add entity rendering --- src/app.coffee | 11 ++++++----- src/control/MapContext.coffee | 29 +++++++++++++++++++++++++++++ src/model/Direction.coffee | 13 +++++++++++++ src/model/Entity.coffee | 8 ++++++++ src/model/EntityPosition.coffee | 8 ++++++++ src/model/Map.coffee | 8 -------- src/model/MapData.coffee | 9 +++++++++ src/model/Position.coffee | 10 ++++++++++ src/util.coffee | 15 ++++++++------- src/view/MapView.coffee | 40 +++++++++++++++++++++++++++++++++------- 10 files changed, 124 insertions(+), 27 deletions(-) create mode 100644 src/control/MapContext.coffee create mode 100644 src/model/Direction.coffee create mode 100644 src/model/Entity.coffee create mode 100644 src/model/EntityPosition.coffee delete mode 100644 src/model/Map.coffee create mode 100644 src/model/MapData.coffee create mode 100644 src/model/Position.coffee diff --git a/src/app.coffee b/src/app.coffee index 6c64c5a..ca3ddf8 100644 --- a/src/app.coffee +++ b/src/app.coffee @@ -2,19 +2,20 @@ require './style.css' +window._ = require 'lodash' -Map = require './model/Map' -MapView = require './view/MapView' +MapData = require './model/MapData' +MapContext = require './control/MapContext' -mapView = null +mapContext = null window.onload = -> xhr = new XMLHttpRequest() xhr.onload = -> - mapDef = new Map(JSON.parse this.responseText) - mapView = new MapView mapDef + mapDef = new MapData(JSON.parse this.responseText) + mapContext = new MapContext mapDef xhr.open 'GET', 'resources/map/test.json', true xhr.send() diff --git a/src/control/MapContext.coffee b/src/control/MapContext.coffee new file mode 100644 index 0000000..df6efec --- /dev/null +++ b/src/control/MapContext.coffee @@ -0,0 +1,29 @@ +'use strict' + + +Direction = require '../model/Direction' +Entity = require '../model/Entity' +EntityPosition = require '../model/EntityPosition' +Position = require '../model/Position' + +MapView = require '../view/MapView' + + +class MapContext + constructor: (@map) -> + @entities = {} + + @playerEntity = new EntityPosition( + new Entity('square'), + new Position(8, 8), + Direction.EAST) + + @addEntity(@playerEntity) + + @mavView = new MapView @map, @entities + + addEntity: (entity) => + @entities[entity.position.asString()] = entity + + +module.exports = MapContext diff --git a/src/model/Direction.coffee b/src/model/Direction.coffee new file mode 100644 index 0000000..5c49c80 --- /dev/null +++ b/src/model/Direction.coffee @@ -0,0 +1,13 @@ +'use strict' + + +Direction = + NORTH: 0 + EAST: 1 + SOUTH: 2 + WEST: 3 + + reverse: (d) -> (d+2)%4 + + +module.exports = Direction diff --git a/src/model/Entity.coffee b/src/model/Entity.coffee new file mode 100644 index 0000000..70c81fa --- /dev/null +++ b/src/model/Entity.coffee @@ -0,0 +1,8 @@ +'use strict' + + +class Entity + constructor: (@name) -> + + +module.exports = Entity diff --git a/src/model/EntityPosition.coffee b/src/model/EntityPosition.coffee new file mode 100644 index 0000000..aaf9531 --- /dev/null +++ b/src/model/EntityPosition.coffee @@ -0,0 +1,8 @@ +'use strict' + + +class EntityPosition + constructor: (@entity, @position, @direction) -> + + +module.exports = EntityPosition diff --git a/src/model/Map.coffee b/src/model/Map.coffee deleted file mode 100644 index e97b1ed..0000000 --- a/src/model/Map.coffee +++ /dev/null @@ -1,8 +0,0 @@ -'use strict' - -class Map - constructor: (data) -> - {@tiles, @collition, @layers} = data - - -module.exports = Map diff --git a/src/model/MapData.coffee b/src/model/MapData.coffee new file mode 100644 index 0000000..39b2140 --- /dev/null +++ b/src/model/MapData.coffee @@ -0,0 +1,9 @@ +'use strict' + + +class MapData + constructor: (data) -> + {@tiles, @collition, @layers} = data + + +module.exports = MapData diff --git a/src/model/Position.coffee b/src/model/Position.coffee new file mode 100644 index 0000000..08bb999 --- /dev/null +++ b/src/model/Position.coffee @@ -0,0 +1,10 @@ +'use strict' + + +class Position + constructor: (@x, @y) -> + + asString: => "#{@x},#{@y}" + + +module.exports = Position diff --git a/src/util.coffee b/src/util.coffee index d2cea04..4e0cd76 100644 --- a/src/util.coffee +++ b/src/util.coffee @@ -1,12 +1,13 @@ 'use strict' -_ = require 'lodash' module.exports = mapPromises: (promises) -> - _.reduce promises, ((seq, v, k) -> - seq.then (acc) -> - v.then (r) -> - acc[k] = r - acc - ), Promise.resolve {} + p = [] + ret = {} + + for own k, v of promises + do (k, v) -> + p.push(v.then (r) -> ret[k] = r) + + Promise.all(p).then -> ret diff --git a/src/view/MapView.coffee b/src/view/MapView.coffee index cafc0aa..e051d48 100644 --- a/src/view/MapView.coffee +++ b/src/view/MapView.coffee @@ -1,6 +1,5 @@ 'use strict' -_ = require 'lodash' util = require '../util' @@ -19,12 +18,20 @@ loadImage = (url) -> loadImages = (imgs) -> util.mapPromises(_.mapValues imgs, loadImage) -loadTiles = (tileDef) -> - loadImages(_.mapValues tileDef, (t) -> "resources/sprite/tile/#{t.file}.png") +loadTiles = (tiles) -> + loadImages(_.mapValues tiles, (t) -> "resources/sprite/tile/#{t.file}.png") + +loadEntities = (entities) -> + p = {} + for e in entities + do (e) -> + p[e.entity.name] = loadImage "resources/sprite/entity/#{e.entity.name}.png" + + util.mapPromises p class MapView - constructor: (@map) -> + constructor: (@map, @entities) -> @redrawPending = false @canvas = document.createElement 'canvas' @@ -36,22 +43,38 @@ class MapView window.addEventListener 'resize', @setSize @setSize() - @ready = loadTiles(@map.tiles).then (tiles) => + tilesReady = loadTiles(@map.tiles).then (tiles) => @tiles = tiles + + entitiesReady = loadEntities(_.values @entities).then (entities) => + @entitySprites = entities + + tilesReady.then(entitiesReady).then => @redraw() return drawTile: (x, y, tile) => return unless tile - @ctx.drawImage(tile, x, y) + @ctx.drawImage tile, x, y + + drawEntity: (e) => + sprite = @entitySprites[e.entity.name] + return unless sprite + + @ctx.drawImage( + sprite, + e.direction*tileSize, 0, + tileSize, tileSize, + e.position.x*tileSize, e.position.y*tileSize, + tileSize, tileSize) draw: => @redrawPending = false @ctx.clearRect 0, 0, @canvas.width, @canvas.height - return unless @tiles + return unless @tiles and @entitySprites for layer in @map.layers y = 0 @@ -65,6 +88,9 @@ class MapView y += tileSize + for e in _.values @entities + @drawEntity e + redraw: => unless @redrawPending @redrawPending = true -- cgit v1.2.3