diff --git a/ext/bg/js/settings/profile-conditions-ui.js b/ext/bg/js/settings/profile-conditions-ui.js index 5db823af..9cedd1ac 100644 --- a/ext/bg/js/settings/profile-conditions-ui.js +++ b/ext/bg/js/settings/profile-conditions-ui.js @@ -19,8 +19,9 @@ * KeyboardMouseInputField */ -class ProfileConditionsUI { +class ProfileConditionsUI extends EventDispatcher { constructor(settingsController) { + super(); this._settingsController = settingsController; this._os = null; this._conditionGroupsContainer = null; @@ -88,7 +89,12 @@ class ProfileConditionsUI { this._os = value; } - prepare(profileIndex, conditionGroups) { + async prepare(profileIndex) { + const options = await this._settingsController.getOptionsFull(); + const {profiles} = options; + if (profileIndex < 0 || profileIndex >= profiles.length) { return; } + const {conditionGroups} = profiles[profileIndex]; + this._profileIndex = profileIndex; this._conditionGroupsContainer = document.querySelector('#profile-condition-groups'); this._addConditionGroupButton = document.querySelector('#profile-add-condition-group'); @@ -195,6 +201,8 @@ class ProfileConditionsUI { items: [] }]); + this._triggerConditionGroupCountChanged(this._children.length); + return true; } @@ -228,6 +236,8 @@ class ProfileConditionsUI { deleteCount: 0, items: [conditionGroup] }]); + + this._triggerConditionGroupCountChanged(this._children.length); } _addConditionGroup(conditionGroup, index) { @@ -269,6 +279,10 @@ class ProfileConditionsUI { _normalizeDomains(value) { return this.splitValue(value).join(', '); } + + _triggerConditionGroupCountChanged(count) { + this.trigger('conditionGroupCountChanged', {count, profileIndex: this._profileIndex}); + } } class ProfileConditionGroupUI { @@ -302,6 +316,10 @@ class ProfileConditionGroupUI { return this._node; } + get childCount() { + return this._children.length; + } + prepare(conditionGroup) { this._node = this._parent.instantiateTemplate('profile-condition-group'); this._conditionContainer = this._node.querySelector('.profile-condition-list'); @@ -358,7 +376,7 @@ class ProfileConditionGroupUI { }]); if (this._children.length === 0) { - this._parent.removeConditionGroup(this); + this.removeSelf(); } return true; @@ -369,6 +387,10 @@ class ProfileConditionGroupUI { return this._parent.getPath(`conditionGroups[${this._index}]${property}`); } + removeSelf() { + this._parent.removeConditionGroup(this); + } + // Private _onAddConditionButtonClick() { @@ -455,7 +477,10 @@ class ProfileConditionUI { this._eventListeners.addEventListener(this._typeInput, 'change', this._onTypeChange.bind(this), false); this._eventListeners.addEventListener(this._operatorInput, 'change', this._onOperatorChange.bind(this), false); if (this._removeButton !== null) { this._eventListeners.addEventListener(this._removeButton, 'click', this._onRemoveButtonClick.bind(this), false); } - if (this._menuButton !== null) { this._eventListeners.addEventListener(this._menuButton, 'menuClosed', this._onMenuClosed.bind(this), false); } + if (this._menuButton !== null) { + this._eventListeners.addEventListener(this._menuButton, 'menuOpened', this._onMenuOpened.bind(this), false); + this._eventListeners.addEventListener(this._menuButton, 'menuClosed', this._onMenuClosed.bind(this), false); + } } cleanup() { @@ -520,11 +545,21 @@ class ProfileConditionUI { this._removeSelf(); } + _onMenuOpened({detail: {menu}}) { + const deleteGroup = menu.querySelector('.popup-menu-item[data-menu-action="deleteGroup"]'); + if (deleteGroup !== null) { + deleteGroup.hidden = (this._parent.childCount <= 1); + } + } + _onMenuClosed({detail: {action}}) { switch (action) { case 'delete': this._removeSelf(); break; + case 'deleteGroup': + this._parent.removeSelf(); + break; case 'resetValue': this._resetValue(); break; diff --git a/ext/bg/js/settings/profile-controller.js b/ext/bg/js/settings/profile-controller.js index b56f92bb..f40818c7 100644 --- a/ext/bg/js/settings/profile-controller.js +++ b/ext/bg/js/settings/profile-controller.js @@ -92,6 +92,7 @@ class ProfileController { if (this._profileMoveUpButton !== null) { this._profileMoveUpButton.addEventListener('click', this._onMove.bind(this, -1), false); } if (this._profileMoveDownButton !== null) { this._profileMoveDownButton.addEventListener('click', this._onMove.bind(this, 1), false); } + this._profileConditionsUI.on('conditionGroupCountChanged', this._onConditionGroupCountChanged.bind(this)); this._settingsController.on('optionsChanged', this._onOptionsChanged.bind(this)); this._onOptionsChanged(); } @@ -334,7 +335,7 @@ class ProfileController { this._profileConditionsUI.cleanup(); this._profileConditionsIndex = profileIndex; - this._profileConditionsUI.prepare(profileIndex, profile.conditionGroups); + this._profileConditionsUI.prepare(profileIndex); if (this._profileConditionsProfileName !== null) { this._profileConditionsProfileName.textContent = profile.name; } @@ -368,7 +369,7 @@ class ProfileController { this._profileConditionsUI.cleanup(); const conditionsProfile = this._getProfile(this._profileConditionsIndex !== null ? this._profileConditionsIndex : settingsProfileIndex); if (conditionsProfile !== null) { - this._profileConditionsUI.prepare(settingsProfileIndex, conditionsProfile.conditionGroups); + this._profileConditionsUI.prepare(settingsProfileIndex); } // Udpate profile entries @@ -449,6 +450,13 @@ class ProfileController { this.moveProfile(this._settingsController.profileIndex, offset); } + _onConditionGroupCountChanged({count, profileIndex}) { + if (profileIndex >= 0 && profileIndex < this._profileEntryList.length) { + const profileEntry = this._profileEntryList[profileIndex]; + profileEntry.setConditionGroupsCount(count); + } + } + _addProfileEntry(profileIndex) { const profile = this._profiles[profileIndex]; const node = this._settingsController.instantiateTemplate('profile-entry'); @@ -626,10 +634,14 @@ class ProfileEntry { updateState() { this._nameInput.value = this._profile.name; - this._countText.textContent = this._profile.conditionGroups.length; + this._countText.textContent = `${this._profile.conditionGroups.length}`; this._isDefaultRadio.checked = (this._index === this._profileController.profileCurrentIndex); } + setConditionGroupsCount(count) { + this._countText.textContent = `${count}`; + } + // Private _onIsDefaultRadioChange(e) { diff --git a/ext/bg/settings2.html b/ext/bg/settings2.html index 11a2dad8..5b9d702d 100644 --- a/ext/bg/settings2.html +++ b/ext/bg/settings2.html @@ -1792,6 +1792,7 @@