summaryrefslogtreecommitdiff
path: root/ext/bg/js/settings/popup-elements.js
diff options
context:
space:
mode:
Diffstat (limited to 'ext/bg/js/settings/popup-elements.js')
-rw-r--r--ext/bg/js/settings/popup-elements.js25
1 files changed, 24 insertions, 1 deletions
diff --git a/ext/bg/js/settings/popup-elements.js b/ext/bg/js/settings/popup-elements.js
index 15de91e8..930f02cd 100644
--- a/ext/bg/js/settings/popup-elements.js
+++ b/ext/bg/js/settings/popup-elements.js
@@ -112,16 +112,22 @@ class Modal extends PopupElement {
closingClassName: 'modal-container-closing',
closingAnimationDuration: 375 // Milliseconds; includes buffer
});
+ this._contentNode = null;
this._canCloseOnClick = false;
}
prepare() {
- const node = this._node;
+ const node = this.node;
+ this._contentNode = node.querySelector('.modal-content');
let dimmerNode = node.querySelector('.modal-content-dimmer');
if (dimmerNode === null) { dimmerNode = node; }
dimmerNode.addEventListener('mousedown', this._onModalContainerMouseDown.bind(this), false);
dimmerNode.addEventListener('mouseup', this._onModalContainerMouseUp.bind(this), false);
dimmerNode.addEventListener('click', this._onModalContainerClick.bind(this), false);
+
+ for (const actionNode of node.querySelectorAll('[data-modal-action]')) {
+ actionNode.addEventListener('click', this._onActionNodeClick.bind(this), false);
+ }
}
// Private
@@ -141,6 +147,23 @@ class Modal extends PopupElement {
if (e.currentTarget !== e.target) { return; }
this.setVisible(false);
}
+
+ _onActionNodeClick(e) {
+ const {modalAction} = e.currentTarget.dataset;
+ switch (modalAction) {
+ case 'expand':
+ this._setExpanded(true);
+ break;
+ case 'collapse':
+ this._setExpanded(false);
+ break;
+ }
+ }
+
+ _setExpanded(expanded) {
+ if (this._contentNode === null) { return; }
+ this._contentNode.classList.toggle('modal-content-full', expanded);
+ }
}
class StatusFooter extends PopupElement {