
window > content(style="build_room") {
    layout = "center",
}

window > content(style="build_room") > buttons {
    align_height = false,
    y = parent_height - 70,
    width = 400,
    height = 72,
    layout = "grid",
    columns = 2,
    rows = 1,

    margin = 16,
    spacing = 16,
}

window > content(style="build_room") > buttons > button(id = "cancel", tooltip=tooltip) {
    on_mouse_move_over = "ui.tooltip#
        ui.set_cursor('base:ui/cursor/interact')

        local key = 'disabled_room'
        local tooltip = node:get_property_string('tooltip')
        local title = 'Limited Editing'

        local content = ui.new('content')
        local title_node = ui.new_text(title .. '\\n')
        title_node:set_property_bool('title', true)
        content:add_child(title_node)
        add_text(content, tooltip)

        ui.show_tooltip(key, content, evt.x, evt.y)
        return true
    ",
    on_mouse_move_out = "init#
        ui.set_cursor('base:ui/cursor/normal')
        local key = 'disabled_room'
        ui.hide_tooltip(key)
        return true
    ",
    on_mouse_move = "init#
        local key = 'disabled_room'
        ui.move_tooltip(key, evt.x, evt.y)
        return true
    ",
}

window > content(style="build_room") > subtext {
    layout = "lined",
    line_height = 35,
    align_height = false,
    y = 46,
}
window > content(style="build_room") > subtext > @text {
    font_size = 28,
    font_color = rgb(255, 120, 120),
    text_shadow = text_shadow(1.0, 1.0, "#000000", 1.0),
}

window > content(style="build_room") > room_name {
    layout = "lined",
    line_height = 45,
    align_height = false,
    y = 75,
}

window > content(style="build_room") > room_name > @text {
    font_size = 35,
    font_color = rgb(250, 250, 255),
    text_shadow = text_shadow(1.0, 1.0, "#000000", 1.0),
}

window > content(style="build_room") > room_options {
    align_height = false,
    y = 125,
    width = 400,
    height = 30,
    layout = "grid",
    columns = 2,
    rows = 1,

    margin = 0,
    spacing = 32,
}

window > content(style="build_room") > scroll_panel {
    y = 162,
    width = 422,
    height = 340,
    align_height = false,
}

window > content(style="build_room") > scroll_panel > content {
    layout = "rows",
}

object_group(entries=count) {
    width = parent_width,
    height = 32,
    clip_overflow = true,
    can_hover = true,

    on_init = "init#
        local is_open = node:get_property_bool('open') or false
        if is_open then
            local entries = node:get_property_int('entries') or 0
            node:set_property_int('height', 39 + 30 * entries)
        else
            node:set_property_int('height', 32)
        end
    ",
    on_update = "init#
        local is_open = node:get_property_bool('open') or false
        local entries = node:get_property_int('entries') or 0
        local height = node:get_property_int('height') or 32

        local target = 32
        if is_open then
            target = 39 + 30 * entries
        end

        if height ~= target then
            if is_open then
                height = height + evt.delta * entries
                if height > target then
                    height = target
                end
            else
                height = height - evt.delta * entries
                if height < target then
                    height = target
                end
            end
            node:set_property_int('height', height)
        end

    ",
    on_mouse_up = "init#
        local is_open = node:get_property_bool('open') or false
        node:set_property_bool('open', not is_open)
    ",
}
object_group(height=height) {
    height = height,
}

object_group(r=r, g=g, b=b) > background {
    width = parent_width,
    height = parent_height,
    border_width = border_width(32.0),
    border = border_image("ui/sticky_large_tint", 32, 32,  true),
    tint = rgb(r, g, b),
}

object_group(r=r, g=g, b=b, hover=true) > background {
    tint = rgb(r*0.8, g*0.8, b*0.8),
}

object_group(r=r, g=g, b=b, open=true) > background {
    tint = rgb(r*1.0, g*1.0, b*1.0),
}

object_group > title {
    width = parent_width,
    height = 30,
    layout = "lined",
    line_height = 35,
    x = 8,
    y = 4,
}

object_group > title > @text {
    font_size = 25,
    font_color = rgb(0, 10, 30),
}

object_group > objects {
    layout = "rows",
    width = parent_width,
    y = 40,
}

objects > object_entry {
    width = parent_width,
    height = 30,
    border_width = border_width(0.0, 0.0, 0.0, 1.0),
    border = border(bside("#111111", "solid")),

    can_hover = true,
    on_mouse_up = "init#return true",
    on_mouse_down = "init#return true",
}

objects > object_entry(on_click=click) {
    on_mouse_up = list(click, "init#
        audio.play_sound('click')
        return true
    "),
}

objects > object_entry(hover=true) {
    background_color = rgba(255, 255, 255, 0.7),
    shadow = shadow(0.0, 0.0, rgba(0, 0, 0, 0.6), 16.0, 1.0, "outset"),
}

object_entry > name {
    layout = "lined",
    line_height = 30,
    width = parent_width,
    x = 20,
}

object_entry > name > @text {
    font_size = 25,
    font_color = "#1e1c21",
}

object_entry > price {
    layout = "lined",
    line_height = 30,
    width = 200,
    x = parent_width - 60,
}

object_entry > price > @text {
    font_size = 25,
    font_color = "#1e1c21",
}

