Added syntax highlighting for XML Tools (#156)

Syntax highlight now should work on all tools apart from Mock Services.

Co-authored-by: Adam Bem <adam.bem@zoho.eu>
Reviewed-on: #156
Reviewed-by: Mikolaj Widla <widlam@noreply.example.com>
This commit is contained in:
2023-05-08 11:11:16 +02:00
parent 21f5911b1c
commit c55942c24a
11 changed files with 1394 additions and 104 deletions

View File

@@ -6,14 +6,15 @@
<meta charset="utf-8" />
<link rel="stylesheet" href="../assets/css/tools/r11form.css">
<link rel="stylesheet" href="../assets/css/json.css">
<link rel="stylesheet" href="../assets/css/highlight.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
<script src="../assets/scripts/tools/scripts.js"></script>
<script src="../assets/scripts/tools/highlight.js"></script>
<script src="../assets/scripts/tools/json.js"></script>
<script>hljs.highlightAll();</script>
</head>
<body>
<body onload="init()">
<div class="container">
<div id="tool" class="tool rwd-expandable">
<div class="tool-context">
@@ -224,38 +225,11 @@
hljs.addPlugin(mergeHTMLPlugin);
const editorEle = document.getElementById('jsonBlock');
// 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);
} 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);
}
});
function init() {
// Make sure that only plain text is pasted
configurePastingInElement("jsonBlock");
}
</script>
</body>
</html>