aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--.gitignore2
-rw-r--r--back-template.m416
-rw-r--r--card/card.html2
-rw-r--r--card/card.js19
-rw-r--r--front-template.m410
-rw-r--r--makefile7
6 files changed, 28 insertions, 28 deletions
diff --git a/.gitignore b/.gitignore
index cef3fa0..3145967 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,2 @@
*.html
-*.min.js
+*.min.*
diff --git a/back-template.m4 b/back-template.m4
index b0b7eda..d948b80 100644
--- a/back-template.m4
+++ b/back-template.m4
@@ -1,15 +1,11 @@
<div class="card back">
-<span class="sentence">{{Complete sentence}}</span>
+<span class="parse sentence foreign">{{Complete sentence}}</span>
<hr class="split">
-<span class="target-word-reading">{{Target word reading}}</span>
-<span class="target-word-translation">{{Target word translation}}</span>
-<span class="sentence-translation">{{Complete sentence translation}}</span>
+<span class="target-word-reading foreign">{{Target word reading}}</span>
+<span class="target-word-translation native">{{Target word translation}}</span>
+<span class="sentence-translation native">{{Complete sentence translation}}</span>
</div>
-<style>
-undivert(`card/card.css')
-</style>
-<script defer>
-undivert(`card.min.js')
-</script>
+<style>undivert(`card.min.css')</style>
+<script defer>undivert(`card.min.js')</script>
diff --git a/card/card.html b/card/card.html
index 9165bf1..908be68 100644
--- a/card/card.html
+++ b/card/card.html
@@ -9,7 +9,7 @@
<body>
<div class="card back">
-<span class="sentence foreign">[俺](おれ)の[目](め)の[前](まえ)に{全}(ぜん)[裸](はだか)のアリスが*[立](た)っていた*。\*escape\* (test)</span>
+<span class="parse sentence foreign">[俺](おれ)の[目](め)の[前](まえ)に{全}(ぜん)[裸](はだか)のアリスが*[立](た)っていた*。\n\*escape\* (<i>test</i>)</span>
<hr class="split">
<span class="target-word-reading foreign">立つ【た・つ】</span>
<span class="target-word-translation native">To stand</span>
diff --git a/card/card.js b/card/card.js
index e375e8a..347a44c 100644
--- a/card/card.js
+++ b/card/card.js
@@ -8,8 +8,12 @@ function parseSentence(input) {
var reading = ""; // current kanji reading
for (var i = 0; i < input.length; i++) {
- // escape all characters preceded by \
- if (input[i] == "\\") { out += input[i+1]; i++; continue; }
+ // escape characters preceded by \
+ if (input[i] == "\\") {
+ var escaped = input[i+1];
+ if (escaped == "n") escaped = "<br>"; // newline
+ out += escaped; i++; continue;
+ }
// parse *test* into <b>test</b>
if (input[i] == "*") { bold = !bold; out += `<${bold ? "" : "/"}b>`; continue; }
@@ -40,12 +44,13 @@ function parseSentence(input) {
}
function run() {
- var sentences = document.getElementsByClassName("sentence");
+ var input = document.getElementsByClassName("parse");
- for (var sentence of sentences) {
- if (sentence.classList.contains("parsed")) continue;
- sentence.innerHTML = parseSentence(sentence.innerText);
- sentence.classList.add("parsed");
+ for (var el of input) {
+ if (el.classList.contains("parsed")) continue;
+ el.innerHTML = parseSentence(el.innerHTML);
+ el.classList.remove("parse");
+ el.classList.add("parsed");
}
}
diff --git a/front-template.m4 b/front-template.m4
index 534477d..03acab0 100644
--- a/front-template.m4
+++ b/front-template.m4
@@ -1,11 +1,7 @@
<div class="card front">
-<span class="sentence">{{Complete sentence}}</span>
+<span class="parse sentence foreign">{{Complete sentence}}</span>
</div>
-<style>
-undivert(`card/card.css')
-</style>
-<script defer>
-undivert(`card.min.js')
-</script>
+<style>undivert(`card.min.css')</style>
+<script defer>undivert(`card.min.js')</script>
diff --git a/makefile b/makefile
index 61b512f..cef3be7 100644
--- a/makefile
+++ b/makefile
@@ -5,11 +5,14 @@ all: back-template.html front-template.html
card.min.js: card/card.js
sed 's/\/\/.*$$//g' $< | tr '\n' ' ' | sed 's/\t//g' | sed 's/ */ /g' > $@
+card.min.css: card/card.css
+ cat $< | tr '\n' ' ' | sed 's/\t//g' | sed 's/ */ /g' > $@
+
%.html: %.m4
m4 $< > $@
-back-template.html: card.min.js card/card.css
-front-template.html: card.min.js card/card.css
+back-template.html: card.min.js card.min.css
+front-template.html: card.min.js card.min.css
clean:
$(RM) back-template.html front-template.html card.min.js