/**
 * The `processVersionSelector()` function is responsible for updating the display of the web page 
 * based on the selected processor and version.
 * 
 * @function
 * @name processVersionSelector
 * @kind function
 * @returns {void}
 */
function processVersionSelector() {
    var processor = getProcessor();
    var hideableOptions = document.getElementsByClassName("hideable");
    for (let i = 0; i < hideableOptions.length; i++) {
        hideableOptions[i].style = "display: none;";
    }
    if (processor == "xalan" || processor == "libxml") {
        var xalanOptions = document.getElementsByClassName("xalan");
        for (let i = 0; i < xalanOptions.length; i++) {
            xalanOptions[i].style = "";
        }
        document.getElementById("versions").selectedIndex = 0;
    }
    else {
        var saxonOptions = document.getElementsByClassName("saxon");
        for (let i = 0; i < saxonOptions.length; i++) {
            saxonOptions[i].style = "";
        }
        document.getElementById("versions").selectedIndex = 3;

    }
    processTooltip();

}

/**
 * The `processTooltip()` function is responsible for updating the display of the tooltip based on the selected version of the processor.
 * It shows or hides different sections of the tooltip based on the selected version. 
 * It also handles the click event on the form and updates the tooltip accordingly.
 * 
 * @function
 * @name processTooltip
 * @kind function
 */
function processTooltip() {
    var filter = "collapse" + getVersion();
    var collList;


    if (filter == "collapse3.0") {
        document.getElementById("tooltipFunctionInfo").innerText = "XPath 3.0 functions";
        hideList(document.getElementsByName("collapse10"));
        hideList(document.getElementsByName("collapse20"));
        showList(document.getElementsByName("collapse30"));
        hideList(document.getElementsByName("collapse31"));

    } else if (filter == "collapse3.1") {
        document.getElementById("tooltipFunctionInfo").innerText = "XPath 3.1 functions";
        hideList(document.getElementsByName("collapse10"));
        hideList(document.getElementsByName("collapse20"));
        hideList(document.getElementsByName("collapse30"));
        showList(document.getElementsByName("collapse31"));
    } else if (filter == "collapse2.0") {
        document.getElementById("tooltipFunctionInfo").innerText = "XPath 2.0 functions";
        hideList(document.getElementsByName("collapse10"));
        showList(document.getElementsByName("collapse20"));
        hideList(document.getElementsByName("collapse30"));
        hideList(document.getElementsByName("collapse31"));
    } else {
        document.getElementById("tooltipFunctionInfo").innerText = "XPath 1.0 functions";
        showList(document.getElementsByName("collapse10"));
        hideList(document.getElementsByName("collapse20"));
        hideList(document.getElementsByName("collapse30"));
        hideList(document.getElementsByName("collapse31"));

    }
}



/**
 * This function is executed after the page is loaded.
 * 
 * @function
 * @name init
 * @kind function
 */
function init() {

    // Make sure that only plain text is pasted
    configurePastingInElement("xmlArea");
    configurePastingInElement("transformArea");

    //Handle clicks in whole form and set info in tooltip
    setDefaultContent(document.getElementById("xmlArea"), 'Insert XML here');
    setDefaultContent(document.getElementById("transformArea"), 'Insert XPath expression here');

    processVersionSelector();
    processTooltip();
    tool.addEventListener('change', event => {
        //Check if script was called from textarea or selector
        var targetID = event.target.getAttribute('id');
        if (targetID == "processors") {
            processVersionSelector();
            processTooltip();
        }
        else if (targetID == "versions") {
            processTooltip();
        }


    })
    tool.addEventListener('click', event => {
        //Check if script was called from textarea or selector
        var targetID = event.target.getAttribute('id');
        if (targetID !== "xmlArea" && targetID !== "transformArea") {
            return;
        }
        processTooltip();

    })
    tool.addEventListener('change', event => {
        //Check if script was called from textarea or selector
        var targetID = event.target.getAttribute('id');
        if (targetID !== "xmlArea" && targetID !== "transformArea") {
            return;
        }
        processTooltip();
    })

    var triggerList = document.getElementsByClassName("collapseTrigger");
    for (i = 0; i < triggerList.length; i++) {

        triggerList[i].addEventListener("click", function () {
            var collapsible = this.parentElement;
            if (this.tagName == "A") {
                var collapsibleData = this.nextElementSibling;
            } else {
                var collapsibleData = this.parentElement.nextElementSibling;

            }


            if (collapsibleData.style.maxHeight > "0px") {
                collapsibleData.style.maxHeight = "0px";

                this.classList.toggle("active", false);
                if (!this.classList.contains("collapsibleMini")) {
                    collapsible.classList.toggle("active", false);
                }

                var subLists1 = collapsibleData.getElementsByClassName("content");
                var subLists2 = collapsibleData.getElementsByClassName("active");
                for (j = 0; j < subLists1.length; j++) {
                    subLists1[j].style.maxHeight = "0px";
                }
                for (j = 0; j < subLists2.length; j++) {
                    subLists2[j].classList.toggle("active", false);
                }
            } else {
                collapsibleData.style.maxHeight = (collapsibleData.scrollHeight) + "px";

                this.classList.toggle("active", true);
                if (!this.classList.contains("collapsibleMini")) {
                    collapsible.classList.toggle("active", true);
                } else {
                    var parentContent = this.closest(".content");
                    parentContent.style.maxHeight = (parentContent.scrollHeight + collapsibleData.scrollHeight) + "px";
                }
            }
        });
    }
}