update japanese sentences

templates/Japanese sentences/Production/back.html

@@ -0,0 +1,39 @@
+{{FrontSide}}
+
+<hr>
+
+<div lang="en">{{SentEng}}</div>
+<div class="strokeorder">{{VocabKanji}}</div>
+
+{{#VocabKanji}}
+<div class="vocab">
+    {{VocabPitchPattern}}
+    {{^VocabPitchPattern}}{{kana:VocabFurigana}}{{/VocabPitchPattern}}
+    {{#VocabPitchNum}}
+    <span class="tags">{{VocabPitchNum}}</span>
+    {{/VocabPitchNum}}
+    【{{VocabKanji}}】
+</div>
+{{/VocabKanji}}
+
+{{#VocabDef}}
+<div class="definitions">
+    {{edit:furigana:VocabDef}}
+</div>
+{{/VocabDef}}
+
+{{#Notes}}
+<div class="notes">
+    <div class="tags">Notes</div>
+    <div>{{furigana:Notes}}</div>
+</div>
+{{/Notes}}
+
+<hr>
+
+<footer>{{#SentKanji}}<a href="https://jisho.org/search?keyword={{edit:text:SentKanji}}"
+        title="Sentence on Jisho">Jisho</a><a href="https://www.google.co.jp/search?q={{edit:text:SentKanji}}&tbm=isch"
+        title="Search images">Images</a>{{/SentKanji}}{{#VocabKanji}}<a
+        href="http://tangorin.com/dict.php?dict=general&s={{text:VocabKanji}}">Tangorin</a><a
+        href="http://www.weblio.jp/content/{{text:VocabKanji}}">Weblio</a><a
+        href="https://wadoku.de/search/?q={{text:VocabKanji}}">Wadoku</a> {{/VocabKanji}}</footer>

templates/Japanese sentences/Production/front.html

@@ -0,0 +1,41 @@
+{{#MakeProductionCard}}
+{{#SentKanji}}
+
+<header>{{#Tags}}<div class="tags">{{Tags}}</div>{{/Tags}}</header>
+{{#Image}}<div class="images">{{Image}}</div>{{/Image}}
+<div class="jpsentence production">{{edit:furigana:SentFurigana}}</div>
+<div style="text-align: center;">{{VocabAudio}}{{SentAudio}}</div>
+<script>
+    function threeDots() {
+        const sent = document.getElementsByClassName("production")[0];
+        if (sent) {
+            for (const hidden of sent.getElementsByTagName("b")) {
+                hidden.style.visibility = "visible";
+                hidden.innerText = "【" + hidden.innerText.replace(/[^ぁ-んァ-ン]/g, "") + "】";
+            }
+        }
+    }
+    /* Splits tags into separate divs */
+    function splitTagDiv() {
+        const header = document.querySelector("header");
+        if (!header) return;
+        const split = `{{MorphManFocus}} {{Tags}}`.split(' ');
+
+        header.innerHTML = "";
+
+        for (const tag of split) {
+            if (tag.length < 1)
+                continue;
+            const tag_elem = document.createElement("div");
+            tag_elem.className = "tags";
+            tag_elem.innerHTML = tag;
+            header.appendChild(tag_elem);
+        }
+    }
+
+    threeDots()
+    splitTagDiv()
+</script>
+
+{{/SentKanji}}
+{{/MakeProductionCard}}

templates/Japanese sentences/Recognition/back.html

@@ -0,0 +1,58 @@
+<div class="wrap">
+
+<div class="fside">{{FrontSide}}</div>
+
+<div class="jpsentence" lang="ja">
+<p>
+    {{edit:furigana:SentFurigana}}
+    {{^SentFurigana}}{{edit:furigana:SentKanji}}{{/SentFurigana}}
+</p>
+</div>
+
+{{#SentEng}}
+<div lang="en">
+    {{hint:SentEng}}
+</div>
+{{/SentEng}}
+
+<div class="vocab">
+    {{VocabAudio}}{{SentAudio}}
+    {{VocabPitchPattern}}{{^VocabPitchPattern}}{{kana:VocabFurigana}}{{/VocabPitchPattern}}
+    {{#VocabPitchNum}}<span class="tags"
+        id="pitchnum">{{VocabPitchNum}}</span>{{/VocabPitchNum}}{{#VocabKanji}}【{{kanji:VocabKanji}}】{{/VocabKanji}}
+</div>
+
+{{#VocabDef}}
+<div class="definitions">{{edit:furigana:VocabDef}}</div>
+{{/VocabDef}}
+
+{{#Notes}}
+<div class="notes">
+    <div class="tags">Notes</div>
+    <div>{{furigana:Notes}}</div>
+</div>
+{{/Notes}}
+
+{{#Image}}<div class="images">{{Image}}</div>{{/Image}}
+
+<hr>
+
+<footer>{{#SentKanji}}<a title="Translate with SimplyTranslate" href="https://translate.metalune.xyz/?engine=google&text={{text:kanji:SentKanji}}&sl=ja&tl=en">Translate</a><a href="https://jisho.org/search?keyword={{text:kanji:SentKanji}}"
+        title="Sentence on Jisho">Jisho</a><a href="https://www.google.co.jp/search?q={{text:kanji:SentKanji}}&tbm=isch"
+        title="Search images">Images</a>{{/SentKanji}}{{#VocabKanji}}<a
+        href="http://www.weblio.jp/content/{{text:VocabKanji}}" title="Vocab on Weblio">Weblio</a><a
+        href="https://wadoku.de/search/?q={{text:VocabKanji}}" title="Vocab on Wadoku">Wadoku</a>{{/VocabKanji}}
+</footer>
+
+</div> <!-- /wrap -->
+
+<script>
+    function removePitchBrackets() {
+        const tags = document.getElementById("pitchnum");
+        if (tags !== null) {
+            tags.innerHTML = tags.innerHTML.replace(/[\[\]]/g, "");
+        }
+    }
+    markPitch()
+    removePitchBrackets()
+</script>

templates/Japanese sentences/Recognition/front.html

@@ -0,0 +1,114 @@
+<!--
+mpvacious cards, version 13.0
+Sat Nov 27 11:10:04 AM UTC 2021
+-->
+
+<div class="wrap">
+
+<header>
+    {{#MorphManFocus}}
+    <div class="tags">{{MorphManFocus}}</div>
+    {{/MorphManFocus}}
+    {{#Tags}}
+    <div class="tags">{{Tags}}</div>
+    {{/Tags}}
+</header>
+
+<div class="jpsentence" lang="ja">
+<p>
+    {{edit:morphHighlight:furigana:SentKanji}}
+    {{^SentKanji}}
+    <nokana>{{edit:kanji:SentFurigana}}</nokana>
+    {{/SentKanji}}
+</p>
+</div>
+
+</div> <!-- /wrap -->
+
+<div style="display:none;">
+    <div id="pitchnum_hidden">{{VocabPitchNum}}</div>
+    <div id="kanaword_hidden">{{kana:VocabFurigana}}</div>
+</div>
+
+<script>
+    /* Paints the question word according to its Pitch Accent number.
+     * blue for 平板
+     * red for 頭高
+     * orange for 中高
+     * green for 尾高
+     */
+    function markPitch() {
+        let pitchNumber = document.getElementById("pitchnum_hidden");
+        if (pitchNumber === null) {
+            return;
+        } else {
+            pitchNumber = pitchNumber.innerHTML.match(/\d/);
+        }
+        if (pitchNumber === null) {
+            return;
+        } else {
+            pitchNumber = Number(pitchNumber);
+        }
+
+        /* Then decide what color to use and change font color accordingly. */
+        if (pitchNumber == 0) {
+            // use blue for 平板
+            paintTargetWord("#3366CC");
+        } else if (pitchNumber == 1) {
+            // use red for 頭高
+            paintTargetWord("red");
+        } else if (pitchNumber > 1) {
+            if (odaka(pitchNumber)) {
+                // use green for 尾高
+                paintTargetWord("green");
+            } else {
+                // use orange for 中高
+                paintTargetWord("#ff6207");
+            }
+        }
+    }
+
+    function paintTargetWord(color) {
+        for (sentence of document.getElementsByClassName("jpsentence")) {
+            for (word of sentence.getElementsByTagName("b")) {
+                word.style.color = color;
+            }
+        }
+    }
+
+    function odaka(pitch_num) {
+        // word is odaka if number of moras is equal to pitch accent position
+        const vocab_kana = document.getElementById("kanaword_hidden");
+        if (vocab_kana === null) {
+            return false;
+        }
+        // small っ is one mora; ゃゅょ are parts of single mora
+        const n_moras = vocab_kana.innerHTML.replace(/[ャュョゃゅょ]/g, '').length;
+        if (n_moras == pitch_num) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+
+    /* Splits tags into separate divs */
+    function splitTagDiv() {
+        const header = document.querySelector("header");
+        if (!header) return;
+        const split = `{{MorphManFocus}} {{Tags}}`.split(' ');
+
+        header.innerHTML = "";
+
+        for (const tag of split) {
+            if (tag.length < 1)
+                continue;
+            const tag_elem = document.createElement("div");
+            tag_elem.className = "tags";
+            tag_elem.innerHTML = tag;
+            header.appendChild(tag_elem);
+        }
+    }
+
+    markPitch()
+    splitTagDiv()
+</script>

templates/Japanese sentences/template.css

@@ -0,0 +1,364 @@
+@charset "utf-8";
+
+@font-face {
+    font-family: "KanjiStrokeOrders";
+    src: local("KanjiStrokeOrders"), url("_kso.ttf");
+}
+
+@font-face {
+    font-family: "Yu Mincho";
+    src: local("Yu Mincho"), local("游明朝"), url("_yumin.ttf");
+}
+
+@font-face {
+    font-family: "Yu Mincho";
+    src: local("Yu Mincho Demibold"), local("游明朝 Demibold"), url("_yumindb.ttf");
+    font-weight: 600;
+}
+
+* {
+    box-sizing: border-box;
+    padding: 0;
+    margin: 0;
+}
+
+.card {
+    background-color: #fffaf0;
+    color: #2a1b0a;
+    font-family: "Noto Serif", "Noto Serif CJK JP", Yu Mincho, "Liberation Serif", "Times New Roman", Times, Georgia,
+        Serif;
+    font-size: 24px;
+    text-align: left;
+    line-height: 1.4;
+    margin: 0 auto;
+}
+
+.card1 {
+    color: inherit;
+}
+
+.card2 .jpsentence ruby rt {
+    opacity: 0;
+}
+
+@media screen and (min-width: 820px) {
+    .card {
+        background-color: #E5D7C9;
+        display: flex;
+        justify-content: center;
+    }
+    .wrap {
+        width: 800px;
+        padding: 0 5px 0;
+        background-color: #fffaf0;
+        border-left: 1px solid #c9bcbc;
+        border-right: 1px solid #c9bcbc;
+        min-height: 100vh;
+    }
+    .wrap .wrap {
+        width: auto;
+        padding: 0;
+        min-height: 0;
+        border: 0;
+    }
+}
+
+.card2 .jpsentence:hover ruby rt {
+    opacity: 1;
+}
+
+hr {
+    margin: 2px 0;
+    clear: both;
+    border: 0;
+    border-top: 1px solid #c9bcbc;
+}
+
+b {
+    font-weight: 600;
+}
+
+/* links */
+a {
+    color: #532f2f;
+}
+
+a:hover {
+    color: #722a2a;
+}
+
+a.hint {
+    text-decoration: none;
+    text-align: center;
+    display: block;
+}
+
+/* Hide furigana on front */
+nokana ruby rt {
+    opacity: 0;
+    font-size: 0;
+    display: none;
+}
+
+notext b {
+    background-color: black;
+    color: transparent;
+}
+
+/* Top */
+header {
+    display: flex;
+    clear: both;
+}
+
+header .tags {
+    border-radius: 0px 0px 3px 3px;
+}
+
+header > div:not(:last-child) {
+    margin-right: 3px;
+}
+
+/* Space between elements */
+.images {
+    margin-top: 16px;
+}
+
+.images > img {
+    margin-bottom: 16px;
+}
+
+/* Japanese sentence */
+
+.jpsentence {
+    display: flex;
+    justify-content: center;
+    font-size: 35px;
+}
+.fside .jpsentence { display: none; }
+
+.tags {
+    font-family: "Noto Sans", "Noto Sans CJK JP", "Liberation Sans", Arial, Sans, sans-serif;
+    text-align: center;
+    display: inline-block;
+    text-transform: lowercase;
+    background-color: #333;
+    color: #fffaf0;
+    font-weight: bold;
+    padding: 1px 3px;
+    margin: 0;
+    cursor: pointer;
+    border-radius: 3px;
+    font-size: 12px;
+    line-height: 14px;
+}
+
+/* AnkiDroid replay button */
+.replaybutton {
+    margin: 0;
+    margin-right: 3px;
+    text-decoration: none;
+}
+
+.replaybutton span {
+    padding: 0;
+    font-size: 16px;
+}
+
+.replaybutton span svg {
+    fill: #fffaf0;
+    background: #333;
+    border-radius: 3px;
+    vertical-align: top;
+    min-width: 16px;
+    min-height: 16px;
+}
+
+/* PC replay button */
+a.replay-button {
+    top: -0.125em;
+    position: relative;
+    margin: 0;
+}
+
+a.replay-button svg {
+    height: 1em;
+    width: 1em;
+}
+
+a.replay-button svg path {
+    fill: #fffaf0;
+}
+
+a.replay-button svg circle {
+    fill: #333;
+}
+
+/* Footer and links */
+footer {
+    font-size: 16px;
+    text-align: center;
+}
+
+footer > a {
+    text-decoration: none;
+}
+
+footer > a:after {
+    content: "·";
+    color: brown;
+    display: inline-block;
+    width: 6px;
+}
+
+footer > a:last-child:after {
+    content: "";
+    width: 0;
+}
+
+/* Vocab */
+.vocab {
+    margin-top: 16px;
+}
+
+.vocab div {
+    display: inline-block;
+}
+
+.vocab br {
+    display: none;
+}
+
+.vocab > .tags {
+    vertical-align: top;
+}
+
+.notes > .tags {
+    vertical-align: bottom;
+}
+
+/* Images */
+.images {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: row;
+    align-items: flex-start;
+    align-content: space-between;
+    justify-content: space-evenly;
+}
+
+.images > img {
+    max-width: 47%;
+    border-radius: 4px;
+    filter: sepia(33%);
+}
+
+.images > img:only-child {
+    max-width: 100%;
+}
+
+/* Production cards */
+.production b {
+    visibility: hidden;
+}
+
+.strokeorder {
+    text-align: center;
+    font-size: 150px;
+    font-family: KanjiStrokeOrders;
+}
+
+/* Morphman coloring */
+.fside .jpsentence:hover [mtype="unknown"] {
+    background-color: #ffff99;
+}
+
+.fside .jpsentence:hover [mtype="seen"] {
+    background-color: #ffd1b3;
+}
+
+.fside .jpsentence:hover [mtype="known"] {
+    background-color: #b3e6cc;
+}
+
+.fside .jpsentence:hover [mtype="mature"] {
+    background-color: transparent;
+}
+
+.fside .jpsentence:hover [priority="true"] {
+    color: inherit;
+}
+
+.fside .jpsentence:hover [frequency="true"] {
+    color: inherit;
+}
+
+del.MorphManHide,
+del.morphmanhide {
+    display: none;
+}
+
+/* Fix for Yomichan defs */
+ul,
+ol {
+    list-style-type: none;
+    display: inline;
+    margin: 0px;
+    padding: 0px;
+}
+
+/* Fix for Yomichan pitch accents */
+.vocab ol > li {
+    display: inline;
+}
+
+.vocab ol > li:after {
+    content: "・";
+}
+
+.vocab ol > li:last-child:after {
+    content: "";
+}
+
+/* Night Mode */
+.nightMode .jpsentence b {
+    color: gray;
+}
+
+.nightMode .tags {
+    background-color: #f0f0f0;
+    color: #333;
+}
+
+.nightMode a.replay-button svg path {
+    fill: #2f2f31;
+}
+
+.nightMode a.replay-button svg circle {
+    fill: white;
+}
+
+.nightMode .replaybutton span svg {
+    fill: #2f2f31;
+    background: white;
+}
+
+.nightMode.card {
+    color: #f0f0f0;
+}
+
+.nightMode a {
+    color: #ccc;
+}
+
+.nightMode a:hover {
+    color: #eee;
+}
+
+.nightMode .jpsentence b {
+    color: gray;
+}
+
+.nightMode footer > a:after {
+    color: white;
+}