strepsirrhini/libreoffice-online
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

loleaflet: fix the orientation only on main custom scroll

Browse source 
Since we are manually changing the CSS class names when
orientation changes, this is only valid for main custom scrollbar
because the mobile wizard scrollbar is always in portrait mode.

Change-Id: I0b9e7156dac0e33a6e793c7f6caae2021068f252
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/97900
Tested-by: Jenkins
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com>
Reviewed-by: Henry Castro <hcastro@collabora.com>
This commit is contained in:
Henry Castro 2020-07-03 16:10:18 -04:00
parent f68d5346a9
commit 982a56e54a
2 changed files with 24 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
loleaflet/src/control/Control.PartsPreview.js
View file

@ -8,6 +8,10 @@ L.Control.PartsPreview = L.Control.extend({
options: {
fetchThumbnail: true,
autoUpdate: true,
imageClass: '',
frameClass: '',
axis: '',
allowOrientation: true,
maxWidth: (window.mode.isMobile() || window.mode.isTablet()) ? 60 : 180,
maxHeight: (window.mode.isMobile() || window.mode.isTablet()) ? 60 : 180
},
@ -31,7 +35,9 @@ L.Control.PartsPreview = L.Control.extend({
onAdd: function (map) {
this._previewInitialized = false;
this._previewTiles = [];
this._direction = window.mode.isMobile() && L.DomUtil.isPortrait() ? 'x' : 'y';
this._direction = this.options.allowOrientation ?
(!window.mode.isDesktop() && L.DomUtil.isPortrait() ? 'x' : 'y') :
this.options.axis;
this._scrollY = 0;
map.on('updateparts', this._updateDisabled, this);
@ -107,7 +113,8 @@ L.Control.PartsPreview = L.Control.extend({
this._scrollContainer = $(this._partsPreviewCont).find('.mCSB_container').get(0);
// Add a special frame just as a drop-site for reordering.
var frame = L.DomUtil.create('div', 'preview-frame', this._scrollContainer);
var frameClass = 'preview-frame ' + this.options.frameClass;
var frame = L.DomUtil.create('div', frameClass, this._scrollContainer);
this._addDnDHandlers(frame);
frame.setAttribute('draggable', false);
@ -140,6 +147,10 @@ L.Control.PartsPreview = L.Control.extend({
}
}
if (!this.options.allowOrientation) {
return;
}
// update portrait / landscape
var removePreviewImg = 'preview-img-portrait';
var addPreviewImg = 'preview-img-landscape';
@ -183,11 +194,12 @@ L.Control.PartsPreview = L.Control.extend({
},
_createPreview: function (i, hashCode, bottomBound) {
var frame = L.DomUtil.create('div', 'preview-frame', this._scrollContainer);
var frameClass = 'preview-frame ' + this.options.frameClass;
var frame = L.DomUtil.create('div', frameClass, this._scrollContainer);
this._addDnDHandlers(frame);
L.DomUtil.create('span', 'preview-helper', frame);
var imgClassName = 'preview-img';
var imgClassName = 'preview-img ' + this.options.imageClass;
var img = L.DomUtil.create('img', imgClassName, frame);
img.hash = hashCode;
img.src = L.Icon.Default.imagePath + '/preview_placeholder.png';

10
loleaflet/src/layer/tile/ImpressTileLayer.js
View file

@ -59,7 +59,13 @@ L.ImpressTileLayer = L.TileLayer.extend({
var container = L.DomUtil.createWithId('div', 'mobile-wizard-header', mobileWizard);
var preview = L.DomUtil.createWithId('div', 'mobile-slide-sorter', container);
L.DomUtil.toBack(container);
map.addControl(L.control.partsPreview(container, preview, {fetchThumbnail: false}));
map.addControl(L.control.partsPreview(container, preview, {
fetchThumbnail: false,
allowOrientation: false,
axis: 'x',
imageClass: 'preview-img-portrait',
frameClass: 'preview-frame-portrait'
}));
L.DomUtil.addClass(mobileWizardContent, 'with-slide-sorter-above');
}
},
@ -99,7 +105,7 @@ L.ImpressTileLayer = L.TileLayer.extend({
this._map.setView(this._map.getCenter(), this._map.getZoom(), {reset: true});
}
L.DomUtil.updateElementsOrientation(['presentation-controls-wrapper', 'document-container', 'slide-sorter', 'mobile-wizard-header', 'mobile-wizard-content']);
L.DomUtil.updateElementsOrientation(['presentation-controls-wrapper', 'document-container', 'slide-sorter']);
// update parts
var visible = L.DomUtil.getStyle(L.DomUtil.get('presentation-controls-wrapper'), 'display');