From d6711c3bc00086dbf4809e20fc2440004f401bd4 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Thu, 31 Jan 2019 19:18:13 +0100 Subject: [PATCH] Centralized method to handle active page overlays --- wcfsetup/install/files/js/WCF.ImageViewer.js | 8 +++-- .../WoltLabSuite/Core/Controller/Clipboard.js | 17 +++------- .../files/js/WoltLabSuite/Core/Ui/Dialog.js | 5 +-- .../Core/Ui/Page/Menu/Abstract.js | 7 ++-- .../files/js/WoltLabSuite/Core/Ui/Screen.js | 34 +++++++++++++++++++ 5 files changed, 50 insertions(+), 21 deletions(-) diff --git a/wcfsetup/install/files/js/WCF.ImageViewer.js b/wcfsetup/install/files/js/WCF.ImageViewer.js index fd4070e7ed..16ef421545 100644 --- a/wcfsetup/install/files/js/WCF.ImageViewer.js +++ b/wcfsetup/install/files/js/WCF.ImageViewer.js @@ -392,7 +392,9 @@ $.widget('ui.wcfImageViewer', { this._bindListener(); - document.documentElement.classList.add('pageOverlayActive'); + require(['Ui/Screen'], function(UiScreen) { + UiScreen.pageOverlayOpen(); + }); return true; }, @@ -427,7 +429,9 @@ $.widget('ui.wcfImageViewer', { WCF.System.DisableScrolling.enable(); WCF.System.DisableZoom.enable(); - document.documentElement.classList.remove('pageOverlayActive'); + require(['Ui/Screen'], function(UiScreen) { + UiScreen.pageOverlayClose(); + }); return true; }, diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Controller/Clipboard.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Controller/Clipboard.js index ad1e1eeb03..96fc52c256 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Controller/Clipboard.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Controller/Clipboard.js @@ -11,13 +11,13 @@ define( 'Ajax', 'Core', 'Dictionary', 'EventHandler', 'Language', 'List', 'ObjectMap', 'Dom/ChangeListener', 'Dom/Traverse', 'Dom/Util', 'Ui/Confirmation', 'Ui/SimpleDropdown', - 'WoltLabSuite/Core/Ui/Page/Action' + 'WoltLabSuite/Core/Ui/Page/Action', 'Ui/Screen' ], function( Ajax, Core, Dictionary, EventHandler, Language, List, ObjectMap, DomChangeListener, DomTraverse, DomUtil, UiConfirmation, UiSimpleDropdown, - UiPageAction + UiPageAction, UiScreen ) { "use strict"; @@ -56,7 +56,6 @@ define( var _callbackItem = null; var _callbackUnmarkAll = null; - var _addPageOverlayActiveClass = false; var _specialCheckboxSelector = '.messageCheckboxLabel > input[type="checkbox"], .message .messageClipboardCheckbox > input[type="checkbox"], .messageGroupList .columnMark > label > input[type="checkbox"]'; /** @@ -708,11 +707,7 @@ define( hideEditor: function(objectType) { UiPageAction.remove('wcfClipboard-' + objectType); - if (_addPageOverlayActiveClass) { - _addPageOverlayActiveClass = false; - - document.documentElement.classList.add('pageOverlayActive'); - } + UiScreen.pageOverlayOpen(); }, /** @@ -721,11 +716,7 @@ define( showEditor: function() { this._loadMarkedItems(); - if (document.documentElement.classList.contains('pageOverlayActive')) { - document.documentElement.classList.remove('pageOverlayActive'); - - _addPageOverlayActiveClass = true; - } + UiScreen.pageOverlayClose(); }, /** diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js index 0a8222d160..246635693c 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Dialog.js @@ -236,7 +236,7 @@ define( * @return {object} dialog data */ openStatic: function(id, html, options, createOnly) { - document.documentElement.classList.add('pageOverlayActive'); + UiScreen.pageOverlayOpen(); if (Environment.platform() !== 'desktop') { if (!this.isOpen(id)) { @@ -830,7 +830,8 @@ define( if (data.closable) { window.removeEventListener('keyup', _keyupListener); } - document.documentElement.classList.remove('pageOverlayActive'); + + UiScreen.pageOverlayClose(); } else { data = _dialogs.get(_activeDialog); diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Menu/Abstract.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Menu/Abstract.js index 163abc0588..b05be21fe4 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Menu/Abstract.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Page/Menu/Abstract.js @@ -121,7 +121,7 @@ define(['Core', 'Environment', 'EventHandler', 'Language', 'ObjectMap', 'Dom/Tra _pageContainer.classList.add('menuOverlay-' + this._menu.id); - document.documentElement.classList.add('pageOverlayActive'); + UiScreen.pageOverlayOpen(); return true; }, @@ -141,11 +141,10 @@ define(['Core', 'Environment', 'EventHandler', 'Language', 'ObjectMap', 'Dom/Tra this._menu.classList.remove('open'); UiScreen.scrollEnable(); + UiScreen.pageOverlayClose(); _pageContainer.classList.remove('menuOverlay-' + this._menu.id); - document.documentElement.classList.remove('pageOverlayActive'); - return true; } @@ -223,7 +222,7 @@ define(['Core', 'Environment', 'EventHandler', 'Language', 'ObjectMap', 'Dom/Tra // break if no edge has been touched if (!isLeftEdge && !isRightEdge) return; // break if a different menu is open - if (document.documentElement.classList.contains('pageOverlayActive')) { + if (UiScreen.pageOverlayIsActive()) { var found = false; for (var i = 0; i < _pageContainer.classList.length; i++) { if (_pageContainer.classList[i] === 'menuOverlay-' + this._menu.id) { diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js index 3aa76597d8..2bacb2c1c3 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Screen.js @@ -14,6 +14,7 @@ define(['Core', 'Dictionary', 'Environment'], function(Core, Dictionary, Environ var _scrollDisableCounter = 0; var _scrollOffsetFrom = null; var _scrollTop = 0; + var _pageOverlayCounter = 0; var _mqMap = Dictionary.fromObject({ 'screen-xs': '(max-width: 544px)', /* smartphone */ @@ -152,6 +153,39 @@ define(['Core', 'Dictionary', 'Environment'], function(Core, Dictionary, Environ } }, + /** + * Indicates that at least one page overlay is currently open. + */ + pageOverlayOpen: function() { + if (_pageOverlayCounter === 0) { + document.documentElement.classList.add('pageOverlayActive'); + } + + _pageOverlayCounter++; + }, + + /** + * Marks one page overlay as closed. + */ + pageOverlayClose: function() { + if (_pageOverlayCounter) { + _pageOverlayCounter--; + + if (_pageOverlayCounter === 0) { + document.documentElement.classList.remove('pageOverlayActive'); + } + } + }, + + /** + * Returns true if at least one page overlay is currently open. + * + * @returns {boolean} + */ + pageOverlayIsActive: function() { + return _pageOverlayCounter > 0; + }, + /** * Sets the dialog container element. This method is used to * circumvent a possible circular dependency, due to `Ui/Dialog` -- 2.20.1