[Libreoffice-commits] online.git: loleaflet/js loleaflet/Makefile.am loleaflet/src

Henry Castro hcastro at collabora.com
Sun May 20 14:14:20 UTC 2018


 loleaflet/Makefile.am    |   24 ++--
 loleaflet/js/main.js     |    7 -
 loleaflet/js/toolbar.js  |  255 +++++++++++++++++++++++------------------------
 loleaflet/src/map/Map.js |    3 
 4 files changed, 146 insertions(+), 143 deletions(-)

New commits:
commit 7b17fc3a3f4cbd913ff5db51c5ba5faa7729d371
Author: Henry Castro <hcastro at collabora.com>
Date:   Sat May 19 17:28:39 2018 -0400

    loleaflet: modularize toolbar.js file
    
    Change-Id: Ic09d97b7f19aebec80a48161ff3f2a8c7db61328

diff --git a/loleaflet/Makefile.am b/loleaflet/Makefile.am
index 86ea96089..26f4a85cb 100644
--- a/loleaflet/Makefile.am
+++ b/loleaflet/Makefile.am
@@ -105,8 +105,8 @@ LOLEAFLET_JS = $(strip $(shell NODE_PATH=$(abs_builddir)/node_modules $(NODE) -e
 
 PLUGINS_JS =\
 	w2ui-1.5.rc1.js \
-	main.js \
-	toolbar.js
+	toolbar.js \
+	main.js
 
 LOLEAFLET_JS_SRC = $(shell find $(srcdir)/src -name '*.js')
 LOLEAFLET_JS_DST = $(patsubst $(srcdir)/src/%.js,$(builddir)/dist/src/%.js,$(LOLEAFLET_JS_SRC))
@@ -137,7 +137,7 @@ $(builddir)/dist/admin-bundle.js: $(LOLEAFLET_ADMIN_DST) $(BOOTSTRAP_DST) $(CURS
 if ENABLE_DEBUG
 $(LOLEAFLET_PREFIX)/dist/loleaflet-src.js: $(LOLEAFLET_JS_DST) $(LOLEAFLET_DRAW_JS_DST)
 	@echo "Checking loleaflet for JS errors..."
-	@$(NODE) node_modules/eslint/bin/eslint.js $(srcdir)/src --ignore-path $(srcdir)/.eslintignore --config $(srcdir)/.eslintrc
+	@NODE_PATH=$(abs_builddir)/node_modules $(NODE) node_modules/eslint/bin/eslint.js $(srcdir)/src --ignore-path $(srcdir)/.eslintignore --config $(srcdir)/.eslintrc
 	@cp -a $(srcdir)/plugins/draw-$(DRAW_VERSION)/dist/images/* $(builddir)/dist/images/
 #	@$(NODE) node_modules/eslint/bin/eslint.js $(srcdir)/plugins/draw-$(DRAW_VERSION)/src --ignore-path $(srcdir)/.eslintignore --config $(srcdir)/.eslintrc
 	@touch $@
@@ -147,14 +147,16 @@ $(builddir)/dist/bundle.css: $(LOLEAFLET_CSS_DST)
 
 $(builddir)/dist/bundle.js: $(NODE_MODULES_JS_DST) \
 	$(LOLEAFLET_PREFIX)/dist/loleaflet-src.js \
-	$(builddir)/dist/global.js $(builddir)/dist/w2ui-1.5.rc1.js \
-	$(builddir)/dist/main.js $(builddir)/dist/toolbar.js
+	$(builddir)/dist/global.js \
+	$(builddir)/dist/w2ui-1.5.rc1.js \
+	$(builddir)/dist/toolbar.js \
+	$(builddir)/dist/main.js
 	@touch $@
 else
 $(LOLEAFLET_PREFIX)/dist/loleaflet-src.js: $(LOLEAFLET_JS_SRC)
 	@mkdir -p $(dir $@)
 	@echo "Checking loleaflet for JS errors..."
-	@$(NODE) node_modules/eslint/bin/eslint.js $(srcdir)/src --ignore-path $(srcdir)/.eslintignore --config $(srcdir)/.eslintrc
+	@NODE_PATH=$(abs_builddir)/node_modules $(NODE) node_modules/eslint/bin/eslint.js $(srcdir)/src --ignore-path $(srcdir)/.eslintignore --config $(srcdir)/.eslintrc
 	@echo "Concatenating loleaflet files..."
 	@(cat $(srcdir)/src/copyright.js | sed 's/{VERSION}/$(LOLEAFLET_VERSION)/' - \
 		&& echo "(function (window, document, undefined) {" \
@@ -169,16 +171,18 @@ $(builddir)/dist/bundle.css: $(LOLEAFLET_CSS)
 
 $(builddir)/dist/bundle.js: $(NODE_MODULES_JS_SRC) \
 	$(LOLEAFLET_PREFIX)/dist/loleaflet-src.js \
-	$(srcdir)/js/global.js $(srcdir)/js/w2ui-1.5.rc1.js \
-	$(srcdir)/js/main.js $(srcdir)/js/toolbar.js
+	$(srcdir)/js/global.js \
+	$(srcdir)/js/w2ui-1.5.rc1.js \
+	$(srcdir)/js/toolbar.js \
+	$(srcdir)/js/main.js
 	@echo "Uglify loleaflet js files..."
 	@$(NODE) node_modules/uglify-js/bin/uglifyjs \
 		$(srcdir)/js/global.js \
 		$(NODE_MODULES_JS) \
-		$(builddir)/build/dist/loleaflet-src.js \
 		$(srcdir)/js/w2ui-1.5.rc1.js \
-		$(srcdir)/js/main.js \
+		$(builddir)/build/dist/loleaflet-src.js \
 		$(srcdir)/js/toolbar.js \
+		$(srcdir)/js/main.js \
 		--source-map --output $@
 endif
 
diff --git a/loleaflet/js/main.js b/loleaflet/js/main.js
index b8668234b..89d99263c 100644
--- a/loleaflet/js/main.js
+++ b/loleaflet/js/main.js
@@ -66,6 +66,8 @@ var map = L.map('map', {
 global.map = map;
 
 ////// Controls /////
+map.addControl(L.control.menubar());
+setupToolbar(map);
 map.addControl(L.control.scroll());
 map.addControl(L.control.alertDialog());
 map.addControl(L.control.lokDialog());
@@ -74,13 +76,12 @@ map.addControl(L.control.tabs());
 map.addControl(L.control.columnHeader());
 map.addControl(L.control.rowHeader());
 map.addControl(L.control.contextMenu());
-map.addControl(L.control.menubar());
 map.addControl(L.control.infobar());
 map.loadDocument();
 
 window.addEventListener('beforeunload', function () {
-	if (global.map && global.map._socket) {
-		global.map._socket.close();
+	if (map && map._socket) {
+		map._socket.close();
 	}
 });
 
diff --git a/loleaflet/js/toolbar.js b/loleaflet/js/toolbar.js
index 7683145df..277d923e6 100644
--- a/loleaflet/js/toolbar.js
+++ b/loleaflet/js/toolbar.js
@@ -2,8 +2,10 @@
  * LibreOffice Online toolbar
  */
 
-/* global $ map closebutton w2ui w2utils vex _ _UNO */
-/* exported onUseritemClicked editorUpdate */
+/* global $ closebutton w2ui w2utils vex _ _UNO */
+(function(global) {
+
+var map;
 var mobileWidth = 768;
 
 function onDelete(e) {
@@ -236,8 +238,8 @@ function onClick(e, id, item, subItem) {
 		// focus on map, and press enter
 		map.focus();
 		map._docLayer._postKeyboardEvent('input',
-		                                 map.keyboard.keyCodes.enter,
-		                                 map.keyboard._toUNOKeyCode(map.keyboard.keyCodes.enter));
+						 map.keyboard.keyCodes.enter,
+						 map.keyboard._toUNOKeyCode(map.keyboard.keyCodes.enter));
 
 		w2ui['formulabar'].hide('acceptformula', 'cancelformula');
 		w2ui['formulabar'].show('sum', 'function');
@@ -327,7 +329,7 @@ var stylesSelectValue;
 var fontsSelectValue;
 var fontsizesSelectValue;
 
-$(function () {
+function createToolbar() {
 	$('#toolbar-up').w2toolbar({
 		name: 'toolbar-up',
 		items: [
@@ -532,10 +534,9 @@ $(function () {
 			$('#search-input').off('keydown', onSearchKeyDown).on('keydown', onSearchKeyDown);
 		}
 	});
-});
+}
 
 var userJoinedPopupMessage = '<div>' + _('%user has joined') + '</div>';
-var userLeftPopupMessage = '<div>' + _('%user has left') + '</div>';
 var userPopupTimeout = null;
 
 function localizeStateTableCell (text) {
@@ -821,18 +822,9 @@ function onFormulaBarBlur() {
 	}, 250);
 }
 
-map.on('hidebusy', function() {
-	// If locked, unlock
-	if (w2ui['toolbar-down'].box.firstChild.className === 'w2ui-lock') {
-		w2utils.unlock(w2ui['toolbar-down'].box);
-	}
-});
 
-map.on('showbusy', function(e) {
-	w2utils.lock(w2ui['toolbar-down'].box, e.label, true);
-});
 
-map.on('wopiprops', function(e) {
+function onWopiProps(e) {
 	if (e.HideSaveOption) {
 		w2ui['toolbar-up'].hide('save');
 	}
@@ -863,9 +855,9 @@ map.on('wopiprops', function(e) {
 		$('#document-name-input').removeClass('editable');
 		$('#document-name-input').off('keypress', onDocumentNameKeyPress);
 	}
-});
+}
 
-map.on('doclayerinit', function () {
+function onDocLayerInit() {
 	var toolbarUp = w2ui['toolbar-up'];
 	var statusbar = w2ui['toolbar-down'];
 	var docType = map.getDocType();
@@ -968,10 +960,9 @@ map.on('doclayerinit', function () {
 	toolbarUp.refresh();
 	statusbar.refresh();
 	resizeToolbar();
-});
-
+}
 
-map.on('commandstatechanged', function (e) {
+function onCommandStateChanged(e) {
 	var toolbar = w2ui['toolbar-up'];
 	var statusbar = w2ui['toolbar-down'];
 	var commandName = e.commandName;
@@ -1160,24 +1151,7 @@ map.on('commandstatechanged', function (e) {
 			toolbar.disable(id);
 		}
 	}
-});
-
-map.on('search', function (e) {
-	var searchInput = L.DomUtil.get('search-input');
-	var toolbar = w2ui['toolbar-down'];
-	if (e.count === 0) {
-		toolbar.disable('searchprev');
-		toolbar.disable('searchnext');
-		toolbar.hide('cancelsearch');
-		L.DomUtil.addClass(searchInput, 'search-not-found');
-		$('#findthis').addClass('search-not-found');
-		map.resetSelection();
-		setTimeout(function () {
-			$('#findthis').removeClass('search-not-found');
-			L.DomUtil.removeClass(searchInput, 'search-not-found');
-		}, 500);
-	}
-});
+}
 
 function updateCommandValues() {
 	var data = [];
@@ -1287,11 +1261,8 @@ function updateCommandValues() {
 	}
 }
 
-map.on('updatetoolbarcommandvalues', function() {
-	w2ui['toolbar-up'].refresh();
-});
 
-map.on('updateparts pagenumberchanged', function (e) {
+function onUpdateParts(e) {
 	if (e.docType === 'text') {
 		var current = e.currentPage;
 		var count = e.pages;
@@ -1344,9 +1315,9 @@ map.on('updateparts pagenumberchanged', function (e) {
 		toolbar.show('lastrecord');
 		toolbar.show('insertsheet');
 	}
-});
+}
 
-map.on('commandresult', function (e) {
+function onCommandResult(e) {
 	var commandName = e.commandName;
 
 	if (commandName === '.uno:Save') {
@@ -1368,33 +1339,9 @@ map.on('commandresult', function (e) {
 		$('#tb_toolbar-up_item_repair').w2overlay({ html: '<div style="padding: 10px; line-height: 150%">' +
 			_('Conflict Undo/Redo with multiple users. Please use document repair to resolve') + '</div>'});
 	}
-});
-
-map.on('celladdress', function (e) {
-	if (document.activeElement !== L.DomUtil.get('addressInput')) {
-		// if the user is not editing the address field
-		L.DomUtil.get('addressInput').value = e.address;
-	}
-});
-
-map.on('cellformula', function (e) {
-	if (document.activeElement !== L.DomUtil.get('formulaInput')) {
-		// if the user is not editing the formula bar
-		L.DomUtil.get('formulaInput').value = e.formula;
-	}
-});
-
-map.on('zoomend', function () {
-	var zoomRatio = map.getZoomScale(map.getZoom(), map.options.zoom);
-	var zoomPercent = Math.round(zoomRatio * 100);
-	$('#zoomlevel').html(zoomPercent + '%');
-});
-
-map.on('hyperlinkclicked', function (e) {
-	window.open(e.url, '_blank');
-});
+}
 
-map.on('updatepermission', function (e) {
+function onUpdatePermission(e) {
 	var toolbar = w2ui['toolbar-up'];
 
 	// copy the first array
@@ -1476,17 +1423,7 @@ map.on('updatepermission', function (e) {
 		});
 		$('#search-input').prop('disabled', true);
 	}
-});
-
-map.on('keydown', function (e) {
-	if (e.originalEvent.ctrlKey && !e.originalEvent.altKey &&
-	   (e.originalEvent.key === 'f' || e.originalEvent.key === 'F')) {
-		var entry = L.DomUtil.get('search-input');
-		entry.focus();
-		entry.select();
-		e.originalEvent.preventDefault();
-	}
-});
+}
 
 function goToViewId(id) {
 	var docLayer = map._docLayer;
@@ -1501,7 +1438,7 @@ function goToViewId(id) {
 	}
 }
 
-function onUseritemClicked(e) {
+function onUseritemClicked(e) { // eslint-disable-line no-unused-vars
 	var docLayer = map._docLayer;
 	var viewId = parseInt(e.currentTarget.id.replace('user-', ''));
 
@@ -1521,7 +1458,7 @@ function onUseritemClicked(e) {
 	selectUser(viewId);
 }
 
-function editorUpdate(e) {
+function editorUpdate(e) { // eslint-disable-line no-unused-vars
 	var docLayer = map._docLayer;
 
 	if (e.target.checked) {
@@ -1564,14 +1501,14 @@ function getUserItem(viewId, userName, extraInfo, color) {
 	}
 
 	var html = '<tr class="' + className + '" id="user-' + viewId + '" onclick="onUseritemClicked(event)">' +
-	             '<td class=usercolor style="background-color: ' + color  +';">';
+		     '<td class=usercolor style="background-color: ' + color  +';">';
 	if (extraInfo !== undefined && extraInfo.avatar !== undefined) {
 		html += '<img src="' + extraInfo.avatar + '" width="32" height="32" />';
 	}
 
 	// TODO: Add mail and other links as sub-menu.
 	html += '</td>' +
-	             '<td class="username loleaflet-font" >' + userName + '</td>' +
+		     '<td class="username loleaflet-font" >' + userName + '</td>' +
 	    '</tr>';
 
 	return html;
@@ -1593,7 +1530,7 @@ function updateUserListCount() {
 	$('#zoomlevel').html(zoomlevel);
 }
 
-map.on('addview', function(e) {
+function onAddView(e) {
 	$('#tb_toolbar-down_item_userlist')
 		.w2overlay({
 			class: 'loleaflet-font',
@@ -1623,47 +1560,7 @@ map.on('addview', function(e) {
 	var newhtml = $(userlistItem.html).find('#userlist_table tbody').append(getUserItem(e.viewId, username, e.extraInfo, color)).parent().parent()[0].outerHTML;
 	userlistItem.html = newhtml;
 	updateUserListCount();
-});
-
-map.on('removeview', function(e) {
-	$('#tb_toolbar-down_item_userlist')
-		.w2overlay({
-			class: 'loleaflet-font',
-			html: userLeftPopupMessage.replace('%user', e.username),
-			style: 'padding: 5px'
-		});
-	clearTimeout(userPopupTimeout);
-	userPopupTimeout = setTimeout(function() {
-		$('#tb_toolbar-down_item_userlist').w2overlay('');
-		clearTimeout(userPopupTimeout);
-		userPopupTimeout = null;
-	}, 3000);
-
-	if (e.viewId === map._docLayer._followThis) {
-		map._docLayer._followThis = -1;
-		map._docLayer._followUser = false;
-	}
-
-	var userlistItem = w2ui['toolbar-down'].get('userlist');
-	userlistItem.html = $(userlistItem.html).find('#user-' + e.viewId).remove().end()[0].outerHTML;
-	updateUserListCount();
-});
-
-map.on('updateEditorName', function(e) {
-	$('#currently-msg').show();
-	$('#current-editor').text(e.username);
-});
-
-map.on('setFollowOff', function() {
-	var docLayer = map._docLayer;
-	var viewId = docLayer._followThis;
-	if (viewId !== -1 && map._viewInfo[viewId]) {
-		deselectUser(viewId);
-	}
-	docLayer._followThis = -1;
-	docLayer._followUser = false;
-	docLayer._followEditor = false;
-});
+}
 
 $(window).resize(function() {
 	resizeToolbar();
@@ -1683,3 +1580,103 @@ $(document).ready(function() {
 	// Attach insert file action
 	$('#insertgraphic').on('change', onInsertFile);
 });
+
+function setupToolbar(e) {
+	map = e;
+
+	createToolbar();
+
+	map.on('updateEditorName', function(e) {
+		$('#currently-msg').show();
+		$('#current-editor').text(e.username);
+	});
+
+	map.on('setFollowOff', function() {
+		var docLayer = map._docLayer;
+		var viewId = docLayer._followThis;
+		if (viewId !== -1 && map._viewInfo[viewId]) {
+			deselectUser(viewId);
+		}
+		docLayer._followThis = -1;
+		docLayer._followUser = false;
+		docLayer._followEditor = false;
+	});
+
+	map.on('keydown', function (e) {
+		if (e.originalEvent.ctrlKey && !e.originalEvent.altKey &&
+		   (e.originalEvent.key === 'f' || e.originalEvent.key === 'F')) {
+			var entry = L.DomUtil.get('search-input');
+			entry.focus();
+			entry.select();
+			e.originalEvent.preventDefault();
+		}
+	});
+
+	map.on('hyperlinkclicked', function (e) {
+		window.open(e.url, '_blank');
+	});
+
+	map.on('cellformula', function (e) {
+		if (document.activeElement !== L.DomUtil.get('formulaInput')) {
+			// if the user is not editing the formula bar
+			L.DomUtil.get('formulaInput').value = e.formula;
+		}
+	});
+
+	map.on('zoomend', function () {
+		var zoomRatio = map.getZoomScale(map.getZoom(), map.options.zoom);
+		var zoomPercent = Math.round(zoomRatio * 100);
+		$('#zoomlevel').html(zoomPercent + '%');
+	});
+
+	map.on('celladdress', function (e) {
+		if (document.activeElement !== L.DomUtil.get('addressInput')) {
+			// if the user is not editing the address field
+			L.DomUtil.get('addressInput').value = e.address;
+		}
+	});
+
+	map.on('search', function (e) {
+		var searchInput = L.DomUtil.get('search-input');
+		var toolbar = w2ui['toolbar-down'];
+		if (e.count === 0) {
+			toolbar.disable('searchprev');
+			toolbar.disable('searchnext');
+			toolbar.hide('cancelsearch');
+			L.DomUtil.addClass(searchInput, 'search-not-found');
+			$('#findthis').addClass('search-not-found');
+			map.resetSelection();
+			setTimeout(function () {
+				$('#findthis').removeClass('search-not-found');
+				L.DomUtil.removeClass(searchInput, 'search-not-found');
+			}, 500);
+		}
+	});
+
+	map.on('updatetoolbarcommandvalues', function() {
+		w2ui['toolbar-up'].refresh();
+	});
+
+	map.on('showbusy', function(e) {
+		w2utils.lock(w2ui['toolbar-down'].box, e.label, true);
+	});
+
+	map.on('hidebusy', function() {
+		// If locked, unlock
+		if (w2ui['toolbar-down'].box.firstChild.className === 'w2ui-lock') {
+			w2utils.unlock(w2ui['toolbar-down'].box);
+		}
+	});
+
+	map.on('doclayerinit', onDocLayerInit);
+	map.on('wopiprops', onWopiProps);
+	map.on('addview', onAddView);
+	map.on('updatepermission', onUpdatePermission);
+	map.on('commandresult', onCommandResult);
+	map.on('updateparts pagenumberchanged', onUpdateParts);
+	map.on('commandstatechanged', onCommandStateChanged);
+}
+
+global.setupToolbar = setupToolbar;
+
+}(window));
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 36f1175a9..ccfd0ec10 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -19,7 +19,8 @@ L.Map = L.Evented.extend({
 		tileWidthTwips: 3840,
 		tileHeightTwips: 3840,
 		urlPrefix: 'lool',
-		wopiSrc: ''
+		wopiSrc: '',
+		cursorURL: 'cursors'
 	},
 
 	lastActiveTime: Date.now(),


More information about the Libreoffice-commits mailing list