[Libreoffice-commits] online.git: loleaflet/build loleaflet/dist loleaflet/src
Pranav Kant
pranavk at collabora.com
Tue May 31 09:01:02 UTC 2016
loleaflet/build/deps.js | 1
loleaflet/dist/leaflet.css | 6 -----
loleaflet/dist/loading.html | 10 +++-----
loleaflet/src/core/LOUtil.js | 30 ++++++++++++++++++++++++++
loleaflet/src/layer/marker/ProgressOverlay.js | 25 ---------------------
loleaflet/src/map/handler/Map.SlideShow.js | 8 +-----
6 files changed, 38 insertions(+), 42 deletions(-)
New commits:
commit d9019a2e79166732071cde84e1f8c8572a4dd281
Author: Pranav Kant <pranavk at collabora.com>
Date: Tue May 31 14:24:59 2016 +0530
loleaflet: Reuse html canvas spinner for slideshows
Move the spinner initialization to a separate class L.LOUtil.
Other similar LO related functions should also go there.
Also remove superfluous class leaflet-slideshow-spinner. It was
not being used anyway due to wrong spelling.
Change-Id: Ie8fac0391a9c6a3771900539e8f08d1b73b9be28
diff --git a/loleaflet/build/deps.js b/loleaflet/build/deps.js
index eaa9f9f..105cc6b 100644
--- a/loleaflet/build/deps.js
+++ b/loleaflet/build/deps.js
@@ -3,6 +3,7 @@ var deps = {
src: ['Leaflet.js',
'core/Log.js',
'core/Util.js',
+ 'core/LOUtil.js',
'core/Class.js',
'core/Events.js',
'core/Socket.js',
diff --git a/loleaflet/dist/leaflet.css b/loleaflet/dist/leaflet.css
index cdb3375..e3c12b3 100644
--- a/loleaflet/dist/leaflet.css
+++ b/loleaflet/dist/leaflet.css
@@ -702,9 +702,3 @@ a.leaflet-control-buttons:hover:first-child {
.leaflet-slideshow {
background: #FFFFFF;
}
-
-.leaflet-slideshow-spinner {
- background-image: url(images/spinner.gif);
- background-repeat: no-repeat;
- background-position: center center;
- }
diff --git a/loleaflet/dist/loading.html b/loleaflet/dist/loading.html
index 8c5cf1e..64cc1de 100644
--- a/loleaflet/dist/loading.html
+++ b/loleaflet/dist/loading.html
@@ -19,17 +19,15 @@
width: 100px;
height: 100px;
}
- .spinner img {
- display: block;
- margin-left: auto;
- margin-right: auto;
- }
</style>
</head>
<body>
<div class="spinner">
- <img src="/loleaflet/dist/images/spinner.gif">
+ <canvas id="spinner" class="leaflet-progress-spinner-canvas"></canvas>
<h4>Loading...</h4>
</div>
</body>
+ <script>
+ var spinnerInterval = window.parent.L.LOUtil.startSpinner(document.getElementById('spinner'), 1.5);
+ </script>
</html>
diff --git a/loleaflet/src/core/LOUtil.js b/loleaflet/src/core/LOUtil.js
new file mode 100644
index 0000000..cbdce2a
--- /dev/null
+++ b/loleaflet/src/core/LOUtil.js
@@ -0,0 +1,30 @@
+/*
+ * L.LOUtil contains various LO related utility functions used throughout the code
+ */
+
+L.LOUtil = {
+ startSpinner: function (spinnerCanvas, spinnerSpeed) {
+ var spinnerInterval;
+ spinnerCanvas.width = 50;
+ spinnerCanvas.height = 50;
+
+ var context = spinnerCanvas.getContext('2d');
+ context.lineWidth = 8;
+ context.strokeStyle = 'grey';
+ var x = spinnerCanvas.width / 2;
+ var y = spinnerCanvas.height / 2;
+ var radius = y - context.lineWidth / 2;
+ spinnerInterval = setInterval(function() {
+ context.clearRect(0, 0, x * 2, y * 2);
+ // Move to center
+ context.translate(x, y);
+ context.rotate(spinnerSpeed * Math.PI / 180);
+ context.translate(-x, -y);
+ context.beginPath();
+ context.arc(x, y, radius, 0, Math.PI * 1.3);
+ context.stroke();
+ }, 1);
+
+ return spinnerInterval;
+ }
+};
diff --git a/loleaflet/src/layer/marker/ProgressOverlay.js b/loleaflet/src/layer/marker/ProgressOverlay.js
index 50c6fac..91785e9 100644
--- a/loleaflet/src/layer/marker/ProgressOverlay.js
+++ b/loleaflet/src/layer/marker/ProgressOverlay.js
@@ -56,36 +56,13 @@ L.ProgressOverlay = L.Layer.extend({
this._container.style.width = this._size.x + 'px';
- this._initSpinner();
+ this._spinnerInterval = L.LOUtil.startSpinner(this._spinnerCanvas, this.options.spinnerSpeed);
L.DomEvent
.disableClickPropagation(this._progress)
.disableScrollPropagation(this._container);
},
- _initSpinner: function () {
- this._spinnerCanvas.width = 50;
- this._spinnerCanvas.height = 50;
-
- var context = this._spinnerCanvas.getContext('2d');
- context.lineWidth = 8;
- context.strokeStyle = 'grey';
- var x = this._spinnerCanvas.width / 2;
- var y = this._spinnerCanvas.height / 2;
- var radius = y - context.lineWidth / 2;
- var self = this;
- this._spinnerInterval = setInterval(function() {
- context.clearRect(0, 0, x * 2, y * 2);
- // Move to center
- context.translate(x, y);
- context.rotate(self.options.spinnerSpeed * Math.PI / 180);
- context.translate(-x, -y);
- context.beginPath();
- context.arc(x, y, radius, 0, Math.PI * 1.3);
- context.stroke();
- }, 1);
- },
-
_setPos: function (pos) {
L.DomUtil.setPosition(this._container, pos);
},
diff --git a/loleaflet/src/map/handler/Map.SlideShow.js b/loleaflet/src/map/handler/Map.SlideShow.js
index f1bb023..00c8d97 100644
--- a/loleaflet/src/map/handler/Map.SlideShow.js
+++ b/loleaflet/src/map/handler/Map.SlideShow.js
@@ -22,14 +22,9 @@ L.Map.SlideShow = L.Handler.extend({
this._map.off('slidedownloadready', this._onSlideDownloadReady, this);
},
- _onIframeLoaded: function () {
- L.DomUtil.removeClass(this._slideShow, 'leaflet-slidshow-spinner');
- },
-
_onFullScreen: function () {
- this._slideShow = L.DomUtil.create('iframe', 'leaflet-slideshow leaflet-slidshow-spinner', this._map._container);
+ this._slideShow = L.DomUtil.create('iframe', 'leaflet-slideshow', this._map._container);
this._slideShow.src = this._map.options.webserver + '/loleaflet/dist/loading.html';
- this._slideShow.onload = L.bind(this._onIframeLoaded, this);
if (this._slideShow.requestFullscreen) {
this._slideShow.requestFullscreen();
}
@@ -64,6 +59,7 @@ L.Map.SlideShow = L.Handler.extend({
_onSlideDownloadReady: function (e) {
this._slideShow.src = e.url + '?mime_type=image/svg%2Bxml';
this._slideShow.contentWindow.focus();
+ clearInterval(this._slideShow.contentWindow.spinnerInterval);
}
});
More information about the Libreoffice-commits
mailing list