Separated in XSLT

Frontend/assets/scripts/tools/xslt.js

@@ -0,0 +1,83 @@
+function processTooltip() {
+
+    if (getProcessor() == "xalan" || getProcessor() == "libxml") {
+        document.getElementById("tooltipFunctionInfo").innerText = "XSLT 1.0 functions";
+        document.getElementById("processorTooltipInfo").innerText = "Supports XSLT 1.0";
+        hideList(document.getElementsByName("collapse30"));
+    } else {
+        document.getElementById("tooltipFunctionInfo").innerText = "XSLT 1.0, 2.0 & 3.0 functions";
+        document.getElementById("processorTooltipInfo").innerText = "Supports XSLT up to 3.0";
+        showList(document.getElementsByName("collapse30"));
+    }
+}
+
+var triggerList = document.getElementsByClassName("collapseTrigger");
+for (i = 0; i < triggerList.length; i++) {
+
+    triggerList[i].addEventListener("click", function () {
+
+        var collapsible = this.parentElement;
+        var collapsibleData = this.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";
+            }
+        }
+    });
+}
+
+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 XSLT here');
+
+    // refreshTooltip();
+    processTooltip();
+    tool.addEventListener('click', event => {
+        //Check if script was called from textarea or selector
+        var targetID = event.target.getAttribute('id');
+        if (targetID !== "processors" && targetID !== "xmlArea" && targetID !== "transformArea" && targetID !== "versions") {
+            return;
+        }
+
+        processTooltip();
+    })
+
+    tool.addEventListener('change', event => {
+        //Check if script was called from textarea or selector
+        var targetID = event.target.getAttribute('id');
+        if (targetID !== "processors") {
+            return;
+        }
+
+        processTooltip();
+        
+    })
+    
+}

Frontend/tools/xslt.html

@@ -6,6 +6,7 @@
     <link rel="stylesheet" href="../assets/css/tools/r11form.css">
     <link rel="stylesheet" href="../assets/css/highlight.css">
     <script src="../assets/scripts/common/hljs.min.js"></script>
+    <script src="../assets/scripts/tools/xslt.js"></script>
     <script src="../assets/scripts/tools/scripts.js"></script>
     <script src="../assets/scripts/tools/highlight.js"></script>
     <script>hljs.highlightAll();</script>