[Libreoffice-commits] online.git: loleaflet/Makefile.am loleaflet/src
Szymon KÅos (via logerrit)
logerrit at kemper.freedesktop.org
Fri Apr 17 10:12:31 UTC 2020
loleaflet/Makefile.am | 2
loleaflet/src/control/Control.StatusBar.js | 19 ----
loleaflet/src/control/Control.Toolbar.js | 43 ----------
loleaflet/src/control/Control.UIManager.js | 110 +++++++++++++++++++++++++++
loleaflet/src/layer/tile/CalcTileLayer.js | 38 ---------
loleaflet/src/layer/tile/ImpressTileLayer.js | 37 ---------
loleaflet/src/layer/tile/WriterTileLayer.js | 14 ---
loleaflet/src/main.js | 24 +----
loleaflet/src/map/Map.js | 6 +
9 files changed, 136 insertions(+), 157 deletions(-)
New commits:
commit 75e11420d51e3f53491a10f9933503c45fac19d6
Author: Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Thu Apr 16 18:21:44 2020 +0200
Commit: Szymon Kłos <szymon.klos at collabora.com>
CommitDate: Fri Apr 17 12:12:13 2020 +0200
Introduce UIManager
Change-Id: I944622a352aae7951f3e69286bb163645fa23276
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/92405
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
Reviewed-by: Szymon Kłos <szymon.klos at collabora.com>
diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index 6c10bc441..87286367f 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -272,6 +272,7 @@ LOLEAFLET_JS =\
src/control/Control.PresentationBar.js \
src/control/Control.SigningBar.js \
src/control/Control.TopToolbar.js \
+ src/control/Control.UIManager.js \
src/control/Control.Layers.js \
src/control/Search.js \
src/control/Permission.js \
@@ -548,6 +549,7 @@ pot:
src/control/Control.Toolbar.js \
src/control/Control.TopToolbar.js \
src/control/Control.UserList.js \
+ src/control/Control.UIManager.js \
src/control/Ruler.js \
src/control/Signing.js \
src/control/Toolbar.js \
diff --git a/loleaflet/src/control/Control.StatusBar.js b/loleaflet/src/control/Control.StatusBar.js
index ed5eb0353..2f1a7a44f 100644
--- a/loleaflet/src/control/Control.StatusBar.js
+++ b/loleaflet/src/control/Control.StatusBar.js
@@ -3,7 +3,7 @@
* L.Control.StatusBar
*/
-/* global $ w2ui w2utils _ _UNO */
+/* global $ w2ui _ _UNO */
L.Control.StatusBar = L.Control.extend({
initialize: function () {
@@ -11,10 +11,10 @@ L.Control.StatusBar = L.Control.extend({
onAdd: function (map) {
this.map = map;
-
map.on('doclayerinit', this.onDocLayerInit, this);
map.on('commandvalues', this.onCommandValues, this);
map.on('commandstatechanged', this.onCommandStateChanged, this);
+ this.create();
},
hideTooltip: function(toolbar, id) {
@@ -221,6 +221,8 @@ L.Control.StatusBar = L.Control.extend({
window.setupSearchInput();
}
});
+
+ toolbar.show();
}
toolbar.bind('touchstart', function() {
@@ -244,19 +246,6 @@ L.Control.StatusBar = L.Control.extend({
}
});
- if (!window.mode.isMobile()) {
- this.map.on('showbusy', function(e) {
- w2utils.lock(w2ui['actionbar'].box, e.label, true);
- });
-
- this.map.on('hidebusy', function() {
- // If locked, unlock
- if (w2ui['actionbar'].box.firstChild.className === 'w2ui-lock') {
- w2utils.unlock(w2ui['actionbar'].box);
- }
- });
- }
-
this.map.on('zoomend', function () {
var zoomPercent = 100;
var zoomSelected = null;
diff --git a/loleaflet/src/control/Control.Toolbar.js b/loleaflet/src/control/Control.Toolbar.js
index 005fbd21c..ece25efcb 100644
--- a/loleaflet/src/control/Control.Toolbar.js
+++ b/loleaflet/src/control/Control.Toolbar.js
@@ -9,15 +9,6 @@
var map;
-function resizeToolbar() {
- if ($(window).width() !== map.getSize().x) {
- var toolbarUp = w2ui['editbar'];
- var statusbar = w2ui['actionbar'];
- toolbarUp.resize();
- statusbar.resize();
- }
-}
-
function _cancelSearch() {
var toolbar = window.mode.isMobile() ? w2ui['searchbar'] : w2ui['actionbar'];
var searchInput = L.DomUtil.get('search-input');
@@ -590,22 +581,6 @@ function hideTooltip(toolbar, id) {
}
}
-function createToolbar() {
-
- if (window.mode.isMobile()) {
- $('#toolbar-search').hide();
- $('#mobile-edit-button').show();
- } else {
- $('#toolbar-down').show();
- initNormalToolbar();
- }
-}
-
-function initNormalToolbar() {
- map.addControl(L.control.topToolbar());
- map.addControl(L.control.signingBar());
-}
-
function setupSearchInput() {
$('#search-input').off('input', onSearchInput).on('input', onSearchInput);
$('#search-input').off('keydown', onSearchKeyDown).on('keydown', onSearchKeyDown);
@@ -1062,18 +1037,6 @@ function onUpdatePermission(e) {
}
}
}
-
- if (e.perm === 'edit') {
- if (window.mode.isMobile()) {
- $('#toolbar-down').show();
- }
- }
- else if (window.mode.isMobile()) {
- $('#toolbar-down').hide();
- }
-
- // We've resized the document container.
- map.invalidateSize();
}
function editorUpdate(e) { // eslint-disable-line no-unused-vars
@@ -1103,10 +1066,6 @@ function editorUpdate(e) { // eslint-disable-line no-unused-vars
global.editorUpdate = editorUpdate;
-$(window).resize(function() {
- resizeToolbar();
-});
-
$(document).ready(function() {
// Attach insert file action
$('#insertgraphic').on('change', onInsertFile);
@@ -1116,8 +1075,6 @@ $(document).ready(function() {
function setupToolbar(e) {
map = e;
- createToolbar();
-
map.on('focussearch', function () {
var entry = L.DomUtil.get('search-input');
entry.focus();
diff --git a/loleaflet/src/control/Control.UIManager.js b/loleaflet/src/control/Control.UIManager.js
new file mode 100644
index 000000000..a75481b9f
--- /dev/null
+++ b/loleaflet/src/control/Control.UIManager.js
@@ -0,0 +1,110 @@
+/* -*- js-indent-level: 8 -*- */
+/*
+ * L.Control.UIManager
+ */
+
+/* global $ setupToolbar w2ui w2utils */
+L.Control.UIManager = L.Control.extend({
+ onAdd: function (map) {
+ this.map = map;
+
+ map.on('updatepermission', this.onUpdatePermission, this);
+ },
+
+ initializeBasicUI: function() {
+ var that = this;
+
+ var menubar = L.control.menubar();
+ this.map.menubar = menubar;
+ this.map.addControl(menubar);
+
+ this.map.addControl(L.control.statusBar());
+
+ if (window.mode.isMobile()) {
+ $('#mobile-edit-button').show();
+ } else {
+ this.map.addControl(L.control.topToolbar());
+ this.map.addControl(L.control.signingBar());
+ }
+
+ setupToolbar(this.map);
+
+ this.map.addControl(L.control.scroll());
+ this.map.addControl(L.control.alertDialog());
+ this.map.addControl(L.control.mobileWizard());
+ this.map.addControl(L.control.languageDialog());
+ this.map.dialog = L.control.lokDialog();
+ this.map.addControl(this.map.dialog);
+ this.map.addControl(L.control.contextMenu());
+ this.map.addControl(L.control.infobar());
+ this.map.addControl(L.control.userList());
+
+ this.map.on('showbusy', function(e) {
+ if (w2ui['actionbar'])
+ w2utils.lock(w2ui['actionbar'].box, e.label, true);
+ });
+
+ this.map.on('hidebusy', function() {
+ // If locked, unlock
+ if (w2ui['actionbar'] && w2ui['actionbar'].box.firstChild.className === 'w2ui-lock') {
+ w2utils.unlock(w2ui['actionbar'].box);
+ }
+ });
+
+ $(window).resize(function() {
+ that.resizeToolbars();
+ });
+ },
+
+ initializeSpecializedUI: function(docType) {
+ var isDesktop = window.mode.isDesktop();
+
+ if (window.mode.isMobile()) {
+ this.map.addControl(L.control.mobileBottomBar(docType));
+ this.map.addControl(L.control.mobileTopBar(docType));
+ this.map.addControl(L.control.searchBar());
+ }
+
+ if (docType === 'spreadsheet') {
+ this.map.addControl(L.control.sheetsBar({shownavigation: isDesktop}));
+ this.map.addControl(L.control.formulaBar({showfunctionwizard: isDesktop}));
+ }
+
+ if (isDesktop && docType === 'presentation') {
+ this.map.addControl(L.control.presentationBar());
+ }
+
+ if (window.mode.isMobile() || window.mode.isTablet()) {
+ this.map.on('updatetoolbarcommandvalues', function() {
+ w2ui['editbar'].refresh();
+ });
+ }
+ },
+
+ onUpdatePermission: function(e) {
+ if (window.mode.isMobile()) {
+ if (e.perm === 'edit') {
+ $('#toolbar-down').show();
+ }
+ else {
+ $('#toolbar-down').hide();
+ }
+ }
+
+ // We've resized the document container.
+ this.map.invalidateSize();
+ },
+
+ resizeToolbars: function() {
+ if ($(window).width() !== this.map.getSize().x) {
+ var toolbarUp = w2ui['editbar'];
+ var statusbar = w2ui['actionbar'];
+ toolbarUp.resize();
+ statusbar.resize();
+ }
+ }
+});
+
+L.control.uiManager = function () {
+ return new L.Control.UIManager();
+};
diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js b/loleaflet/src/layer/tile/CalcTileLayer.js
index 658b6362d..1e82f2598 100644
--- a/loleaflet/src/layer/tile/CalcTileLayer.js
+++ b/loleaflet/src/layer/tile/CalcTileLayer.js
@@ -3,7 +3,7 @@
* Calc tile layer is used to display a spreadsheet document
*/
-/* global w2ui w2utils */
+/* global */
L.CalcTileLayer = L.TileLayer.extend({
STD_EXTRA_WIDTH: 113, /* 2mm extra for optimal width,
* 0.1986cm with TeX points,
@@ -51,12 +51,7 @@ L.CalcTileLayer = L.TileLayer.extend({
map.on('AnnotationReply', this._onAnnotationReply, this);
map.on('AnnotationSave', this._onAnnotationSave, this);
- if (window.mode.isMobile() || window.mode.isTablet()) {
- this.onMobileInit(map);
- }
-
- map.addControl(L.control.sheetsBar({shownavigation: true}));
- map.addControl(L.control.formulaBar({showfunctionwizard: true}));
+ map.uiManager.initializeSpecializedUI('spreadsheet');
},
clearAnnotations: function () {
@@ -74,35 +69,6 @@ L.CalcTileLayer = L.TileLayer.extend({
this._annotations = {};
},
- onMobileInit: function (map) {
- map.addControl(L.control.mobileTopBar('spreadsheet'));
-
- map.addControl(L.control.formulaBar({showfunctionwizard: false}));
-
- map.addControl(L.control.sheetsBar({shownavigation: false}));
-
- map.addControl(L.control.mobileBottomBar('spreadsheet'));
-
- map.addControl(L.control.searchBar());
-
- map.on('updatetoolbarcommandvalues', function() {
- w2ui['editbar'].refresh();
- });
-
- map.on('showbusy', function(e) {
- w2utils.lock(w2ui['actionbar'].box, e.label, true);
- });
-
- map.on('hidebusy', function() {
- // If locked, unlock
- if (w2ui['actionbar'].box.firstChild.className === 'w2ui-lock') {
- w2utils.unlock(w2ui['actionbar'].box);
- }
- });
-
- map.on('updatepermission', window.onUpdatePermission);
- },
-
onAnnotationModify: function (annotation) {
annotation.edit();
annotation.focus();
diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js b/loleaflet/src/layer/tile/ImpressTileLayer.js
index 933a89c77..cc02e444d 100644
--- a/loleaflet/src/layer/tile/ImpressTileLayer.js
+++ b/loleaflet/src/layer/tile/ImpressTileLayer.js
@@ -3,7 +3,7 @@
* Impress tile layer is used to display a presentation document
*/
-/* global $ w2ui w2utils L */
+/* global $ L */
L.ImpressTileLayer = L.TileLayer.extend({
extraSize: L.point(290, 0),
@@ -50,8 +50,10 @@ L.ImpressTileLayer = L.TileLayer.extend({
map.on('AnnotationScrollDown', this.onAnnotationScrollDown, this);
map.on('orientationchange', this.onOrientationChange, this);
map.on('resize', this.onResize, this);
+
+ map.uiManager.initializeSpecializedUI('presentation');
+
if (window.mode.isMobile()) {
- this.onMobileInit(map);
L.Control.MobileWizard.mergeOptions({maxHeight: '55%'});
var mobileWizard = L.DomUtil.get('mobile-wizard');
var mobileWizardContent = L.DomUtil.get('mobile-wizard-content');
@@ -60,8 +62,6 @@ L.ImpressTileLayer = L.TileLayer.extend({
L.DomUtil.toBack(container);
map.addControl(L.control.partsPreview(container, preview, {fetchThumbnail: false}));
L.DomUtil.addClass(mobileWizardContent, 'with-slide-sorter-above');
- } else {
- this.onDesktopAndTabletInit(map);
}
},
@@ -115,35 +115,6 @@ L.ImpressTileLayer = L.TileLayer.extend({
}
},
- onDesktopAndTabletInit: function(map) {
- map.addControl(L.control.presentationBar());
- },
-
- onMobileInit: function (map) {
- map.addControl(L.control.mobileTopBar('presentation'));
-
- map.addControl(L.control.mobileBottomBar('presentation'));
-
- map.addControl(L.control.searchBar());
-
- map.on('updatetoolbarcommandvalues', function() {
- w2ui['editbar'].refresh();
- });
-
- map.on('showbusy', function(e) {
- w2utils.lock(w2ui['actionbar'].box, e.label, true);
- });
-
- map.on('hidebusy', function() {
- // If locked, unlock
- if (w2ui['actionbar'].box.firstChild.className === 'w2ui-lock') {
- w2utils.unlock(w2ui['actionbar'].box);
- }
- });
-
- map.on('updatepermission', window.onUpdatePermission);
- },
-
onAdd: function (map) {
L.TileLayer.prototype.onAdd.call(this, map);
this._annotations = {};
diff --git a/loleaflet/src/layer/tile/WriterTileLayer.js b/loleaflet/src/layer/tile/WriterTileLayer.js
index 72e7561fb..b41b7e58d 100644
--- a/loleaflet/src/layer/tile/WriterTileLayer.js
+++ b/loleaflet/src/layer/tile/WriterTileLayer.js
@@ -39,9 +39,7 @@ L.WriterTileLayer = L.TileLayer.extend({
},
beforeAdd: function (map) {
- if (window.mode.isMobile() || window.mode.isTablet()) {
- this.onMobileInit(map);
- }
+ map.uiManager.initializeSpecializedUI('text');
},
onAdd: function (map) {
@@ -51,16 +49,6 @@ L.WriterTileLayer = L.TileLayer.extend({
map.on('updatemaxbounds', this._onUpdateMaxBounds, this);
},
- onMobileInit: function (map) {
- map.addControl(L.control.mobileBottomBar('text'));
-
- map.addControl(L.control.mobileTopBar('text'));
-
- map.addControl(L.control.searchBar());
-
- map.on('updatepermission', window.onUpdatePermission);
- },
-
onAnnotationModify: function (annotation) {
if (window.mode.isMobile() || window.mode.isTablet()) {
var that = this;
diff --git a/loleaflet/src/main.js b/loleaflet/src/main.js
index a291de1c8..7f8fbb267 100644
--- a/loleaflet/src/main.js
+++ b/loleaflet/src/main.js
@@ -1,6 +1,6 @@
/* -*- js-indent-level: 8 -*- */
/* global errorMessages getParameterByName accessToken accessTokenTTL accessHeader reuseCookies */
-/* global vex host serviceRoot idleTimeoutSecs outOfFocusTimeoutSecs setupToolbar*/
+/* global vex host serviceRoot idleTimeoutSecs outOfFocusTimeoutSecs*/
/*eslint indent: [error, "tab", { "outerIIFEBody": 0 }]*/
(function (global) {
@@ -68,23 +68,13 @@ var map = L.map('map', {
});
////// Controls /////
-var menubar = L.control.menubar();
-map.menubar = menubar;
-map.addControl(menubar);
-var statusbar = L.control.statusBar();
-map.addControl(statusbar);
-statusbar.create();
-setupToolbar(map);
-map.addControl(L.control.scroll());
-map.addControl(L.control.alertDialog());
-map.addControl(L.control.mobileWizard());
-map.addControl(L.control.languageDialog());
-map.dialog = L.control.lokDialog();
-map.addControl(map.dialog);
-map.addControl(L.control.contextMenu());
-map.addControl(L.control.infobar());
+
+map.uiManager = L.control.uiManager();
+map.addControl(map.uiManager);
+
+map.uiManager.initializeBasicUI();
+
map.loadDocument(global.socket);
-map.addControl(L.control.userList());
global.socket = map._socket;
window.addEventListener('beforeunload', function () {
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index ca4550593..b333774da 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -53,6 +53,12 @@ L.Map = L.Evented.extend({
cursorURL: 'images/cursors'
},
+ // uiManager is set in main.js
+ uiManager: null,
+
+ // Control.LokDialog instance, is set in Control.UIManager.js
+ dialog: null,
+
lastActiveTime: Date.now(),
initialize: function (id, options) { // (HTMLElement or String, Object)
More information about the Libreoffice-commits
mailing list