import "luxe: draw" for Draw, PathStyle
import "luxe: world" for Entity, Transform, UI, UIRenderMode
import "luxe: ui/control" for Control
import "luxe: ui/panel" for UIPanel
import "luxe: ui/list" for UIList
import "luxe: ui/button" for UIButton
import "luxe: ui/image" for UIImage
import "luxe: assets" for Assets

import "globals" for Globals
import "blocks/ui/image_button" for ImageButton

class Ui{
  construct new(app){
    _ui = Entity.create(app.ui, "UI Root")

    var ui_rect = Globals["UiRect"]
    
    UI.create(_ui, ui_rect.x, ui_rect.y, ui_rect.width, ui_rect.height, 0, app.ui_camera)
    UI.set_render_mode(_ui, UIRenderMode.world)

    var list = UIList.create(_ui)
    //todo: make list horizontal?
    Control.set_pos(list, 0, ui_rect.height-16)
    Control.set_size(list, ui_rect.width, 16)

    var adventureButtons = Assets.image("assets/AdventureButtons")
    var tiles = 10

    for(i in 0...6){
      var button = UIButton.create(_ui)
      Control.set_size(button, 16, 16)
      UIButton.set_text(button, "%(i)")
      UIButton.set_text_size(button, 10)
      Control.set_pos(button, i*16, 0)

      var image = UIImage.create(_ui)
      UIImage.set_image(image, adventureButtons)
      UIImage.set_uv(image, i/tiles, 0, (i+1)/tiles, 1)
      Control.child_add(button, image)

      UIList.add(list, button)
    }
    //UIList.refresh(list) //uncomment this when list learns not to be vertical

    _test = ImageButton.create(_ui)
    UIImage.set_image(_test, adventureButtons)
    ImageButton.set_state_change(_test) {|state, element| 
      if(state["press"]) {
        System.print("heck %(element)")
      }
    }
    
    UI.commit(_ui)
    
  }

  test(){
    ImageButton.get_data(_test)
  }
}