/* * Copyright (C) 2023 Yomitan Authors * Copyright (C) 2021-2022 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 . */ import {EventListenerCollection} from '../../core.js'; export class PermissionsOriginController { /** * @param {SettingsController} settingsController */ constructor(settingsController) { /** @type {SettingsController} */ this._settingsController = settingsController; /** @type {?HTMLElement} */ this._originContainer = null; /** @type {?HTMLElement} */ this._originEmpty = null; /** @type {?NodeListOf} */ this._originToggleNodes = null; /** @type {?HTMLInputElement} */ this._addOriginInput = null; /** @type {?HTMLElement} */ this._errorContainer = null; /** @type {ChildNode[]} */ this._originContainerChildren = []; /** @type {EventListenerCollection} */ this._eventListeners = new EventListenerCollection(); } /** */ async prepare() { this._originContainer = /** @type {HTMLElement} */ (document.querySelector('#permissions-origin-list')); this._originEmpty = /** @type {HTMLElement} */ (document.querySelector('#permissions-origin-list-empty')); this._originToggleNodes = /** @type {NodeListOf} */ (document.querySelectorAll('.permissions-origin-toggle')); this._addOriginInput = /** @type {HTMLInputElement} */ (document.querySelector('#permissions-origin-new-input')); this._errorContainer = /** @type {HTMLElement} */ (document.querySelector('#permissions-origin-list-error')); const addButton = /** @type {HTMLButtonElement} */ (document.querySelector('#permissions-origin-add')); for (const node of this._originToggleNodes) { node.addEventListener('change', this._onOriginToggleChange.bind(this), false); } addButton.addEventListener('click', this._onAddButtonClick.bind(this), false); this._settingsController.on('permissionsChanged', this._onPermissionsChanged.bind(this)); await this._updatePermissions(); } // Private /** * @param {import('settings-controller').PermissionsChangedEvent} details */ _onPermissionsChanged({permissions}) { this._eventListeners.removeAllEventListeners(); for (const node of this._originContainerChildren) { if (node.parentNode === null) { continue; } node.parentNode.removeChild(node); } this._originContainerChildren = []; /** @type {Set} */ const originsSet = new Set(permissions.origins); for (const node of /** @type {NodeListOf} */ (this._originToggleNodes)) { const {origin} = node.dataset; node.checked = typeof origin === 'string' && originsSet.has(origin); } let any = false; const excludeOrigins = new Set([ '' ]); const fragment = document.createDocumentFragment(); for (const origin of originsSet) { if (excludeOrigins.has(origin)) { continue; } const node = this._settingsController.instantiateTemplateFragment('permissions-origin'); const input = /** @type {HTMLInputElement} */ (node.querySelector('.permissions-origin-input')); const menuButton = /** @type {HTMLElement} */ (node.querySelector('.permissions-origin-button')); input.value = origin; this._eventListeners.addEventListener(menuButton, 'menuClose', this._onOriginMenuClose.bind(this, origin), false); this._originContainerChildren.push(...node.childNodes); fragment.appendChild(node); any = true; } const container = /** @type {HTMLElement} */ (this._originContainer); container.insertBefore(fragment, container.firstChild); /** @type {HTMLElement} */ (this._originEmpty).hidden = any; /** @type {HTMLElement} */ (this._errorContainer).hidden = true; } /** * @param {Event} e */ _onOriginToggleChange(e) { const node = /** @type {HTMLInputElement} */ (e.currentTarget); const value = node.checked; node.checked = !value; const {origin} = node.dataset; if (typeof origin !== 'string') { return; } this._setOriginPermissionEnabled(origin, value); } /** * @param {string} origin */ _onOriginMenuClose(origin) { this._setOriginPermissionEnabled(origin, false); } /** */ _onAddButtonClick() { this._addOrigin(); } /** */ async _addOrigin() { const input = /** @type {HTMLInputElement} */ (this._addOriginInput); const origin = input.value; const added = await this._setOriginPermissionEnabled(origin, true); if (added) { input.value = ''; } } /** */ async _updatePermissions() { const permissions = await this._settingsController.permissionsUtil.getAllPermissions(); this._onPermissionsChanged({permissions}); } /** * @param {string} origin * @param {boolean} enabled * @returns {Promise} */ async _setOriginPermissionEnabled(origin, enabled) { let added = false; try { added = await this._settingsController.permissionsUtil.setPermissionsGranted({origins: [origin]}, enabled); } catch (e) { const errorContainer = /** @type {HTMLElement} */ (this._errorContainer); errorContainer.hidden = false; errorContainer.textContent = e instanceof Error ? e.message : `${e}`; } if (!added) { return false; } await this._updatePermissions(); return true; } }