aboutsummaryrefslogtreecommitdiff
path: root/ext
diff options
context:
space:
mode:
Diffstat (limited to 'ext')
-rw-r--r--ext/bg/context.html11
-rw-r--r--ext/bg/js/context-main.js16
-rw-r--r--ext/bg/search.html2
-rw-r--r--ext/fg/float.html8
-rw-r--r--ext/mixed/display-templates.html22
-rw-r--r--ext/mixed/js/display-generator.js11
-rw-r--r--ext/mixed/js/display.js9
-rw-r--r--ext/mixed/js/hotkey-help-controller.js120
-rw-r--r--ext/mixed/js/html-template-collection.js4
9 files changed, 183 insertions, 20 deletions
diff --git a/ext/bg/context.html b/ext/bg/context.html
index 4b2bcb8c..afd89207 100644
--- a/ext/bg/context.html
+++ b/ext/bg/context.html
@@ -30,9 +30,9 @@
<optgroup label="Primary Profile" id="profile-select-option-group"></optgroup>
</select></span>
</button>
- <a class="nav-button action-open-settings" data-icon="cog" title="Options&#10;(Middle click to open in new tab)"></a>
- <a class="nav-button action-open-search" data-icon="magnifying-glass" title="Search (Alt + Insert)&#10;(Middle click to open in new tab)"></a>
- <a class="nav-button action-open-info" data-icon="question-mark" title="Information"></a>
+ <a class="nav-button action-open-settings" data-icon="cog" title="Settings" data-hotkey='["global:openSettingsPage","title","Settings ({0})"]'></a>
+ <a class="nav-button action-open-search" data-icon="magnifying-glass" title="Search" data-hotkey='["global:openSearchPage","title","Search ({0})"]'></a>
+ <a class="nav-button action-open-info" data-icon="question-mark" title="Information" data-hotkey='["global:openInfoPage","title","Information ({0})"]'></a>
</div>
</div>
@@ -42,7 +42,7 @@
<span class="link-group-icon"><input type="checkbox" id="enable-search2"></span><span class="link-group-label">Enable content scanning</span>
</label>
<a class="link-group action-open-settings">
- <span class="link-group-icon" data-icon="chevron"></span><span class="link-group-label">Options</span>
+ <span class="link-group-icon" data-icon="chevron"></span><span class="link-group-label">Settings</span>
</a>
<a class="link-group action-open-search">
<span class="link-group-icon" data-icon="chevron"></span><span class="link-group-label">Search</span>
@@ -57,6 +57,9 @@
<script src="/mixed/js/comm.js"></script>
<script src="/mixed/js/api.js"></script>
+<script src="/mixed/js/hotkey-help-controller.js"></script>
+<script src="/mixed/js/hotkey-util.js"></script>
+
<script src="/bg/js/context-main.js"></script>
</body>
diff --git a/ext/bg/js/context-main.js b/ext/bg/js/context-main.js
index 839b534e..65853514 100644
--- a/ext/bg/js/context-main.js
+++ b/ext/bg/js/context-main.js
@@ -16,6 +16,7 @@
*/
/* global
+ * HotkeyHelpController
* api
*/
@@ -35,6 +36,8 @@ class DisplayController {
const optionsFull = await api.optionsGetFull();
this._optionsFull = optionsFull;
+ this._setupHotkeys();
+
const optionsPageUrl = optionsFull.global.useSettingsV2 ? '/bg/settings2.html' : manifest.options_ui.page;
this._setupButtonEvents('.action-open-settings', 'openSettingsPage', chrome.runtime.getURL(optionsPageUrl));
@@ -99,6 +102,19 @@ class DisplayController {
}
}
+ async _setupHotkeys() {
+ const hotkeyHelpController = new HotkeyHelpController();
+ await hotkeyHelpController.prepare();
+
+ const {profiles, profileCurrent} = this._optionsFull;
+ const primaryProfile = (profileCurrent >= 0 && profileCurrent < profiles.length) ? profiles[profileCurrent] : null;
+ if (primaryProfile !== null) {
+ hotkeyHelpController.setOptions(primaryProfile.options);
+ }
+
+ hotkeyHelpController.setupNode(document.documentElement);
+ }
+
_updateProfileSelect(profiles, profileCurrent) {
const select = document.querySelector('#profile-select');
const optionGroup = document.querySelector('#profile-select-option-group');
diff --git a/ext/bg/search.html b/ext/bg/search.html
index f8e4d21c..4a0cac58 100644
--- a/ext/bg/search.html
+++ b/ext/bg/search.html
@@ -94,6 +94,8 @@
<script src="/mixed/js/display-notification.js"></script>
<script src="/mixed/js/dynamic-loader.js"></script>
<script src="/mixed/js/hotkey-handler.js"></script>
+<script src="/mixed/js/hotkey-help-controller.js"></script>
+<script src="/mixed/js/hotkey-util.js"></script>
<script src="/mixed/js/media-loader.js"></script>
<script src="/mixed/js/scroll.js"></script>
<script src="/mixed/js/text-scanner.js"></script>
diff --git a/ext/fg/float.html b/ext/fg/float.html
index 52fe3e66..512818bd 100644
--- a/ext/fg/float.html
+++ b/ext/fg/float.html
@@ -66,11 +66,11 @@
<div class="content-sidebar scrollbar" id="content-sidebar">
<div class="content-sidebar-inner">
<div class="content-sidebar-top-pre">
- <button class="sidebar-button danger" id="close-button" title="Close popup"><span class="sidebar-button-icon" data-icon="cross"></span></button>
+ <button class="sidebar-button danger" id="close-button" title="Close popup" data-hotkey='["close","title","Close popup ({0})"]'><span class="sidebar-button-icon" data-icon="cross"></span></button>
</div>
<div class="content-sidebar-top">
- <button class="sidebar-button" disabled id="navigate-previous-button" title="Previous definition (Alt + B)"><span class="sidebar-button-icon" data-icon="left-chevron"></span></button>
- <button class="sidebar-button" disabled id="navigate-next-button" title="Next definition (Alt + F)"><span class="sidebar-button-icon" data-icon="right-chevron"></span></button>
+ <button class="sidebar-button" disabled id="navigate-previous-button" title="Previous definition" data-hotkey='["historyBackward","title","Previous definition ({0})"]'><span class="sidebar-button-icon" data-icon="left-chevron"></span></button>
+ <button class="sidebar-button" disabled id="navigate-next-button" title="Next definition" data-hotkey='["historyForward","title","Next definition ({0})"]'><span class="sidebar-button-icon" data-icon="right-chevron"></span></button>
</div>
<div class="content-sidebar-bottom">
<button class="sidebar-button" id="profile-button"><span class="sidebar-button-icon" data-icon="profile"></span></button>
@@ -110,6 +110,8 @@
<script src="/mixed/js/dynamic-loader.js"></script>
<script src="/mixed/js/frame-endpoint.js"></script>
<script src="/mixed/js/hotkey-handler.js"></script>
+<script src="/mixed/js/hotkey-help-controller.js"></script>
+<script src="/mixed/js/hotkey-util.js"></script>
<script src="/mixed/js/media-loader.js"></script>
<script src="/mixed/js/panel-element.js"></script>
<script src="/mixed/js/scroll.js"></script>
diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html
index 66cd9785..c261bcdb 100644
--- a/ext/mixed/display-templates.html
+++ b/ext/mixed/display-templates.html
@@ -2,16 +2,16 @@
<!-- Term entry templates -->
<template id="term-entry-template" data-remove-whitespace-text="true"><div class="entry" data-type="term">
- <div class="entry-current-indicator" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)"><span class="entry-current-indicator-inner"></span></div>
+ <div class="entry-current-indicator" title="Current entry"><span class="entry-current-indicator-inner"></span></div>
<div class="entry-header1">
<div class="entry-header2">
<div class="entry-header3">
<div class="actions">
- <button class="action-button action-view-note" hidden disabled data-icon="view-note" title="View added note (Alt + V)"></button>
- <button class="action-button action-add-note" hidden disabled data-icon="add-term-kanji" data-mode="term-kanji" title="Add expression (Alt + E)"></button>
- <button class="action-button action-add-note" hidden disabled data-icon="add-term-kana" data-mode="term-kana" title="Add reading (Alt + R)"></button>
- <button class="action-button action-play-audio" data-icon="play-audio" title="Play audio" data-title-default="Play audio"></button>
- <span class="entry-current-indicator-icon" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)"></span>
+ <button class="action-button action-view-note" hidden disabled data-icon="view-note" title="View added note" data-hotkey='["viewNote","title","View added note ({0})"]'></button>
+ <button class="action-button action-add-note" hidden disabled data-icon="add-term-kanji" data-mode="term-kanji" title="Add expression" data-hotkey='["addNoteTermKanji","title","Add expression ({0})"]'></button>
+ <button class="action-button action-add-note" hidden disabled data-icon="add-term-kana" data-mode="term-kana" title="Add reading" data-hotkey='["addNoteTermKana","title","Add reading ({0})"]'></button>
+ <button class="action-button action-play-audio" data-icon="play-audio" title="Play audio" data-title-default="Play audio" data-hotkey='["playAudio",["title","data-title-default"],"Play audio ({0})"]'></button>
+ <span class="entry-current-indicator-icon" title="Current entry"></span>
</div>
<div class="term-expression-list"></div>
</div>
@@ -44,7 +44,7 @@
</span>
</div>
<div class="term-expression-details">
- <button class="action-button action-play-audio" data-icon="play-audio" title="Play audio" data-title-default="Play audio"></button>
+ <button class="action-button action-play-audio" data-icon="play-audio" title="Play audio" data-title-default="Play audio" data-hotkey='["playAudio",["title","data-title-default"],"Play audio ({0})"]'></button>
<div class="tags tag-list"></div>
</div>
</div></template>
@@ -84,14 +84,14 @@
<!-- Kanji entry templates -->
<template id="kanji-entry-template" data-remove-whitespace-text="true"><div class="entry" data-type="kanji">
- <div class="entry-current-indicator" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)"><span class="entry-current-indicator-inner"></span></div>
+ <div class="entry-current-indicator" title="Current entry"><span class="entry-current-indicator-inner"></span></div>
<div class="entry-header1">
<div class="entry-header2">
<div class="entry-header3">
<div class="actions">
- <button class="action-button action-view-note" hidden disabled data-icon="view-note" title="View added note (Alt + V)"></button>
- <button class="action-button action-add-note" hidden disabled data-icon="add-term-kanji" data-mode="kanji" title="Add Kanji (Alt + K)"></button>
- <span class="entry-current-indicator-icon" title="Current entry (Alt + Up/Down/Home/End/PgUp/PgDn)"></span>
+ <button class="action-button action-view-note" hidden disabled data-icon="view-note" title="View added note" data-hotkey='["viewNote","title","View added note ({0})"]'></button>
+ <button class="action-button action-add-note" hidden disabled data-icon="add-term-kanji" data-mode="kanji" title="Add kanji" data-hotkey='["addNoteKanji","title","Add kanji ({0})"]'></button>
+ <span class="entry-current-indicator-icon" title="Current entry"></span>
</div>
<div class="kanji-glyph-container">
<span class="term-expression-current-indicator"></span>
diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js
index b48ddadc..0102afbc 100644
--- a/ext/mixed/js/display-generator.js
+++ b/ext/mixed/js/display-generator.js
@@ -22,9 +22,10 @@
*/
class DisplayGenerator {
- constructor({japaneseUtil, mediaLoader}) {
+ constructor({japaneseUtil, mediaLoader, hotkeyHelpController}) {
this._japaneseUtil = japaneseUtil;
this._mediaLoader = mediaLoader;
+ this._hotkeyHelpController = hotkeyHelpController;
this._templates = null;
this._termPitchAccentStaticTemplateIsSetup = false;
}
@@ -32,6 +33,14 @@ class DisplayGenerator {
async prepare() {
const html = await api.getDisplayTemplatesHtml();
this._templates = new HtmlTemplateCollection(html);
+ this.updateHotkeys();
+ }
+
+ updateHotkeys() {
+ const hotkeyHelpController = this._hotkeyHelpController;
+ for (const template of this._templates.getAllTemplates()) {
+ hotkeyHelpController.setupNode(template.content);
+ }
}
preparePitchAccents() {
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index a9d59aff..6af35074 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -24,6 +24,7 @@
* DocumentUtil
* FrameEndpoint
* Frontend
+ * HotkeyHelpController
* MediaLoader
* PopupFactory
* QueryParser
@@ -50,9 +51,11 @@ class Display extends EventDispatcher {
this._eventListeners = new EventListenerCollection();
this._setContentToken = null;
this._mediaLoader = new MediaLoader();
+ this._hotkeyHelpController = new HotkeyHelpController();
this._displayGenerator = new DisplayGenerator({
japaneseUtil,
- mediaLoader: this._mediaLoader
+ mediaLoader: this._mediaLoader,
+ hotkeyHelpController: this._hotkeyHelpController
});
this._messageHandlers = new Map();
this._directMessageHandlers = new Map();
@@ -201,6 +204,7 @@ class Display extends EventDispatcher {
this._browser = browser;
// Prepare
+ await this._hotkeyHelpController.prepare();
await this._displayGenerator.prepare();
this._displayAudio.prepare();
this._queryParser.prepare();
@@ -285,6 +289,9 @@ class Display extends EventDispatcher {
this._updateTheme(options.general.popupTheme);
this.setCustomCss(options.general.customPopupCss);
this._displayAudio.updateOptions(options);
+ this._hotkeyHelpController.setOptions(options);
+ this._displayGenerator.updateHotkeys();
+ this._hotkeyHelpController.setupNode(document.documentElement);
this._queryParser.setOptions({
selectedParser: options.parsing.selectedParser,
diff --git a/ext/mixed/js/hotkey-help-controller.js b/ext/mixed/js/hotkey-help-controller.js
new file mode 100644
index 00000000..032573c1
--- /dev/null
+++ b/ext/mixed/js/hotkey-help-controller.js
@@ -0,0 +1,120 @@
+/*
+ * Copyright (C) 2021 Yomichan Authors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/* global
+ * HotkeyUtil
+ * api
+ */
+
+class HotkeyHelpController {
+ constructor() {
+ this._hotkeyUtil = new HotkeyUtil();
+ this._localActionHotseys = new Map();
+ this._globalActionHotkeys = new Map();
+ this._replacementPattern = /\{0\}/g;
+ }
+
+ async prepare() {
+ const {platform: {os}} = await api.getEnvironmentInfo();
+ this._hotkeyUtil.os = os;
+ await this._setupGlobalCommands(this._globalActionHotkeys);
+ }
+
+ setOptions(options) {
+ const hotkeys = options.inputs.hotkeys;
+ const hotkeyMap = this._localActionHotseys;
+ hotkeyMap.clear();
+ for (const {enabled, action, key, modifiers} of hotkeys) {
+ if (!enabled || key === null || action === '' || hotkeyMap.has(action)) { continue; }
+ hotkeyMap.set(action, this._hotkeyUtil.getInputDisplayValue(key, modifiers));
+ }
+ }
+
+ setupNode(node) {
+ const globalPrexix = 'global:';
+ const replacementPattern = this._replacementPattern;
+ for (const node2 of node.querySelectorAll('[data-hotkey]')) {
+ const data = JSON.parse(node2.dataset.hotkey);
+ let [action, attributes, values] = data;
+ if (!Array.isArray(attributes)) { attributes = [attributes]; }
+ const multipleValues = Array.isArray(values);
+
+ const actionIsGlobal = action.startsWith(globalPrexix);
+ if (actionIsGlobal) { action = action.substring(globalPrexix.length); }
+
+ const defaultAttributeValues = this._getDefaultAttributeValues(node2, data, attributes);
+
+ const hotkey = (actionIsGlobal ? this._globalActionHotkeys : this._localActionHotseys).get(action);
+
+ for (let i = 0, ii = attributes.length; i < ii; ++i) {
+ const attribute = attributes[i];
+ let value = null;
+ if (typeof hotkey !== 'undefined') {
+ value = (multipleValues ? values[i] : values);
+ value = value.replace(replacementPattern, hotkey);
+ } else {
+ value = defaultAttributeValues[i];
+ }
+
+ if (typeof value === 'string') {
+ node2.setAttribute(attribute, value);
+ } else {
+ node2.removeAttribute(attribute);
+ }
+ }
+ }
+ }
+
+ // Private
+
+ async _setupGlobalCommands(commandMap) {
+ const commands = await new Promise((resolve, reject) => {
+ chrome.commands.getAll((result) => {
+ const e = chrome.runtime.lastError;
+ if (e) {
+ reject(new Error(e.message));
+ } else {
+ resolve(result);
+ }
+ });
+ });
+
+ commandMap.clear();
+ for (const {name, shortcut} of commands) {
+ if (shortcut.length === 0) { continue; }
+ const {key, modifiers} = this._hotkeyUtil.convertCommandToInput(shortcut);
+ commandMap.set(name, this._hotkeyUtil.getInputDisplayValue(key, modifiers));
+ }
+ return commandMap;
+ }
+
+ _getDefaultAttributeValues(node, data, attributes) {
+ if (data.length > 3) {
+ return data[3];
+ }
+
+ const defaultAttributeValues = [];
+ for (let i = 0, ii = attributes.length; i < ii; ++i) {
+ const attribute = attributes[i];
+ const value = node.hasAttribute(attribute) ? node.getAttribute(attribute) : null;
+ defaultAttributeValues.push(value);
+ }
+ data[3] = defaultAttributeValues;
+ node.dataset.hotkey = JSON.stringify(data);
+ return defaultAttributeValues;
+ }
+}
diff --git a/ext/mixed/js/html-template-collection.js b/ext/mixed/js/html-template-collection.js
index 65b316c8..52d5f3b0 100644
--- a/ext/mixed/js/html-template-collection.js
+++ b/ext/mixed/js/html-template-collection.js
@@ -44,6 +44,10 @@ class HtmlTemplateCollection {
return document.importNode(template.content, true);
}
+ getAllTemplates() {
+ return this._templates.values();
+ }
+
// Private
_prepareTemplate(template) {