HUD improvements

src/game.coffee

@@ -9,6 +9,8 @@ app.game =
     # Start the game tick
     window.setInterval(@tick, 1000)
 
+    @hud.start()
+
   render: ->
     for tile, i in @map
       y = Math.floor(i/20)

src/hud.coffee

@@ -1,11 +1,59 @@
 app.game.hud =
+  start: ->
+    resTypes = (k for own k of app.game.resources)
+    
+    @position = x: 64, y: 107
+
+    @resources = []
+    for restype, i in resTypes
+      @resources[restype] = new Tilelayer(
+        type: restype,
+        depth: i
+      )
+
   render: ->
-    app.layer.drawImage app.images.hud, 0, 12*8+2
-    posy = 15
+    app.layer.drawImage app.images.hud, 0, 12*8+4
+
+    i = 0
     for type, amount of app.game.resources
       if amount > 0
-        app.layer
-          .fillStyle "#000"
-          .font "10px Arial"
-          .wrappedText(amount+" x "+type, 5, posy, 800)
-        posy += 10
+        #console.log @resources[type]
+        tileLayer = @resources[type]
+
+        spritePosition = {
+          x: i*9+@position.x
+          y: @position.y
+        }
+
+        app.layer.drawRegion app.images.layers, tileLayer.hudSprite, spritePosition.x, spritePosition.y
+
+        amountByTwenty = Math.floor(amount/20)
+        amountLeft = amount - amountByTwenty*20
+        for e in [0..amountLeft]
+          color = "#0a0"
+
+          if e < 6
+            x = spritePosition.x-1+e
+            y = spritePosition.y-1
+          else if e < 10
+            x = spritePosition.x+4
+            y = spritePosition.y-1+e-5
+          else if e < 15
+            x = spritePosition.x+14-e
+            y = spritePosition.y+4
+          else
+            x = spritePosition.x-1
+            y = spritePosition.y+19-e
+
+          app.layer.setPixel(color, x, y)
+
+        for f in [0..amountByTwenty]
+          if f > 0
+            color = "#0000ff"
+
+            x = spritePosition.x-2+f
+            y = spritePosition.y+7
+
+            app.layer.setPixel(color, x, y)
+
+      i++

src/tiles/tilelayer.coffee

@@ -3,6 +3,7 @@ class Tilelayer
     {@type, @depth, @amount} = options
     @randomFactor = getRandomInt 0, 4
     @sprite = [@randomFactor*8, @depth*8, 8, 8]
+    @hudSprite = [@randomFactor*8, @depth*8, 4, 4]
 
   collect: ->
     return false if @amount == 0