Added RenderHTML
Removed Wiki.html. Functionality was merged and generalises into RenderHTML
This commit is contained in:
parent
65b498a460
commit
fb088d50ff
91
RenderHTML.html
Normal file
91
RenderHTML.html
Normal file
@ -0,0 +1,91 @@
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
margin: 0px;
|
||||
background-color: #383c4a;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
const queryString = window.location.search;
|
||||
const queryLoc = window.location.origin;
|
||||
const queryRequest = window.location.href.split('?')[0];
|
||||
console.log(queryString);
|
||||
const urlParams = new URLSearchParams(queryString);
|
||||
const requestURL = urlParams.get('url')
|
||||
const selector = urlParams.get('selector')
|
||||
// Fetch the content
|
||||
fetch(queryLoc + requestURL)
|
||||
.then(function (data) {
|
||||
return data.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
// Parse the DOM of the fetched file
|
||||
var parser = new DOMParser();
|
||||
var doc = parser.parseFromString(html, "text/html");
|
||||
// Select the correct container
|
||||
var htmlTrimmed = doc.querySelector(selector);
|
||||
if (htmlTrimmed) {
|
||||
var styleSheets = doc.querySelectorAll("link");
|
||||
for (var i = 0; i < styleSheets.length; i++) {
|
||||
document.head.appendChild(styleSheets[i]);
|
||||
}
|
||||
// Fetch and refactor links, to use this html doc where appropriate
|
||||
var hlinks = htmlTrimmed.querySelectorAll("a");
|
||||
for (var i = 0; i < hlinks.length; i++) {
|
||||
if (hlinks[i].href.replace(queryLoc, "").startsWith("/")) {
|
||||
// Replace either http://<somehost>/<somedoc> or http://<somehost> with "" so that:
|
||||
// 1.) links to elements on the same page work
|
||||
// 2.) disable cross-origin requests
|
||||
var fixedURL = hlinks[i].href.replace(window.location, "").replace(queryLoc, "")
|
||||
// If the remaining character is the hash, this is a same-page section link
|
||||
if (fixedURL.startsWith("#")) {
|
||||
fixedURL = requestURL + fixedURL;
|
||||
}
|
||||
// selector is the selector used to select the element. Use body if the whole page is required
|
||||
hlinks[i].href = queryRequest + "?selector=" + selector + "&url=" + fixedURL;
|
||||
}
|
||||
}
|
||||
// Paste the fetched html into this doc; set styles of the root element
|
||||
document.getElementById('renderspot').innerHTML = htmlTrimmed.innerHTML;
|
||||
document.getElementById("renderspot").classList = htmlTrimmed.classList;
|
||||
// Find and run scripts
|
||||
var scripts = document.getElementById("renderspot").querySelectorAll("script");
|
||||
for (var i = 0; i < scripts.length; i++) {
|
||||
if (scripts[i].innerText) {
|
||||
eval(scripts[i].innerText);
|
||||
} else {
|
||||
fetch(scripts[i].src).then(function (data) {
|
||||
data.text().then(function (r) {
|
||||
eval(r);
|
||||
})
|
||||
});
|
||||
}
|
||||
// To not repeat the element
|
||||
scripts[i].parentNode.removeChild(scripts[i]);
|
||||
}
|
||||
}
|
||||
else{
|
||||
// In case of an error url, just use the standard 404 page
|
||||
fetch(queryLoc + "/404")
|
||||
.then(function (data) {
|
||||
return data.text();
|
||||
})
|
||||
.then(function (html) {
|
||||
document.getElementById('renderspot').innerHTML = html;
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
.markdown {
|
||||
overflow: auto !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body margin="0">
|
||||
<div id="renderspot" style="height: 100%; width: 100%" />
|
||||
</body>
|
||||
</html>
|
26
Wiki.html
26
Wiki.html
@ -1,26 +0,0 @@
|
||||
<script>
|
||||
const queryLoc = window.location.origin;
|
||||
console.log(queryLoc);
|
||||
// Fetch the default page
|
||||
fetch(queryLoc + "/" + "BrychanD/JavaECS-Docs/src/branch/master/README.md")
|
||||
.then(x => x.text())
|
||||
.then(function (y) {
|
||||
var parser = new DOMParser();
|
||||
var doc = parser.parseFromString(y, "text/html");
|
||||
var ytrimmed = doc.querySelector(".file-view");
|
||||
// Set the render spot to the captured html
|
||||
document.getElementById("renderspot2").innerHTML = ytrimmed.innerHTML;
|
||||
// Assign the viewpoint classes from the container of the page we captured
|
||||
document.getElementById("renderspot2").classList = ytrimmed.classList;
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.markdown {
|
||||
overflow: auto!important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="renderspot2" style="height: 100%; width: 100%" />
|
Loading…
x
Reference in New Issue
Block a user