148 lines
4.5 KiB
HTML
148 lines
4.5 KiB
HTML
<!--
|
|
mpvacious cards, version 15.0
|
|
Sun Mar 5 12:08:06 AM UTC 2023
|
|
-->
|
|
|
|
<div class="wrap">
|
|
<header>
|
|
{{#Focus}}
|
|
<div class="tags">{{Focus}}</div>
|
|
{{/Focus}}
|
|
{{#Tags}}
|
|
<div class="tags">{{Tags}}</div>
|
|
{{/Tags}}
|
|
</header>
|
|
|
|
<div class="sent-center">
|
|
<div class="jpsentence" lang="ja">
|
|
{{edit:furigana:SentKanji}}
|
|
{{^SentKanji}}
|
|
<nokana>{{edit:kanji:SentFurigana}}</nokana>
|
|
{{/SentKanji}}
|
|
</div>
|
|
</div>
|
|
|
|
{{#Image}}<div class="images on-front">{{Image}}</div>{{/Image}}
|
|
</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 (const word of document.querySelectorAll(".jpsentence b, .jpsentence strong")) {
|
|
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 = `{{Focus}} {{Tags}}`.split(" ");
|
|
const dont_show = ['imageonfront', 'tolearn', 'marked',];
|
|
|
|
header.innerHTML = "";
|
|
|
|
for (const tag of split) {
|
|
if (tag.length < 1 || dont_show.includes(tag)) continue;
|
|
const tag_elem = document.createElement("div");
|
|
tag_elem.className = "tags";
|
|
tag_elem.innerText = tag;
|
|
header.appendChild(tag_elem);
|
|
}
|
|
}
|
|
|
|
function setImageOnFront() {
|
|
const tags = `{{Tags}}`.split(" ");
|
|
const front_img = document.querySelector("div.images.on-front");
|
|
if (front_img && tags.includes("imageonfront")) {
|
|
front_img.classList.toggle("on-front");
|
|
}
|
|
}
|
|
|
|
function formatNewRuby(kanji, readings) {
|
|
if (readings.length > 1) {
|
|
return `<ruby>${formatNewRuby(kanji, readings.slice(0, -1))}</ruby><rt>${readings.slice(-1)}</rt>`
|
|
} else {
|
|
return `<rb>${kanji}</rb><rt>${readings.join('')}</rt>`
|
|
}
|
|
}
|
|
|
|
function reformatMultiFurigana() {
|
|
const separators = /[\s;,.、・。]+/iu;
|
|
document.querySelectorAll("ruby").forEach(ruby => {
|
|
try {
|
|
const kanji = (ruby.querySelector("rb") || ruby.firstChild).textContent.trim()
|
|
const readings = ruby.querySelector("rt").textContent
|
|
.split(separators)
|
|
.map(str => str.trim())
|
|
.filter(str => str.length)
|
|
if (readings.length > 1) {
|
|
ruby.innerHTML = formatNewRuby(kanji, readings)
|
|
}
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
})
|
|
}
|
|
|
|
markPitch();
|
|
splitTagDiv();
|
|
setImageOnFront();
|
|
reformatMultiFurigana();
|
|
</script> |