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.k...@collabora.com>
AuthorDate: Thu Apr 16 18:21:44 2020 +0200
Commit:     Szymon Kłos <szymon.k...@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 <jenkinscollaboraoff...@gmail.com>
    Reviewed-by: Szymon Kłos <szymon.k...@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)
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits

Reply via email to