aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--ext/fg/frame.html1
-rw-r--r--ext/fg/js/frame.js47
2 files changed, 33 insertions, 15 deletions
diff --git a/ext/fg/frame.html b/ext/fg/frame.html
index 32758786..8246787b 100644
--- a/ext/fg/frame.html
+++ b/ext/fg/frame.html
@@ -13,6 +13,7 @@
<div class="content"></div>
<script src="../lib/jquery-2.2.2.min.js"></script>
+ <script src="js/util.js"></script>
<script src="js/frame.js"></script>
</body>
</html>
diff --git a/ext/fg/js/frame.js b/ext/fg/js/frame.js
index e3d152c1..fc758ffe 100644
--- a/ext/fg/js/frame.js
+++ b/ext/fg/js/frame.js
@@ -88,6 +88,9 @@
class FrameContext {
constructor() {
+ this.definitions = [];
+ this.audio = {};
+
$(window).on('message', e => {
const {action, params} = e.originalEvent.data, method = this['api_' + action];
if (typeof(method) === 'function') {
@@ -103,8 +106,20 @@ class FrameContext {
playback: options.enableAudioPlayback
};
- this.renderText('term-list.html', context).then(content => {
+ this.definitions = definitions;
+ renderText(context, 'term-list.html').then(content => {
$('.content').html(content);
+
+ $('.kanji-link').click(e => {
+ e.preventDefault();
+ findKanji($(e.target).text()).then(defs => this.api_showKanjiDefs({options, definitions: defs}));
+ });
+
+ $('.action-play-audio').click(e => {
+ e.preventDefault();
+ const index = $(e.currentTarget).data('index');
+ this.playAudio(this.definitions[index]);
+ });
});
}
@@ -114,25 +129,27 @@ class FrameContext {
addable: options.ankiMethod !== 'disabled'
};
- this.renderText('kanji-list.html', context).then(content => {
+ this.definitions = definitions;
+ renderText(context, 'kanji-list.html').then(content => {
$('.content').html(content);
});
}
- renderText(template, data) {
- return this.invokeBgApi('renderText', {data, template});
- }
+ playAudio(definition) {
+ let url = `https://assets.languagepod101.com/dictionary/japanese/audiomp3.php?kanji=${encodeURIComponent(definition.expression)}`;
+ if (definition.reading) {
+ url += `&kana=${encodeURIComponent(definition.reading)}`;
+ }
- invokeBgApi(action, params) {
- return new Promise((resolve, reject) => {
- chrome.runtime.sendMessage({action, params}, ({result, error}) => {
- if (error) {
- reject(error);
- } else {
- resolve(result);
- }
- });
- });
+ for (const key in this.audio) {
+ this.audio[key].pause();
+ }
+
+ const audio = this.audio[url] || new Audio(url);
+ audio.currentTime = 0;
+ audio.play();
+
+ this.audio[url] = audio;
}
}