[Libreoffice-commits] online.git: Branch 'distro/collabora/co-4-2' - loleaflet/css loleaflet/src

[Szymon KÅ‚os (via logerrit)]

 loleaflet/css/leaflet.css                     |    3 +-
 loleaflet/css/loleaflet.css                   |   10 +++++++
 loleaflet/src/layer/marker/ProgressOverlay.js |   36 +++++++-------------------
 loleaflet/src/map/Map.js                      |    8 -----
 4 files changed, 23 insertions(+), 34 deletions(-)

New commits:
commit fb8ee44f489f8cb6172b676a80111115d2461909
Author:     Szymon Kłos <szymon.klos at collabora.com>
AuthorDate: Tue Jul 28 16:01:07 2020 +0200
Commit:     Andras Timar <andras.timar at collabora.com>
CommitDate: Wed Jul 29 10:15:48 2020 +0200

    Center progressbar using css
    
    Simplify progressbar code and center it using
    css instead of JS code.
    
    Change-Id: Ie5877dcbc0614b889f436cc598c7069fda135a3d
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/99633
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Andras Timar <andras.timar at collabora.com>

diff --git a/loleaflet/css/leaflet.css b/loleaflet/css/leaflet.css
index ccf881de2..88ee4572a 100644
--- a/loleaflet/css/leaflet.css
+++ b/loleaflet/css/leaflet.css
@@ -814,7 +814,8 @@ input.clipboard {
 
 .leaflet-progress-label {
 	text-align: center;
-	}
+	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
+}
 
 .leaflet-slideshow {
 	background: #FFFFFF;
diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
index 2885dba2d..0d7d7e05a 100644
--- a/loleaflet/css/loleaflet.css
+++ b/loleaflet/css/loleaflet.css
@@ -37,6 +37,16 @@
 	z-index: 10;
 	cursor: auto;
 }
+
+.leaflet-progress-layer
+{
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	z-index: 1000;
+}
+
 #document-container.text-doctype > #map{
 	cursor: text;
 }
diff --git a/loleaflet/src/layer/marker/ProgressOverlay.js b/loleaflet/src/layer/marker/ProgressOverlay.js
index 090f8b078..fe6286279 100644
--- a/loleaflet/src/layer/marker/ProgressOverlay.js
+++ b/loleaflet/src/layer/marker/ProgressOverlay.js
@@ -10,8 +10,7 @@ L.ProgressOverlay = L.Layer.extend({
 		spinnerSpeed: 30
 	},
 
-	initialize: function (latlng, size) {
-		this._latlng = L.latLng(latlng);
+	initialize: function (size) {
 		this._size = size;
 		this._percent = 0;
 		this._initLayout();
@@ -19,18 +18,13 @@ L.ProgressOverlay = L.Layer.extend({
 	},
 
 	onAdd: function () {
-		if (this._container) {
-			this.getPane().appendChild(this._container);
-			this.update();
-		}
-
 		this._spinnerInterval = L.LOUtil.startSpinner(this._spinnerCanvas, this.options.spinnerSpeed);
-		this._map.on('moveend', this.update, this);
 	},
 
 	onRemove: function () {
 		if (this._container) {
-			this.getPane().removeChild(this._container);
+			L.DomUtil.get('document-container').removeChild(this._container);
+			this._container = null;
 		}
 
 		if (this._spinnerInterval) {
@@ -38,18 +32,8 @@ L.ProgressOverlay = L.Layer.extend({
 		}
 	},
 
-	update: function () {
-		if (this._container && this._map) {
-			var origin = new L.Point(0, 0);
-			var paneOffset = this._map.layerPointToContainerPoint(origin);
-			var sizeOffset = this._size.divideBy(2, true);
-			var position = this._map.latLngToLayerPoint(this._latlng).round();
-			this._setPos(position.subtract(paneOffset).subtract(sizeOffset));
-		}
-	},
-
 	_initLayout: function () {
-		this._container = L.DomUtil.create('div', 'leaflet-progress-layer');
+		this._container = L.DomUtil.create('div', 'leaflet-progress-layer', L.DomUtil.get('document-container'));
 		this._spinner = L.DomUtil.create('div', 'leaflet-progress-spinner', this._container);
 		this._spinnerCanvas = L.DomUtil.create('canvas', 'leaflet-progress-spinner-canvas', this._spinner);
 
@@ -72,10 +56,6 @@ L.ProgressOverlay = L.Layer.extend({
 			.disableScrollPropagation(this._container);
 	},
 
-	_setPos: function (pos) {
-		L.DomUtil.setPosition(this._container, pos);
-	},
-
 	shutdownTimer: function() {
 		if (this.intervalTimer)
 			clearInterval(this.intervalTimer);
@@ -123,6 +103,10 @@ L.ProgressOverlay = L.Layer.extend({
 		if (map.hasLayer(this)) {
 			map.removeLayer(this);
 		}
+		if (this._container) {
+			L.DomUtil.get('document-container').removeChild(this._container);
+			this._container = null;
+		}
 	},
 
 	setLabel: function (label) {
@@ -147,6 +131,6 @@ L.ProgressOverlay = L.Layer.extend({
 	}
 });
 
-L.progressOverlay = function (latlng, size) {
-	return new L.ProgressOverlay(latlng, size);
+L.progressOverlay = function (size) {
+	return new L.ProgressOverlay(size);
 };
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 0368915e3..2365b4bcc 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -150,13 +150,7 @@ L.Map = L.Evented.extend({
 		this._addLayers(this.options.layers);
 		this._socket = L.socket(this);
 
-		var center = this.getCenter();
-		if (window.mode.isMobile() || window.mode.isTablet()) {
-			var doubledProgressHeight = 200;
-			var size = new L.point(screen.width, screen.height - doubledProgressHeight);
-			center = this.layerPointToLatLng(size._divideBy(2));
-		}
-		this._progressBar = L.progressOverlay(center, new L.point(150, 25));
+		this._progressBar = L.progressOverlay(new L.point(150, 25));
 
 		this._textInput = L.textInput();
 		this.addLayer(this._textInput);