loleaflet/Makefile.am | 1 - loleaflet/css/device-mobile.css | 22 ++++++++++++++++++++++ loleaflet/css/menubar-mobile.css | 7 ------- loleaflet/css/mobilewizard.css | 9 --------- loleaflet/src/control/Control.MobileWizard.js | 5 +++++ loleaflet/src/dom/DomUtil.js | 17 +++++++++++++++++ loleaflet/src/layer/tile/ImpressTileLayer.js | 21 ++------------------- 7 files changed, 46 insertions(+), 36 deletions(-)
New commits: commit 67d14eafd21da1d906a0a8e07a07192445ac07c0 Author: Jan Holesovsky <[email protected]> AuthorDate: Thu Apr 2 16:34:20 2020 +0200 Commit: Jan Holesovsky <[email protected]> CommitDate: Mon Apr 6 10:34:41 2020 +0200 mobile: More portrait / landscape handling in Impress' mobile-wizard. Change-Id: I8592db63e9112b1f879e5a10351308fbdd97e28d Reviewed-on: https://gerrit.libreoffice.org/c/online/+/91582 Tested-by: Jenkins CollaboraOffice <[email protected]> Reviewed-by: Jan Holesovsky <[email protected]> diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am index 3a31b27d6..1422de467 100644 --- a/loleaflet/Makefile.am +++ b/loleaflet/Makefile.am @@ -116,7 +116,6 @@ LOLEAFLET_CSS =\ $(builddir)/node_modules/smartmenus/dist/css/sm-core-css.css \ $(builddir)/node_modules/smartmenus/dist/css/sm-simple/sm-simple.css \ $(srcdir)/css/menubar.css \ - $(srcdir)/css/menubar-mobile.css \ $(srcdir)/css/mobilewizard.css \ $(srcdir)/css/vex.css \ $(builddir)/node_modules/jquery-ui/themes/ui-lightness/jquery-ui.css diff --git a/loleaflet/css/device-mobile.css b/loleaflet/css/device-mobile.css index 363818deb..b29bc0ed7 100644 --- a/loleaflet/css/device-mobile.css +++ b/loleaflet/css/device-mobile.css @@ -689,3 +689,25 @@ td[id^=tb_spreadsheet-toolbar_item]:focus table.w2ui-button div.w2ui-icon, td[id .preview-img-dropsite { border-bottom: 3px solid #b6b6b6; } + +/* Related to mobilewizard.cxx */ +#mobile-wizard-header.landscape { + display: none; +} +#mobile-wizard-content.with-slide-sorter-above.landscape { + top: 48px !important; +} +#mobile-wizard-header.portrait { + display: block; +} +#mobile-wizard-content.with-slide-sorter-above.portrait { + top: 111px !important; +} + +/* Related to mobile-wizard based menubar */ +#mobile-wizard.menuwizard.landscape #mobile-wizard-content.with-slide-sorter-above.landscape { + overflow-y: auto !important; +} +#mobile-wizard.menuwizard.portrait #mobile-wizard-content.with-slide-sorter-above.portrait { + overflow-y: hidden !important; +} diff --git a/loleaflet/css/menubar-mobile.css b/loleaflet/css/menubar-mobile.css deleted file mode 100644 index af0ccb615..000000000 --- a/loleaflet/css/menubar-mobile.css +++ /dev/null @@ -1,7 +0,0 @@ -@media (max-device-width: 767px) { - @media (orientation: landscape) { - #mobile-wizard.menuwizard #mobile-wizard-content.with-slide-sorter-above { - overflow-y: auto !important; - } - } -} diff --git a/loleaflet/css/mobilewizard.css b/loleaflet/css/mobilewizard.css index dc3cfacca..ec5f5c916 100644 --- a/loleaflet/css/mobilewizard.css +++ b/loleaflet/css/mobilewizard.css @@ -245,15 +245,6 @@ p.mobile-wizard.ui-combobox-text.selected { float: left; margin-bottom: 4%; } -@media (orientation: landscape) { - #mobile-wizard-header{display: none;} - #mobile-wizard-content.with-slide-sorter-above { - top: 48px !important; - } -} -@media (orientation: portrait) { - #mobile-wizard-header{display: block;} -} .menuwizard #mobile-wizard-back { background-position-x: 22px; width: 52px; diff --git a/loleaflet/src/control/Control.MobileWizard.js b/loleaflet/src/control/Control.MobileWizard.js index ea0ad84b6..bb0b3d95d 100644 --- a/loleaflet/src/control/Control.MobileWizard.js +++ b/loleaflet/src/control/Control.MobileWizard.js @@ -29,6 +29,7 @@ L.Control.MobileWizard = L.Control.extend({ map.on('closemobilewizard', this._hideWizard, this); map.on('showwizardsidebar', this._showWizardSidebar, this); map.on('mobilewizardback', this.goLevelUp, this); + map.on('resize', this._onResize, this); this._setupBackButton(); }, @@ -224,6 +225,10 @@ L.Control.MobileWizard = L.Control.extend({ } }, + _onResize: function() { + L.DomUtil.updateElementsOrientation(['mobile-wizard', 'mobile-wizard-content']); + }, + _setTitle: function(title) { var right = $('#mobile-wizard-title'); right.text(title); diff --git a/loleaflet/src/dom/DomUtil.js b/loleaflet/src/dom/DomUtil.js index 1c38ceb7d..39b87eea6 100644 --- a/loleaflet/src/dom/DomUtil.js +++ b/loleaflet/src/dom/DomUtil.js @@ -202,6 +202,23 @@ L.DomUtil = { isPortrait: function() { return window.matchMedia && window.matchMedia('(orientation: portrait)').matches; + }, + + // Add/remove a portrait or landscape class from the list of elementns. + updateElementsOrientation: function(elements) { + var remove = 'portrait'; + var add = 'landscape'; + if (L.DomUtil.isPortrait()) { + remove = 'landscape'; + add = 'portrait'; + } + + for (var i = 0; i < elements.length; ++i) { + var element = elements[i]; + var domElement = L.DomUtil.get(element); + L.DomUtil.removeClass(domElement, remove); + L.DomUtil.addClass(domElement, add); + } } }; diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js b/loleaflet/src/layer/tile/ImpressTileLayer.js index ee0b75e9c..756f189a8 100644 --- a/loleaflet/src/layer/tile/ImpressTileLayer.js +++ b/loleaflet/src/layer/tile/ImpressTileLayer.js @@ -98,27 +98,10 @@ L.ImpressTileLayer = L.TileLayer.extend({ this._map.setView(this._map.getCenter(), this._map.getZoom(), {reset: true}); } - var presentationControlWrapperElem = L.DomUtil.get('presentation-controls-wrapper'); - var documentContainer = L.DomUtil.get('document-container'); - var slideSorter = L.DomUtil.get('slide-sorter'); - - // update portrait / landscape - var remove = 'portrait'; - var add = 'landscape'; - if (L.DomUtil.isPortrait()) { - remove = 'landscape'; - add = 'portrait'; - } - - L.DomUtil.removeClass(presentationControlWrapperElem, remove); - L.DomUtil.removeClass(documentContainer, remove); - L.DomUtil.removeClass(slideSorter, remove); - L.DomUtil.addClass(presentationControlWrapperElem, add); - L.DomUtil.addClass(documentContainer, add); - L.DomUtil.addClass(slideSorter, add); + L.DomUtil.updateElementsOrientation(['presentation-controls-wrapper', 'document-container', 'slide-sorter', 'mobile-wizard-header', 'mobile-wizard-content']); // update parts - var visible = L.DomUtil.getStyle(presentationControlWrapperElem, 'display'); + var visible = L.DomUtil.getStyle(L.DomUtil.get('presentation-controls-wrapper'), 'display'); if (visible !== 'none') { this._map.fire('updateparts', { selectedPart: this._selectedPart, _______________________________________________ Libreoffice-commits mailing list [email protected] https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
