[Libreoffice-commits] online.git: 2 commits - loleaflet/css loleaflet/src
Szymon KÅ‚os (via logerrit)
logerrit at kemper.freedesktop.org
Tue Sep 8 07:59:36 UTC 2020
loleaflet/css/device-mobile.css | 4 +-
loleaflet/src/control/Control.Menubar.js | 10 -------
loleaflet/src/control/Control.MobileWizard.js | 23 ++++++++++++++---
loleaflet/src/control/Control.Toolbar.js | 35 +++++++++++---------------
loleaflet/src/control/Control.UIManager.js | 25 +++++++++++++++++-
5 files changed, 62 insertions(+), 35 deletions(-)
New commits:
commit c780726c52ae08d4e63e9ab5525d62f68532196d
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Aug 6 12:32:55 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Tue Sep 8 09:59:21 2020 +0200
Handle back button on mobile
This patch created states in history when using
mobilewizard, allows to use back button which navigates
back in the menu.
Used History API and popstate event.
Also unified onClose handler to close the app.
Change-Id: Id9da9bf71ee6183525ea20d43a416d3ddabec7c2
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/100301
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Jan Holesovsky <kendy at collabora.com>
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/102177
Tested-by: Jenkins
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/src/control/Control.Menubar.js b/loleaflet/src/control/Control.Menubar.js
index 074ec743a..7e4788534 100644
--- a/loleaflet/src/control/Control.Menubar.js
+++ b/loleaflet/src/control/Control.Menubar.js
@@ -1250,15 +1250,7 @@ L.Control.Menubar = L.Control.extend({
this._map.fire('postMessage', {msgId: 'rev-history', args: {Deprecated: true}});
this._map.fire('postMessage', {msgId: 'UI_FileVersions'});
} else if (id === 'closedocument') {
- if (window.ThisIsAMobileApp) {
- window.postMobileMessage('BYE');
- } else {
- this._map.fire('postMessage', {msgId: 'close', args: {EverModified: this._map._everModified, Deprecated: true}});
- this._map.fire('postMessage', {msgId: 'UI_Close', args: {EverModified: this._map._everModified}});
- }
- if (!this._map._disableDefaultAction['UI_Close']) {
- this._map.remove();
- }
+ window.onClose();
} else if (id === 'repair') {
this._map._socket.sendMessage('commandvalues command=.uno:DocumentRepair');
} else if (id === 'searchdialog') {
diff --git a/loleaflet/src/control/Control.MobileWizard.js b/loleaflet/src/control/Control.MobileWizard.js
index 58f405f50..1cd965865 100644
--- a/loleaflet/src/control/Control.MobileWizard.js
+++ b/loleaflet/src/control/Control.MobileWizard.js
@@ -11,6 +11,7 @@ L.Control.MobileWizard = L.Control.extend({
_inMainMenu: true,
_isActive: false,
+ _inBuilding: false,
_currentDepth: 0,
_mainTitle: '',
_isTabMode: false,
@@ -56,10 +57,9 @@ L.Control.MobileWizard = L.Control.extend({
},
_setupBackButton: function() {
- var that = this;
this.content = $('#mobile-wizard-content');
this.backButton = $('#mobile-wizard-back');
- this.backButton.click(function() { that.goLevelUp(); });
+ this.backButton.click(function() { history.back(); });
$(this.backButton).addClass('close-button');
},
@@ -131,6 +131,10 @@ L.Control.MobileWizard = L.Control.extend({
this._updateMapSize();
},
+ isOpen: function() {
+ return $('#mobile-wizard').is(':visible');
+ },
+
_hideKeyboard: function() {
document.activeElement.blur();
},
@@ -201,6 +205,8 @@ L.Control.MobileWizard = L.Control.extend({
$(contentToShow).show();
this._currentDepth++;
+ if (!this._inBuilding)
+ history.pushState({context: 'mobile-wizard', level: this._currentDepth}, 'mobile-wizard-level-' + this._currentDepth);
this._setTitle(contentToShow.title);
this._inMainMenu = false;
@@ -326,6 +332,8 @@ L.Control.MobileWizard = L.Control.extend({
_onMobileWizard: function(data) {
if (data) {
+ this._inBuilding = true;
+
var isSidebar = (data.children && data.children.length >= 1 &&
data.children[0].type == 'deck');
@@ -337,7 +345,8 @@ L.Control.MobileWizard = L.Control.extend({
return;
}
- if (data.id && !isNaN(data.id) && !isSidebar) {
+ var isMobileDialog = data.id && !isNaN(data.id) && !isSidebar;
+ if (isMobileDialog) {
// id is a number - remember window id for interaction
window.mobileDialogId = data.id;
}
@@ -348,6 +357,7 @@ L.Control.MobileWizard = L.Control.extend({
this._isActive = true;
var currentPath = null;
var lastScrollPosition = null;
+ var alreadyOpen = this.isOpen();
if (this._currentPath)
currentPath = this._currentPath;
@@ -375,6 +385,11 @@ L.Control.MobileWizard = L.Control.extend({
if (isSidebar)
this._modifySidebarLayout(data);
+ if (!alreadyOpen) {
+ history.pushState({context: 'mobile-wizard'}, 'mobile-wizard-opened');
+ history.pushState({context: 'mobile-wizard', level: 0}, 'mobile-wizard-level-0');
+ }
+
var builder = L.control.jsDialogBuilder({mobileWizard: this, map: this.map, cssClass: 'mobile-wizard'});
builder.build(this.content.get(0), [data]);
@@ -407,6 +422,8 @@ L.Control.MobileWizard = L.Control.extend({
}
this._updateMapSize();
+
+ this._inBuilding = false;
}
},
diff --git a/loleaflet/src/control/Control.Toolbar.js b/loleaflet/src/control/Control.Toolbar.js
index 9a124cf88..23ba12b4f 100644
--- a/loleaflet/src/control/Control.Toolbar.js
+++ b/loleaflet/src/control/Control.Toolbar.js
@@ -41,6 +41,18 @@ function getUNOCommand(unoData) {
return unoData.objectCommand;
}
+function onClose() {
+ if (window.ThisIsAMobileApp) {
+ window.postMobileMessage('BYE');
+ } else {
+ map.fire('postMessage', {msgId: 'close', args: {EverModified: map._everModified, Deprecated: true}});
+ map.fire('postMessage', {msgId: 'UI_Close', args: {EverModified: map._everModified}});
+ }
+ if (!map._disableDefaultAction['UI_Close']) {
+ map.remove();
+ }
+}
+
function onClick(e, id, item) {
if (w2ui['editbar'].get(id) !== null) {
var toolbar = w2ui['editbar'];
@@ -130,15 +142,7 @@ function onClick(e, id, item) {
map.uiManager.toggleMenubar();
}
else if (id === 'close' || id === 'closemobile') {
- if (window.ThisIsAMobileApp) {
- window.postMobileMessage('BYE');
- } else {
- map.fire('postMessage', {msgId: 'close', args: {EverModified: map._everModified, Deprecated: true}});
- map.fire('postMessage', {msgId: 'UI_Close', args: {EverModified: map._everModified}});
- }
- if (!map._disableDefaultAction['UI_Close']) {
- map.remove();
- }
+ onClose();
}
else if (id === 'link') {
map.showHyperlinkDialog();
@@ -1070,19 +1074,10 @@ function setupToolbar(e) {
$('#closebuttonwrapper').css('display', 'block');
}
- $('#closebutton').click(function() {
- if (window.ThisIsAMobileApp) {
- window.postMobileMessage('BYE');
- } else {
- map.fire('postMessage', {msgId: 'close', args: {EverModified: map._everModified, Deprecated: true}});
- map.fire('postMessage', {msgId: 'UI_Close', args: {EverModified: map._everModified}});
- if (!map._disableDefaultAction['UI_Close']) {
- map.remove();
- }
- }
- });
+ $('#closebutton').click(onClose);
}
+global.onClose = onClose;
global.setupToolbar = setupToolbar;
global.onClick = onClick;
global.hideTooltip = hideTooltip;
diff --git a/loleaflet/src/control/Control.UIManager.js b/loleaflet/src/control/Control.UIManager.js
index a4459e39e..9f18fd511 100644
--- a/loleaflet/src/control/Control.UIManager.js
+++ b/loleaflet/src/control/Control.UIManager.js
@@ -6,11 +6,19 @@
/* global $ setupToolbar w2ui w2utils */
L.Control.UIManager = L.Control.extend({
+ mobileWizard: null,
+
onAdd: function (map) {
this.map = map;
this.notebookbar = null;
map.on('updatepermission', this.onUpdatePermission, this);
+
+ window.addEventListener('popstate', this.onGoBack.bind(this));
+
+ // provide entries in the history we can catch to close the app
+ history.pushState({context: 'app-started'}, 'app-started');
+ history.pushState({context: 'app-started'}, 'app-started');
},
// UI initialization
@@ -40,7 +48,8 @@ L.Control.UIManager = L.Control.extend({
this.map.addControl(L.control.documentNameInput());
this.map.addControl(L.control.scroll());
this.map.addControl(L.control.alertDialog());
- this.map.addControl(L.control.mobileWizard());
+ this.mobileWizard = L.control.mobileWizard();
+ this.map.addControl(this.mobileWizard);
this.map.addControl(L.control.languageDialog());
this.map.dialog = L.control.lokDialog();
this.map.addControl(this.map.dialog);
@@ -283,6 +292,20 @@ L.Control.UIManager = L.Control.extend({
this.map.invalidateSize();
},
+ onGoBack: function(popStateEvent) {
+ if (popStateEvent.state && popStateEvent.state.context) {
+ if (popStateEvent.state.context === 'mobile-wizard' && this.mobileWizard) {
+ if (this.mobileWizard.isOpen()) {
+ this.mobileWizard.goLevelUp(true);
+ } else {
+ window.onClose();
+ }
+ } else if (popStateEvent.state.context === 'app-started') {
+ window.onClose();
+ }
+ }
+ },
+
// Helper functions
moveObjectVertically: function(obj, diff) {
commit c42255ad7118d2b0fdccef086e4954e14454ff9e
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Aug 13 13:26:24 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Tue Sep 8 09:59:17 2020 +0200
Reduce height of textarea in annotation vex
Size has fixed value which is too big for small screen
devices. Reduce it for now, more intelligent calculation
seems to be hard to implement in existing vex dialog
structure.
Change-Id: Ic16845a96000b17aa668f39fc2871fca57076d0c
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/100655
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Andras Timar <andras.timar at collabora.com>
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/102178
Tested-by: Jenkins
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/css/device-mobile.css b/loleaflet/css/device-mobile.css
index c12126a04..3329c79a0 100644
--- a/loleaflet/css/device-mobile.css
+++ b/loleaflet/css/device-mobile.css
@@ -316,12 +316,12 @@ div#w2ui-overlay-actionbar.w2ui-overlay{
box-sizing: content-box !important;
}
.vex-dialog-input > textarea.loleaflet-annotation-textarea {
- height: 198px;
+ height: 150px;
border: 4px solid #f0f0f0 !important;
box-shadow: 0 0 1px 1px #dfdfdf;
}
.vex-dialog-input > textarea.loleaflet-annotation-textarea:focus {
- height: 198px;
+ height: 150px;
border: 4px solid #f0f0f0 !important;
box-shadow: 0 0 1px 1px #0b87e7 !important;
}
More information about the Libreoffice-commits
mailing list