Skip to content

Instantly share code, notes, and snippets.

@clooth
Created August 28, 2012 11:32
Show Gist options
  • Save clooth/3497390 to your computer and use it in GitHub Desktop.
Save clooth/3497390 to your computer and use it in GitHub Desktop.
###
###
mapCanvas = document.getElementById 'map'
createCanvas = (width, height) ->
canvas = document.createElement 'canvas'
canvas.width = width
canvas.height = height
canvas
createCanvasWithImage = (image) ->
canvas = createCanvas image.width, image.height
context = canvas.getContext '2d'
context.drawImage image, 0, 0
canvas
loadTileset = (imageSrc, callback) ->
tilesetImage = new Image()
tilesetImage.onload = () ->
callback(createCanvasWithImage(tilesetImage))
tilesetImage.src = imageSrc
clone = (obj) ->
if not obj? or typeof obj isnt 'object'
return obj
if obj instanceof Date
return new Date(obj.getTime())
if obj instanceof RegExp
flags = ''
flags += 'g' if obj.global?
flags += 'i' if obj.ignoreCase?
flags += 'm' if obj.multiline?
flags += 'y' if obj.sticky?
return new RegExp(obj.source, flags)
newInstance = new obj.constructor()
for key of obj
newInstance[key] = clone obj[key]
return newInstance
class Point
constructor: (@x, @y) ->
class Vector
constructor: (@x = 0, @y = 0, @z = 0) ->
class Rectangle
constructor: (@x = 0, @y = 0, @width = 0, @height = 0) ->
class Choro
class Choro.Engine
@tileWidth
@tileHeight
constructor: (width, height) ->
Engine.tileWidth = width
Engine.tileHeight = height
@vectorToCell: (position) ->
new Point position.x / @tileWidth, position.y / @tileHeight
class Choro.Tileset
constructor: (@image, @tilesWide, @tilesHigh, @tileWidth, @tileHeight) ->
@tileRectangles = []
tileCount = tilesWide * tilesHigh
tileIndex = 0
for y in [0..@tilesHigh]
for x in [0..@tilesWide]
@tileRectangles[tileIndex] = new Rectangle(
x * @tileWidth,
y * @tileHeight,
@tileWidth,
@tileHeight
)
tileIndex++
class Choro.Tile
constructor: (@tileIndex, @tileset) ->
class Choro.MapLayer
constructor: (width, height) ->
if typeof width is "object"
@map = width
else
@map = []
for y in [0...height]
@map[y] or= []
for x in [0...width]
@map[y][x] = new Choro.Tile 0, 0
width: () -> @map[1].length if @map[1]
height: () -> @map[0].length if @map[0]
getTile: (x, y) ->
@map[y][x]
setTile: (x, y, tile, tileset) ->
@map[y] or= []
@map[y][x] = if tileset then new Choro.Tile(tile, tileset) else tile
class Choro.TileMap
constructor: (tilesets, layers) ->
@tilesets = if typeof tilesets.length is "undefined" then [tilesets] else tilesets
@mapLayers = if typeof layers.length is "undefined" then [layers] else layers
render: (canvas) ->
context = canvas.getContext '2d'
destination = new Rectangle 0, 0, Choro.Engine.tileWidth, Choro.Engine.tileHeight
for layer in @mapLayers
for y in [0...layer.height()]
destination.y = y * Choro.Engine.tileHeight
for x in [0...layer.width()]
tile = layer.getTile x, y
tileset = @tilesets[tile.tileset]
rectangle = tileset.tileRectangles[tile.tileIndex]
destination.x = x * Choro.Engine.tileWidth
context.drawImage(
tileset.image,
rectangle.x,
rectangle.y,
rectangle.width,
rectangle.height,
destination.x,
destination.y,
destination.width,
destination.height
)
canvas
engine = new Choro.Engine(32, 32)
map = null
loadTileset 'img/tileset.png', (tileset) ->
tileset = new Choro.Tileset(tileset, 44, 48, 32, 32)
mapLayer = new Choro.MapLayer(25, 20)
for y in [0...mapLayer.height()]
for x in [0...mapLayer.width()]
tile = new Choro.Tile(1, 0)
mapLayer.setTile(x, y, tile)
map = new Choro.TileMap(tileset, mapLayer)
map.render(mapCanvas)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment