mirror of
https://github.com/ankitects/anki.git
synced 2025-09-25 09:16:38 -04:00
iframe poc
This commit is contained in:
parent
1e67a773c6
commit
da90e3c718
1 changed files with 25 additions and 1 deletions
|
@ -1,16 +1,40 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import { bridgeCommand } from "@tslib/bridgecommand";
|
||||||
import type { Writable } from "svelte/store";
|
import type { Writable } from "svelte/store";
|
||||||
|
import { isNightMode } from "../../html-filter/helpers";
|
||||||
|
|
||||||
export let html: Writable<string>;
|
export let html: Writable<string>;
|
||||||
export let cardClass: Writable<string>;
|
export let cardClass: Writable<string>;
|
||||||
|
|
||||||
|
let iframe: HTMLIFrameElement;
|
||||||
|
|
||||||
|
html.subscribe(($html) => {
|
||||||
|
if (iframe?.contentDocument) {
|
||||||
|
iframe.contentDocument.body.innerHTML = $html;
|
||||||
|
iframe.contentDocument.head.innerHTML = document.head.innerHTML;
|
||||||
|
iframe.contentDocument.body.className = isNightMode()
|
||||||
|
? "nightMode card"
|
||||||
|
: "card";
|
||||||
|
iframe.contentDocument.querySelector("html")!.className = isNightMode()
|
||||||
|
? "night-mode"
|
||||||
|
: "";
|
||||||
|
//@ts-ignore
|
||||||
|
iframe.contentDocument.pycmd = bridgeCommand;
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="qa" class={$cardClass}>
|
<div id="qa" class={$cardClass}>
|
||||||
{@html $html}
|
<iframe bind:this={iframe} title="card" frameborder="0"></iframe>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
#qa {
|
#qa {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in a new issue