roosevelt
Version:
🧸 MVC web framework for Node.js designed to make Express easier to use.
145 lines (128 loc) • 3.58 kB
HTML
<html lang='en'>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<meta name='format-detection' content='telephone=no'>
<title>${pageTitle}</title>
<style>
${prismStyle}
h1 {
color: #000;
}
body {
margin-left: 15px;
}
h1 {
float: left;
}
button {
margin-top: 25px;
float: right;
}
button + p {
float: right;
}
h2 {
clear: both;
}
.validatorErrors {
color: #f00;
white-space: pre-wrap;
}
.validatorWarnings {
color: #ffa500;
white-space: pre-wrap;
}
.markup {
font-family: monospace;
background-color: #fff;
overflow: hidden;
padding: 0.5em;
border-radius: .25em;
box-shadow: .1em .1em .5em rgba(0,0,0,.45);
line-height: 0;
counter-reset: line;
}
.markup .line-numbers {
display: block;
line-height: 1.5rem;
}
.markup .line-numbers::before {
counter-increment: line;
content: counter(line);
display: inline-block;
border-right: 1px solid #ddd;
padding: 0 .5em;
margin-right: .5em;
width: ${preWidth}px;
}
.markup .error::before {
background-color: #ffb2b2;
}
input {
margin-top: 25px;
}
</style>
<script>
window.addEventListener('DOMContentLoaded', (event) => {
var rawMarkup = document.querySelectorAll('textarea')[0].value
var displayAnywayButton = document.createElement('button')
displayAnywayButton.innerHTML = 'Display anyway'
displayAnywayButton.addEventListener('click', function () {
var iframe = document.createElement('iframe')
document.body.appendChild(iframe)
var doc = iframe.contentWindow.document
doc.open()
doc.write(rawMarkup)
var html = doc.querySelectorAll('html')[0].innerHTML
doc.close()
document.querySelectorAll('html')[0].innerHTML = html
inertScriptReplace(document.getElementsByTagName('body')[0])
})
document.querySelectorAll('h1')[0].insertAdjacentElement('afterend', displayAnywayButton)
document.querySelectorAll('input')[0].addEventListener('click', function (e) {
if (confirm('Are you sure you want to disable the HTML validator until the server restarts?')) {
return true
} else {
e.preventDefault()
}
})
function inertScriptReplace (node) {
if (node.tagName === 'SCRIPT') {
node.parentNode.replaceChild(nodeScriptClone(node), node)
} else {
var i = 0
var children = node.childNodes
while (i < children.length) {
inertScriptReplace(children[i++])
}
}
return node
function nodeScriptClone (node) {
var script = document.createElement('script')
script.text = node.innerHTML
for (var i = node.attributes.length - 1; i >= 0; i--) {
script.setAttribute(node.attributes[i].name, node.attributes[i].value)
}
return script
}
}
})
</script>
</head>
<body>
<main>
<article>
<h1>${pageHeader}</h1>
${errors}
${warnings}
${markup}
<form action='/disableValidator' method='post'>
<input type='submit' name='disableValidator' value='Disable validator until the server restarts'>
</form>
</article>
</main>
<textarea hidden>${rawMarkup}</textarea>
</body>
</html>