let roomChange;

let actions = [
    { "Action": "Set" },
    { "Action": "Mod" },
    { "Action": "Strike" },
    { "Action": "Carry" }
];

let rooms = [
    { "Room": "Empire", id: 0 },
    { "Room": "Empire A", id: 1 },
    { "Room": "Empire B", id: 2 },
    { "Room": "Empire C", id: 3 },

];

$("#jsgrid").jsGrid({
    width: "100%",
    height: "400px",

    inserting: true,
    editing: true,
    sorting: true,
    paging: true,

    // data: clients,

    fields: [
        {
            name: "Room", type: "select", items: rooms, textField: "Room", valueField: "id", validate: "required"
        },
        { name: "Action", type: "select", items: actions, textField: "Action", valueField: "Action" },
        { name: "Note", type: "text" },
        { name: "Day", type: "date" },
        { type: "control" }
    ],
    controller: {
        insertItem: (item) => {
            if (item.Note == "") {
                item.Note = "-";
            }
            if (item.Action == "Mod") {
                // if action = mod, get extra input and set the roomChange var to value of what user selects
                $("#exampleModal").modal();
                /* NO ACTUAL FUNCTIONALITY! JUST PROOF OF CONCEPT */
                roomChange = 1; // Set var to user's val
            } else {
                // If not mod, then set/reset var to what user has selected in the table
                roomChange = item.Room;
            }
        },

    }
});

/* Event listener for insert button click */
$(document).on('click', '.jsgrid-insert-button', () => {
    $("select").val(roomChange); // updates select value based on user's input
});