Adam Bem
59ffeb9363
Co-authored-by: Adam Bem <adam.bem@zoho.eu> Reviewed-on: #147 Reviewed-by: Dariusz Augustyniak <augustyd@noreply.example.com>
122 lines
5.7 KiB
HTML
122 lines
5.7 KiB
HTML
<!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 XSD tester</h1>
|
|
</div>
|
|
<div class="display-space-between">
|
|
<div style="text-align: center;">
|
|
<label for="processors">Select XSLT processor:</label>
|
|
<select name="processors" id="processors">
|
|
<option value="xalan">Xalan</option>
|
|
<option value="libxml">libXML</option>
|
|
</select>
|
|
<select name="versions" id="versions" style="display: none;">
|
|
<option class="hideable libxml xalan"value="1.0">1.0</option>
|
|
<option class="hideable saxon" value="2.0">2.0</option>
|
|
<option class="hideable saxon" value="3.0">3.0</option>
|
|
<option class="hideable saxon" value="3.1">3.1</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">procInfo</span><br> -->
|
|
|
|
<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>
|
|
|
|
<label for="transformArea"><b>Insert your XSD:</b></label>
|
|
<textarea id="transformArea" name="transformArea" rows="15"
|
|
class="textarea-300 bordered-field vertically-resizeable max-width"
|
|
onblur="setDefaultContent(this, 'Insert XSD here');"
|
|
onfocus="clearDefaultContent(this, 'Insert XSD here');"></textarea>
|
|
<br>
|
|
<button id="requestButton" class="max-width block-label action-button active"
|
|
onclick="performRequest('xsd', true, true)">Verify XSD</button>
|
|
<br><br>
|
|
|
|
<label for="resultArea"><b>Result:<span id="procinfo"></span></b></label>
|
|
<textarea disabled id="resultArea" name="resultArea" rows="2"
|
|
class="bordered-field vert2ically-resizeable max-width" style="margin-bottom: 50px;"></textarea>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="tooltip-window rwd-hideable">
|
|
<h2>What is XSD?</h2>
|
|
<p><b>XSD is a W3C recomedation that specifies how to describe the elements in XML document</b></p>
|
|
<p>XSD specifies data types, order and arity of elements in XML file.<br>
|
|
Main components of XSD file are:<br>
|
|
- Element declaration - declares properties of elements (names and namespaces)<br>
|
|
- Attribute declarations - declares properties of attributes<br>
|
|
- Simple and complex types:<br>
|
|
- - XSD provides 19 simple data types<br>
|
|
- - More complex types are declared using simple types and relationships<br>
|
|
</p>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<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');
|
|
|
|
// 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();
|
|
//
|
|
})
|
|
}
|
|
|
|
function processTooltip() {
|
|
|
|
if (getProcessor() == "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>
|
|
|
|
</body>
|
|
|
|
</html> |