From 6a271e067fa917614f4c81f473533e24c6d04404 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 13 Feb 2021 22:52:28 -0500 Subject: Move mixed/js (#1383) * Move mixed/js/core.js to js/core.js * Move mixed/js/yomichan.js to js/yomichan.js * Move mixed/js/timer.js to js/debug/timer.js * Move mixed/js/hotkey-handler.js to js/input/hotkey-handler.js * Move mixed/js/hotkey-help-controller.js to js/input/hotkey-help-controller.js * Move mixed/js/hotkey-util.js to js/input/hotkey-util.js * Move mixed/js/audio-system.js to js/input/audio-system.js * Move mixed/js/media-loader.js to js/input/media-loader.js * Move mixed/js/text-to-speech-audio.js to js/input/text-to-speech-audio.js * Move mixed/js/comm.js to js/comm/cross-frame-api.js * Move mixed/js/api.js to js/comm/api.js * Move mixed/js/frame-client.js to js/comm/frame-client.js * Move mixed/js/frame-endpoint.js to js/comm/frame-endpoint.js * Move mixed/js/display.js to js/display/display.js * Move mixed/js/display-audio.js to js/display/display-audio.js * Move mixed/js/display-generator.js to js/display/display-generator.js * Move mixed/js/display-history.js to js/display/display-history.js * Move mixed/js/display-notification.js to js/display/display-notification.js * Move mixed/js/display-profile-selection.js to js/display/display-profile-selection.js * Move mixed/js/japanese.js to js/language/japanese-util.js * Move mixed/js/dictionary-data-util.js to js/language/dictionary-data-util.js * Move mixed/js/document-focus-controller.js to js/dom/document-focus-controller.js * Move mixed/js/document-util.js to js/dom/document-util.js * Move mixed/js/dom-data-binder.js to js/dom/dom-data-binder.js * Move mixed/js/html-template-collection.js to js/dom/html-template-collection.js * Move mixed/js/panel-element.js to js/dom/panel-element.js * Move mixed/js/popup-menu.js to js/dom/popup-menu.js * Move mixed/js/selector-observer.js to js/dom/selector-observer.js * Move mixed/js/scroll.js to js/dom/window-scroll.js * Move mixed/js/text-scanner.js to js/language/text-scanner.js * Move mixed/js/cache-map.js to js/general/cache-map.js * Move mixed/js/object-property-accessor.js to js/general/object-property-accessor.js * Move mixed/js/task-accumulator.js to js/general/task-accumulator.js * Move mixed/js/environment.js to js/background/environment.js * Move mixed/js/dynamic-loader.js to js/scripting/dynamic-loader.js * Move mixed/js/dynamic-loader-sentinel.js to js/scripting/dynamic-loader-sentinel.js --- ext/js/display/display-profile-selection.js | 106 ++++++++++++++++++++++++++++ 1 file changed, 106 insertions(+) create mode 100644 ext/js/display/display-profile-selection.js (limited to 'ext/js/display/display-profile-selection.js') diff --git a/ext/js/display/display-profile-selection.js b/ext/js/display/display-profile-selection.js new file mode 100644 index 00000000..0a44392e --- /dev/null +++ b/ext/js/display/display-profile-selection.js @@ -0,0 +1,106 @@ +/* + * Copyright (C) 2020-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 . + */ + +/* global + * PanelElement + * api + */ + +class DisplayProfileSelection { + constructor(display) { + this._display = display; + this._profielList = document.querySelector('#profile-list'); + this._profileButton = document.querySelector('#profile-button'); + this._profilePanel = new PanelElement({ + node: document.querySelector('#profile-panel'), + closingAnimationDuration: 375 // Milliseconds; includes buffer + }); + this._profileListNeedsUpdate = false; + this._eventListeners = new EventListenerCollection(); + this._source = generateId(16); + } + + async prepare() { + yomichan.on('optionsUpdated', this._onOptionsUpdated.bind(this)); + this._profileButton.addEventListener('click', this._onProfileButtonClick.bind(this), false); + this._profileListNeedsUpdate = true; + } + + // Private + + _onOptionsUpdated({source}) { + if (source === this._source) { return; } + this._profileListNeedsUpdate = true; + if (this._profilePanel.isVisible()) { + this._updateProfileList(); + } + } + + _onProfileButtonClick(e) { + e.preventDefault(); + e.stopPropagation(); + this._setProfilePanelVisible(!this._profilePanel.isVisible()); + } + + _setProfilePanelVisible(visible) { + this._profilePanel.setVisible(visible); + this._profileButton.classList.toggle('sidebar-button-highlight', visible); + document.documentElement.dataset.profilePanelVisible = `${visible}`; + if (visible && this._profileListNeedsUpdate) { + this._updateProfileList(); + } + } + + async _updateProfileList() { + this._profileListNeedsUpdate = false; + const options = await api.optionsGetFull(); + + this._eventListeners.removeAllEventListeners(); + const displayGenerator = this._display.displayGenerator; + + const {profileCurrent, profiles} = options; + const fragment = document.createDocumentFragment(); + for (let i = 0, ii = profiles.length; i < ii; ++i) { + const {name} = profiles[i]; + const entry = displayGenerator.createProfileListItem(); + const radio = entry.querySelector('.profile-entry-is-default-radio'); + radio.checked = (i === profileCurrent); + const nameNode = entry.querySelector('.profile-list-item-name'); + nameNode.textContent = name; + fragment.appendChild(entry); + this._eventListeners.addEventListener(radio, 'change', this._onProfileRadioChange.bind(this, i), false); + } + this._profielList.textContent = ''; + this._profielList.appendChild(fragment); + } + + _onProfileRadioChange(index, e) { + if (e.currentTarget.checked) { + this._setProfileCurrent(index); + } + } + + async _setProfileCurrent(index) { + await api.modifySettings([{ + action: 'set', + path: 'profileCurrent', + value: index, + scope: 'global' + }], this._source); + this._setProfilePanelVisible(false); + } +} -- cgit v1.2.3