Added XQuery Tool and refactored tools-service (#220)

Co-authored-by: Adam Bem <adam.bem@zoho.eu>
Reviewed-on: #220
Reviewed-by: Mikolaj Widla <widlam@noreply.example.com>
This commit is contained in:
2023-06-12 10:53:22 +02:00
parent 86b3572003
commit 3c5798cfa2
21 changed files with 509 additions and 209 deletions

View File

@@ -0,0 +1,7 @@
declare namespace p="http://www.release11.com/person";
declare namespace b="http://www.release11.com/book";
declare namespace l="http://www.release11.com/library";
for $x in //p:person
return string($x/p:name)

View File

@@ -25,6 +25,7 @@ function init() {
tools.set("xpath", "tools/xpath.html");
tools.set("xsd", "tools/xsd.html");
tools.set("xslt", "tools/xslt.html");
tools.set("xquery", "tools/xquery.html");
tools.set("xmlform", "tools/xmlFormatter.html");
tools.set("jsonform", "tools/jsonFormatter.html");
tools.set("mock", "tools/mock.html");

View File

@@ -135,6 +135,24 @@ function fillDefaultXSLT() {
} )
}
/**
* The `fillDefaultXQuery()` function fetches a default XQuery from the server and sets the value of the element with id "transformArea" to the fetched template.
*
* @function
* @name fillDefaultXQuery
* @kind function
* @returns {void}
*/
function fillDefaultXQuery() {
const serverAddress = window.location.protocol + "//" + window.location.hostname;
fetch(serverAddress + "/assets/samples/sampleXQuery.xquery")
.then( response => response.text() )
.then( (XQueryTemplate) => {
document.getElementById('transformArea').innerText = XQueryTemplate;
highlightSyntax("transformArea");
} )
}
/**
* It sets default content for the element an changes it's color to grey
*
@@ -300,7 +318,7 @@ function performRequest(endpoint, checkXML, checkTransform) {
if (result.status == "OK") {
document.getElementById("procinfo").innerText += " (" + result.time + "ms)";
document.getElementById("procinfo").innerText += " (" + result.duration + "ms)";
if (result.type)
document.getElementById("procinfo").innerText += ". Returned: " + result.type;
else

View File

@@ -0,0 +1,13 @@
/**
* 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");
}

View File

@@ -36,6 +36,7 @@
<li class="toolListRow xmlTool"><a href="#" onclick="changeTool('xpath');">XPath</a></li>
<li class="toolListRow xmlTool"><a href="#" onclick="changeTool('xslt');">XSLT</a></li>
<li class="toolListRow xmlTool"><a href="#" onclick="changeTool('xsd');">XSD</a></li>
<li class="toolListRow xmlTool"><a href="#" onclick="changeTool('xquery');">XQuery</a></li>
<li class="toolListRow xmlTool"><a href="#" onclick="changeTool('xmlform');">XML Formatter</a></li>
<li class="toolListRow jsonTool"><a href="#" onclick="changeTool('jsonform');">JSON Formatter</a></li>
</ul>

View File

@@ -0,0 +1,87 @@
<!DOCTYPE html>
<html>
<head>
<!-- <link rel="stylesheet" href="styles.css"> -->
<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/xquery.js"></script>
<script src="../assets/scripts/tools/scripts.js"></script>
<script src="../assets/scripts/tools/highlight.js"></script>
<script>hljs.highlightAll();</script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8" />
</head>
<body onload="init();">
<div class="container">
<div id="tool" class="tool rwd-expandable">
<div class="tool-context">
<div class="headline">
<h1>Online XQuery Interpreter</h1>
</div>
<div class="display-space-between">
<div style="text-align: center;">
<label for="processors">Select XQuery processor:</label>
<select name="processors" id="processors">
<option value="saxon">Saxon</option>
</select>
<label for="versions">XQuery version:</label>
<select name="versions" id="versions">
<option class="hideable saxon" value="3.1">3.1</option>
<option class="hideable saxon" value="4.0">4.0</option>
</select>
</div>
<div>
<button class="action-button active" id="clearXMLButton" style="padding: 3px 10px;"
onclick="clearDataField()">Clear</button>
<button class="action-button active" id="prettyXMLButton" style="padding: 3px 10px;"
onclick="performFormatRequest('prettify', true, 'xmlArea', 'xmlArea')">Format XML</button>
<button class="action-button active" id="defaultXMLButton" style="padding: 3px 10px;"
onclick="fillDefaultXML(this)">Insert default XML</button>
</div>
</div>
<span id="processorTooltipInfo">Supports XQuery up to 4.0</span><br>
<br>
<label for="xmlArea"><b>Insert your XML:</b></label>
<pre><code class="language-xml bordered-field textarea-300" id="xmlArea" contenteditable="True"></code></pre>
<br>
<div class="display-space-between">
<label for="transformArea"><b>Insert your XQuery:</b></label>
<div>
<button class="action-button active" id="defaultQueryButton" style="padding: 3px 10px;" onclick="fillDefaultXQuery();">Insert default XQuery</button>
</div>
</div>
<pre><code class="language-xml bordered-field textarea-300" id="transformArea" contenteditable="True"></code></pre>
<br>
<button id="requestButton" class="max-width block-label action-button active"
onclick="performRequest('xquery', true, true)">Execute XQuery</button>
<br>
<label for="resultArea"><b>Query result:<span id="procinfo"></span></b></label>
<pre><code class="language-xml bordered-field textarea-300" id="resultArea"></code></pre>
</div>
</div>
<div class="tooltip tooltip-window rwd-hideable">
<h2>What is XQuery?</h2>
<p><b>XQuery</b> (<b>XML Query</b>) is a query and functional programming language that queries and transforms collections of structured and unstructured data, usually in the form of XML, text and with vendor-specific extensions for other data formats (JSON, binary, etc.).</p>
<p>Source: <a href="https://en.wikipedia.org/wiki/XQuery">Wikipedia</a></p>
</div>
<!-- Cut END -->
</div>
</div>
</div>
</body>
</html>