diff options
Diffstat (limited to 'ext')
-rw-r--r-- | ext/bg/context.html | 18 | ||||
-rw-r--r-- | ext/bg/css/settings.css | 154 | ||||
-rw-r--r-- | ext/bg/js/conditions-ui.js | 4 | ||||
-rw-r--r-- | ext/bg/js/settings.js | 25 | ||||
-rw-r--r-- | ext/bg/legal.html | 20 | ||||
-rw-r--r-- | ext/bg/search.html | 2 | ||||
-rw-r--r-- | ext/bg/settings.html | 165 | ||||
-rw-r--r-- | ext/fg/js/frontend.js | 18 | ||||
-rw-r--r-- | ext/fg/js/popup-proxy-host.js | 6 | ||||
-rw-r--r-- | ext/fg/js/popup-proxy.js | 4 | ||||
-rw-r--r-- | ext/fg/js/popup.js | 21 | ||||
-rw-r--r-- | ext/fg/js/source.js | 190 | ||||
-rw-r--r-- | ext/mixed/js/extension.js | 15 |
13 files changed, 402 insertions, 240 deletions
diff --git a/ext/bg/context.html b/ext/bg/context.html index 198ccd42..51346838 100644 --- a/ext/bg/context.html +++ b/ext/bg/context.html @@ -14,20 +14,20 @@ .btn-group { display: flex; + margin-top: 10px; + white-space: nowrap; } </style> </head> <body> - <p> + <div> <input type="checkbox" id="enable-search"> - </p> - <p> - <div class="btn-group" style="white-space: nowrap"> - <button type="button" id="open-search" title="Search (Alt + Insert)" class="btn btn-default btn-xs glyphicon glyphicon-search"></button> - <button type="button" id="open-options" title="Options" class="btn btn-default btn-xs glyphicon glyphicon-wrench"></button> - <button type="button" id="open-help" title="Help" class="btn btn-default btn-xs glyphicon glyphicon-question-sign"></button> - </div> - </p> + </div> + <div class="btn-group"> + <button type="button" id="open-search" title="Search (Alt + Insert)" class="btn btn-default btn-xs"><span class="glyphicon glyphicon-search"></span></button> + <button type="button" id="open-options" title="Options" class="btn btn-default btn-xs"><span class="glyphicon glyphicon-wrench"></span></button> + <button type="button" id="open-help" title="Help" class="btn btn-default btn-xs"><span class="glyphicon glyphicon-question-sign"></span></button> + </div> <script src="/mixed/lib/jquery.min.js"></script> <script src="/mixed/lib/bootstrap-toggle/bootstrap-toggle.min.js"></script> diff --git a/ext/bg/css/settings.css b/ext/bg/css/settings.css new file mode 100644 index 00000000..12bbe8a8 --- /dev/null +++ b/ext/bg/css/settings.css @@ -0,0 +1,154 @@ +/* + * Copyright (C) 2019 Alex Yatskov <alex@foosoft.net> + * Author: Alex Yatskov <alex@foosoft.net> + * + * 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/>. + */ + + +#anki-spinner, #anki-general, #anki-error, +#dict-spinner, #dict-error, #dict-warning, #dict-purge, #dict-import-progress, +#debug, .options-advanced, .storage-hidden, #storage-spinner { + display: none; +} + +.tab-content { + border-bottom: 1px #ddd solid; + border-left: 1px #ddd solid; + border-right: 1px #ddd solid; + padding: 10px; +} + +#field-templates { + font-family: monospace; + overflow-x: hidden; + white-space: pre; +} + +.bottom-links { + padding-bottom: 1em; +} + +.label-light { + font-weight: normal; +} + +.form-control.is-invalid { + border-color: #f00000; +} + +.condition { + display: flex; + -flex-wrap: wrap; +} +.condition-input { + flex: 1 1 auto; +} +.condition-line-break { + flex: 1 0 100%; + display: none; +} +.condition>.input-group-btn { + width: auto; +} +.condition>.condition-prefix:after { + content: "IF"; +} +.condition:nth-child(n+2)>.condition-prefix:after { + content: "AND"; +} + +.input-group .condition-prefix { + flex: 0 0 auto; +} +.input-group .condition-prefix, +.input-group .condition-group-separator-label { + width: 60px; + text-align: center; +} +.input-group .condition-group-separator-label { + padding: 6px 12px; + font-weight: bold; + display: inline-block; +} +.input-group .condition-type, +.input-group .condition-operator { + width: auto; + text-align: center; + text-align-last: center; +} + +.condition-group>.condition>div:first-child { + border-bottom-left-radius: 0; +} +.condition-group>.condition:nth-child(n+2)>div:first-child { + border-top-left-radius: 0; +} +.condition-group>.condition:nth-child(n+2)>div:last-child>button { + border-top-right-radius: 0; +} +.condition-group>.condition:nth-last-child(n+2)>div:last-child>button { + border-bottom-right-radius: 0; +} +.condition-group-options>.condition-add { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.condition-groups>*:last-of-type { + display: none; +} + +#custom-popup-css { + width: 100%; + min-height: 34px; + height: 96px; + resize: vertical; + font-family: 'Courier New', Courier, monospace; + white-space: pre; +} + +[data-show-for-browser] { + display: none; +} + +[data-browser=edge] [data-show-for-browser~=edge], +[data-browser=chrome] [data-show-for-browser~=chrome], +[data-browser=firefox] [data-show-for-browser~=firefox], +[data-browser=firefox-mobile] [data-show-for-browser~=firefox-mobile] { + display: initial; +} + +@media screen and (max-width: 740px) { + .col-xs-6 { + float: none; + width: 100%; + } + .col-xs-6+.col-xs-6 { + margin-top: 15px; + } +} + +@media screen and (max-width: 600px) { + .condition { + flex-wrap: wrap; + } + .condition-input { + order: 2; + } + .condition-line-break { + display: block; + order: 1; + } +} diff --git a/ext/bg/js/conditions-ui.js b/ext/bg/js/conditions-ui.js index a6f54a1c..43c6dc08 100644 --- a/ext/bg/js/conditions-ui.js +++ b/ext/bg/js/conditions-ui.js @@ -36,7 +36,7 @@ ConditionsUI.Container = class Container { this.container.empty(); - for (const conditionGroup of conditionGroups) { + for (const conditionGroup of toIterable(conditionGroups)) { this.children.push(new ConditionsUI.ConditionGroup(this, conditionGroup)); } @@ -122,7 +122,7 @@ ConditionsUI.ConditionGroup = class ConditionGroup { this.separator = ConditionsUI.instantiateTemplate('#condition-group-separator-template').appendTo(parent.container); this.addButton = this.options.find('.condition-add'); - for (const condition of conditionGroup.conditions) { + for (const condition of toIterable(conditionGroup.conditions)) { this.children.push(new ConditionsUI.Condition(this, condition)); } diff --git a/ext/bg/js/settings.js b/ext/bg/js/settings.js index a0fe7c70..9838ea02 100644 --- a/ext/bg/js/settings.js +++ b/ext/bg/js/settings.js @@ -151,6 +151,7 @@ async function formWrite(options) { function formSetupEventListeners() { $('#dict-purge-link').click(utilAsync(onDictionaryPurge)); $('#dict-file').change(utilAsync(onDictionaryImport)); + $('#dict-file-button').click(onDictionaryImportButtonClick); $('#field-templates-reset').click(utilAsync(onAnkiFieldTemplatesReset)); $('input, select, textarea').not('.anki-model').not('.profile-form *').change(utilAsync(onFormOptionsChanged)); @@ -240,6 +241,8 @@ async function onFormOptionsChanged(e) { } async function onReady() { + showExtensionInformation(); + formSetupEventListeners(); await profileOptionsSetup(); @@ -422,7 +425,7 @@ async function onDictionaryPurge(e) { dictionarySpinnerShow(true); await utilDatabasePurge(); - for (const options of await getOptionsArray()) { + for (const options of toIterable(await getOptionsArray())) { options.dictionaries = utilBackgroundIsolate({}); options.general.mainDictionary = ''; } @@ -446,6 +449,11 @@ async function onDictionaryPurge(e) { } } +function onDictionaryImportButtonClick() { + const dictFile = document.querySelector('#dict-file'); + dictFile.click(); +} + async function onDictionaryImport(e) { const dictFile = $('#dict-file'); const dictControls = $('#dict-importer').hide(); @@ -466,7 +474,7 @@ async function onDictionaryImport(e) { const exceptions = []; const summary = await utilDatabaseImport(e.target.files[0], updateProgress, exceptions); - for (const options of await getOptionsArray()) { + for (const options of toIterable(await getOptionsArray())) { options.dictionaries[summary.title] = utilBackgroundIsolate({ enabled: true, priority: 0, @@ -741,3 +749,16 @@ function storageSpinnerShow(show) { spinner.hide(); } } + + +/* + * Information + */ + +function showExtensionInformation() { + const node = document.getElementById('extension-info'); + if (node === null) { return; } + + const manifest = chrome.runtime.getManifest(); + node.textContent = `${manifest.name} v${manifest.version}`; +} diff --git a/ext/bg/legal.html b/ext/bg/legal.html index 28c7fb21..26ac033d 100644 --- a/ext/bg/legal.html +++ b/ext/bg/legal.html @@ -8,10 +8,10 @@ <link rel="stylesheet" type="text/css" href="/mixed/lib/bootstrap/css/bootstrap-theme.min.css"> </head> <body> - <div class="container-fluid"> + <div class="container"> <h3>Yomichan License</h3> <pre> -Copyright (C) 2016-2017 Alex Yatskov +Copyright (C) 2016-2019 Alex Yatskov 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 @@ -28,10 +28,20 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. </pre> <h3>EDRDG License</h3> <pre> -This package uses the <a href="http://www.csse.monash.edu.au/~jwb/edict.html">EDICT</a> and <a href="http://www.csse.monash.edu.au/~jwb/kanjidic.html">KANJIDIC</a> dictionary files. These files are -the property of the <a href="http://www.edrdg.org/"> Electronic Dictionary Research and Development Group</a>, -and are used in conformance with the Group's <a href="http://www.edrdg.org/edrdg/licence.html">licence</a>. +This package uses the <a href="https://www.edrdg.org/jmdict/edict.html">EDICT</a> and <a href="https://www.edrdg.org/wiki/index.php/KANJIDIC_Project">KANJIDIC</a> dictionary files. These files are +the property of the <a href="https://www.edrdg.org/">Electronic Dictionary Research and Development Group</a>, +and are used in conformance with the Group's <a href="https://www.edrdg.org/edrdg/licence.html">licence</a>. </pre> + <h3>Third-Party Software Licenses</h3> + <ul> + <li><a href="https://github.com/twbs/bootstrap/blob/v3.3.7/LICENSE" target="_blank" rel="noopener">Bootstrap v3.3.7</a></li> + <li><a href="https://github.com/minhur/bootstrap-toggle/blob/2.2.0/LICENSE" target="_blank" rel="noopener">Bootstrap Toggle v2.2.0</a></li> + <li><a href="https://github.com/dfahlander/Dexie.js/blob/v2.0.0-beta.10/LICENSE" target="_blank" rel="noopener">Dexie v2.0.0-beta.10</a></li> + <li><a href="https://github.com/wycats/handlebars.js/blob/v4.0.6/LICENSE" target="_blank" rel="noopener">Handlebars v4.0.6</a></li> + <li><a href="https://github.com/jquery/jquery/blob/3.2.1/LICENSE.txt" target="_blank" rel="noopener">jQuery v3.2.1</a></li> + <li><a href="https://github.com/Stuk/jszip/blob/v3.1.3/LICENSE.markdown" target="_blank" rel="noopener">JSZip v3.1.3</a></li> + <li><a href="https://github.com/WaniKani/WanaKana/blob/2.2.3/LICENSE" target="_blank" rel="noopener">WanaKana v2.2.3</a></li> + </ul> </div> </div> </body> diff --git a/ext/bg/search.html b/ext/bg/search.html index 121b477c..668b2436 100644 --- a/ext/bg/search.html +++ b/ext/bg/search.html @@ -9,7 +9,7 @@ <link rel="stylesheet" type="text/css" href="/mixed/css/display.css"> </head> <body> - <div class="container-fluid"> + <div class="container"> <div id="intro" style="overflow: hidden;"> <div class="page-header"> <h1>Yomichan Search</h1> diff --git a/ext/bg/settings.html b/ext/bg/settings.html index 6fdd54c4..0bc5e14c 100644 --- a/ext/bg/settings.html +++ b/ext/bg/settings.html @@ -6,116 +6,14 @@ <title>Yomichan Options</title> <link rel="stylesheet" type="text/css" href="/mixed/lib/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="/mixed/lib/bootstrap/css/bootstrap-theme.min.css"> - <style> - #anki-spinner, #anki-general, #anki-error, - #dict-spinner, #dict-error, #dict-warning, #dict-purge, #dict-import-progress, - #debug, .options-advanced, .storage-hidden, #storage-spinner { - display: none; - } - - .tab-content { - border-bottom: 1px #ddd solid; - border-left: 1px #ddd solid; - border-right: 1px #ddd solid; - padding: 10px; - } - - #field-templates { - font-family: monospace; - overflow-x: hidden; - white-space: pre; - } - - .bottom-links { - padding-bottom: 1em; - } - - .label-light { - font-weight: normal; - } - - .form-control.is-invalid { - border-color: #f00000; - } - - .condition>.condition-prefix:after { - content: "IF"; - } - .condition:nth-child(n+2)>.condition-prefix:after { - content: "AND"; - } - - .input-group .condition-prefix, - .input-group .condition-group-separator-label { - width: 60px; - text-align: center; - } - .input-group .condition-group-separator-label { - padding: 6px 12px; - font-weight: bold; - display: inline-block; - } - .input-group .condition-type, - .input-group .condition-operator { - width: auto; - text-align: center; - text-align-last: center; - } - - .condition-group>.condition>div:first-child { - border-bottom-left-radius: 0; - } - .condition-group>.condition:nth-child(n+2)>div:first-child { - border-top-left-radius: 0; - } - .condition-group>.condition:nth-child(n+2)>div:last-child>button { - border-top-right-radius: 0; - } - .condition-group>.condition:nth-last-child(n+2)>div:last-child>button { - border-bottom-right-radius: 0; - } - .condition-group-options>.condition-add { - border-top-left-radius: 0; - border-top-right-radius: 0; - } - - .condition-groups>*:last-of-type { - display: none; - } - - #custom-popup-css { - width: 100%; - min-height: 34px; - height: 96px; - resize: vertical; - font-family: 'Courier New', Courier, monospace; - white-space: pre; - } - - [data-show-for-browser] { - display: none; - } - - [data-browser=edge] [data-show-for-browser~=edge], - [data-browser=chrome] [data-show-for-browser~=chrome], - [data-browser=firefox] [data-show-for-browser~=firefox], - [data-browser=firefox-mobile] [data-show-for-browser~=firefox-mobile] { - display: initial; - } - - @media screen and (max-width: 740px) { - .col-xs-6 { - float: none; - width: 100%; - } - .col-xs-6+.col-xs-6 { - margin-top: 15px; - } - } - </style> + <link rel="stylesheet" type="text/css" href="/bg/css/settings.css"> </head> <body> - <div class="container-fluid"> + <div class="container"> + <div class="page-header"> + <h1>Yomichan Options</h1> + </div> + <div class="profile-form"> <h3>Profiles</h3> @@ -211,7 +109,8 @@ <div class="input-group-addon condition-prefix"></div> <div class="input-group-btn"><select class="form-control btn btn-default condition-type"><optgroup label="Type"></optgroup></select></div> <div class="input-group-btn"><select class="form-control btn btn-default condition-operator"><optgroup label="Operator"></optgroup></select></div> - <input type="text" class="form-control" /> + <div class="condition-line-break"></div> + <div class="condition-input"><input type="text" class="form-control" /></div> <div class="input-group-btn"><button class="btn btn-danger condition-remove" title="Remove"><span class="glyphicon glyphicon-remove"></span></button></div> </div></template> <template id="condition-group-separator-template"><div class="input-group"> @@ -293,14 +192,14 @@ <div class="form-group"> <div class="row"> <div class="col-xs-6"> - <label for="popup-display-mode">Popup position for horizontal text</label> + <label for="popup-horizontal-text-position">Popup position for horizontal text</label> <select class="form-control" id="popup-horizontal-text-position"> <option value="below">Below text</option> <option value="above">Above text</option> </select> </div> <div class="col-xs-6"> - <label for="popup-display-mode">Popup position for vertical text</label> + <label for="popup-vertical-text-position">Popup position for vertical text</label> <select class="form-control" id="popup-vertical-text-position"> <option value="default">Same as for horizontal text</option> <option value="before">Before text reading direction</option> @@ -315,11 +214,11 @@ <div class="form-group options-advanced"> <div class="row"> <div class="col-xs-6"> - <label for="popup-display-mode">Popup width <span class="label-light">(in pixels)</span></label> + <label for="popup-width">Popup width <span class="label-light">(in pixels)</span></label> <input type="number" min="1" id="popup-width" class="form-control"> </div> <div class="col-xs-6"> - <label for="popup-display-mode">Popup height <span class="label-light">(in pixels)</span></label> + <label for="popup-height">Popup height <span class="label-light">(in pixels)</span></label> <input type="number" min="1" id="popup-height" class="form-control"> </div> </div> @@ -328,11 +227,11 @@ <div class="form-group options-advanced"> <div class="row"> <div class="col-xs-6"> - <label for="popup-display-mode">Horizontal popup offset <span class="label-light">(in pixels)</span></label> + <label for="popup-horizontal-offset">Horizontal popup offset <span class="label-light">(in pixels)</span></label> <input type="number" min="0" id="popup-horizontal-offset" class="form-control"> </div> <div class="col-xs-6"> - <label for="popup-display-mode">Vertical popup offset <span class="label-light">(in pixels)</span></label> + <label for="popup-vertical-offset">Vertical popup offset <span class="label-light">(in pixels)</span></label> <input type="number" min="0" id="popup-vertical-offset" class="form-control"> </div> </div> @@ -341,11 +240,11 @@ <div class="form-group options-advanced"> <div class="row"> <div class="col-xs-6"> - <label for="popup-display-mode">Horizontal popup offset for vertical text <span class="label-light">(in pixels)</span></label> + <label for="popup-horizontal-offset2">Horizontal popup offset for vertical text <span class="label-light">(in pixels)</span></label> <input type="number" min="0" id="popup-horizontal-offset2" class="form-control"> </div> <div class="col-xs-6"> - <label for="popup-display-mode">Vertical popup offset for vertical text <span class="label-light">(in pixels)</span></label> + <label for="popup-vertical-offset2">Vertical popup offset for vertical text <span class="label-light">(in pixels)</span></label> <input type="number" min="0" id="popup-vertical-offset2" class="form-control"> </div> </div> @@ -414,7 +313,7 @@ </p> <div class="checkbox"> - <label><input type="checkbox" id="enable-search-within-first-popup"> Enable search within the first popup with Alt+B</label> + <label><input type="checkbox" id="enable-search-within-first-popup"> Enable search when clicking glossary entries</label> </div> <div class="checkbox"> @@ -469,7 +368,8 @@ <a href="https://foosoft.net/projects/yomichan" target="_blank" rel="noopener">download free dictionaries</a> for use with this extension and to learn about importing proprietary EPWING dictionaries. </p> - <input type="file" id="dict-file"> + <button class="btn btn-primary" id="dict-file-button">Import Dictionary</button> + <div hidden><input type="file" id="dict-file"></div> </div> </div> @@ -503,7 +403,7 @@ </div></div> <div> - <input type="button" value="Refresh" id="storage-refresh" /> + <button class="btn btn-default" id="storage-refresh">Refresh</button> </div> </div> @@ -621,6 +521,29 @@ </div> <div> + <h3>Keyboard Shortcuts</h3> + + <p class="help-block"> + Yomichan includes keyboard shortcuts for common actions which can be adjusted + using the web browser's settings. + Instructions on how to access this settings page are listed below for a few browsers. + </p> + + <h4>Chrome</h4> + <ul class="help-block"> + <li>Open the settings page (<a href="chrome://settings/">chrome://settings/</a>)</li> + <li>Click the "Extensions" link in the left sidebar (<a href="chrome://extensions/">chrome://extensions/</a>)</li> + <li>Open the left side panel using the hamburger (<strong>≡</strong>) menu button, then click "Keyboard shortcuts"</li> + </ul> + + <h4>Firefox</h4> + <ul class="help-block"> + <li>Open the extensions page (<a href="about:addons">about:addons</a>)</li> + <li>Click the button on the right with the gear icon, then click "Manage Extension Shortcuts"</li> + </ul> + </div> + + <div> <h3>Support Development</h3> <p class="help-block"> @@ -639,7 +562,7 @@ <pre id="debug"></pre> <div class="pull-right bottom-links"> - <small><a href="search.html">Search</a> • <a href="https://foosoft.net/projects/yomichan/" target="_blank" rel="noopener">Homepage</a> • <a href="legal.html">Legal</a></small> + <small><span id="extension-info"></span> • <a href="search.html">Search</a> • <a href="https://foosoft.net/projects/yomichan/" target="_blank" rel="noopener">Homepage</a> • <a href="legal.html">Legal</a></small> </div> </div> diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index 167e82c0..3292cac4 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -128,7 +128,7 @@ class Frontend { } this.popupTimerClear(); - this.searchClear(); + this.searchClear(true); } onMouseOut(e) { @@ -138,7 +138,7 @@ class Frontend { onFrameMessage(e) { const handlers = { popupClose: () => { - this.searchClear(); + this.searchClear(true); }, selectionCopy: () => { @@ -153,7 +153,7 @@ class Frontend { } onResize() { - this.searchClear(); + this.searchClear(true); } onClick(e) { @@ -265,7 +265,7 @@ class Frontend { async updateOptions() { this.options = await apiOptionsGet(this.getOptionsContext()); if (!this.options.enable) { - this.searchClear(); + this.searchClear(false); } } @@ -320,7 +320,7 @@ class Frontend { textSource.cleanup(); } if (hideResults && this.options.scanning.autoHideResults) { - this.searchClear(); + this.searchClear(true); } this.pendingLookup = false; @@ -333,7 +333,7 @@ class Frontend { const searchText = textSource.text(); if (searchText.length === 0) { - return; + return false; } const {definitions, length} = await apiTermsFind(searchText, this.getOptionsContext()); @@ -366,7 +366,7 @@ class Frontend { const searchText = textSource.text(); if (searchText.length === 0) { - return; + return false; } const definitions = await apiKanjiFind(searchText, this.getOptionsContext()); @@ -392,8 +392,8 @@ class Frontend { return true; } - searchClear() { - this.popup.hide(); + searchClear(changeFocus) { + this.popup.hide(changeFocus); this.popup.clearAutoPlayTimer(); if (this.options.scanning.selectText && this.textSourceLast) { diff --git a/ext/fg/js/popup-proxy-host.js b/ext/fg/js/popup-proxy-host.js index 396f7556..cb9741be 100644 --- a/ext/fg/js/popup-proxy-host.js +++ b/ext/fg/js/popup-proxy-host.js @@ -40,7 +40,7 @@ class PopupProxyHost { createNestedPopup: ({parentId}) => this.createNestedPopup(parentId), show: ({id, elementRect, options}) => this.show(id, elementRect, options), showOrphaned: ({id, elementRect, options}) => this.show(id, elementRect, options), - hide: ({id}) => this.hide(id), + hide: ({id, changeFocus}) => this.hide(id, changeFocus), setVisible: ({id, visible}) => this.setVisible(id, visible), containsPoint: ({id, x, y}) => this.containsPoint(id, x, y), termsShow: ({id, elementRect, writingMode, definitions, options, context}) => this.termsShow(id, elementRect, writingMode, definitions, options, context), @@ -98,9 +98,9 @@ class PopupProxyHost { return await popup.showOrphaned(elementRect, options); } - async hide(id) { + async hide(id, changeFocus) { const popup = this.getPopup(id); - return popup.hide(); + return popup.hide(changeFocus); } async setVisible(id, visible) { diff --git a/ext/fg/js/popup-proxy.js b/ext/fg/js/popup-proxy.js index 235e1730..072cebc9 100644 --- a/ext/fg/js/popup-proxy.js +++ b/ext/fg/js/popup-proxy.js @@ -58,11 +58,11 @@ class PopupProxy { return await this.invokeHostApi('showOrphaned', {id, elementRect, options}); } - async hide() { + async hide(changeFocus) { if (this.id === null) { return; } - return await this.invokeHostApi('hide', {id: this.id}); + return await this.invokeHostApi('hide', {id: this.id, changeFocus}); } async setVisible(visible) { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 08965084..64da9aef 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -105,7 +105,7 @@ class Popup { container.style.height = `${height}px`; container.style.visibility = 'visible'; - this.hideChildren(); + this.hideChildren(true); } static getPositionForHorizontalText(elementRect, width, height, maxWidth, maxHeight, optionsGeneral) { @@ -206,16 +206,21 @@ class Popup { this.invokeApi('orphaned'); } - hide() { - this.hideChildren(); + hide(changeFocus) { + if (this.isContainerHidden()) { + changeFocus = false; + } + this.hideChildren(changeFocus); this.hideContainer(); - this.focusParent(); + if (changeFocus) { + this.focusParent(); + } } - hideChildren() { - // recursively hides all children - if (this.child && !this.child.isContainerHidden()) { - this.child.hide(); + hideChildren(changeFocus) { + // Recursively hides all children. + if (this.child !== null && !this.child.isContainerHidden()) { + this.child.hide(changeFocus); } } diff --git a/ext/fg/js/source.js b/ext/fg/js/source.js index 4642de50..ee4f58e2 100644 --- a/ext/fg/js/source.js +++ b/ext/fg/js/source.js @@ -83,120 +83,142 @@ class TextSourceRange { } static shouldEnter(node) { - if (node.nodeType !== 1) { - return false; - } - - const skip = ['RT', 'SCRIPT', 'STYLE']; - if (skip.includes(node.nodeName.toUpperCase())) { - return false; + switch (node.nodeName.toUpperCase()) { + case 'RT': + case 'SCRIPT': + case 'STYLE': + return false; } const style = window.getComputedStyle(node); - const hidden = + return !( style.visibility === 'hidden' || style.display === 'none' || - parseFloat(style.fontSize) === 0; + parseFloat(style.fontSize) === 0); + } - return !hidden; + static getRubyElement(node) { + node = TextSourceRange.getParentElement(node); + if (node !== null && node.nodeName.toUpperCase() === "RT") { + node = node.parentNode; + return (node !== null && node.nodeName.toUpperCase() === "RUBY") ? node : null; + } + return null; } static seekForward(node, offset, length) { const state = {node, offset, remainder: length, content: ''}; - if (!TextSourceRange.seekForwardHelper(node, state)) { - return state; + const TEXT_NODE = Node.TEXT_NODE; + const ELEMENT_NODE = Node.ELEMENT_NODE; + let resetOffset = false; + + const ruby = TextSourceRange.getRubyElement(node); + if (ruby !== null) { + node = ruby; + resetOffset = true; } - for (let current = node; current !== null; current = current.parentElement) { - for (let sibling = current.nextSibling; sibling !== null; sibling = sibling.nextSibling) { - if (!TextSourceRange.seekForwardHelper(sibling, state)) { - return state; + while (node !== null) { + let visitChildren = true; + const nodeType = node.nodeType; + + if (nodeType === TEXT_NODE) { + state.node = node; + if (TextSourceRange.seekForwardTextNode(state, resetOffset)) { + break; } + resetOffset = true; + } else if (nodeType === ELEMENT_NODE) { + visitChildren = TextSourceRange.shouldEnter(node); } + + node = TextSourceRange.getNextNode(node, visitChildren); } return state; } - static seekForwardHelper(node, state) { - if (node.nodeType === 3 && node.parentElement && TextSourceRange.shouldEnter(node.parentElement)) { - const offset = state.node === node ? state.offset : 0; - - let consumed = 0; - let stripped = 0; - while (state.remainder - consumed > 0) { - const currentChar = node.nodeValue[offset + consumed + stripped]; - if (!currentChar) { - break; - } else if (currentChar.match(IGNORE_TEXT_PATTERN)) { - stripped++; - } else { - consumed++; - state.content += currentChar; - } - } - - state.node = node; - state.offset = offset + consumed + stripped; - state.remainder -= consumed; - } else if (TextSourceRange.shouldEnter(node)) { - for (let i = 0; i < node.childNodes.length; ++i) { - if (!TextSourceRange.seekForwardHelper(node.childNodes[i], state)) { + static seekForwardTextNode(state, resetOffset) { + const nodeValue = state.node.nodeValue; + const nodeValueLength = nodeValue.length; + let content = state.content; + let offset = resetOffset ? 0 : state.offset; + let remainder = state.remainder; + let result = false; + + for (; offset < nodeValueLength; ++offset) { + const c = nodeValue[offset]; + if (!IGNORE_TEXT_PATTERN.test(c)) { + content += c; + if (--remainder <= 0) { + result = true; + ++offset; break; } } } - return state.remainder > 0; + state.offset = offset; + state.content = content; + state.remainder = remainder; + return result; } static seekBackward(node, offset, length) { const state = {node, offset, remainder: length, content: ''}; - if (!TextSourceRange.seekBackwardHelper(node, state)) { - return state; + const TEXT_NODE = Node.TEXT_NODE; + const ELEMENT_NODE = Node.ELEMENT_NODE; + let resetOffset = false; + + const ruby = TextSourceRange.getRubyElement(node); + if (ruby !== null) { + node = ruby; + resetOffset = true; } - for (let current = node; current !== null; current = current.parentElement) { - for (let sibling = current.previousSibling; sibling !== null; sibling = sibling.previousSibling) { - if (!TextSourceRange.seekBackwardHelper(sibling, state)) { - return state; + while (node !== null) { + let visitChildren = true; + const nodeType = node.nodeType; + + if (nodeType === TEXT_NODE) { + state.node = node; + if (TextSourceRange.seekBackwardTextNode(state, resetOffset)) { + break; } + resetOffset = true; + } else if (nodeType === ELEMENT_NODE) { + visitChildren = TextSourceRange.shouldEnter(node); } + + node = TextSourceRange.getPreviousNode(node, visitChildren); } return state; } - static seekBackwardHelper(node, state) { - if (node.nodeType === 3 && node.parentElement && TextSourceRange.shouldEnter(node.parentElement)) { - const offset = state.node === node ? state.offset : node.length; - - let consumed = 0; - let stripped = 0; - while (state.remainder - consumed > 0) { - const currentChar = node.nodeValue[offset - 1 - consumed - stripped]; // negative indices are undefined in JS - if (!currentChar) { - break; - } else if (currentChar.match(IGNORE_TEXT_PATTERN)) { - stripped++; - } else { - consumed++; - state.content = currentChar + state.content; - } - } - - state.node = node; - state.offset = offset - consumed - stripped; - state.remainder -= consumed; - } else if (TextSourceRange.shouldEnter(node)) { - for (let i = node.childNodes.length - 1; i >= 0; --i) { - if (!TextSourceRange.seekBackwardHelper(node.childNodes[i], state)) { + static seekBackwardTextNode(state, resetOffset) { + const nodeValue = state.node.nodeValue; + let content = state.content; + let offset = resetOffset ? nodeValue.length : state.offset; + let remainder = state.remainder; + let result = false; + + for (; offset > 0; --offset) { + const c = nodeValue[offset - 1]; + if (!IGNORE_TEXT_PATTERN.test(c)) { + content = c + content; + if (--remainder <= 0) { + result = true; + --offset; break; } } } - return state.remainder > 0; + state.offset = offset; + state.content = content; + state.remainder = remainder; + return result; } static getParentElement(node) { @@ -219,22 +241,38 @@ class TextSourceRange { static getNodesInRange(range) { const end = range.endContainer; const nodes = []; - for (let node = range.startContainer; node !== null; node = TextSourceRange.getNextNode(node)) { + for (let node = range.startContainer; node !== null; node = TextSourceRange.getNextNode(node, true)) { nodes.push(node); if (node === end) { break; } } return nodes; } - static getNextNode(node) { - let next = node.firstChild; + static getNextNode(node, visitChildren) { + let next = visitChildren ? node.firstChild : null; if (next === null) { while (true) { next = node.nextSibling; if (next !== null) { break; } next = node.parentNode; - if (node === null) { break; } + if (next === null) { break; } + + node = next; + } + } + return next; + } + + static getPreviousNode(node, visitChildren) { + let next = visitChildren ? node.lastChild : null; + if (next === null) { + while (true) { + next = node.previousSibling; + if (next !== null) { break; } + + next = node.parentNode; + if (next === null) { break; } node = next; } diff --git a/ext/mixed/js/extension.js b/ext/mixed/js/extension.js index d7085e5b..5c803132 100644 --- a/ext/mixed/js/extension.js +++ b/ext/mixed/js/extension.js @@ -17,13 +17,24 @@ */ +// toIterable is required on Edge for cross-window origin objects. function toIterable(value) { if (typeof Symbol !== 'undefined' && typeof value[Symbol.iterator] !== 'undefined') { return value; } - const array = JSON.parse(JSON.stringify(value)); - return Array.isArray(array) ? array : []; + if (value !== null && typeof value === 'object') { + const length = value.length; + if (typeof length === 'number' && Number.isFinite(length)) { + const array = []; + for (let i = 0; i < length; ++i) { + array.push(value[i]); + } + return array; + } + } + + throw 'Could not convert to iterable'; } function extensionHasChrome() { |