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:
		
							
								
								
									
										7
									
								
								Frontend/assets/samples/sampleXQuery.xquery
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										7
									
								
								Frontend/assets/samples/sampleXQuery.xquery
									
									
									
									
									
										Normal 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) | ||||
| @@ -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"); | ||||
|   | ||||
| @@ -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 | ||||
|   | ||||
							
								
								
									
										13
									
								
								Frontend/assets/scripts/tools/xquery.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								Frontend/assets/scripts/tools/xquery.js
									
									
									
									
									
										Normal 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"); | ||||
|  | ||||
| } | ||||
| @@ -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> | ||||
|   | ||||
							
								
								
									
										87
									
								
								Frontend/tools/xquery.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										87
									
								
								Frontend/tools/xquery.html
									
									
									
									
									
										Normal 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> | ||||
		Reference in New Issue
	
	Block a user