From 4b6dec4e4b3e9d852d0de574d268993f03eb8cad Mon Sep 17 00:00:00 2001
From: Nikolaus Krismer <niko@krismer.de>
Date: Fri, 21 Mar 2014 11:21:05 +0100
Subject: [PATCH] added warning icon regarding websocket/configuration status
---
src/main/webapp/css/{isoga.css => isomap.css} | 7 +++-
src/main/webapp/js/isochrone/isoMap.js | 32 +++++++++++++++----
src/main/webapp/js/map/control/wswarning.js | 19 +++++++++++
3 files changed, 51 insertions(+), 7 deletions(-)
rename src/main/webapp/css/{isoga.css => isomap.css} (85%)
create mode 100644 src/main/webapp/js/map/control/wswarning.js
diff --git a/src/main/webapp/css/isoga.css b/src/main/webapp/css/isomap.css
similarity index 85%
rename from src/main/webapp/css/isoga.css
rename to src/main/webapp/css/isomap.css
index 5f604fc8..3d96d735 100644
--- a/src/main/webapp/css/isoga.css
+++ b/src/main/webapp/css/isomap.css
@@ -34,13 +34,18 @@ fieldset { padding:0; border:0; margin-top:25px; }
background: url('/isochrone/img/help_filled.png') no-repeat scroll 0px 0px transparent;
}
+.wsWarning-control-div {
+ background: url('/isochrone/img/warning.png') no-repeat scroll 0px 0px transparent;
+}
+
.settings-control-div {
background: url('/isochrone/img/settings.png') no-repeat scroll 0px 0px transparent;
clear: none;
}
.help-control-div,
-.settings-control-div {
+.settings-control-div,
+.wsWarning-control-div {
background-position: center;
background-size: 90%;
cursor: pointer;
diff --git a/src/main/webapp/js/isochrone/isoMap.js b/src/main/webapp/js/isochrone/isoMap.js
index 9a755531..87ae69f4 100644
--- a/src/main/webapp/js/isochrone/isoMap.js
+++ b/src/main/webapp/js/isochrone/isoMap.js
@@ -1,11 +1,11 @@
-define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'map/control/settings', 'map/control/help', 'map/control/geosearch', 'map/control/geosearchProvider/osm', 'map/ipLocator/ipProvider', 'map/ipLocator/ipLocator'], function($, L, logger, BingLayer, GoogleLayer, SettingsControl, HelpControl, GeoSearch, OSMProvider, IpProvider, IpLocator) {
+define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'map/control/help', 'map/control/settings', 'map/control/wswarning', 'map/control/geosearch', 'map/control/geosearchProvider/osm', 'map/ipLocator/ipProvider', 'map/ipLocator/ipLocator'], function($, L, logger, BingLayer, GoogleLayer, HelpControl, SettingsControl, WsWarningControl, GeoSearch, OSMProvider, IpProvider, IpLocator) {
// Private static fields
var INNSBRUCK = [47.265718, 11.391342];
// var VIENNA = [48.186312, 16.317615];
// Class function (a.k.a. constructor)
function IsoMap(div) {
- // self has to be used insteaf of this in private methods to refer to public vars/mathods
+ // self has to be used instead of this in private methods to refer to public vars/mathods
// var self = this;
// Private fields
@@ -19,6 +19,7 @@ define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'ma
zoomControl: false, // hide default zoom control, so we can create a bottomright one
zoom: 12
};
+ var wsWarningControl = null;
// Constructor code
@@ -51,12 +52,12 @@ define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'ma
// Map creation and control assignment
require(['locateControl', 'map/ipLocator/mapIncluder'], function() {
map = L.map(mDiv, mapOptions);
- map.addControl(new SettingsControl({position: 'bottomright'}));
- map.addControl(new HelpControl({position: 'bottomright'}));
+ map.addControl(L.control.scale({position: 'bottomleft'}));
+ map.addControl(new SettingsControl());
+ map.addControl(new HelpControl());
map.addControl(layerControl);
- map.addControl(L.control.zoom({position: 'bottomright'}));
map.addControl(L.control.locate({position: 'bottomright'}));
- map.addControl(L.control.scale({position: 'bottomleft'}));
+ map.addControl(L.control.zoom({position: 'bottomright'}));
map.addControl(new GeoSearch({
doReverseLookup: true,
position: 'topleft',
@@ -65,6 +66,11 @@ define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'ma
}));
map.attributionControl.setPrefix('IsoMap v@version@');
+
+ warningIndicatorShow();
+ $(document).on('websocket_error', warningIndicatorShow);
+ $(document).on('websocket_close', warningIndicatorShow);
+ $(document).on('getConfiguration', warningIndicatorHide);
$(document).trigger('isomap_draw');
});
};
@@ -210,6 +216,20 @@ define(['jQuery', 'leaflet', 'console', 'map/layer/bing','map/layer/google', 'ma
this.draw();
}
+
+ function warningIndicatorHide() {
+ if (wsWarningControl !== null) {
+ map.removeControl(wsWarningControl);
+ wsWarningControl = null;
+ }
+ };
+
+ function warningIndicatorShow() {
+ if (wsWarningControl === null) {
+ wsWarningControl = new WsWarningControl();
+ map.addControl(wsWarningControl);
+ }
+ };
}
// Public static field
diff --git a/src/main/webapp/js/map/control/wswarning.js b/src/main/webapp/js/map/control/wswarning.js
new file mode 100644
index 00000000..2261b71d
--- /dev/null
+++ b/src/main/webapp/js/map/control/wswarning.js
@@ -0,0 +1,19 @@
+define(['leaflet', 'console'], function(L, logger) {
+ L.WsWarningControl = L.Control.extend({
+ options: {
+ position: 'bottomleft'
+ },
+
+ onAdd: function() {
+ this._container = L.DomUtil.create('div', 'help-control');
+ this._container.id = 'wsWarning-control-div';
+ this._container.className = 'wsWarning-control-div';
+ this._container.title = 'Problem regarding websocket/configuration';
+
+ L.DomEvent.disableClickPropagation(this._container);
+ return this._container;
+ }
+ });
+
+ return L.WsWarningControl;
+});
--
GitLab