R11/release11-tools
4
2
Fork 0
Code Issues 9 Pull Requests 4 Packages Projects Releases 6 Wiki Activity

Syntax highlighting works fully for XPath

Browse Source
This commit is contained in:
Adam Bem
2023-04-25 14:52:06 +02:00
parent 4a6e7fe309
commit d06c0bdf36
2 changed files with 63 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
Frontend/assets/scripts/tools/scripts.js
View File

@@ -74,8 +74,8 @@ function clearDataField() {
* @param {any} element
* @returns {void}
*/
function escapeHTML(element) {
element.innerHTML = element.innerHTML
function escapeHTML(elementID) {
document.getElementById(elementID).innerHTML = document.getElementById(elementID).innerHTML
.replace(/&/g, "&")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
@@ -83,6 +83,11 @@ function escapeHTML(element) {
.replace(/'/g, "&#039;");
}
function highlightSyntax(elementId) {
const element = document.getElementById(elementId);
element.innerHTML = hljs.highlightAuto(element.innerText).value
}
/**
* It fills the XML area with a sample XML.
*
@@ -99,10 +104,10 @@ function fillDefaultXML(element) {
fetch(serverAddress + "/assets/samples/sampleXml.xml")
.then(response => response.text())
.then((exampleData) => {
document.getElementById("xmlArea").innerHTML = exampleData;
escapeHTML(document.getElementById("xmlArea"));
document.getElementById("xmlArea").innerText = exampleData;
highlightSyntax("xmlArea");
document.getElementById("xmlArea").style.backgroundColor = null;
hljs.highlightAll();
})
}
}
@@ -284,17 +289,17 @@ function performRequest(endpoint, checkXML, checkTransform) {
}
if (!empty) {
restRequest(port, endpoint, xmlData, transformData).then(function (result) {
document.getElementById("resultArea").innerHTML = result.result;
escapeHTML(document.getElementById("resultArea"));
hljs.highlightAll();
document.getElementById("procinfo").innerText = ' Computed using ' + result.processor
if (result.type)
document.getElementById("procinfo").innerText += ". Returned: " + result.type;
else
document.getElementById("procinfo").innerText += ". Engine doesn't support return of data types.";
document.getElementById("resultArea").innerText = result.result;
highlightSyntax("resultArea");
document.getElementById("procinfo").innerText = ' Computed using ' + result.processor;
if (result.status = "OK") {
if (result.status == "OK") {
document.getElementById("procinfo").innerText += " (" + result.time + "ms)";
if (result.type)
document.getElementById("procinfo").innerText += ". Returned: " + result.type;
else
document.getElementById("procinfo").innerText += ". Engine doesn't support return of data types.";
procinfo.style.color = "#30aa58";
} else {
procinfo.style.color = "#aa3030";
@@ -324,7 +329,7 @@ function performFormatRequest(endpoint, checkXML, sourceId, targetId) {
const targetElement = document.getElementById(targetId);
const infoElement = document.getElementById("formatinfo");
const port = 8082;
var xmlData = sourceElement.value.trim();
var xmlData = sourceElement.innerText.trim();
var empty = false;
if (defaultStrings.includes(xmlData) && checkXML) {
@@ -336,10 +341,13 @@ function performFormatRequest(endpoint, checkXML, sourceId, targetId) {
if (!empty) {
restRequest(port, endpoint, xmlData, "").then(function (result) {
if (result.status == "OK") {
targetElement.value = result.result;
targetElement.innerText = result.result.trim();
highlightSyntax(targetElement.id);
targetElement.style.backgroundColor = null;
infoElement.innerText = ' Computed'.concat(" in ", result.time, "ms.");
infoElement.style.color = "#30aa58";
}
else {
targetElement.style.backgroundColor = color_red;
@@ -350,6 +358,7 @@ function performFormatRequest(endpoint, checkXML, sourceId, targetId) {
});
}
}

39
Frontend/tools/xpath.html
View File

@@ -68,7 +68,7 @@
<!-- <textarea disabled id="resultArea" name="resultArea"
class="textarea-300 bordered-field vertically-resizeable max-width" style="margin-bottom: 50px;"
rows="10" cols="100"></textarea> -->
<pre><code class="language-xml bordered-field textarea-300" id="resultArea" contenteditable="True"></code></pre>
<pre><code class="language-xml bordered-field textarea-300" id="resultArea" "></code></pre>
</div>
</div>
@@ -17266,6 +17266,43 @@
})
}
const editorEle = document.getElementById('xmlArea');
// Handle the `paste` event
editorEle.addEventListener('paste', function (e) {
// Prevent the default action
e.preventDefault();
// Get the copied text from the clipboard
const text = e.clipboardData
? (e.originalEvent || e).clipboardData.getData('text/plain')
: // For IE
window.clipboardData
? window.clipboardData.getData('Text')
: '';
if (document.queryCommandSupported('insertText')) {
document.execCommand('insertText', false, text);
highlightSyntax(editorEle.id);
} else {
// Insert text at the current position of caret
const range = document.getSelection().getRangeAt(0);
range.deleteContents();
const textNode = document.createTextNode(text);
range.insertNode(textNode);
range.selectNodeContents(textNode);
range.collapse(false);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
}
});
</script>
</body>