diff --git a/ANLEITUNG.html b/ANLEITUNG.html
new file mode 100644
index 0000000000000000000000000000000000000000..0e433b1da771c21356813a8a8fa39de2874f7e27
--- /dev/null
+++ b/ANLEITUNG.html
@@ -0,0 +1,153 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Sinologie Anki Pack User Guide (Deutsch)</title>
+</head>
+
+<body>
+ <h1>Sinologie Anki Pack User Guide (Deutsch)</h1>
+
+ <aside>
+ For an english version of this guide, see <a href="GUIDE.html">here</a>.
+ </aside>
+
+ <h2>Was ist dieses Sinologie Anki Pack?</h2>
+
+ <p>
+ Dieser Abschnitt gibt einen Überblick über das Pack. Du kannst auch direkt
+ mit der <a href="#setup">Schnellstartanleitung</a> beginnen.
+ </p>
+
+ <p>
+ Das <em>Sinologie Anki Pack</em> enthält verschiedene Decks für das
+ Lernprogramm <em>Anki</em>, die dir im Sinologiestudium an der Uni Wien
+ helfen können. Du kannst damit <em>Vokabeln</em> und <em>Fakten</em> lernen.
+ </p>
+
+ <p>
+ Mitgeliefert werden:
+ </p>
+ <ul>
+ <li>Vokabeln:</li>
+ <ul>
+ <li><em>Chinesisch lernen für die Sinologie (Band 1)</em></li>
+ </ul>
+ <li>Fakten:</li>
+ <ul>
+ <li>Introduction to Chinese Cultural History (wip)</li>
+ <li>Chinesische Politische Geschichte (wip)</li>
+ </ul>
+ </ul>
+
+ <p>Es gibt folgende Arten von Karten:</p>
+ <ul>
+ <li>Frage/Antwort (Fakten),</li>
+ <li>Gesprochenes Chinesisch verstehen,</li>
+ <li>Hànzì und Pīnyīn lesen,</li>
+ <li>Hànzì schreiben,</li>
+ <li>deutsche Begriffe auf Chinesisch übersetzen.</li>
+ </ul>
+
+ <p>
+ Kartenaale treffen sicher unter anderem auf
+ <a href="https://chat.whatsapp.com/JFKpfmq29yM2xKcSu7JQib">Whatsapp</a>.
+ </p>
+
+ <h2 id="setup">Schnellstartanleitung</h2>
+ <p>Um einfach nur zu üben, folge diesem Abschnitt.</p>
+ <h3 id="schritt-1-apkg-herunterladen">Schritt 1: apkg herunterladen</h3>
+ <p>Lade die neueste <em>apkg</em>-Datei vom GitLab-Repository unter
+ <a href="https://gitlab.phaidra.org/kartenaale/sinologie-anki-pack/-/releases">Releases</a> auf einen
+ PC herunter, z.B. <code>hanyu-0.9.0.apkg</code>.
+ </p>
+ <h3 id="schritt-2-anki-desktop-intallieren">Schritt 2: Anki Desktop intallieren</h3>
+ <p>Wenn du Anki noch nicht auf deinem PC installiert hast, lade es von der
+ offiziellen <a href="https://apps.ankiweb.net/#download">Anki</a>-Seite herunter und
+ installiere.</p>
+ <h3 id="schritt-3-apkg-importieren">Schritt 3: apkg importieren</h3>
+ <p>Importiere das <em>apkg</em>-Deck in Anki Desktop, z.B. unter <em>File | Import…</em>:</p>
+ <p><img src="screenshots/screenshot-anki-import.png" alt="_File | Import…_ dialog in Anki Desktop"></p>
+ <p><img src="screenshots/screenshot-anki-import-dialog.png"
+ alt="_hanyu-0.9.0.apkg_ in the file open dialog of Anki Desktop"></p>
+ <p>Damit ist alles erledigt um am PC zu lernen. Probiere es aus!</p>
+ <h3 id="schritt-4-anki-am-smartphone-optional-">Schritt 4: Anki am Smartphone (optional)</h3>
+ <p>Schön an Anki ist, dass man auch am Smartphone oder anderen Geräten lernen
+ kann. Du kannst diesen Schritt überspringen falls du das (noch) nicht brauchst,
+ oder du kannst es später erledigen.</p>
+ <p>Stelle zuerst sicher, dass deine Kartensammlung mit Anki Web synchron ist.
+ Betätige dazu den <em>Sync</em>-Knopf open rechts. Du musst dich registrieren, falls
+ noch nicht geschehen.</p>
+ <p>Wenn die Synchronisierung abgeschlossen ist, kannst du über einen Web-Browser
+ auf deinem Smartphone unter <a href="https://ankiweb.net/">https://ankiweb.net/</a> lernen. Wenn du eine App
+ bevorzugst, probiere
+ <a
+ href="https://play.google.com/store/apps/details?id=com.ichi2.anki&hl=de_AT&gl=US&pli=1">AnkiDroid</a>
+ (for Android-Handys, gratis)
+ oder
+ <a href="https://apps.apple.com/de/app/ankimobile-flashcards/id373493387">Anki Mobile</a>
+ (mobile Apple-Geräte, z.B. iPhone or iPad, ~30€).
+ </p>
+ <h3 id="schritt-5-vorlese-funktion-in-ankidroid-konfigurieren-optional-">Schritt 5: Vorlese-Funktion in AnkiDroid
+ konfigurieren (optional)</h3>
+ <p>Bei Benutzung von AnkiDroid wird empfohlen Text-to-speech unter
+ <em>Settings | Advanced | Text to speech</em> zu aktivieren. Wie bei der Desktop-App
+ werden dann bei den Zuhör-Übungen chinesische Begriffe laut abgespielt. Für
+ andere Karten-Typen erfolgt die Sprachausgabe auf der Rückseite der
+ Karteikarte. Um erneut abzuspielen, gibt es in <em>AnkiDroid</em> einen Play-Button in
+ der Menüleiste oben. Der Button ist möglicherweise ausgeblendet. Er lässt sich
+ unter <em>Settings | Reviewing | App bar buttons | Replay audio</em> einblenden, indem
+ man die Einstellung auf <em>Always show</em> setzt.
+ </p>
+ <p>Auf anderen Plattformen wie <em>AnkiWeb</em>, <em>Anki Mobile</em> oder auf der PC-Version
+ von Anki ist keine Konfiguration erforderlich. Hier kann der Play-Button auf
+ der Karte verwendet werden.</p>
+ <h3 id="step-5-genie-en-">Step 5: Genießen!</h3>
+ <p>Das war's, viel Spaß beim lernen!</p>
+ <h2 id="fortgeschrittene-anwendung">Fortgeschrittene Anwendung</h2>
+ <h3 id="wie-kann-ich-mir-die-strichfolge-f-r-ein-chinesisches-zeichen-ansehen-">Wie kann ich mir die Strichfolge für
+ ein
+ chinesisches Zeichen ansehen?</h3>
+ <p>Wenn du ein animiertes chinesisches Zeichen siehst, kannst du darauf klicken
+ bzw. es berühren. Es öffnet sich eine Tabelle mit den einzelnen Strichen, z.B.:
+ <img src="screenshots/screenshot-practice-writing.png" alt="Screenshot of the template in AnkiDroid">
+ </p>
+ <h3 id="auf-eine-neuere-version-updaten">Auf eine neuere Version updaten</h3>
+ <p>Wenn eine neuere Version als apkg verfügbar ist und du updaten möchtest, folge
+ noch einmal den Schritten oben. Neue Vokabeln und Features werden importiert,
+ aber dein bisheriger Fortschritt bleibt.</p>
+ <h3 id="wenn-ich-ein-smartphone-verwende-brauche-ich-dann-trotzdem-die-pc-version-">Wenn ich ein Smartphone verwende,
+ brauche ich dann trotzdem die PC-Version?</h3>
+ <p>Ja, mit der PC-Version kann das <em>apkg</em> importiert bzw. upgedated werden. Sobald
+ du deine Kartensammlung mit Anki Web synchronisiert hast, kannst du auch auf
+ <em>AnkiDroid</em>, <em>Anki Mobile</em> oder <em>Anki Web</em> von einem Smartphone aus lernen.
+ </p>
+ <h3>Fortgeschrittene Anwendung und Anpassung</h3>
+ <p>
+ Außer deine eigenen Inhalte hinzuzufügen, kannst du auch viele andere Dinge
+ direkt in Anki für dich anpassen. Zum Beispiel können kleinere optische
+ Veränderungen wie eine Änderung der Schriftgröße mit CSS gemacht werden.
+ Für tiefergehende Anpassungen oder neue Features, siehe auch das README im
+ <a href="https://gitlab.phaidra.org/kartenaale/sinologie-anki-pack">Repository</a>.
+ </p>
+
+ <h2 id="zum-kartendeck-beitragen">Zum Kartendeck beitragen</h2>
+ <p>
+ Du kannst die Decks auch leicht mit deinen eigenen Vokabeln oder Fakten
+ erweitern oder eigene Decks anlegen. Wenn du mit dem Ergebnis zufrieden
+ bist, überlege dir ob du es mit anderen Kartenaalen teilen möchtest. Die
+ Früchte deiner Arbeit könnten letzten Endes hier landen, wenn du das
+ möchtest.
+ </p>
+ <p>Du kannst gern ein GitLab-Issue anlegen wenn du Schwierigkeiten bei der
+ Verwendung hast. Ein Pull-Request freut mich natürlich noch mehr. Für
+ Verbesserungsvorschläge auch gerne Issues anlegen.</p>
+ <p>Wenn du selbst kein sehr technischer Benutzer bist aber trotzdem neue Wörter
+ hinzufügen willst, kannst du auch gerne ein Issue mit deinen Wörtern anlegen
+ und ich helfe dabei.</p>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/GUIDE.html b/GUIDE.html
new file mode 100644
index 0000000000000000000000000000000000000000..f1edc1ca44762175c6f62793044948b86a2ec7f4
--- /dev/null
+++ b/GUIDE.html
@@ -0,0 +1,165 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Sinologie Anki Pack User Guide (English)</title>
+</head>
+
+<body>
+ <h1>Sinologie Anki Pack User Guide (English)</h1>
+
+ <aside>
+ Eine deutsche Version dieser Anleitung gibt es <a href="ANLEITUNG.html">hier</a>.
+ </aside>
+
+ <h2>What is this Sinologie Anki Pack?</h2>
+
+ <p>
+ This section gives you an overview of the features of the pack. Go straight
+ to the <a href="#setup">Quickstart Guide</a> if you want to get started quickly.
+ </p>
+
+ <p>
+ The <em>Sinologie Anki Pack</em> contains various decks for the popular
+ <em>Anki</em> app that can be helpful for your studies at the University of
+ Vienna. You can use them to learn <em>vocabulary</em> or <em>facts</em>.
+ </p>
+
+ <p>
+ The pack includes:
+ </p>
+ <ul>
+ <li>Vocabulary:</li>
+ <ul>
+ <li><em>Chinesisch lernen für die Sinologie (Band 1)</em></li>
+ </ul>
+ <li>Facts:</li>
+ <ul>
+ <li>Introduction to Chinese Cultural History (wip)</li>
+ <li>Chinesische Politische Geschichte (wip)</li>
+ </ul>
+ </ul>
+
+ <p>These kinds of cards are included:</p>
+ <ul>
+ <li>Q/A (facts),</li>
+ <li>listening to and understanding Chinese speech,</li>
+ <li>reading Hànzì and Pīnyīn,</li>
+ <li>writing Hànzì,</li>
+ <li>translating German words and expressions to Chinese.</li>
+ </ul>
+
+ <p>
+ Among other places, the Kartenaale group meets on
+ <a href="https://chat.whatsapp.com/JFKpfmq29yM2xKcSu7JQib">Whatsapp</a>
+ </p>
+
+ <h2 id="setup">Quickstart Guide</h2>
+
+ <p>If you just want to practice, follow these steps.</p>
+
+ <h3 id="step-1-download-apkg">Step 1: Download apkg</h3>
+ <p>Download the latest deck as an <em>apkg</em> file from the
+ <a href="https://gitlab.phaidra.org/kartenaale/sinologie-anki-pack/-/releases">Releases</a>
+ section on the GitLab repo, e.g. download <code>hanyu-0.9.0.apkg</code> and save it on
+ your PC.
+ </p>
+
+ <h3 id="step-2-install-anki-desktop">Step 2: Install Anki Desktop</h3>
+ <p>If you don't yet have Anki installed, download a version for your PC from the
+ official <a href="https://apps.ankiweb.net/#download">Anki</a> website. Install it to
+ your PC.</p>
+
+ <h3 id="step-3-import-the-deck">Step 3: Import the Deck</h3>
+ <p>Import the <em>apkg</em> deck into Anki with <em>File | Import…</em> on Anki Desktop:</p>
+ <p><img src="screenshots/screenshot-anki-import.png" alt="_File | Import…_ dialog in Anki Desktop"></p>
+ <p><img src="screenshots/screenshot-anki-import-dialog.png"
+ alt="_hanyu-0.9.0.apkg_ in the file open dialog of Anki Desktop"></p>
+ <p>That's all you need to practice on your PC. Go ahead and try it out!</p>
+
+ <h3 id="step-4-set-up-anki-on-your-phone-optional-">Step 4: Set up Anki on your phone (optional)</h3>
+ <p>A nice feature of Anki is that you can also practice on your phone or other
+ device. If you don't need this right now, skip this step completely or do it
+ later.</p>
+ <p>First, make sure that your collection of cards is synced to the web. Hit the
+ <em>Sync</em> button on the top right in Anki Desktop to do this. You may need to
+ register if you don't yet have an account on Anki Web.
+ </p>
+ <p>When the synchronization has finished, you can practice over the web on any
+ device including your mobile phone by visiting <a href="https://ankiweb.net/">https://ankiweb.net/</a> in your
+ browser. If you prefer a native app, try
+ <a
+ href="https://play.google.com/store/apps/details?id=com.ichi2.anki&hl=de_AT&gl=US&pli=1">AnkiDroid</a>
+ (for Android phones, free)
+ or
+ <a href="https://apps.apple.com/de/app/ankimobile-flashcards/id373493387">Anki Mobile</a>
+ (mobile Apple devices, e.g. iPhone or iPad, ~30€).
+ </p>
+
+ <h3 id="step-5-configuring-text-to-speech-on-ankidroid-optional-">Step 5: Configuring text-to-speech on AnkiDroid
+ (optional)</h3>
+ <p>When using AnkiDroid, it is recommended to activate text-to-speech under
+ <em>Settings | Advanced | Text to speech</em>. This will speak the characters out loud
+ when practicing listening (or for other cards when the backside is shown). To
+ replay the sound, use the play button in the menu bar. This button may be
+ invisible for you unless you change it to <em>Always show</em> under <em>Settings |
+ Reviewing | App bar buttons | Replay audio</em>.
+ </p>
+ <p>On other platforms like <em>AnkiWeb</em>, <em>Anki Mobile</em> or on the desktop version of
+ Anki, no configuration is needed for text-to-speech. You can use the play
+ button within the template to replay without extra configuration.</p>
+
+ <h3 id="step-5-enjoy-">Step 5: Enjoy!</h3>
+ <p>That's it, have fun learning!</p>
+
+ <h2 id="advanced-usage">Advanced usage</h2>
+ <h3 id="how-do-i-view-the-individual-strokes-of-a-chinese-character-">How do I view the individual strokes of a
+ Chinese
+ character?</h3>
+ <p>Whenever you see a chinese character, there is also an animation to showcase
+ the correct stroke order. If the animation is too fast or too slow for you,
+ instead tap or click the character in question. This will show you all the
+ strokes in sequence, e.g.:
+ <img src="screenshots/screenshot-practice-writing.png" alt="Screenshot of the template in AnkiDroid">
+ </p>
+ <h3 id="updating-to-a-newer-version">Updating to a newer version</h3>
+ <p>If a newer version of this template is available and you want to update, repeat
+ the guide above with the newer apkg. This will give you the newest features
+ and vocabulary, but will keep your progress with the vocabulary you already
+ learned.</p>
+ <h3 id="as-a-smartphone-user-do-i-need-the-pc-version-at-all-">As a smartphone user, do I need the PC version at all?
+ </h3>
+ <p>Yes, you need the desktop version to import the <em>apkg</em> and to update to newer
+ versions. Once you have synced your card collection with this deck to the web,
+ you can also practice with <em>AnkiDroid</em>, <em>Anki Mobile</em> or <em>Anki Web</em>.</p>
+ <h2 id="advanced-usage-and-customization">Advanced usage and customization</h2>
+ <p>
+ Apart from adding your own content, you can customize many other things
+ directly in Anki. For example, you can add extra CSS for minor optical tweaks
+ like changing the font size.
+ </p>
+ <p>
+ If you want to do some deeper customization or add new features, you can follow the steps
+ in the main README of the <a href="https://gitlab.phaidra.org/kartenaale/sinologie-anki-pack">Repository</a> to
+ generate customized HTML.
+ </p>
+
+ <h2 id="contributing">Contributing</h2>
+ <p>
+ It's easy to extend these decks with your own content, or to make your own
+ decks. If you're happy with what you made and want to share it, consider
+ sharing it with the Kartenaale group. The fruits of your labor may end up
+ here if you like.
+ </p>
+ <p>Feel free to raise a GitLab issue if you are experiencing issues or have any
+ suggestions or even pull requests to make this pack better.</p>
+ <p>If you want to contribute new words but are not that technical, just open an
+ issue and post the new words there as an Anki collection or some other format
+ of your choice.</p>
+
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Makefile b/Makefile
index b12a82aef19a4d7ec383ea98e813e71529cba343..d17d0e1e8468e049c3ec4c164ba3cddab2dc55d9 100644
--- a/Makefile
+++ b/Makefile
@@ -1,9 +1,11 @@
# part before the npm version in the release directory name
RELEASE_DIR_STEM = sinologie-anki-pack
# files and directories to copy unchanged into the release directory
-STATIC_CONTENT := LICENSE NOTICE README.md docs
+STATIC_CONTENT := LICENSE NOTICE
STATIC_CONTENT_DIR := .
SRC_DIR := src
+# any HTML in the root is considered documentation relevant for release
+DOCS_DIR := .
CONTENT_DIR := content
CACHE_DIR := .build-cache
APKG_SPEC_FILENAME := .apkg-spec.yaml
@@ -12,18 +14,28 @@ REQUIRED_ON_PATH = yarn pipenv grep find sed zip cut patch
K := $(foreach exec,$(REQUIRED_ON_PATH),\
$(if $(shell which $(exec)),some string,$(error "No $(exec) in PATH")))
-VERSION=$(shell grep '"version":' package.json -m 1 | cut -d '"' -f 4)
+VERSION:=$(shell grep '"version":' package.json -m 1 | cut -d '"' -f 4)
RELEASE_DIR := $(RELEASE_DIR_STEM)-$(VERSION)
RELEASE_ARCHIVE := $(RELEASE_DIR).zip
BUILT_TEMPLATES_DIR := $(RELEASE_DIR)/templates
-PIP_INSTALLED_FILE = $(CACHE_DIR)/.pip-installed
-YARN_INSTALLED_FILE = $(PIP_INSTALLED_FILE)/.yarn-installed
-PARCEL_ENTRY_HTMLS := $(SRC_DIR)/index.html $(shell find $(SRC_DIR)/templates -name '*.html')
+PIP_INSTALLED_FILE := $(CACHE_DIR)/.pip-installed
+YARN_INSTALLED_FILE := $(PIP_INSTALLED_FILE)/.yarn-installed
+DEV_ONLY_ENTRY_HTMLS := $(SRC_DIR)/templates/index.html
+# consider only HTMLs in subdirectories of subdirectories as templates proper
+# (without index.html which is directly under templates)
+TEMPLATES_ENTRY_HTMLS := \
+$(foreach CATEGORY,$(wildcard $(SRC_DIR)/templates/*),\
+ $(foreach TEMPLATE,$(wildcard $(CATEGORY)/*),\
+ $(wildcard $(TEMPLATE)/*.html)))
+DOCS_ENTRY_HTMLS := $(wildcard $(DOCS_DIR)/*.html)
+PARCEL_RELEASE_ENTRY_HTMLS := $(TEMPLATES_ENTRY_HTMLS) $(DOCS_ENTRY_HTMLS)
+PARCEL_DEV_ENTRY_HTMLS := $(DEV_ONLY_ENTRY_HTMLS) $(PARCEL_RELEASE_ENTRY_HTMLS)
TEMPLATE_SOURCES := $(shell find $(SRC_DIR) -type f '(' -name '*.html' -o -name '*.css' -o -name '*.js' -o -name '*.ts' ')')
CLEAN_DIRS := .parcel-cache $(CACHE_DIR) $(wildcard $(RELEASE_DIR_STEM)-*)
# delete generated directory contents on clean, but not the directories themselves
RELEASED_STATIC_CONTENT := $(foreach STATIC,$(STATIC_CONTENT),$(RELEASE_DIR)/$(STATIC))
# sed -e 's/ /\\ /g': we need to escape the spaces so make knows where the files start and end
+# above we could away without it, because the code files generally don't contain spaces
CONTENT_DIRS := $(shell find $(CONTENT_DIR) -type f -name $(APKG_SPEC_FILENAME) -exec dirname '{}' ';' | sed -e 's/ /\\ /g')
CONTENT_SOURCES := $(shell find $(CONTENT_DIRS) -type f '(' -name $(APKG_SPEC_FILENAME) -o -name '*.csv' -o -name '*.apkg' ')' | sed -e 's/ /\\ /g')
# some shell magic to produce e.g.
@@ -41,7 +53,7 @@ clean:
.PHONY: dev
dev: $(YARN_INSTALLED_FILE)
- @yarn run parcel serve $(PARCEL_ENTRY_HTMLS)
+ @yarn run parcel serve $(PARCEL_DEV_ENTRY_HTMLS)
# no dependencies for lint: always scan all files
.PHONY: lint
@@ -72,7 +84,10 @@ $(APKGS): $(PIP_INSTALLED_FILE) $(BUILT_TEMPLATES_DIR) $(CONTENT_SOURCES)
pipenv run build/export_apkgs.py -c $(CONTENT_DIR) -t $(BUILT_TEMPLATES_DIR) -o $(RELEASE_DIR)
$(BUILT_TEMPLATES_DIR): $(TEMPLATE_SOURCES)
- @yarn run parcel build --no-source-maps --dist-dir=$(RELEASE_DIR) $(PARCEL_ENTRY_HTMLS)
+ @yarn run parcel build --no-source-maps --dist-dir=$(RELEASE_DIR) $(PARCEL_RELEASE_ENTRY_HTMLS)
+# parcel per default outputs this into a source folder, get rid of this unnecessary nesting
+ mv $(RELEASE_DIR)/src/templates $(RELEASE_DIR)
+ rm -r $(RELEASE_DIR)/src
.SECONDEXPANSION:
SOURCE_STATIC = $(STATIC_CONTENT_DIR)/$(notdir $@)
diff --git a/README.md b/README.md
index dee957ac2a8dca988670c2c422d7bd0b784e196f..7ac0a8dd7d635c298ad1aab85ff31ced8b53b9fa 100644
--- a/README.md
+++ b/README.md
@@ -1,112 +1,13 @@
-# 貘老师的汉语
-_English version below_
+# Sinologie Anki Pack
+Hi there! If you just want to learn, see the user documentation in [English](GUIDE.html)
+or [German](ANLEITUNG.html). If you like coding and are interested in how it
+works or want to contribute code, please read on.
-Hier gibt es Karteikarten für das Lernprogramm _Anki_. Ich verwende sie um
-Mandarin-chinesisch zu lernen. Übersetzungen für chinesische Begriffe sind auf
-_deutsch_.
+This is a template for flashcard decks for the popular _Anki_ app, mostly to
+learn facts and the Chinese languages. You can use the bundled vocabulary or
+the HTML this template generates for other purposes too.
-Es gibt folgende Arten von Karten:
-* Gesprochenes Chinesisch verstehen,
-* Hànzì und Pīnyīn lesen,
-* Hànzì schreiben,
-* deutsche Begriffe auf chinesisch übersetzen.
-
-Die Karteikarten können wie sie sind verwendet werden, oder individuell
-angepasst werden. Zum Beispiel können in Anki neue Vokabeln hinzugefügt werden,
-oder die existierenden Vokabeln können für eine andere Sprache als Deutsch
-angepasst werden. Programmierkenntnisse sind dazu nicht nötig.
-
-Wenn du gerne programmierst, kannst du dieses Repository herunterladen und für
-deine Zwecke anpassen. Mehr Details dazu gibt es weiter unten.
-
-## Installation
-Um einfach nur zu üben, befolge die folgenden Schritte.
-
-### Schritt 1: apkg herunterladen
-Lade die neueste _apkg_-Datei vom GitHub-Repository unter
-[Releases](https://github.com/tapirbug/anki-template-hanyu/releases) auf einen
-PC herunter, z.B. `hanyu-0.9.0.apkg`.
-
-### Schritt 2: Anki Desktop intallieren
-Wenn du Anki noch nicht auf deinem PC installiert hast, lade es von der
-offiziellen [Anki](https://apps.ankiweb.net/#download)-Seite herunter und
-installiere.
-
-### Schritt 3: apkg importieren
-Importiere das _apkg_-Deck in Anki Desktop, z.B. unter _File | Import…_:
-
-
-
-
-
-Damit ist alles erledigt um am PC zu lernen. Probiere es aus!
-
-### Schritt 4: Anki am Smartphone (optional)
-Schön an Anki ist, dass man auch am Smartphone oder anderen Geräten lernen
-kann. Du kannst diesen Schritt überspringen falls du das (noch) nicht brauchst,
-oder du kannst es später erledigen.
-
-Stelle zuerst sicher, dass deine Kartensammlung mit Anki Web synchron ist.
-Betätige dazu den _Sync_-Knopf open rechts. Du musst dich registrieren, falls
-noch nicht geschehen.
-
-Wenn die Synchronisierung abgeschlossen ist, kannst du über einen Web-Browser
-auf deinem Smartphone unter https://ankiweb.net/ lernen. Wenn du eine App
-bevorzugst, probiere
-[AnkiDroid](https://play.google.com/store/apps/details?id=com.ichi2.anki&hl=de_AT&gl=US&pli=1)
-(for Android-Handys, gratis)
-oder
-[Anki Mobile](https://apps.apple.com/de/app/ankimobile-flashcards/id373493387)
-(mobile Apple-Geräte, z.B. iPhone or iPad, ~30€).
-
-### Schritt 5: Vorlese-Funktion in AnkiDroid konfigurieren (optional)
-Bei Benutzung von AnkiDroid wird empfohlen Text-to-speech unter
-_Settings | Advanced | Text to speech_ zu aktivieren. Wie bei der Desktop-App
-werden dann bei den Zuhör-Übungen chinesische Begriffe laut abgespielt. Für
-andere Karten-Typen erfolgt die Sprachausgabe auf der Rückseite der
-Karteikarte. Um erneut abzuspielen, gibt es in _AnkiDroid_ einen Play-Button in
-der Menüleiste oben. Der Button ist möglicherweise ausgeblendet. Er lässt sich
-unter _Settings | Reviewing | App bar buttons | Replay audio_ einblenden, indem
-man die Einstellung auf _Always show_ setzt.
-
-Auf anderen Plattformen wie _AnkiWeb_, _Anki Mobile_ oder auf der PC-Version
-von Anki ist keine Konfiguration erforderlich. Hier kann der Play-Button auf
-der Karte verwendet werden.
-
-### Step 5: Genießen!
-Das war's, viel Spaß beim lernen!
-
-## Fortgeschrittene Anwendung
-### Wie kann ich mir die Strichfolge für ein chinesisches Zeichen ansehen?
-Wenn du ein animiertes chinesisches Zeichen siehst, kannst du darauf klicken
-bzw. es berühren. Es öffnet sich eine Tabelle mit den einzelnen Strichen, z.B.:
-
-
-### Auf eine neuere Version updaten
-Wenn eine neuere Version als apkg verfügbar ist und du updaten möchtest, folge
-noch einmal den Schritten oben. Neue Vokabeln und Features werden importiert,
-aber dein bisheriger Fortschritt bleibt.
-
-### Wenn ich ein Smartphone verwende, brauche ich dann trotzdem die PC-Version?
-Ja, mit der PC-Version kann das _apkg_ importiert bzw. upgedated werden. Sobald
-du deine Kartensammlung mit Anki Web synchronisiert hast, kannst du auch auf
-_AnkiDroid_, _Anki Mobile_ oder _Anki Web_ von einem Smartphone aus lernen.
-
-## Anpassung
-Siehe dazu die englische Version unter _Advanced usage and customization_.
-
-## Zum Kartendeck beitragen
-Du kannst gern ein GitHub-Issue anlegen wenn du Schwierigkeiten bei der
-Verwendung hast. Ein Pull-Request freut mich natürlich noch mehr. Für
-Verbesserungsvorschläge auch gerne Issues anlegen.
-
-Wenn du selbst kein sehr technischer Benutzer bist aber trotzdem neue Wörter
-hinzufügen willst, kannst du auch gerne ein Issue mit deinen Wörtern anlegen
-und ich helfe dabei.
-
-# 貘老师的汉语 (English version)
-This is a flashcard deck for the popular _Anki_ app to learn Mandarin Chinese.
-It is targeted at native speakers of _German_ and includes cards to practice:
+The template and content is targeted at native speakers of _German_ and includes cards to practice:
* listening to and understanding Chinese speech,
* reading Hànzì and Pīnyīn,
* writing Hànzì,
@@ -120,102 +21,24 @@ coding skills to do any of this.
If you like coding, you can also check out this repository and customize the
template for your own needs. See below for details.
-## Quickstart guide
-If you just want to practice, follow these steps.
-
-### Step 1: Download apkg
-Download the latest deck as an _apkg_ file from the
-[Releases](https://github.com/tapirbug/anki-template-hanyu/releases)
-section on the GitHub repo, e.g. download `hanyu-0.9.0.apkg` and save it on
-your PC.
-
-### Step 2: Install Anki Desktop
-If you don't yet have Anki installed, download a version for your PC from the
-official [Anki](https://apps.ankiweb.net/#download) website. Install it to
-your PC.
-
-### Step 3: Import the Deck
-Import the _apkg_ deck into Anki with _File | Import…_ on Anki Desktop:
-
-
-
-
-
-That's all you need to practice on your PC. Go ahead and try it out!
-
-### Step 4: Set up Anki on your phone (optional)
-A nice feature of Anki is that you can also practice on your phone or other
-device. If you don't need this right now, skip this step completely or do it
-later.
-
-First, make sure that your collection of cards is synced to the web. Hit the
-_Sync_ button on the top right in Anki Desktop to do this. You may need to
-register if you don't yet have an account on Anki Web.
-
-When the synchronization has finished, you can practice over the web on any
-device including your mobile phone by visiting https://ankiweb.net/ in your
-browser. If you prefer a native app, try
-[AnkiDroid](https://play.google.com/store/apps/details?id=com.ichi2.anki&hl=de_AT&gl=US&pli=1)
-(for Android phones, free)
-or
-[Anki Mobile](https://apps.apple.com/de/app/ankimobile-flashcards/id373493387)
-(mobile Apple devices, e.g. iPhone or iPad, ~30€).
-
-### Step 5: Configuring text-to-speech on AnkiDroid (optional)
-When using AnkiDroid, it is recommended to activate text-to-speech under
-_Settings | Advanced | Text to speech_. This will speak the characters out loud
-when practicing listening (or for other cards when the backside is shown). To
-replay the sound, use the play button in the menu bar. This button may be
-invisible for you unless you change it to _Always show_ under _Settings |
-Reviewing | App bar buttons | Replay audio_.
-
-On other platforms like _AnkiWeb_, _Anki Mobile_ or on the desktop version of
-Anki, no configuration is needed for text-to-speech. You can use the play
-button within the template to replay without extra configuration.
-
-### Step 5: Enjoy!
-That's it, have fun learning!
-
-## Advanced usage
-### How do I view the individual strokes of a Chinese character?
-Whenever you see a chinese character, there is also an animation to showcase
-the correct stroke order. If the animation is too fast or too slow for you,
-instead tap or click the character in question. This will show you all the
-strokes in sequence, e.g.:
-
-
-### Updating to a newer version
-If a newer version of this template is available and you want to update, repeat
-the guide above with the newer apkg. This will give you the newest features
-and vocabulary, but will keep your progress with the vocabulary you already
-learned.
-
-### As a smartphone user, do I need the PC version at all?
-Yes, you need the desktop version to import the _apkg_ and to update to newer
-versions. Once you have synced your card collection with this deck to the web,
-you can also practice with _AnkiDroid_, _Anki Mobile_ or _Anki Web_.
-
-## Advanced usage and customization
-Many customizations to this template can be done right in Anki. For example,
-you can change the vocabulary or add new words, change the names of templates
-(e.g. "Lesen (Pīnyīn)" to something else). You can also add extra CSS for minor
-optical tweaks. Changing the HTML will be a bit more involved, but if you want
-to do some deeper customization or add new features, you can follow the steps
-in _Building_ to generate customized HTML.
-
## Building
Read this section if you want to make a customized version of the template,
e.g. to change the name of the fields to match your pre-existing notes, or if
you want to add entirely new features.
+### Overview
+What this whole thing does is generate a bunch of HTML files and then bake
+them into anki packages (APKG) files with bundled vocabulary using python.
+The build process is controlled with _make_.
+
### Prerequesites
Make sure that you have _node.js_, _yarn_, _pipenv_, _zip_, and _make_
installed.
Then, check out the repo:
- git clone git@github.com:tapirbug/anki-template-hanyu.git
- cd anki-template-hanyu
+ git clone git@gitlab.phaidra.org:kartenaale/sinologie-anki-pack.git
+ cd sinologie-anki-pack
### Applying Changes
Run a dev server at https://localhost:1234/:
@@ -253,10 +76,10 @@ If you want to add more packs or extend them, you will have to do without docs
for the moment, but try to do something similar as in the example content.
## Contributing
-Feel free to raise a Github issue if you are experiencing issues or have any
+Feel free to raise an issue if you are experiencing issues or if you have any
suggestions or even pull requests to make this template better.
-If you want to contribute new words but are not that technical, just open an
-issue and post the new words there as an Anki collection or some other format
-of your choice.
+If you want to contribute new words but are not that technical, open an issue
+and post the new words there as an Anki collection or some other format of your
+choice.
diff --git a/docs/screenshots/screenshot-anki-import-dialog.png b/screenshots/screenshot-anki-import-dialog.png
similarity index 100%
rename from docs/screenshots/screenshot-anki-import-dialog.png
rename to screenshots/screenshot-anki-import-dialog.png
diff --git a/docs/screenshots/screenshot-anki-import.png b/screenshots/screenshot-anki-import.png
similarity index 100%
rename from docs/screenshots/screenshot-anki-import.png
rename to screenshots/screenshot-anki-import.png
diff --git a/docs/screenshots/screenshot-practice-writing.png b/screenshots/screenshot-practice-writing.png
similarity index 100%
rename from docs/screenshots/screenshot-practice-writing.png
rename to screenshots/screenshot-practice-writing.png
diff --git a/src/index.html b/src/index.html
deleted file mode 100644
index 32a4297607195299b910be1397892f7acbcb4539..0000000000000000000000000000000000000000
--- a/src/index.html
+++ /dev/null
@@ -1,62 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Anki Template Hanyu Overview</title>
-</head>
-<body>
- <h1>Overview</h1>
-
- <h2>templates/facts</h2>
- <h3>Q/A</h3>
- <h4>Front</h4>
- <a href="templates/facts/q_a/front.html">read/front.html</a>
- <h4>Back</h4>
- <a href="templates/facts/q_a/back.html">read/back.html</a>
-
- <h2>templates/hanzi</h2>
- <h3>Read</h3>
- <h4>Front</h4>
- <a href="templates/hanzi/read/front.html">read/front.html</a>
- <h4>Back</h4>
- <a href="templates/hanzi/read/back.html">read/back.html</a>
- <h3>Write</h3>
- <h4>Front</h4>
- <a href="templates/hanzi/write/front.html">write/front.html</a>
- <h4>Back</h4>
- <a href="templates/hanzi/write/back.html">write/back.html</a>
-
- <h2>templates/molaoshi</h2>
- <h3>Hear</h3>
- <h4>Front</h4>
- <a href="templates/molaoshi/hear/front.html">hear/front.html</a>
- <h4>Back</h4>
- <a href="templates/molaoshi/hear/back.html">hear/back.html</a>
-
- <h3>Read Hanzi</h3>
- <h4>Front</h4>
- <a href="templates/molaoshi/read_hanzi/front.html">read_hanzi/front.html</a>
- <h4>Back</h4>
- <a href="templates/molaoshi/read_hanzi/back.html">read_hanzi/back.html</a>
-
- <h3>Read Pinyin</h3>
- <h4>Front</h4>
- <a href="templates/molaoshi/read_pinyin/front.html">read_pinyin/front.html</a>
- <h4>Back</h4>
- <a href="templates/molaoshi/read_pinyin/back.html">read_pinyin/back.html</a>
-
- <h3>Speak</h3>
- <h4>Front</h4>
- <a href="templates/molaoshi/speak/front.html">speak/front.html</a>
- <h4>Back</h4>
- <a href="templates/molaoshi/speak/back.html">speak/back.html</a>
-
- <h3>Write</h3>
- <h4>Front</h4>
- <a href="templates/molaoshi/speak/front.html">speak/front.html</a>
- <h4>Back</h4>
- <a href="templates/molaoshi/write/back.html">write/back.html</a>
-</body>
-</html>
\ No newline at end of file
diff --git a/src/templates/index.html b/src/templates/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..023e32e59018f20410c7d0d9457eca5f21c85681
--- /dev/null
+++ b/src/templates/index.html
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Anki Template Hanyu Overview</title>
+</head>
+
+<body>
+ <h1>Overview</h1>
+
+ <h2>templates/facts</h2>
+ <h3>Q/A</h3>
+ <h4>Front</h4>
+ <a href="facts/q_a/front.html">read/front.html</a>
+ <h4>Back</h4>
+ <a href="facts/q_a/back.html">read/back.html</a>
+
+ <h2>templates/hanzi</h2>
+ <h3>Read</h3>
+ <h4>Front</h4>
+ <a href="hanzi/read/front.html">read/front.html</a>
+ <h4>Back</h4>
+ <a href="hanzi/read/back.html">read/back.html</a>
+ <h3>Write</h3>
+ <h4>Front</h4>
+ <a href="hanzi/write/front.html">write/front.html</a>
+ <h4>Back</h4>
+ <a href="hanzi/write/back.html">write/back.html</a>
+
+ <h2>templates/molaoshi</h2>
+ <h3>Hear</h3>
+ <h4>Front</h4>
+ <a href="molaoshi/hear/front.html">hear/front.html</a>
+ <h4>Back</h4>
+ <a href="molaoshi/hear/back.html">hear/back.html</a>
+
+ <h3>Read Hanzi</h3>
+ <h4>Front</h4>
+ <a href="molaoshi/read_hanzi/front.html">read_hanzi/front.html</a>
+ <h4>Back</h4>
+ <a href="molaoshi/read_hanzi/back.html">read_hanzi/back.html</a>
+
+ <h3>Read Pinyin</h3>
+ <h4>Front</h4>
+ <a href="molaoshi/read_pinyin/front.html">read_pinyin/front.html</a>
+ <h4>Back</h4>
+ <a href="molaoshi/read_pinyin/back.html">read_pinyin/back.html</a>
+
+ <h3>Speak</h3>
+ <h4>Front</h4>
+ <a href="molaoshi/speak/front.html">speak/front.html</a>
+ <h4>Back</h4>
+ <a href="molaoshi/speak/back.html">speak/back.html</a>
+
+ <h3>Write</h3>
+ <h4>Front</h4>
+ <a href="molaoshi/speak/front.html">speak/front.html</a>
+ <h4>Back</h4>
+ <a href="molaoshi/write/back.html">write/back.html</a>
+</body>
+
+</html>
\ No newline at end of file