app.game.hud =
  start: ->
    resTypes = (k for own k of app.game.resources)
    
    @position = x: 45, y: 103

    @resources = []
    for restype, i in resTypes
      @resources[restype] = new Tilelayer(
        type: restype,
        depth: i
      )

  render: ->
    app.layer.drawImage app.images.hud, 0, 11*8

    if app.game.currentSelectedTile != null
      app.layer.drawRegion app.images.layers, app.game.currentSelectedTile.getCurrentLayer().sprite, 15, 100

    # silo capacity
    usedSiloStoragePercent = (100 / app.game.availableSiloStorage()) * app.game.usedSiloStorage()

    for f in [0..100]
      color = "#333"
      color = "#fff" if f < usedSiloStoragePercent

      x = 44+f
      y = 112

      app.layer.setPixel(color, x, y)

    # resources
    i = 0
    for type, amount of app.game.resources
      if amount > 0
        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"
          color = "#0f0" if e == amountLeft

          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++
