Made the notebox secure and add the correct font

This commit is contained in:
Tracker-Friendly 2024-04-25 19:26:58 +01:00
parent 5e639ec916
commit c95ba78682
5 changed files with 58 additions and 6 deletions

View File

@ -82,7 +82,7 @@
<div class="noteBox"> <div class="noteBox">
<textarea id="noteBox" class="noteBoxText"></textarea> <textarea id="noteBox" class="noteBoxText"></textarea>
<iframe src="about:blank" id="markdown" style="display: none;" sandbox="allow-same-origin allow-scripts"></iframe> <iframe id="markdown" style="display: none;" sandbox="allow-scripts"></iframe>
</div> </div>
<script type="text/javascript" src="../static/js/main.js"></script> <script type="text/javascript" src="../static/js/main.js"></script>

23
markdown/index.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<script>
let iframe = document.Get
window.addEventListener('message', function(event) {
var message = event.data;
if (message && message.header && message.body) {
if (message.header === 'head') {
console.log("head" + message.body);
} else if (message.header === 'body') {
console.log("body" + message.body);
}
}
});
</script>
</head>
<body>
<iframe src="about:blank" id="markdown-frame" style="width: 100%; height: 100%; border: none;"></iframe>
</body>

View File

@ -353,6 +353,7 @@ body {
color: var(--text-color); color: var(--text-color);
border: none; border: none;
width: 100%; width: 100%;
font-family: "Inter", sans-serif;
} }
iframe#markdown { iframe#markdown {

27
static/iframe.html Normal file
View File

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>iFrame Container</title>
</head>
<body>
<iframe style="width: 100%; height: 100%; border: none;" id="messageContainer" sandbox="allow-same-origin allow-scripts"></iframe>
<script>
function receiveMessage(event) {
if (event.origin !== location.origin) {
return;
}
document.getElementById('messageContainer').contentWindow.document;
iframeDocument.open();
iframeDocument.write(event.data);
iframeDocument.close();
}
// Listen for messages from the parent window
window.addEventListener('message', receiveMessage, false);
</script>
</body>
</html>

View File

@ -185,8 +185,8 @@ function updateFont() {
currentFontSize = localStorage.getItem("SETTING-fontsize") currentFontSize = localStorage.getItem("SETTING-fontsize")
noteBox.style.fontSize = currentFontSize + "px" noteBox.style.fontSize = currentFontSize + "px"
textSizeBox.innerText = currentFontSize + "px" textSizeBox.innerText = currentFontSize + "px"
var style = "<style>body { color: " + getComputedStyle(document.documentElement).getPropertyValue('--text-color') + "; font-size: " + currentFontSize + "px; }</style>"; var targethtml = "<!DOCTYPE html><html><style>html { height: 100% } body { font-family: 'Inter', sans-serif; height: 100%; color: " + getComputedStyle(document.documentElement).getPropertyValue('--text-color') + "; font-size: " + currentFontSize + "px; }</style>" + marked.parse(noteBox.value) + "</html>";
markdown.contentWindow.document.head.innerHTML = style; markdown.srcdoc = targethtml;
} }
async function waitforedit() { async function waitforedit() {
@ -399,7 +399,8 @@ function updateWordCount() {
} }
function renderMarkDown() { function renderMarkDown() {
markdown.contentWindow.document.body.innerHTML = marked.parse(noteBox.value) var targethtml = "<!DOCTYPE html><html><style>html { height: 100% } body { font-family: 'Inter', sans-serif; height: 100%; color: " + getComputedStyle(document.documentElement).getPropertyValue('--text-color') + "; font-size: " + currentFontSize + "px; }</style>" + marked.parse(noteBox.value) + "</html>";
markdown.srcdoc = targethtml
} }
function selectNote(nameithink) { function selectNote(nameithink) {
@ -674,8 +675,8 @@ removeBox.addEventListener("click", (event) => {
}); });
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
var style = "<style>body { color: " + getComputedStyle(document.documentElement).getPropertyValue('--text-color') + "; }</style>"; var targethtml = "<!DOCTYPE html><html><style>html { height: 100% } body { font-family: 'Inter', sans-serif; height: 100%; color: " + getComputedStyle(document.documentElement).getPropertyValue('--text-color') + "; font-size: " + currentFontSize + "px; }</style>" + marked.parse(noteBox.value) + "</html>";
markdown.contentWindow.document.head.innerHTML = style; markdown.srcdoc = targethtml
}); });
if (isFirstTimeVisitor() && /Android|iPhone|iPod/i.test(navigator.userAgent)) { if (isFirstTimeVisitor() && /Android|iPhone|iPod/i.test(navigator.userAgent)) {