diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.hbs b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.hbs index 4fe6e70fd3a..0c22014c8e0 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.hbs +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.hbs @@ -64,6 +64,12 @@
+ {{#if geoServicesEnabled}} +
+ Alerts Stream  + Spatial Stream +
+ {{/if}}
@@ -688,11 +696,11 @@ var geoLocationLink = $(".initGeoLocationLink"); if (geoLocationLink) { geoLocationLink.on('click', function () { - initializeGeoLocation() + initializeGeoLocation({{geoServicesEnabled}}); }); - {{#if showGeoFencingTools}} + geoPublicUri = $("#geo-charts").data("geo-public-uri"); + {{#if geoServicesEnabled}} var geoToolsMenu = $('#location-action-bar'); - geoPublicUri = $("#geo-charts").data("geo-public-uri"); var realtTime = createGeoToolListItem('javascript:enableRealTime()', 'Return to Real Time View', 'fw fw-undo', geoToolsMenu); realtTime.css("display", "none"); diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.js index e41cde43455..f35db76fee3 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.js +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/geo-dashboard.js @@ -52,6 +52,6 @@ function onRequest(context) { } else { viewModel.lastLocation = stringify({}); } - viewModel.showGeoFencingTools = devicemgtProps.serverConfig.geoLocationConfiguration.isEnabled; + viewModel.geoServicesEnabled = devicemgtProps.serverConfig.geoLocationConfiguration.isEnabled; return viewModel; } \ 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 ad02afb1148..dcc9a8c95a6 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 @@ -40,38 +40,11 @@ function initialLoad() { setTimeout(initialLoad, 500); // give everything some time to render } else { initializeMap(); - // getTileServers(); - // loadWms(); processAfterInitializationMap(); - //Access gps and make zoom to server location as map center - //navigator.geolocation.getCurrentPosition(success, error); $("#loading").hide(); } } -//function success(position) { -// var browserLatitude = position.coords.latitude; -// var browserLongitude = position.coords.longitude; -// map.setView([browserLatitude, browserLongitude]); -// map.setZoom(14); -// $.UIkit.notify({ -// message: "Map view set to browser's location", -// status: 'info', -// timeout: ApplicationOptions.constance.NOTIFY_INFO_TIMEOUT, -// pos: 'top-center' -// }); -//} -// -//function error() { -// $.UIkit.notify({ -// message: "Unable to find browser location!", -// status: 'warning', -// timeout: ApplicationOptions.constance.NOTIFY_WARNING_TIMEOUT, -// pos: 'top-center' -// }); -//} - - function initializeMap() { if (typeof(map) !== 'undefined') { map.remove(); @@ -83,7 +56,7 @@ function initializeMap() { map = L.map("map", { zoom: 14, center: [6.927078, 79.861243], - layers: [defaultOSM, defaultTFL], + layers: [defaultOSM], zoomControl: true, attributionControl: false, maxZoom: 20, @@ -147,28 +120,20 @@ function processAfterInitializationMap() { div.innerHTML = "Attribution"; return div; }; - // 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); - // L.control.zoom({ - // position: "bottomright" - // }).addTo(map); groupedOverlays = { "Web Map Service layers": {} }; layerControl = L.control.groupedLayers(baseLayers, groupedOverlays, { - collapsed: true + collapsed: true, + position: 'bottomleft' }).addTo(map); - //L.control.layers(baseLayers).addTo(map); - //map.addLayer(defaultTFL); } /* Highlight search box text on click */ @@ -308,35 +273,43 @@ var getProviderData = function (timeFrom, timeTo) { deviceId = deviceDetails.data("deviceid"); deviceType = deviceDetails.data("type"); - var serviceUrl = '/api/device-mgt/v1.0/geo-services/stats/' + deviceType + '/' + deviceId + '?from=' + timeFrom + '&to=' + timeTo; - invokerUtil.get(serviceUrl, - function (data) { - tableData = JSON.parse(data); - if (tableData.length === 0) { - var geoCharts = $("#geo-charts"); - var location = geoCharts.data("device-location"); - location.heading = 0; - location.id = deviceId; - location.values = {}; - location.values.id = deviceId; - location.values.information = "Last seen " + timeSince(new Date(location.updatedTime)); - location.values.notify = false; - location.values.speed = 0; - location.values.state = "NORMAL"; - location.values.longitude = location.longitude; - location.values.latitude = location.latitude; - location.timestamp = location.updatedTime; - location.values.timeStamp = location.updatedTime; - location.values.type = deviceType; - location._version = "1.0.0"; - tableData.push(location); - } - }, function (message) { - console.log(message); - }); + if (geoFencingEnabled) { + var serviceUrl = '/api/device-mgt/v1.0/geo-services/stats/' + deviceType + '/' + deviceId + '?from=' + timeFrom + '&to=' + timeTo; + invokerUtil.get(serviceUrl, + function (data) { + tableData = JSON.parse(data); + if (tableData.length === 0) { + showCurrentLocation(tableData); + } + }, function (message) { + showCurrentLocation(tableData); + }); + } else { + showCurrentLocation(tableData); + } return tableData; }; +function showCurrentLocation(tableData){ + var geoCharts = $("#geo-charts"); + var location = geoCharts.data("device-location"); + location.heading = 0; + location.id = deviceId; + location.values = {}; + location.values.id = deviceId; + location.values.information = "Last seen " + timeSince(new Date(location.updatedTime)); + location.values.notify = false; + location.values.speed = 0; + location.values.state = "NORMAL"; + location.values.longitude = location.longitude; + location.values.latitude = location.latitude; + location.timestamp = location.updatedTime; + location.values.timeStamp = location.updatedTime; + location.values.type = deviceType; + location._version = "1.0.0"; + tableData.push(location); +} + function timeSince(date) { if (!date) { @@ -399,12 +372,10 @@ function enableRealTime() { isBatchModeOn = false; } -function InitSpatialObject() { +var geoFencingEnabled = true; +function InitSpatialObject(geoFencingIsEnabled) { + geoFencingEnabled = geoFencingIsEnabled; 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})); } @@ -455,13 +426,19 @@ function drawSpatialObject() { return true; } - map.setView(spatialObject.marker.getLatLng(), zoomLevel, {animate: true}); // TODO: check the map._layersMaxZoom and set the zoom level accordingly + if (geoFencingEnabled) { + var alertsFromDate = new Date(); + alertsFromDate.setHours(alertsFromDate.getHours() - 24); //last 24 hours + getAlertsHistory(deviceType, deviceId, alertsFromDate.valueOf(), toDate.valueOf()); + } + + setTimeout(function () { + map.invalidateSize(); + map.setView(spatialObject.marker.getLatLng(), spatialObject.marker.zoomLevel, {animate: true}); + spatialObject.marker.openPopup(); + spatialObject.drawPath(); + }, 500); - var alertsFromDate = new Date(); - alertsFromDate.setHours(alertsFromDate.getHours() - 24); //last 24 hours - getAlertsHistory(deviceType, deviceId, alertsFromDate.valueOf(), toDate.valueOf()); - spatialObject.marker.openPopup(); - spatialObject.drawPath(); if (speedGraphControl) { setTimeout(function () { createChart(); 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 90e338c5d60..e7c9df3f167 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 @@ -65,17 +65,7 @@ var defaultOSM = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png maxZoom: 19 }); -//var defaultTFL = L.tileLayer('https://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',{ -// maxZoom: 19, -// subdomains:['mt0','mt1','mt2','mt3'] -//}); -var defaultTFL = L.tileLayer("", { - maxZoom: 19, - attribution: '| London Traffic and London Buses data Powered by TfL Open Data' -}); - var baseLayers = { - //"Google Maps": defaultTFL, "Open Street Maps": defaultOSM }; @@ -564,7 +554,6 @@ function getAlertsHistory(deviceType, deviceId, timeFrom, timeTo) { } }); }, 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/websocket.js b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/websocket.js index f8fb3923977..3ef846e1485 100644 --- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/websocket.js +++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.geo-dashboard/public/js/websocket.js @@ -20,7 +20,7 @@ var debugObject; // assign object and debug from browser console, this is for de var showPathFlag = false; // Flag to hold the status of draw objects path var currentSpatialObjects = {}; var selectedSpatialObject; // This is set when user search for an object from the search box -var websocket; +var spatialWebsocket; var onAlertWebsocket; var onTrafficStreamWebsocket; var currentPredictions = {}; @@ -506,36 +506,11 @@ function LocalStorageArray(id) { }; } -var webSocketOnTrafficStreamOpen = function () { - onTrafficStreamWebsocket.set_opened(); - noty({text: 'You Are Connected to Traffic Stream !!', type: 'success'}); -}; - -var webSocketOnTrafficStreamMessage = function processMessage(message) { - var json = $.parseJSON(message.data); - if (json.messageType == "Traffic") { - processTrafficMessage(json); - } else { - console.log("Message type not supported."); - } -}; - -var webSocketOnTrafficStreamClose = function (e) { - if (onTrafficStreamWebsocket.get_opened()) { - noty({text: 'Connection lost with Traffic Stream Stream !!', type: 'error'}); - } - waitForSocketConnection(onTrafficStreamWebsocket, initializeOnTrafficStreamWebSocket); -}; - -var webSocketOnTrafficStreamError = function (e) { - if (!onTrafficStreamWebsocket.get_opened()) return; - noty({text: 'Something went wrong when trying to connect to ' + trafficStreamWebSocketURL + '', type: 'error'}); -}; - +var initLoading = true; var webSocketOnAlertOpen = function () { onAlertWebsocket.set_opened(); - noty({text: 'You Are Connected to Alert Stream !!', type: 'success'}); + $('#ws-alert-stream').removeClass('text-muted text-danger text-success').addClass('text-success'); }; var webSocketOnAlertMessage = function processMessage(message) { @@ -551,7 +526,7 @@ var webSocketOnAlertMessage = function processMessage(message) { var webSocketOnAlertClose = function (e) { if (onAlertWebsocket.get_opened()) { - noty({text: 'Connection lost with Alert Stream !!', type: 'error'}); + $('#ws-alert-stream').removeClass('text-muted text-danger text-success').addClass('text-danger'); } waitForSocketConnection(onAlertWebsocket, initializeOnAlertWebSocket); }; @@ -561,18 +536,15 @@ var webSocketOnAlertError = function (e) { noty({text: 'Something went wrong when trying to connect to ' + alertWebSocketURL + '', type: 'error'}); }; -var initLoading = true; -var webSocketOnOpen = function () { - websocket.set_opened(); +var webSocketSpatialOnOpen = function () { + spatialWebsocket.set_opened(); if (initLoading) { - initialLoad(); - InitSpatialObject(); initLoading = false; } - noty({text: 'You Are Connected to Spatial Stream !!', type: 'success'}); + $('#ws-spatial-stream').removeClass('text-muted text-danger text-success').addClass('text-success'); }; -var webSocketOnMessage = function (message) { +var webSocketSpatialOnMessage = function (message) { if (!isBatchModeOn) { var json = $.parseJSON(message.data); if (json.messageType == "Point") { @@ -585,15 +557,15 @@ var webSocketOnMessage = function (message) { } }; -var webSocketOnClose = function (e) { - if (websocket.get_opened()) { - noty({text: 'Connection lost with server!!', type: 'error'}); +var webSocketSpatialOnClose = function (e) { + if (spatialWebsocket.get_opened()) { + $('#ws-spatial-stream').removeClass('text-muted text-danger text-success').addClass('text-danger'); } - waitForSocketConnection(websocket, initializeWebSocket); + waitForSocketConnection(spatialWebsocket, initializeSpatialStreamWebSocket); }; -var webSocketOnError = function (err) { - if (!websocket.get_opened()) return; +var webSocketSpatialOnError = function (err) { + if (!spatialWebsocket.get_opened()) return; noty({text: 'Something went wrong when trying to connect to ' + webSocketURL + '', type: 'error'}); }; @@ -622,13 +594,13 @@ function waitForSocketConnection(socket, callback) { } -function initializeWebSocket() { - if(websocket) websocket.close(); - websocket = new WebSocket(webSocketURL); - websocket.onopen = webSocketOnOpen; - websocket.onmessage = webSocketOnMessage; - websocket.onclose = webSocketOnClose; - websocket.onerror = webSocketOnError; +function initializeSpatialStreamWebSocket() { + if(spatialWebsocket) spatialWebsocket.close(); + spatialWebsocket = new WebSocket(webSocketURL); + spatialWebsocket.onopen = webSocketSpatialOnOpen; + spatialWebsocket.onmessage = webSocketSpatialOnMessage; + spatialWebsocket.onclose = webSocketSpatialOnClose; + spatialWebsocket.onerror = webSocketSpatialOnError; } function initializeOnAlertWebSocket() { @@ -640,7 +612,7 @@ function initializeOnAlertWebSocket() { onAlertWebsocket.onopen = webSocketOnAlertOpen; } -function initializeGeoLocation() { +function initializeGeoLocation(geoFencingEnabled) { var deviceDetails = $(".device-id"); deviceId = deviceDetails.data("deviceid"); deviceType = deviceDetails.data("type"); @@ -657,11 +629,17 @@ function initializeGeoLocation() { alertWebSocketURL = wsEndPoint + userDomain + "/org.wso2.geo.AlertsNotifications/1.0.0?" + "deviceId=" + deviceId + "&deviceType=" + deviceType + "&websocketToken=" + wsToken; $("#proximity_alert").hide(); - initializeWebSocket(); - initializeOnAlertWebSocket(); - window.onbeforeunload = function () { - websocket.close(); - onAlertWebsocket.close(); + + initialLoad(); + InitSpatialObject(geoFencingEnabled); + + if (geoFencingEnabled) { + initializeSpatialStreamWebSocket(); + initializeOnAlertWebSocket(); + window.onbeforeunload = function () { + spatialWebsocket.close(); + onAlertWebsocket.close(); + } } } else { noty({text: 'Invalid Access! No device information provided to track!', type: 'error'});