aboutsummaryrefslogtreecommitdiff
path: root/ext/fg
diff options
context:
space:
mode:
Diffstat (limited to 'ext/fg')
-rw-r--r--ext/fg/img/pronounce.pngbin0 -> 610 bytes
-rw-r--r--ext/fg/js/client.js7
-rw-r--r--ext/fg/js/frame.js19
3 files changed, 22 insertions, 4 deletions
diff --git a/ext/fg/img/pronounce.png b/ext/fg/img/pronounce.png
new file mode 100644
index 00000000..6056d234
--- /dev/null
+++ b/ext/fg/img/pronounce.png
Binary files differ
diff --git a/ext/fg/js/client.js b/ext/fg/js/client.js
index ec2ea630..4ac40b65 100644
--- a/ext/fg/js/client.js
+++ b/ext/fg/js/client.js
@@ -167,6 +167,13 @@ class Client {
});
}
+ api_pronounce(index) {
+ const dfn = this.definitions[index];
+ const url = `http://assets.languagepod101.com/dictionary/japanese/audiomp3.php?kana=${dfn.reading}&kanji=${dfn.expression}`;
+ const audio = new Audio(url);
+ audio.play();
+ }
+
api_displayKanji(kanji) {
bgFindKanji(kanji, (definitions) => {
const sequence = ++this.sequence;
diff --git a/ext/fg/js/frame.js b/ext/fg/js/frame.js
index a61bb9ee..376d4826 100644
--- a/ext/fg/js/frame.js
+++ b/ext/fg/js/frame.js
@@ -26,8 +26,8 @@ function registerKanjiLinks() {
}
}
-function registerActionLinks() {
- for (const link of [].slice.call(document.getElementsByClassName('action-link'))) {
+function registerLearnLinks() {
+ for (const link of [].slice.call(document.getElementsByClassName('action-learn'))) {
link.addEventListener('click', (e) => {
e.preventDefault();
const ds = e.currentTarget.dataset;
@@ -36,9 +36,20 @@ function registerActionLinks() {
}
}
+function registerPronounceLinks() {
+ for (const link of [].slice.call(document.getElementsByClassName('action-pronounce'))) {
+ link.addEventListener('click', (e) => {
+ e.preventDefault();
+ const ds = e.currentTarget.dataset;
+ window.parent.postMessage({action: 'pronounce', params: ds.index}, '*');
+ });
+ }
+}
+
function onDomContentLoaded() {
registerKanjiLinks();
- registerActionLinks();
+ registerLearnLinks();
+ registerPronounceLinks();
}
function onMessage(e) {
@@ -50,7 +61,7 @@ function onMessage(e) {
function api_setActionState({index, state, sequence}) {
for (const mode in state) {
- const matches = document.querySelectorAll(`.action-link[data-sequence="${sequence}"][data-index="${index}"][data-mode="${mode}"]`);
+ const matches = document.querySelectorAll(`.action-learn[data-sequence="${sequence}"][data-index="${index}"][data-mode="${mode}"]`);
if (matches.length === 0) {
return;
}