From 465a8e21c0a9d7b2d1e704ab9a42b5f662fd82d3 Mon Sep 17 00:00:00 2001 From: Alex Yatskov Date: Sat, 25 Feb 2017 19:14:44 -0800 Subject: [PATCH] usability improvements --- ext/bg/js/options-form.js | 52 +++++++++++++-------------------------- ext/bg/js/options.js | 2 +- ext/bg/js/yomichan.js | 39 ++++++++++++++--------------- ext/bg/options.html | 2 +- ext/fg/js/driver.js | 27 ++++++-------------- ext/fg/js/util.js | 4 --- 6 files changed, 45 insertions(+), 81 deletions(-) diff --git a/ext/bg/js/options-form.js b/ext/bg/js/options-form.js index 91c6f140..7824164c 100644 --- a/ext/bg/js/options-form.js +++ b/ext/bg/js/options-form.js @@ -28,7 +28,7 @@ function getFormData() { return optionsLoad().then(optionsOld => { const optionsNew = $.extend(true, {}, optionsOld); - optionsNew.general.autoStart = $('#activate-on-startup').prop('checked'); + optionsNew.general.enable = $('#enable-search').prop('checked'); optionsNew.general.audioPlayback = $('#audio-playback-buttons').prop('checked'); optionsNew.general.groupResults = $('#group-terms-results').prop('checked'); optionsNew.general.softKatakana = $('#soft-katakana-search').prop('checked'); @@ -87,7 +87,7 @@ $(document).ready(() => { Handlebars.partials = Handlebars.templates; optionsLoad().then(options => { - $('#activate-on-startup').prop('checked', options.general.autoStart); + $('#enable-search').prop('checked', options.general.enable); $('#audio-playback-buttons').prop('checked', options.general.audioPlayback); $('#group-terms-results').prop('checked', options.general.groupResults); $('#soft-katakana-search').prop('checked', options.general.softKatakana); @@ -172,9 +172,7 @@ function populateDictionaries(options) { $('.dict-enabled, .dict-priority').change(onOptionsChanged); $('.dict-delete').click(onDictionaryDelete); - }).catch(error => { - showDictionaryError(error); - }).then(() => { + }).catch(showDictionaryError).then(() => { showDictionarySpinner(false); if (dictCount === 0) { dictWarning.show(); @@ -191,13 +189,17 @@ function onDictionaryPurge(e) { const dictControls = $('#dict-importer, #dict-groups').hide(); const dictProgress = $('#dict-purge-progress').show(); - return database().purge().catch(error => { - showDictionaryError(error); - }).then(() => { + return database().purge().catch(showDictionaryError).then(() => { showDictionarySpinner(false); dictControls.show(); dictProgress.hide(); - return optionsLoad().then(options => populateDictionaries(options)); + return optionsLoad(); + }).then(options => { + options.dictionaries = {}; + return optionsSave(options).then(() => { + yomichan().setOptions(options); + populateDictionaries(options); + }); }); } @@ -214,13 +216,11 @@ function onDictionaryDelete() { setProgress(0.0); - database().deleteDictionary(dictGroup.data('title'), (total, current) => setProgress(current / total * 100.0)).catch(error => { - showDictionaryError(error); - }).then(() => { + database().deleteDictionary(dictGroup.data('title'), (total, current) => setProgress(current / total * 100.0)).catch(showDictionaryError).then(() => { showDictionarySpinner(false); dictProgress.hide(); dictControls.show(); - return optionsLoad().then(options => populateDictionaries(options)); + return optionsLoad().then(populateDictionaries); }); } @@ -241,11 +241,7 @@ function onDictionaryImport() { database().importDictionary(dictUrl.val(), (total, current) => setProgress(current / total * 100.0)).then(summary => { options.dictionaries[summary.title] = {enabled: true, priority: 0}; return optionsSave(options).then(() => yomichan().setOptions(options)); - }).then(() => { - return populateDictionaries(options); - }).catch(error => { - showDictionaryError(error); - }).then(() => { + }).then(() => populateDictionaries(options)).catch(showDictionaryError).then(() => { showDictionarySpinner(false); dictProgress.hide(); dictImporter.show(); @@ -330,13 +326,7 @@ function populateAnkiDeckAndModel(options) { populateAnkiFields($('#anki-terms-model').val(options.anki.terms.model), options), populateAnkiFields($('#anki-kanji-model').val(options.anki.kanji.model), options) ]); - }).then(() => { - ankiFormat.show(); - }).catch(error => { - showAnkiError(error); - }).then(() => { - showAnkiSpinner(false); - }); + }).then(() => ankiFormat.show()).catch(showAnkiError).then(() => showAnkiSpinner(false)); } function populateAnkiFields(element, options) { @@ -386,11 +376,7 @@ function onAnkiModelChanged(e) { optionsNew.anki[tabId].fields = {}; populateAnkiFields(element, optionsNew).then(() => { optionsSave(optionsNew).then(() => yomichan().setOptions(optionsNew)); - }).catch(error => { - showAnkiError(error); - }).then(() => { - showAnkiSpinner(false); - }); + }).catch(showAnkiError).then(() => showAnkiSpinner(false)); }); } @@ -409,9 +395,5 @@ function onOptionsChanged(e) { return populateAnkiDeckAndModel(optionsNew); } }); - }).catch(error => { - showAnkiError(error); - }).then(() => { - showAnkiSpinner(false); - }); + }).catch(showAnkiError).then(() => showAnkiSpinner(false)); } diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js index 65712c12..127f0421 100644 --- a/ext/bg/js/options.js +++ b/ext/bg/js/options.js @@ -20,7 +20,7 @@ function optionsSetDefaults(options) { const defaults = { general: { - autoStart: true, + enable: true, audioPlayback: true, groupResults: true, softKatakana: true, diff --git a/ext/bg/js/yomichan.js b/ext/bg/js/yomichan.js index 4c70bf0f..b1bf710f 100644 --- a/ext/bg/js/yomichan.js +++ b/ext/bg/js/yomichan.js @@ -26,18 +26,12 @@ class Yomichan { this.translator = new Translator(); this.anki = new AnkiNull(); this.options = null; - this.setEnabled(false); chrome.runtime.onMessage.addListener(this.onMessage.bind(this)); - chrome.browserAction.onClicked.addListener(this.onBrowserAction.bind(this)); chrome.runtime.onInstalled.addListener(this.onInstalled.bind(this)); + chrome.browserAction.onClicked.addListener(e => chrome.runtime.openOptionsPage()); - this.translator.prepare().then(optionsLoad).then(options => { - this.setOptions(options); - if (this.options.general.autoStart) { - this.setEnabled(true); - } - }); + this.translator.prepare().then(optionsLoad).then(this.setOptions.bind(this)); } onInstalled(details) { @@ -57,19 +51,26 @@ class Yomichan { return true; } - onBrowserAction() { - this.setEnabled(!this.enabled); - } - - setEnabled(enabled) { - this.enabled = enabled; - this.tabInvokeAll('setEnabled', this.enabled); - chrome.browserAction.setBadgeText({text: enabled ? '' : 'off'}); - } + // setEnabled(enabled) { + // this.enabled = enabled; + // this.tabInvokeAll('setEnabled', this.enabled); + // chrome.browserAction.setBadgeText({text: enabled ? '' : 'off'}); + // } setOptions(options) { this.options = options; + let usable = false; + for (const title in options.dictionaries) { + if (options.dictionaries[title].enabled) { + usable = true; + break; + } + } + + chrome.browserAction.setBadgeBackgroundColor({color: '#f0ad4e'}); + chrome.browserAction.setBadgeText({text: usable ? '' : '!'}); + if (options.anki.enable) { this.anki = new AnkiConnect(this.options.anki.server); } else { @@ -132,10 +133,6 @@ class Yomichan { return note; } - api_getEnabled({callback}) { - callback({result: this.enabled}); - } - api_getOptions({callback}) { promiseCallback(optionsLoad(), callback); } diff --git a/ext/bg/options.html b/ext/bg/options.html index ebb12f15..03e328d2 100644 --- a/ext/bg/options.html +++ b/ext/bg/options.html @@ -26,7 +26,7 @@

General Options

- +
diff --git a/ext/fg/js/driver.js b/ext/fg/js/driver.js index 421c3591..3b4c0c76 100644 --- a/ext/fg/js/driver.js +++ b/ext/fg/js/driver.js @@ -24,21 +24,16 @@ class Driver { this.lastMousePos = null; this.lastTextSource = null; this.pendingLookup = false; - this.enabled = false; this.options = null; - chrome.runtime.onMessage.addListener(this.onBgMessage.bind(this)); - window.addEventListener('mouseover', this.onMouseOver.bind(this)); - window.addEventListener('mousedown', this.onMouseDown.bind(this)); - window.addEventListener('mousemove', this.onMouseMove.bind(this)); - window.addEventListener('resize', e => this.searchClear()); - - Promise.all([getOptions(), isEnabled()]).then(([options, enabled]) => { + getOptions().then(options => { this.options = options; - this.enabled = enabled; - }).catch(error => { - this.handleError(error); - }); + window.addEventListener('mouseover', this.onMouseOver.bind(this)); + window.addEventListener('mousedown', this.onMouseDown.bind(this)); + window.addEventListener('mousemove', this.onMouseMove.bind(this)); + window.addEventListener('resize', e => this.searchClear()); + chrome.runtime.onMessage.addListener(this.onBgMessage.bind(this)); + }).catch(this.handleError.bind(this)); } popupTimerSet(callback) { @@ -63,7 +58,7 @@ class Driver { this.lastMousePos = {x: e.clientX, y: e.clientY}; this.popupTimerClear(); - if (!this.enabled) { + if (!this.options.general.enable) { return; } @@ -198,12 +193,6 @@ class Driver { api_setOptions(options) { this.options = options; } - - api_setEnabled(enabled) { - if (!(this.enabled = enabled)) { - this.searchClear(); - } - } } window.driver = new Driver(); diff --git a/ext/fg/js/util.js b/ext/fg/js/util.js index c9ee4ed7..99da6381 100644 --- a/ext/fg/js/util.js +++ b/ext/fg/js/util.js @@ -38,10 +38,6 @@ function showError(error) { window.alert(`Error: ${error}`); } -function isEnabled() { - return invokeBgApi('getEnabled', {}); -} - function getOptions() { return invokeBgApi('getOptions', {}); }