loleaflet/css/device-mobile.css | 34 +++++++++++++++++++++++
loleaflet/css/partsPreviewControl.css | 38 --------------------------
loleaflet/src/control/Control.PartsPreview.js | 21 ++++++++++++++
loleaflet/src/layer/tile/ImpressTileLayer.js | 6 ++--
4 files changed, 59 insertions(+), 40 deletions(-)
New commits:
commit 7cd2beb8660498d1dedd37b23057c4e4b0bc55a4
Author: Jan Holesovsky <ke...@collabora.com>
AuthorDate: Thu Apr 2 14:14:19 2020 +0200
Commit: Jan Holesovsky <ke...@collabora.com>
CommitDate: Thu Apr 2 16:37:45 2020 +0200
mobile: Handle the portrait / landscape for slide sorter in JS too.
Change-Id: I214501fac516f4d581d3c1e8a95650a87db1a4aa
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/91570
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoff...@gmail.com>
Reviewed-by: Jan Holesovsky <ke...@collabora.com>
diff --git a/loleaflet/css/device-mobile.css b/loleaflet/css/device-mobile.css
index 5a40ba1b2..685d16454 100644
--- a/loleaflet/css/device-mobile.css
+++ b/loleaflet/css/device-mobile.css
@@ -624,6 +624,24 @@ td[id^=tb_spreadsheet-toolbar_item]:focus
table.w2ui-button div.w2ui-icon, td[id
bottom: 33px;
}
+#slide-sorter.portrait {
+ max-height: 60px;
+}
+
+.preview-img-portrait {
+ min-width: 37px;
+ max-width: 60px;
+ max-height: 45px;
+ margin: 0px;
+}
+
+.preview-frame-portrait {
+ max-height: 60px;
+ max-width: initial;
+ display: table-cell;
+ padding-right: 1em;
+}
+
/* Slidesorter in landscape mode */
#presentation-controls-wrapper.landscape {
top: 41px;
@@ -650,3 +668,19 @@ td[id^=tb_spreadsheet-toolbar_item]:focus
table.w2ui-button div.w2ui-icon, td[id
#document-container.landscape.parts-preview-document.keyboard {
left: 0px !important;
}
+
+#slide-sorter.landscape {
+ max-width: 120px;
+}
+
+.preview-img-landscape {
+ min-width: 40px;
+ max-width: 40px;
+ margin-left: 8px;
+}
+
+.preview-frame-landscape {
+ max-height: initial;
+ max-width: 66px;
+ display: block;
+}
diff --git a/loleaflet/css/partsPreviewControl.css
b/loleaflet/css/partsPreviewControl.css
index 618d2e0a7..4ea0d3c7e 100644
--- a/loleaflet/css/partsPreviewControl.css
+++ b/loleaflet/css/partsPreviewControl.css
@@ -33,44 +33,6 @@
margin-left: 20px;
}
-@media (max-width: 767px) and (orientation: portrait), (max-device-width:
767px) and (orientation: portrait) {
- #slide-sorter {
- max-height: 60px;
- }
-
- .preview-img {
- min-width: 37px;
- max-width: 60px;
- max-height: 45px;
- margin: 0px;
- }
-
- .preview-frame {
- max-height: 60px;
- max-width: initial;
- display: table-cell;
- padding-right: 1em;
- }
-}
-
-@media (max-height: 767px) and (orientation: landscape), (max-device-height:
767px) and (orientation: landscape) {
- #slide-sorter {
- max-width: 120px;
- }
-
- .preview-img {
- min-width: 40px;
- max-width: 40px;
- margin-left: 8px;
- }
-
- .preview-frame {
- max-height: initial;
- max-width: 66px;
- display: block;
- }
-}
-
/* The current part the user is on. */
.preview-img-currentpart {
border-color: #000000;
diff --git a/loleaflet/src/control/Control.PartsPreview.js
b/loleaflet/src/control/Control.PartsPreview.js
index 4d9776566..22c81be19 100644
--- a/loleaflet/src/control/Control.PartsPreview.js
+++ b/loleaflet/src/control/Control.PartsPreview.js
@@ -150,6 +150,27 @@ L.Control.PartsPreview = L.Control.extend({
L.DomUtil.addClass(this._previewTiles[j], 'preview-img-selectedpart');
}
}
+
+ // update portrait / landscape
+ var removePreviewImg = 'preview-img-portrait';
+ var addPreviewImg = 'preview-img-landscape';
+ var removePreviewFrame = 'preview-frame-portrait';
+ var addPreviewFrame = 'preview-frame-landscape';
+ if (L.DomUtil.isPortrait()) {
+ removePreviewImg = 'preview-img-landscape';
+ addPreviewImg = 'preview-img-portrait';
+ removePreviewFrame = 'preview-frame-landscape';
+ addPreviewFrame = 'preview-frame-portrait';
+ }
+
+ for (i = 0; i < parts; i++) {
+ L.DomUtil.removeClass(this._previewTiles[i],
removePreviewImg);
+ L.DomUtil.addClass(this._previewTiles[i],
addPreviewImg);
+ }
+
+ var previewFrame =
$(this._partsPreviewCont).find('.preview-frame');
+ previewFrame.removeClass(removePreviewFrame);
+ previewFrame.addClass(addPreviewFrame);
}
},
diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js
b/loleaflet/src/layer/tile/ImpressTileLayer.js
index 0319cf7b1..ee0b75e9c 100644
--- a/loleaflet/src/layer/tile/ImpressTileLayer.js
+++ b/loleaflet/src/layer/tile/ImpressTileLayer.js
@@ -100,6 +100,7 @@ L.ImpressTileLayer = L.TileLayer.extend({
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';
@@ -111,12 +112,14 @@ L.ImpressTileLayer = L.TileLayer.extend({
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);
// update parts
var visible =
L.DomUtil.getStyle(presentationControlWrapperElem, 'display');
- if (!this._isSlidePaneVisible && visible !== 'none') {
+ if (visible !== 'none') {
this._map.fire('updateparts', {
selectedPart: this._selectedPart,
selectedParts: this._selectedParts,
@@ -125,7 +128,6 @@ L.ImpressTileLayer = L.TileLayer.extend({
partNames: this._partHashes
});
}
- this._isSlidePaneVisible = !(visible === 'none');
},
onMobileInit: function (map) {
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
