Pronounce => Play Audio

ext/bg/js/templates.js

@@ -104,11 +104,11 @@ templates['term.html'] = template({"1":function(container,depth0,helpers,partial
 },"2":function(container,depth0,helpers,partials,data,blockParams,depths) {
     var helper, alias1=container.escapeExpression;
 
-  return "        <a href=\"#\" title=\"Pronounce\" class=\"action-pronounce\" data-index=\""
+  return "        <a href=\"#\" title=\"Play audio\" class=\"action-play-audio\" data-index=\""
     + alias1(((helper = (helper = helpers.index || (data && data.index)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},{"name":"index","hash":{},"data":data}) : helper)))
     + "\"><img src=\""
     + alias1(container.lambda((depths[1] != null ? depths[1].root : depths[1]), depth0))
-    + "/img/pronounce.png\"></a>\n";
+    + "/img/play_audio.png\"></a>\n";
 },"4":function(container,depth0,helpers,partials,data,blockParams,depths) {
     var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression, alias5=container.lambda;
 

ext/fg/js/client.js

@@ -168,9 +168,13 @@ class Client {
         });
     }
 
-    api_pronounce(index) {
+    api_playAudio(index) {
-        const dfn = this.definitions[index];
+        const definition = this.definitions[index];
-        const url = `http://assets.languagepod101.com/dictionary/japanese/audiomp3.php?kana=${dfn.reading}&kanji=${dfn.expression}`;
+
+        let url = `https://assets.languagepod101.com/dictionary/japanese/audiomp3.php?kanji=${definition.expression}`;
+        if (definition.reading) {
+            url += `&kana=${definition.reading}`;
+        }
 
         for (let key in this.audio) {
             this.audio[key].pause();

ext/fg/js/frame.js

@@ -36,12 +36,12 @@ function registerAddNoteLinks() {
     }
 }
 
-function registerPronounceLinks() {
+function registerAudioLinks() {
-    for (let link of [].slice.call(document.getElementsByClassName('action-pronounce'))) {
+    for (let link of [].slice.call(document.getElementsByClassName('action-play-audio'))) {
         link.addEventListener('click', (e) => {
             e.preventDefault();
             const ds = e.currentTarget.dataset;
-            window.parent.postMessage({action: 'pronounce', params: ds.index}, '*');
+            window.parent.postMessage({action: 'playAudio', params: ds.index}, '*');
         });
     }
 }
@@ -49,7 +49,7 @@ function registerPronounceLinks() {
 function onDomContentLoaded() {
     registerKanjiLinks();
     registerAddNoteLinks();
-    registerPronounceLinks();
+    registerAudioLinks();
 }
 
 function onMessage(e) {

ext/manifest.json

@@ -24,7 +24,7 @@
         "fg/img/add_kanji.png",
         "fg/img/add_vocab_kana.png",
         "fg/img/add_vocab_kanji.png",
-        "fg/img/pronounce.png",
+        "fg/img/play_audio.png",
         "fg/js/frame.js",
         "fg/ttf/kanji-stroke-orders.ttf",
         "fg/ttf/vl-gothic-regular.ttf"

tmpl/term.html

@@ -2,7 +2,7 @@
     {{#with options}}
     <div class="action-bar" data-sequence="{{../sequence}}">
         {{#if enableAudioPlayback}}
-        <a href="#" title="Pronounce" class="action-pronounce" data-index="{{@index}}"><img src="{{../root}}/img/pronounce.png"></a>
+        <a href="#" title="Play audio" class="action-play-audio" data-index="{{@index}}"><img src="{{../root}}/img/play_audio.png"></a>
         {{/if}}
         {{#if enableAnkiConnect}}
         <a href="#" title="Add term as expression" class="action-add-note disabled" data-mode="vocab_kanji" data-index="{{@index}}"><img src="{{../root}}/img/add_vocab_kanji.png"></a>