@@ -515,6 +481,7 @@
Speed km/h
Heading
+
@@ -693,6 +660,7 @@
{{js "js/leaflet/leaflet.markercluster.js" }}
{{js "js/leaflet/L.Control.Locate.js" }}
{{js "js/leaflet/L.Control.Focus.js" }}
+ {{js "js/leaflet/L.Control.GeoAlerts.js" }}
{{js "js/leaflet/leaflet.groupedlayercontrol.js" }}
{{js "js/leaflet/Leaflet.fullscreen.min.js" }}
{{js "js/leaflet/Marker.Rotate.js" }}
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/app.css b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/app.css
index 3a078528ad..086e80f550 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/app.css
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/app.css
@@ -113,6 +113,22 @@ input[type="radio"], input[type="checkbox"] {
display: none;
}
}
+
+.leaflet-geo-alerts{
+ border-radius: 4px;
+ border: none;
+ background-color: white;
+ padding: 5px;
+ box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+ width: 200px;
+ font-size: 11px;
+}
+
+.leaflet-geo-alerts a{
+ padding: 5px 10px;
+}
+
+
/*
!* Print Handling *!
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/map.css b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/map.css
index 4e4a2e7d8e..74c5f7a3c8 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/map.css
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/css/map.css
@@ -44,11 +44,6 @@
margin: 6px;
}
-#objectInfoCloseButton:hover {
- cursor: pointer;
- color: firebrick;
-}
-
.sectionJointStyle {
stroke-dasharray: 3, 20;
}
\ No newline at end of file
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/app.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/app.js
index d3f7c71c3d..7be0b9c2b4 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/app.js
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/app.js
@@ -45,26 +45,10 @@ function initialLoad() {
processAfterInitializationMap();
//Access gps and make zoom to server location as map center
//navigator.geolocation.getCurrentPosition(success, error);
- setPageTitle();
$("#loading").hide();
}
}
-function setPageTitle() {
- var hash = window.parent.location.hash;
- if(hash) {
- var startIdx = hash.indexOf("/") + 1;
- var lastIdx = hash.length;
- var deviceInfoString = hash.substring(startIdx,lastIdx);
- var deviceInfo = JSON.parse(deviceInfoString);
- if(deviceInfo) {
- var newTitle = "[ " + deviceInfo.device.id + "]" + " - Geo Dashboard [" + deviceInfo.device.type + "]";
- window.parent.document.title = newTitle;
- $("#title").val(newTitle)
- }
- }
-}
-
//function success(position) {
// var browserLatitude = position.coords.latitude;
// var browserLongitude = position.coords.longitude;
@@ -150,6 +134,7 @@ function updateAttribution(e) {
}
var attributionControl;
+var geoAlertsBar;
var groupedOverlays;
var layerControl;
@@ -164,6 +149,9 @@ function processAfterInitializationMap() {
};
// map.addControl(attributionControl);
map.addControl(L.control.fullscreen({position: 'bottomright'}));
+
+ geoAlertsBar = L.control.geoAlerts({position: 'topright'});
+ map.addControl(geoAlertsBar);
//L.control.fullscreen({
// position: 'bottomright'
//}).addTo(map);
@@ -300,18 +288,15 @@ function focusOnSpatialObject(objectId) {
map.setView(spatialObject.marker.getLatLng(), zoomLevel, {animate: true});
// TODO: check the map._layersMaxZoom and set the zoom level accordingly
- $('#objectInfo').find('#objectInfoId').html(selectedSpatialObject);
spatialObject.marker.openPopup();
- if (!toggled) {
- $('#objectInfo').animate({width: 'toggle'}, 100);
- toggled = true;
- }
getAlertsHistory(deviceType, deviceId, new Date($('#timeFrom').val()).getTime(), new Date($('#timeTo').val()).getTime());
spatialObject.drawPath();
- setTimeout(function () {
- createChart();
- chart.load({columns: [spatialObject.speedHistory.getArray()]});
- }, 100);
+ if (speedGraphControl) {
+ setTimeout(function () {
+ createChart();
+ chart.load({columns: [spatialObject.speedHistory.getArray()]});
+ }, 100);
+ }
map.addControl(L.control.focus({position: 'bottomright', marker: spatialObject.marker, zoomLevel: zoomLevel}));
}
@@ -359,29 +344,41 @@ function timeSince(date) {
}
var seconds = Math.floor((new Date() - date) / 1000);
+ var intervalType;
var interval = Math.floor(seconds / 31536000);
-
- if (interval > 1) {
- return interval + " years";
- }
- interval = Math.floor(seconds / 2592000);
- if (interval > 1) {
- return interval + " months";
- }
- interval = Math.floor(seconds / 86400);
- if (interval > 1) {
- return interval + " days";
- }
- interval = Math.floor(seconds / 3600);
- if (interval > 1) {
- return interval + " hours";
+ if (interval >= 1) {
+ intervalType = 'year';
+ } else {
+ interval = Math.floor(seconds / 2592000);
+ if (interval >= 1) {
+ intervalType = 'month';
+ } else {
+ interval = Math.floor(seconds / 86400);
+ if (interval >= 1) {
+ intervalType = 'day';
+ } else {
+ interval = Math.floor(seconds / 3600);
+ if (interval >= 1) {
+ intervalType = "hour";
+ } else {
+ interval = Math.floor(seconds / 60);
+ if (interval >= 1) {
+ intervalType = "minute";
+ } else {
+ interval = seconds;
+ intervalType = "second";
+ }
+ }
+ }
+ }
}
- interval = Math.floor(seconds / 60);
- if (interval > 1) {
- return interval + " minutes";
+
+ if (interval > 1 || interval === 0) {
+ intervalType += 's';
}
- return Math.floor(seconds) + " seconds ago";
+
+ return interval + ' ' + intervalType + ' ago';
}
function notifyError(message) {
@@ -404,6 +401,10 @@ function enableRealTime() {
function InitSpatialObject() {
var spatialObject = drawSpatialObject();
+ setTimeout(function () {
+ map.setView(spatialObject.marker.getLatLng(), spatialObject.marker.zoomLevel, {animate: true});
+ }, 1000
+ );
map.addControl(L.control.focus({position: 'bottomright', marker: spatialObject.marker, zoomLevel: zoomLevel}));
}
@@ -456,17 +457,17 @@ function drawSpatialObject() {
map.setView(spatialObject.marker.getLatLng(), zoomLevel, {animate: true}); // TODO: check the map._layersMaxZoom and set the zoom level accordingly
- $('#objectInfo').find('#objectInfoId').html(selectedSpatialObject);
+ var alertsFromDate = new Date();
+ alertsFromDate.setHours(alertsFromDate.getHours() - 24); //last 24 hours
+ getAlertsHistory(deviceType, deviceId, alertsFromDate.valueOf(), toDate.valueOf());
spatialObject.marker.openPopup();
- if (!toggled) {
- $('#objectInfo').animate({width: 'toggle'}, 100);
- toggled = true;
- }
spatialObject.drawPath();
- setTimeout(function () {
- createChart();
- chart.load({columns: [spatialObject.speedHistory.getArray()]});
- }, 100);
+ if (speedGraphControl) {
+ setTimeout(function () {
+ createChart();
+ chart.load({columns: [spatialObject.speedHistory.getArray()]});
+ }, 100);
+ }
return spatialObject;
}
@@ -525,18 +526,15 @@ function focusOnHistorySpatialObject(objectId, timeFrom, timeTo) {
map.setView(spatialObject.marker.getLatLng(), zoomLevel, {animate: true});
// TODO: check the map._layersMaxZoom and set the zoom level accordingly
- $('#objectInfo').find('#objectInfoId').html(selectedSpatialObject);
spatialObject.marker.openPopup();
- if (!toggled) {
- $('#objectInfo').animate({width: 'toggle'}, 100);
- toggled = true;
- }
getAlertsHistory(deviceType, deviceId, new Date($('#timeFrom').val()).getTime(), new Date($('#timeTo').val()).getTime());
spatialObject.drawPath();
- setTimeout(function () {
- createChart();
- chart.load({columns: [spatialObject.speedHistory.getArray()]});
- }, 100);
+ if (speedGraphControl) {
+ setTimeout(function () {
+ createChart();
+ chart.load({columns: [spatialObject.speedHistory.getArray()]});
+ }, 100);
+ }
}
}
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_fencing.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_fencing.js
index 62eeeb0b16..4c876ae7c9 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_fencing.js
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_fencing.js
@@ -17,6 +17,7 @@
*/
var drawControl;
+var speedGraphControl;
var removeAllControl;
var drawnItems;
var lastId;
@@ -285,6 +286,20 @@ function createPopup(layer,id) {
$(layer._popup._container.childNodes[0]).css("background", "rgba(255,255,255,0.8)");
}
+function toggleSpeedGraph(){
+ if (speedGraphControl) {
+ try {
+ map.removeControl(speedGraphControl);
+ speedGraphControl = null;
+ } catch (e) {
+ console.log("error: " + e.message);
+ }
+ } else {
+ speedGraphControl = new L.control.speedChart({'position' : 'topright'});
+ map.addControl(speedGraphControl);
+ }
+}
+
function closeTools(leafletId) {
map.removeLayer(map._layers[leafletId]);
map.removeControl(drawControl);
@@ -336,7 +351,6 @@ function updateDrawing(updatedGeoJson) {
map.addLayer(polygon);
createPopup(polygon);
closeAll();
-
}
function viewFence(geoFenceElement,id) {
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_remote.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_remote.js
index db2083c305..90e338c5d6 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_remote.js
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/geo_remote.js
@@ -531,6 +531,8 @@ function removeGeoFence(geoFenceElement, id) {
});
}
+
+
function getAlertsHistory(deviceType, deviceId, timeFrom, timeTo) {
var timeRange = '';
if (timeFrom && timeTo) {
@@ -539,42 +541,27 @@ function getAlertsHistory(deviceType, deviceId, timeFrom, timeTo) {
var serviceUrl = '/api/device-mgt/v1.0/geo-services/alerts/history/' + deviceType + '/' + deviceId + timeRange;
invokerUtil.get(serviceUrl,
function (data) {
- var alertsContainer = $('#showAlertsArea').empty();
+ geoAlertsBar.clearAllAlerts();
var alerts = JSON.parse(data);
$.each(alerts, function (key, val) {
if(val.values){
val = val.values;
}
- var alertDOMElement = document.createElement('a'); // Reason for using
- // document.createElement
- // (performance issue)
- // http://stackoverflow.com/questions/268490/jquery-document-createelement-equivalent
+ var msg = deviceType.charAt(0).toUpperCase() + deviceType.slice(1) +
+ " " + deviceId +" "+ val.information.replace("Alerts: ,", "") + " - " + timeSince(val.timeStamp);
switch (val.state) {
case "NORMAL":
-// $(alertDOMElement).addClass("list-group-item list-group-item-info");
return;
case "WARNING":
- $(alertDOMElement).addClass("list-group-item list-group-item-warning");
+ geoAlertsBar.addAlert('warn', msg, val);
break;
case "ALERTED":
- $(alertDOMElement).addClass("list-group-item list-group-item-danger");
+ geoAlertsBar.addAlert('danger', msg, val);
break;
case "OFFLINE":
- $(alertDOMElement).addClass("list-group-item list-group-item-success");
+ geoAlertsBar.addAlert('info', msg, val);
break;
}
- $(alertDOMElement).html(val.information);
- $(alertDOMElement).css({marginTop: "5px"});
- $(alertDOMElement).attr('onClick', 'showAlertInMap(this)');
-
- // Set HTML5 data attributes for later use
- $(alertDOMElement).attr('data-id', val.id);
- $(alertDOMElement).attr('data-latitude', val.latitude);
- $(alertDOMElement).attr('data-longitude', val.longitude);
- $(alertDOMElement).attr('data-state', val.state);
- $(alertDOMElement).attr('data-information', val.information);
-
- alertsContainer.append(alertDOMElement);
});
}, function (message) {
console.log(message);
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.Focus.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.Focus.js
index 678b295cb2..77d91c90f6 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.Focus.js
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.Focus.js
@@ -40,22 +40,12 @@ L.Control.Focus = L.Control.extend({
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', function () {
- focus();
+ // self.options.latlng
+ map.setView(self.options.marker.getLatLng(), self.options.marker.zoomLevel, {animate: true});
+ self.options.marker.openPopup();
})
.on(link, 'dblclick', L.DomEvent.stopPropagation);
- var focus = function () {
- visualizeLocation();
- };
-
- var visualizeLocation = function () {
- // self.options.latlng
- map.setView(self.options.marker.getLatLng(), self.options.marker.zoomLevel, {animate: true});
- self.options.marker.openPopup();
- };
-
- // make focus functions available to outside world
- this.focus = focus;
return container;
}
});
@@ -69,22 +59,4 @@ L.Map.addInitHook(function () {
L.control.focus = function (options) {
return new L.Control.Focus(options);
-};
-
-(function () {
- // leaflet.js raises bug when trying to addClass / removeClass multiple classes at once
- // Let's create a wrapper on it which fixes it.
- var LDomUtilApplyClassesMethod = function (method, element, classNames) {
- classNames = classNames.split(' ');
- classNames.forEach(function (className) {
- L.DomUtil[method].call(this, element, className);
- });
- };
-
- L.DomUtil.addClasses = function (el, names) {
- LDomUtilApplyClassesMethod('addClass', el, names);
- };
- L.DomUtil.removeClasses = function (el, names) {
- LDomUtilApplyClassesMethod('removeClass', el, names);
- };
-})();
+};
\ No newline at end of file
diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.GeoAlerts.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.GeoAlerts.js
new file mode 100644
index 0000000000..5147026936
--- /dev/null
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/leaflet/L.Control.GeoAlerts.js
@@ -0,0 +1,186 @@
+/*
+ * Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+L.Control.GeoAlertCompact = L.Control.extend({
+ options: {
+ position: 'topright',
+ icon: 'fw fw-notification', // icon-location or icon-direction
+ strings: {
+ title: "Show the device"
+ },
+ marker: {},
+ zoomLevel: 13,
+ alerts: {}
+ },
+
+ onAdd: function (map) {
+ var self = this;
+ var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
+
+ var link = L.DomUtil.create('a', 'leaflet-bar-part leaflet-bar-part-single', container);
+ link.href = '#';
+ link.title = this.options.strings.title;
+
+ var alertsCount = this.options.alerts.length;
+ if (alertsCount > 0) {
+ var spanMain = L.DomUtil.create('i', 'fw-stack', link);
+ L.DomUtil.create('i', this.options.icon + ' fw-stack-2x', spanMain);
+ var span = L.DomUtil.create('span', 'fw-stack fw-move-right fw-move-bottom', spanMain);
+ L.DomUtil.create('i', 'fw fw-circle fw-stack-2x fw-stroke', span);
+ var num = L.DomUtil.create('i', 'fw fw-number fw-stack-1x fw-inverse', span);
+ num.innerHTML = (alertsCount < 100) ? alertsCount + "" : "99+";
+ } else {
+ L.DomUtil.create('i', this.options.icon, link);
+ }
+
+ L.DomEvent
+ .on(link, 'click', L.DomEvent.stopPropagation)
+ .on(link, 'click', L.DomEvent.preventDefault)
+ .on(link, 'click', function () {
+ link.remove();
+ self.removeFrom(map);
+ toggleSpeedGraph();
+ map.addControl(L.control.geoAlerts());
+ for (var i = 0; i < self.options.alerts.length; i++) {
+ var alert = self.options.alerts[i];
+ L.DomUtil.get("geoAlertContainer").appendChild(alert);
+ i--; //because dom manipulation
+ }
+ toggleSpeedGraph();
+ self = null;
+ })
+ .on(link, 'dblclick', L.DomEvent.stopPropagation);
+
+ return container;
+ }
+});
+
+L.control.geoAlertCompact = function (options) {
+ return new L.Control.GeoAlertCompact(options);
+};
+
+L.Control.GeoAlerts = L.Control.extend({
+ options: {
+ position: 'topright'
+ },
+
+ onAdd: function (map) {
+ var self = this;
+ var container = L.DomUtil.create('div', 'leaflet-control list-group leaflet-geo-alerts');
+ container.id = "geoAlertContainer";
+
+ var title = L.DomUtil.create('h5', '', container);
+ title.innerHTML = "Geo Alerts";
+
+ var closeBtn = L.DomUtil.create('a', 'leaflet-popup-close-button', container);
+ closeBtn.href = "#close";
+ closeBtn.innerHTML = "×";
+ L.DomEvent
+ .addListener(closeBtn, 'click', L.DomEvent.stopPropagation)
+ .addListener(closeBtn, 'click', L.DomEvent.preventDefault)
+ .addListener(closeBtn, 'click', function () {
+ closeBtn.remove();
+ var alerts = L.DomUtil.get("geoAlertContainer").getElementsByClassName("leaflet-geo-alert");
+ self.removeFrom(map);
+ var alertCompactControl = L.control.geoAlertCompact({'alerts':alerts});
+ toggleSpeedGraph();
+ map.addControl(alertCompactControl);
+ toggleSpeedGraph();
+ self = null;
+ });
+
+ this.options.alertContainer = container;
+ return container;
+ },
+
+ addAlert: function (state, text, alert){
+ var container = L.DomUtil.get("geoAlertContainer");
+ var link = L.DomUtil.create('a', 'leaflet-geo-alert list-group-item list-group-item alert alert-' + state, container);
+ link.href = 'javascript:void()';
+ link.innerHTML = text;
+ link.setAttribute('onClick', 'showAlertInMap(this)');
+
+ // Set HTML5 data attributes for later use
+ link.setAttribute('data-id', alert.id);
+ link.setAttribute('data-latitude', alert.latitude);
+ link.setAttribute('data-longitude', alert.longitude);
+ link.setAttribute('data-state', alert.state);
+ link.setAttribute('data-information', alert.information);
+ },
+
+ getAllAlerts: function (){
+ return L.DomUtil.get("geoAlertContainer").getElementsByClassName("leaflet-geo-alert");
+ },
+
+ clearAllAlerts: function () {
+ var alerts = L.DomUtil.get("geoAlertContainer").getElementsByClassName("leaflet-geo-alert");
+ while(alerts[0]){
+ alerts[0].parentNode.removeChild(alerts[0]);
+ }
+ }
+});
+
+L.Map.addInitHook(function () {
+ if (this.options.geoAlertsControl) {
+ this.geoAlertsControl = L.control.geoAlerts();
+ this.addControl(this.geoAlertsControl);
+ }
+});
+
+L.control.geoAlerts = function (options) {
+ return new L.Control.GeoAlerts(options);
+};
+
+L.Control.SpeedChart = L.Control.extend({
+ options: {
+ position: 'topleft',
+ alerts: {}
+ },
+
+ onAdd: function (map) {
+ var self = this;
+ var container = L.DomUtil.create('div', 'leaflet-control list-group leaflet-geo-alerts');
+
+ var title = L.DomUtil.create('h5', '', container);
+ title.innerHTML = "Speed";
+
+ var closeBtn = L.DomUtil.create('a', 'leaflet-popup-close-button', container);
+ closeBtn.href = "#close";
+ closeBtn.innerHTML = "×";
+ L.DomEvent
+ .addListener(closeBtn, 'click', L.DomEvent.stopPropagation)
+ .addListener(closeBtn, 'click', L.DomEvent.preventDefault)
+ .addListener(closeBtn, 'click', function () {
+ closeBtn.remove();
+ speedGraphControl.removeFrom(map);
+ speedGraphControl = null;
+ });
+
+ var chartDiv = L.DomUtil.create('div', '', container);
+ chartDiv.id = 'chart_div';
+ this.options.alertContainer = container;
+ return container;
+ },
+
+ updateGraph: function () {
+ var alerts = L.DomUtil.get("chart_div");
+ }
+});
+
+L.control.speedChart = function (options) {
+ return new L.Control.SpeedChart(options);
+};
\ No newline at end of file