From e0f91b9a8a0f2e7db0362ff10623f94c6673d926 Mon Sep 17 00:00:00 2001 From: Alex Yatskov Date: Mon, 13 Jun 2016 22:09:39 -0700 Subject: [PATCH] Elementary audio playback support --- ext/bg/js/templates.js | 18 +++++++++++++----- ext/fg/img/pronounce.png | Bin 0 -> 610 bytes ext/fg/js/client.js | 7 +++++++ ext/fg/js/frame.js | 19 +++++++++++++++---- ext/manifest.json | 1 + tmpl/term.html | 9 +++++---- 6 files changed, 41 insertions(+), 13 deletions(-) create mode 100644 ext/fg/img/pronounce.png diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js index 29e86c89..3408b334 100644 --- a/ext/bg/js/templates.js +++ b/ext/bg/js/templates.js @@ -93,25 +93,33 @@ templates['kanji-list.html'] = template({"1":function(container,depth0,helpers,p + ((stack1 = container.invokePartial(partials["footer.html"],depth0,{"name":"footer.html","data":data,"helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : ""); },"usePartial":true,"useData":true,"useDepths":true}); templates['term.html'] = template({"1":function(container,depth0,helpers,partials,data,blockParams,depths) { - var stack1; + var stack1, helper, alias1=container.lambda, alias2=container.escapeExpression, alias3=depth0 != null ? depth0 : {}; - return ((stack1 = helpers["if"].call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.enableAnkiConnect : depth0),{"name":"if","hash":{},"fn":container.program(2, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : ""); + return "
\n \n" + + ((stack1 = helpers["if"].call(alias3,(depth0 != null ? depth0.enableAnkiConnect : depth0),{"name":"if","hash":{},"fn":container.program(2, data, 0, blockParams, depths),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "
\n"; },"2":function(container,depth0,helpers,partials,data,blockParams,depths) { var helper, alias1=container.lambda, alias2=container.escapeExpression, alias3=depth0 != null ? depth0 : {}, alias4=helpers.helperMissing, alias5="function"; - return "
\n \n \n \n
\n"; + + "/img/add_vocab_kana.png\">\n"; },"4":function(container,depth0,helpers,partials,data) { var stack1, helper, options, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", buffer = "
"; diff --git a/ext/fg/img/pronounce.png b/ext/fg/img/pronounce.png new file mode 100644 index 0000000000000000000000000000000000000000..6056d234a9818d248987389d4a621e5c83ce0851 GIT binary patch literal 610 zcmV-o0-gPdP)FDRfPcVFW5d%9V=z{?A#;oriL5xO+n6O2X~nf!lQuE^VWXpgu83qI(qCF{ zS}dqc=wWy-JjhR6YYDxINHb)T^nMSh)vA20R`F7)lzCSCZF94My}d73T>N+m zpyXWPL`#FF;s+j3t(LL2R!6+EP98p9G9EaJe<5S)o@#CPu0JyV*YBbiNC<>y{C`3_2 zFc^fUC0P=`0GC2D0rmxry!i<{eh#|t2UjSV*w|QyY37m5W)KQZKoA6m%^;bK|K7sb zq~^Y!1U(%y>Cs5W^^bz?JUQeR7IK)M&$43OYdMwDJVcVBtSjl_Ar8Hmr2)a$eK-tv zNC4d)(7D`Piq~gVUR7m2k$BH5O6=$i%I6Kpa_sVNy!&j)9UKPT@*VWNNNm+UIUciF wPJ00!a`S;oH}3WS@hUTDnx*^y9@F3E2OYGed{u8eJ^%m!07*qoM6N<$f+a~A3jhEB literal 0 HcmV?d00001 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; } diff --git a/ext/manifest.json b/ext/manifest.json index e6f65a8f..3cb13480 100644 --- a/ext/manifest.json +++ b/ext/manifest.json @@ -22,6 +22,7 @@ "fg/img/add_kanji.png", "fg/img/add_vocab_kana.png", "fg/img/add_vocab_kanji.png", + "fg/img/pronounce.png", "fg/js/frame.js", "fg/ttf/kanji-stroke-orders.ttf", "fg/ttf/vl-gothic-regular.ttf" diff --git a/tmpl/term.html b/tmpl/term.html index 3fb75c98..b6861b03 100644 --- a/tmpl/term.html +++ b/tmpl/term.html @@ -1,11 +1,12 @@
{{#with options}} - {{#if enableAnkiConnect}}
- - + + {{#if enableAnkiConnect}} + + + {{/if}}
- {{/if}} {{/with}} {{#if reading}}