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

Merge pull request 'bema/func/formatter' (#48) from bema/func/formatter into dev

Browse Source 
Reviewed-on: R11/release11-tools-web#48
This commit is contained in:
Adam Bem
2023-02-21 10:48:16 +01:00
parent d4791a1959 56a9906c58
commit 65a730105d
15 changed files with 383 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
Frontend/assets/css/tools/r11form.css
View File

@@ -287,6 +287,10 @@
width: 100%;
}
.half-width {
width: 50%;
}
.max-width.with-padding {
width: 94%;
}

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

@@ -91,7 +91,7 @@ function refreshTooltip() {
document.getElementById("xsltelementsheader").innerText = XSLTheader;
}
function performRequest(text, checkXML, checkTransform){
function performRequest(endpoint, checkXML, checkTransform){
var xmlData = document.getElementById("xmlArea").value.trim();
var transformData = document.getElementById("transformArea").value.trim();
@@ -106,7 +106,7 @@ function performRequest(text, checkXML, checkTransform){
empty = true;
}
if (!empty) {
restRequest(text);
restRequest(endpoint, xmlData, transformData);
}else{
document.getElementById("resultArea").value = "No data provided!";
return false;
@@ -114,17 +114,33 @@ function performRequest(text, checkXML, checkTransform){
}
function performFormatRequest(endpoint, checkXML){
var xmlData = document.getElementById("xmlArea").value.trim();
var empty = false;
if (defaultStrings.includes(xmlData) && checkXML) {
document.getElementById("xmlArea").style.backgroundColor = color_red;
xmlData = "";
empty = true;
}
if (!empty) {
restRequest(endpoint, xmlData, null);
}else{
document.getElementById("resultArea").value = "No data provided!";
return false;
}
}
//Form REST request, send, receive and display in resultArea
async function restRequest(text) {
async function restRequest(endpoint, xmlData, transformData) {
const escapeChar = "specialEscapeChar";
var port = ":8081/"
if (getProcessor() == "libxml") {
port = ":8082/"
}
const addr = window.location.protocol + "//" + window.location.hostname + port + text;
var xmlData = document.getElementById("xmlArea").value.trim();
var transformData = document.getElementById("transformArea").value.trim();
const addr = window.location.protocol + "//" + window.location.hostname + port + endpoint;
if(defaultStrings.includes(xmlData)){
xmlData = "<empty/>";

1
Frontend/index.html
View File

@@ -25,6 +25,7 @@
<li id="toolListRow"><a href="./tools/xpath.html" target="iframe">XPath</a></li>
<li id="toolListRow"><a href="./tools/xslt.html" target="iframe">XSLT</a></li>
<li id="toolListRow"><a href="./tools/xsd.html" target="iframe">XSD</a></li>
<li id="toolListRow"><a href="./tools/formatter.html" target="iframe">Formatter</a></li>
</ul>
<div id="copyright">Copyright © 2023<br><a href="http://release11.com/">Release11 Sp. z. o. o.</a></div>
</div>

161
Frontend/tools/formatter.html Normal file
View File

@@ -0,0 +1,161 @@
<!DOCTYPE html>
<html>
<head>
<!-- <link rel="stylesheet" href="styles.css"> -->
<link rel="stylesheet" href="../assets/css/tools/r11form.css">
<script src="../assets/scripts/tools/scripts.js"></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 XML Formatter <span class="versionInfo"><span class="version-span">v0.21.37 BETA</span></span>
</h1>
</div>
<select name="processors" id="processors" class="hidden">
<option value="libxml">libXML</option>
</select>
<label for="xmlArea"><b>Insert your XML:</b></label>
<textarea id="xmlArea" name="xmlArea" rows="15"
class="textarea-300 bordered-field vertically-resizeable max-width"
onblur="setDefaultContent(this, 'Insert XML here');"
onfocus="clearDefaultContent(this, 'Insert XML here');"></textarea>
<br><br>
<button id="requestButton" class="max-width block-label action-button active"
onclick="performFormatRequest('prettifypost', true)">Prettify XML</button>
<button id="requestButton" class="max-width block-label action-button active"
onclick="performFormatRequest('minimizepost', true)">Minimize XML</button>
<br><br>
<label for="resultArea"><b>Result:<span id="procinfo"></span></b></label>
<textarea id="resultArea" name="resultArea" rows="2"
class="bordered-field textarea-300 vert2ically-resizeable max-width" style="margin-bottom: 50px;"></textarea>
</div>
</div>
<div class="tooltip-window rwd-hideable">
<h2>What is this?</h2>
<p>This tool has 2 main functions:
<ul>
<li><strong>Prettify XML</strong> to make it human-readable (add indentation etc.)</li>
<li><strong>Minimize XML</strong> to make it more compact (exactly opposite to above)</li>
</ul>
</p>
</div>
</div>
<!-- <script>
function getVersion() {
return document.getElementById("versions").value;
}
</script> -->
<script>
function processTooltip() {
console.log("processTooltip");
if (getProcInfo() == "xalan") {
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"));
}
}
</script>
<script>
function getProcessor() {
return document.getElementById("processors").value;
}
</script>
<script>
function getVersion() {
if (getProcInfo() == "xalan") {
return "1.0";
} else {
return "3.0";
}
}
</script>
<script>
function getProcInfo() {
var processVariables = document.getElementById("processors").value;// + "&version=" + document.getElementById("versions").value;
return processVariables;
}
</script>
<script>
var triggerList = document.getElementsByClassName("collapseTrigger");
for (i = 0; i < triggerList.length; i++) {
console.log("trigger connected");
triggerList[i].addEventListener("click", function () {
console.log("click");
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";
}
}
});
}
</script>
<script>
function init() {
//Handle clicks in whole form and set info in tooltip
setDefaultContent(document.getElementById("xmlArea"), 'Insert XML here');
setDefaultContent(document.getElementById("transformArea"), 'Insert XSD here');
console.log("init");
// 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();
// console.log("clock");
})
}
</script>
</body>
</html>