local ui = require("ui")
local color = ui.color

local function menubox(title, elem)
    local box_title = ui.text(title, 30, color(0x000000))
    return { box_title = box_title, fill = color(0xa0a0a0), ui.pad_x(20, ui.stack_y(
        ui.pad_y(15, ui.center_x(box_title)),
        elem,
        ui.pad_y(20)
    )) }
end

local function mm_create(actions)
    local host_game = menubox("Host Game", ui.pad_x(10,
        ui.flex(1, ui.button("Create Save")),
        ui.flex(1, ui.button("Load Save"))
    ))

    local invite_code = ui.input("Invite Code")
    local join_game = menubox("Join Game", ui.pad_x(10,
        ui.flex(3, invite_code),
        ui.flex(1, ui.button("Join", function()
            if invite_code.input_value ~= "" then
                actions.join_game(invite_code.input_value)
            end
        end))
    ))

    local edit_map = menubox("Edit Map", ui.button("Open Editor"))

    return ui.new(ui.stack_y(
        ui.pad_y(50, ui.center_x(ui.text("RAINBOW SIX: PANOPTICON", 50, color(0x000000)))),
        ui.stack_x(
            ui.flex(1),
            ui.flex(4, ui.pad_y(20,
                host_game,
                join_game,
                edit_map
            )),
            ui.flex(1)
        )
    ))
end

return {
    box = menubox,
    create = mm_create,
}