mirror of
https://github.com/ankitects/anki.git
synced 2025-11-06 12:47:11 -05:00
reviewer-inner poc
This commit is contained in:
parent
5998aa913d
commit
654701da4d
5 changed files with 54 additions and 22 deletions
|
|
@ -335,6 +335,7 @@ def is_sveltekit_page(path: str) -> bool:
|
|||
"import-page",
|
||||
"image-occlusion",
|
||||
"reviewer",
|
||||
"reviewer-inner",
|
||||
]
|
||||
|
||||
|
||||
|
|
|
|||
30
ts/routes/reviewer-inner/+page.svelte
Normal file
30
ts/routes/reviewer-inner/+page.svelte
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
<script lang="ts">
|
||||
import "../../reviewer/reviewer.scss";
|
||||
|
||||
addEventListener("message", (e) => {
|
||||
switch (e.data.type) {
|
||||
case "html":
|
||||
document.body.innerHTML = e.data.value;
|
||||
break;
|
||||
case "nightMode":
|
||||
// This method currently "Flashbangs" the user if they have nightmode on and is a placeholder
|
||||
// I will probably use #night-mode in the url.
|
||||
const root = document.querySelector("html")!;
|
||||
const nightMode = e.data.value;
|
||||
if (e.data.value) {
|
||||
root.classList.add("night-mode");
|
||||
} else {
|
||||
root.classList.remove("night-mode");
|
||||
}
|
||||
document.body.className = nightMode ? "nightMode card" : "card";
|
||||
root.className = nightMode ? "night-mode" : "";
|
||||
root.setAttribute("data-bs-theme", nightMode ? "dark" : "light");
|
||||
break;
|
||||
default:
|
||||
console.warn(`Unknown message type: ${e.data.type}`);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
window.parent.postMessage({ type: "ready" });
|
||||
</script>
|
||||
|
|
@ -7,7 +7,12 @@
|
|||
</script>
|
||||
|
||||
<div id="qa" class={$cardClass}>
|
||||
<iframe bind:this={iframe} title="card" frameborder="0"></iframe>
|
||||
<iframe
|
||||
src="/reviewer-inner"
|
||||
bind:this={iframe}
|
||||
title="card"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
|
|||
|
|
@ -77,11 +77,6 @@ export function setupBottomBar() {
|
|||
}
|
||||
*/
|
||||
|
||||
// TODO This should probably be a "ready" command now that it is part of the actual reviewer,
|
||||
// Currently this depends on this component mounting after the reviewer which it should but seems hacky.
|
||||
// Maybe use a counter with a counter.subscribe($counter == 2 then call("ready"))
|
||||
bridgeCommand("bottomReady");
|
||||
|
||||
return {
|
||||
answerButtons,
|
||||
remaining,
|
||||
|
|
|
|||
|
|
@ -1,26 +1,12 @@
|
|||
import { bridgeCommand } from "@tslib/bridgecommand";
|
||||
import { writable } from "svelte/store";
|
||||
import { isNightMode } from "../../html-filter/helpers";
|
||||
import { preloadAnswerImages } from "../../reviewer/images";
|
||||
|
||||
export function setupReviewer(iframe: HTMLIFrameElement) {
|
||||
const cardClass = writable("");
|
||||
|
||||
function updateHtml(htmlString) {
|
||||
if (iframe?.contentDocument) {
|
||||
const nightMode = isNightMode();
|
||||
iframe.contentDocument.body.innerHTML = htmlString;
|
||||
iframe.contentDocument.head.innerHTML = document.head.innerHTML;
|
||||
iframe.contentDocument.body.className = nightMode
|
||||
? "nightMode card"
|
||||
: "card";
|
||||
const root = iframe.contentDocument.querySelector("html")!;
|
||||
root.className = nightMode
|
||||
? "night-mode"
|
||||
: "";
|
||||
root.setAttribute("data-bs-theme", nightMode ? "dark" : "light");
|
||||
// @ts-ignore
|
||||
iframe.contentDocument.pycmd = bridgeCommand;
|
||||
}
|
||||
iframe.contentWindow?.postMessage({ type: "html", value: htmlString });
|
||||
}
|
||||
|
||||
function showQuestion(q, a, cc) {
|
||||
|
|
@ -30,6 +16,21 @@ export function setupReviewer(iframe: HTMLIFrameElement) {
|
|||
preloadAnswerImages(a);
|
||||
}
|
||||
|
||||
addEventListener("message", (e) => {
|
||||
switch (e.data.type) {
|
||||
case "ready":
|
||||
// TODO This should probably be a "ready" command now that it is part of the actual reviewer,
|
||||
// Currently this depends on the reviewer component mounting after the bottom-reviewer which it should but seems hacky.
|
||||
// Maybe use a counter with a counter.subscribe($counter == 2 then call("ready"))
|
||||
bridgeCommand("bottomReady");
|
||||
iframe.contentWindow?.postMessage({ type: "nightMode", value: true });
|
||||
break;
|
||||
default:
|
||||
console.warn(`Unknown message type: ${e.data.type}`);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
globalThis._showAnswer = updateHtml;
|
||||
globalThis._showQuestion = showQuestion;
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue