/**
 * @author Usman Naeem
 */
function enablePreferredItemsPage() {
    addLoader();
    setPage("preferred_items_page");
    addHeader(true);
    addFooter();
    const messageboxElement = getElement("preferred_items_message_box");
    messageboxElement.innerHTML = "";

    //
    load_user().then(() => {
        load_items(messageboxElement).then(() => {
            load_preferred_items(messageboxElement).then(() => {
                load_analyzed_items(messageboxElement).then(() => {
                    removeLoader();
                    load_preferred_items_div_list();
                }).catch(error => {
                    handleError(error, "preferred_items_message_box", true);
                    return;
                });
            }).catch(error => {
                handleError(error, "preferred_items_message_box", true);
                return;
            });
        }).catch(error => {
            handleError(error, "preferred_items_message_box", true);
            return;
        });
    }).catch(error => {
        handleError(error, "preferred_items_message_box", true);
        enableLoginPage();
        return;
    });
}

function load_preferred_items_div_list() {
    const preferredDivContainer = getElement("preferred_items_div_container");
    preferredDivContainer.innerHTML = "";

    var items_array = new Array(...items);
    var preferred_items_array = new Array(...preferred_items);
    var analyzed_items_array = new Array(...analyzed_items);

    var selectedDone = false;
    items_array.forEach(function (id, index) {
        const item = id;
        const analyzed = analyzed_items_array.includes(id);
        const preferred = preferred_items_array.includes(id);

        add_preferred_items_div(id, id, analyzed, preferred);
    });
}

function add_preferred_items_div(id, name, analyzed, preferred) {
    var preferredDiv = "<div class='preferred_div' style='pointer-events: auto;' id='preferred_item_div_" + id + "' onClick='javascript:changeItemPreferrerence(\"" + id + "\");'>";
    preferredDiv += "<span class='preferred_label'>" + name + "</span>";
    preferredDiv += "<span class='preferred_info'>" + (analyzed ? "analyzed" : "not analyzed") + "</span>";
    preferredDiv += "<span class='preferred_checkbox_label' id='checkbox_label_" + id + "'>" + (preferred ? "&#x2713;" : "&nbsp;") + "</span>";
    preferredDiv += "<input type='checkbox' class='preferred_checkbox' name='" + id + "' id='checkbox_" + id + "'" + (preferred ? " checked='checked'" : "") + ">";
    preferredDiv += "</div>";

    const preferred_items_div_container = getElement("preferred_items_div_container");
    preferred_items_div_container.innerHTML += preferredDiv;
}

async function changeItemPreferrerence(id) {
    const messageboxElement = getElement("preferred_items_message_box");
    messageboxElement.innerHTML = "";
    const preferredDivElement = getElement("preferred_item_div_" + id);
    preferredDivElement.style.pointerEvents = 'none';
    try {
        const checkboxElement = getElement("checkbox_" + id);
        const newPreference = !checkboxElement.checked;

        var url;
        if (newPreference) {
            url = "AddUserItemPreference?item_id=" + id;
        } else {
            url = "RemoveUserItemPreference?item_id=" + id;
        }
        const json = await callWebserviceGET(url, messageboxElement, null);
        if (json.code !== 200) {
            messageboxElement.innerHTML = json.message;
        } else {
            const checkboxLabelElement = getElement("checkbox_label_" + id);
            checkboxLabelElement.innerHTML = (newPreference ? "&#x2713;" : "&nbsp;");
            checkboxElement.checked = newPreference;
        }
    } catch (error) {
        console.log(error);
        messageboxElement.innerHTML = "Failed to change symbol preferrence";
    }
    preferredDivElement.style.pointerEvents = 'auto';
}