mirror of
https://github.com/streetwriters/notesnook.git
synced 2026-02-24 04:00:59 +01:00
117 lines
2.6 KiB
HTML
117 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta charset="utf-8" />
|
|
<title>Note Preview</title>
|
|
<style>
|
|
body {
|
|
background-color: transparent !important;
|
|
margin: 0px !important;
|
|
padding: 12px;
|
|
padding-top: 0px;
|
|
font-size: 16px;
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
}
|
|
|
|
|
|
iframe {
|
|
max-width: 100% !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
img {
|
|
max-width: 100% !important;
|
|
background-color: transparent !important;
|
|
height: unset !important;
|
|
}
|
|
|
|
.editor {
|
|
overflow-x: hidden;
|
|
overflow-y: scroll;
|
|
min-height: 150px;
|
|
outline: none !important;
|
|
border-width: 0px !important;
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
[contenteditable][placeholder]:empty:before {
|
|
content: attr(placeholder);
|
|
position: absolute;
|
|
color: gray;
|
|
background-color: transparent;
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div aria-autocomplete="none" placeholder="Write something..." contenteditable="true" id="editor" class="editor double-spaced" ></div>
|
|
<script>
|
|
function postMessage(type, value) {
|
|
if (window.ReactNativeWebView) {
|
|
window.ReactNativeWebView.postMessage(
|
|
JSON.stringify({
|
|
type: type,
|
|
value: value
|
|
})
|
|
);
|
|
}
|
|
}
|
|
document.getElementById("editor").addEventListener("input", function (event) {
|
|
postMessage('content', event.target.innerHTML);
|
|
}, false);
|
|
|
|
|
|
attachOnMessage()
|
|
let styleElementDocument;
|
|
let doubleSpacedLines = true;
|
|
function attachOnMessage() {
|
|
let isSafari = navigator.vendor.match(/apple/i);
|
|
let listenerHandler = document;
|
|
if (isSafari) {
|
|
listenerHandler = window;
|
|
}
|
|
|
|
listenerHandler.addEventListener('message', function (data) {
|
|
console.log("message", data);
|
|
let message = JSON.parse(data.data);
|
|
let type = message.type;
|
|
let value = message.value;
|
|
switch (type) {
|
|
case 'html':
|
|
document.getElementById('editor').innerHTML = value;
|
|
break;
|
|
case 'theme':
|
|
if (!styleElementDocument) {
|
|
styleElementDocument = document.createElement('style');
|
|
styleElementDocument.type = 'text/css';
|
|
styleElementDocument.innerHTML = value;
|
|
document.getElementsByTagName('head')[0].appendChild(styleElementDocument);
|
|
} else {
|
|
styleElementDocument.innerHTML = node;
|
|
}
|
|
break;
|
|
case 'line-spacing': {
|
|
doubleSpacedLines = JSON.parse(value);
|
|
}
|
|
case 'focus':
|
|
document.getElementById('editor').focus();
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
|
|
</script>
|
|
</body>
|
|
|
|
</html> |