loleaflet/src/control/Control.Menubar.js | 10 -------
loleaflet/src/control/Control.MobileWizard.js | 25 +++++++++++++++---
loleaflet/src/control/Control.Toolbar.js | 35 +++++++++++---------------
loleaflet/src/control/Control.UIManager.js | 25 +++++++++++++++++-
4 files changed, 61 insertions(+), 34 deletions(-)
New commits:
commit fbfc1f4d2c5fb9e0383cfb681efe7bbe82211f03
Author: Szymon Kłos <szymon.k...@collabora.com>
AuthorDate: Thu Aug 6 12:32:55 2020 +0200
Commit: Jan Holesovsky <ke...@collabora.com>
CommitDate: Fri Aug 14 21:50:38 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 <jenkinscollaboraoff...@gmail.com>
Reviewed-by: Jan Holesovsky <ke...@collabora.com>
diff --git a/loleaflet/src/control/Control.Menubar.js
b/loleaflet/src/control/Control.Menubar.js
index f08d5d966..bb868473f 100644
--- a/loleaflet/src/control/Control.Menubar.js
+++ b/loleaflet/src/control/Control.Menubar.js
@@ -1218,15 +1218,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 4a4a1eba2..853dfe333 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,
@@ -57,10 +58,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');
},
@@ -130,6 +130,10 @@ L.Control.MobileWizard = L.Control.extend({
this._updateMapSize();
},
+ isOpen: function() {
+ return $('#mobile-wizard').is(':visible');
+ },
+
_hideKeyboard: function() {
document.activeElement.blur();
},
@@ -191,6 +195,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;
@@ -314,6 +320,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');
@@ -325,14 +333,15 @@ 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;
}
// Sometimes it happens that we get the same sidebar
// structure twice. This makes hard to test mobile
wizard.
- if (isSidebar && L.Browser.cypressTest) {
+ if (isSidebar) {
var dataString = JSON.stringify(data.children);
if (this._isActive && this.map.showSidebar &&
dataString === this._lastSidebarData) {
@@ -347,6 +356,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;
@@ -372,6 +382,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]);
@@ -404,6 +419,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 2af35e1d1..c1580f8d4 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();
@@ -1062,19 +1066,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 5cb657a25..a379e2a8f 100644
--- a/loleaflet/src/control/Control.UIManager.js
+++ b/loleaflet/src/control/Control.UIManager.js
@@ -6,10 +6,18 @@
/* global $ setupToolbar w2ui w2utils */
L.Control.UIManager = L.Control.extend({
+ mobileWizard: null,
+
onAdd: function (map) {
this.map = map;
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
@@ -37,7 +45,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);
@@ -189,6 +198,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) {
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
