diff --git a/Frontend/assets/scripts/tools/scripts.js b/Frontend/assets/scripts/tools/scripts.js index 904fdbe..ea50724 100644 --- a/Frontend/assets/scripts/tools/scripts.js +++ b/Frontend/assets/scripts/tools/scripts.js @@ -3,15 +3,15 @@ const color_grey = "#6b6b6b"; const color_red = "#ff8f8f"; /** - * It clears default content of the element and sets it's color to black. - * - * @function - * @name clearDefaultContent - * @kind function - * @param {any} element to set - * @param {any} text to set - * @returns {void} - */ +* It clears default content of the element and sets it's color to black. +* +* @function +* @name clearDefaultContent +* @kind function +* @param {any} element to set +* @param {any} text to set +* @returns {void} +*/ function clearDefaultContent(element, text) { if (element.value == text) { element.value = ""; @@ -21,25 +21,25 @@ function clearDefaultContent(element, text) { } /** - * It returns the value of the element with id "processors". - * - * @function - * @name getProcessor - * @kind function - * @returns {any} - */ +* It returns the value of the element with id "processors". +* +* @function +* @name getProcessor +* @kind function +* @returns {any} +*/ function getProcessor() { return document.getElementById("processors").value; } /** - * It returns version of XSLT. - * - * @function - * @name getVersion - * @kind function - * @returns {"1.0" | "3.0"} - */ +* It returns version of XSLT. +* +* @function +* @name getVersion +* @kind function +* @returns {"1.0" | "3.0"} +*/ function getVersion() { if (getProcessor() == "xalan") { return "1.0"; @@ -49,13 +49,13 @@ function getVersion() { } /** - * It clears all data fields. - * - * @function - * @name clearDataField - * @kind function - */ -function clearDataField(){ +* It clears all data fields. +* +* @function +* @name clearDataField +* @kind function +*/ +function clearDataField() { document.getElementById("xmlArea").value = ""; document.getElementById("xmlArea").style.color = null; document.getElementById("xmlArea").style.backgroundColor = null; @@ -65,28 +65,37 @@ function clearDataField(){ document.getElementById("transformArea").style.backgroundColor = null; } +/** +* It fills the XML area with a sample XML. +* +* @function +* @name fillDefaultXML +* @kind function +* @param {any} element +* @returns {void} +*/ function fillDefaultXML(element) { - if(element.classList.contains("active")){ + if (element.classList.contains("active")) { const serverAddress = window.location.protocol + "//" + window.location.hostname + ":8086"; clearDefaultContent(document.getElementById("xmlArea"), "Insert XML here"); fetch(serverAddress + "/assets/samples/sampleXml.xml") - .then(response => response.text()) - .then((exampleData) => { - document.getElementById("xmlArea").value = exampleData; - document.getElementById("xmlArea").style.backgroundColor = null; - }) - } - } + .then(response => response.text()) + .then((exampleData) => { + document.getElementById("xmlArea").value = exampleData; + document.getElementById("xmlArea").style.backgroundColor = null; + }) + } +} /** - * It sets default content for the element an changes it's color to grey - * - * @function - * @name setDefaultContent - * @kind function - * @param {any} element to set - * @param {any} text to set - */ +* It sets default content for the element an changes it's color to grey +* +* @function +* @name setDefaultContent +* @kind function +* @param {any} element to set +* @param {any} text to set +*/ function setDefaultContent(element, text) { if (element.value == "") { var id = element.getAttribute('id'); @@ -109,14 +118,14 @@ function setDefaultContent(element, text) { } /** - * It hides list for specified version of XPath - * - * @function - * @name hideList - * @kind function - * @param {any} collList class name of list to hide - * @returns {void} - */ +* It hides list for specified version of XPath +* +* @function +* @name hideList +* @kind function +* @param {any} collList class name of list to hide +* @returns {void} +*/ function hideList(collList) { for (i = 0; i < collList.length; i++) { if (collList[i].nextElementSibling !== null) { @@ -129,27 +138,27 @@ function hideList(collList) { } /** - * It checks if the text is a default text. - * - * @function - * @name checkDefault - * @kind function - * @param {any} text - * @returns {boolean} - */ -function checkDefault(text){ +* It checks if the text is a default text. +* +* @function +* @name checkDefault +* @kind function +* @param {any} text +* @returns {boolean} +*/ +function checkDefault(text) { return defaultStrings.includes(text); } /** - * It show list for specified version of XPath - * - * @function - * @name showList - * @kind function - * @param {any} collList class name of list to hide - * @returns {void} - */ +* It show list for specified version of XPath +* +* @function +* @name showList +* @kind function +* @param {any} collList class name of list to hide +* @returns {void} +*/ function showList(collList) { for (i = 0; i < collList.length; i++) { collList[i].style.display = 'block'; @@ -157,20 +166,20 @@ function showList(collList) { } /** - * A function that is used to fold/unfold collapsible elements. - * - * @function - * @name smoothFoldElement - * @kind function - * @param {any} element - * @param {any} toogleState - * @param {any} toggleParrent - * @returns {void} - */ -function smoothFoldElement(element, toogleState, toggleParrent){ +* A function that is used to fold/unfold collapsible elements. +* +* @function +* @name smoothFoldElement +* @kind function +* @param {any} element +* @param {any} toogleState +* @param {any} toggleParrent +* @returns {void} +*/ +function smoothFoldElement(element, toogleState, toggleParrent) { if (toogleState) { console.log("DUPA"); - if(toggleParrent){ + if (toggleParrent) { element.parentElement.style.maxHeight = "0px"; } @@ -189,13 +198,13 @@ function smoothFoldElement(element, toogleState, toggleParrent){ } /** - * Set tooltip info, function is called by onClick handlers - * - * @function - * @name refreshTooltip - * @kind function - * @returns {void} - */ +* Set tooltip info, function is called by onClick handlers +* +* @function +* @name refreshTooltip +* @kind function +* @returns {void} +*/ function refreshTooltip() { var resizeList = document.getElementsByClassName("collapsibleData"); console.log("collDataList: " + resizeList.length) @@ -206,17 +215,17 @@ function refreshTooltip() { /** - * A function that performs a request to the server. - * - * @function - * @name performRequest - * @kind function - * @param {any} endpoint of target service - * @param {any} checkXML enable checking for empty XML - * @param {any} checkTransform enable checking for empty transform data - * @returns {false | undefined} - */ -function performRequest(endpoint, checkXML, checkTransform){ +* A function that performs a request to the server. +* +* @function +* @name performRequest +* @kind function +* @param {any} endpoint of target service +* @param {any} checkXML enable checking for empty XML +* @param {any} checkTransform enable checking for empty transform data +* @returns {false | undefined} +*/ +function performRequest(endpoint, checkXML, checkTransform) { const sourceId = "xmlArea"; const transformId = "transformArea"; var xmlData = document.getElementById(sourceId).value.trim(); @@ -226,19 +235,19 @@ function performRequest(endpoint, checkXML, checkTransform){ if (getProcessor() == "libxml") { port = 8082; } - + var empty = false; if (defaultStrings.includes(xmlData) && checkXML) { - document.getElementById(sourceId).style.backgroundColor = color_red; - xmlData = ""; - empty = true; + document.getElementById(sourceId).style.backgroundColor = color_red; + xmlData = ""; + empty = true; } if (defaultStrings.includes(transformData) && checkTransform) { document.getElementById(transformId).style.backgroundColor = color_red; empty = true; } if (!empty) { - restRequest(port, endpoint, xmlData, transformData).then(function(result) { + restRequest(port, endpoint, xmlData, transformData).then(function (result) { document.getElementById("resultArea").value = result.result; document.getElementById("procinfo").innerText = ' Computed using '.concat(" ", result.processor); if (result.status = "OK") { @@ -248,7 +257,7 @@ function performRequest(endpoint, checkXML, checkTransform){ procinfo.style.color = "#aa3030"; } }); - }else{ + } else { document.getElementById("resultArea").value = "No data provided!"; return false; } @@ -256,18 +265,18 @@ function performRequest(endpoint, checkXML, checkTransform){ } /** - * Function that prepares data to send and handles response - * - * @function - * @name performFormatRequest - * @kind function - * @param {any} endpoint of target service - * @param {any} checkXML enable checking for empty XML - * @param {any} sourceId ID of element to get XML from - * @param {any} targetId ID of element to write formatted XML - * @returns {void} - */ -function performFormatRequest(endpoint, checkXML, sourceId, targetId){ +* Function that prepares data to send and handles response +* +* @function +* @name performFormatRequest +* @kind function +* @param {any} endpoint of target service +* @param {any} checkXML enable checking for empty XML +* @param {any} sourceId ID of element to get XML from +* @param {any} targetId ID of element to write formatted XML +* @returns {void} +*/ +function performFormatRequest(endpoint, checkXML, sourceId, targetId) { const sourceElement = document.getElementById(sourceId); const targetElement = document.getElementById(targetId); const infoElement = document.getElementById("formatinfo"); @@ -276,13 +285,13 @@ function performFormatRequest(endpoint, checkXML, sourceId, targetId){ var empty = false; if (defaultStrings.includes(xmlData) && checkXML) { - sourceElement.style.backgroundColor = color_red; - xmlData = ""; - empty = true; + sourceElement.style.backgroundColor = color_red; + xmlData = ""; + empty = true; } - + if (!empty) { - restRequest(port, endpoint, xmlData, "").then(function(result) { + restRequest(port, endpoint, xmlData, "").then(function (result) { console.log(result); if (result.status == "OK") { targetElement.value = result.result; @@ -303,36 +312,36 @@ function performFormatRequest(endpoint, checkXML, sourceId, targetId){ /** - * Form REST request, send and return received data - * - * @async - * @function - * @name restRequest - * @kind function - * @param {any} port of target service - * @param {any} endpoint of target service - * @param {any} xmlData XML that will be sent - * @param {any} transformData data used to transform given XML - * @returns {Promise} - */ +* Form REST request, send and return received data +* +* @async +* @function +* @name restRequest +* @kind function +* @param {any} port of target service +* @param {any} endpoint of target service +* @param {any} xmlData XML that will be sent +* @param {any} transformData data used to transform given XML +* @returns {Promise} +*/ async function restRequest(port, endpoint, xmlData, transformData) { const escapeChar = "specialEscapeChar"; const addr = window.location.protocol + "//" + window.location.hostname + ":" + port + "/" + endpoint; - - if(defaultStrings.includes(xmlData)){ + + if (defaultStrings.includes(xmlData)) { xmlData = ""; } - + // var data = xmlData.concat(escapeChar, transformData); - + // const url = addr.concat("?escapechar=", escapeChar, "&processor=", getProcInfo()); - + var jsonData = JSON.stringify({ - "data" : xmlData, - "process" : transformData, - "processor" : getProcessor(), - "version" : getVersion() + "data": xmlData, + "process": transformData, + "processor": getProcessor(), + "version": getVersion() }); // console.log(jsonData); var init = { @@ -343,10 +352,10 @@ async function restRequest(port, endpoint, xmlData, transformData) { method: "POST" }; var request = new Request(addr, init); - + var result = await fetch(request).then(response => { - return response.text().then(function(text) { + return response.text().then(function (text) { return JSON.parse(text); });