adding location history to map view

revert-dabc3590
kamidu 8 years ago
parent 05e2cb7bb8
commit 234157b6f5

@ -22,7 +22,7 @@
{{#zone "overview-section"}} {{#zone "overview-section"}}
<div class="media-body asset-desc add-padding-left-5x"> <div class="media-body asset-desc add-padding-left-5x">
<div style="background: #11375B; color: #fff; padding: 10px; margin-bottom: 5px">Device <div style="background: #11375B; color: #fff; padding: 10px; margin-bottom: 5px">Device
Overview Overview
</div> </div>
<table class="table table-responsive table-striped" id="members"> <table class="table table-responsive table-striped" id="members">
<tbody> <tbody>
@ -89,7 +89,7 @@
{{#if device.osBuildDate}} {{#if device.osBuildDate}}
<tr role="row" class="even"> <tr role="row" class="even">
<td class="sorting_1" style="padding:10px 15px; width: 15%;">Firmware Build <td class="sorting_1" style="padding:10px 15px; width: 15%;">Firmware Build
Date Date
</td> </td>
<td style="padding:10px 15px;">{{device.osBuildDate}}</td> <td style="padding:10px 15px;">{{device.osBuildDate}}</td>
</tr> </tr>
@ -185,19 +185,19 @@
</div> </div>
{{/if}} {{/if}}
<!--{{#if device.cpuUsage}}--> <!--{{#if device.cpuUsage}}-->
<!--<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">--> <!--<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">-->
<!--<div class="col-md-12">--> <!--<div class="col-md-12">-->
<!--<div class="wr-stats-board-tile">--> <!--<div class="wr-stats-board-tile">-->
<!--<div class="tile-name">CPU Usage</div>--> <!--<div class="tile-name">CPU Usage</div>-->
<!--<div>--> <!--<div>-->
<!--<div class="tile-icon"><i class="fw fw-dashboard"></i></div>--> <!--<div class="tile-icon"><i class="fw fw-dashboard"></i></div>-->
<!--<div class="tile-stats">--> <!--<div class="tile-stats">-->
<!--{{device.cpuUsage.value}} %--> <!--{{device.cpuUsage.value}} %-->
<!--</div>--> <!--</div>-->
<!--</div>--> <!--</div>-->
<!--</div>--> <!--</div>-->
<!--</div>--> <!--</div>-->
<!--</div>--> <!--</div>-->
<!--{{/if}}--> <!--{{/if}}-->
{{#if device.ramUsage}} {{#if device.ramUsage}}
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"> <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
@ -228,9 +228,9 @@
<div class="tile-stats"> <div class="tile-stats">
{{device.internalMemory {{device.internalMemory
.usage}} % .usage}} %
<span class="tile-stats-free"> <span class="tile-stats-free">
TOTAL OF {{device.internalMemory TOTAL OF {{device.internalMemory
.total}} GB .total}} GB
</span> </span>
</div> </div>
</div> </div>
@ -249,9 +249,9 @@
<div class="tile-stats"> <div class="tile-stats">
{{device.externalMemory {{device.externalMemory
.usage}} % .usage}} %
<span class="tile-stats-free"> <span class="tile-stats-free">
TOTAL OF {{device.externalMemory TOTAL OF {{device.externalMemory
.total}} GB .total}} GB
</span> </span>
</div> </div>
</div> </div>
@ -291,7 +291,7 @@
<div class="panel-heading display-none-xs"> <div class="panel-heading display-none-xs">
Policy Compliance Policy Compliance
<span> <span>
<a href="javascript:void(0);" id="refresh-policy"> <a href="javascript:void(0);" id="refresh-policy">
<i class="fw fw-refresh"></i> <i class="fw fw-refresh"></i>
</a> </a>
@ -308,7 +308,7 @@
<div id="policy-spinner" <div id="policy-spinner"
class="wr-advance-operations-init add-padding-bottom-2x add-padding-bottom-4x hidden"> class="wr-advance-operations-init add-padding-bottom-2x add-padding-bottom-4x hidden">
<i class="fw fw-settings fw-spin fw-2x"></i>Loading Policy <i class="fw fw-settings fw-spin fw-2x"></i>Loading Policy
Compliance... Compliance...
</div> </div>
<div id="policy-list-container"> <div id="policy-list-container">
</div> </div>
@ -335,11 +335,12 @@
{{#if device.location}} {{#if device.location}}
<div id="device-location" <div id="device-location"
data-lat="{{device.location.latitude}}" data-lat="{{device.location.latitude}}"
data-long="{{device.location.longitude}}"> data-long="{{device.location.longitude}}"
data-locations = "{{device.locationHistory}}">
</div> </div>
<br/> <br/>
<a class="padding-left" target="_blank" <a class="padding-left" target="_blank"
href="{{portalUrl}}/portal/dashboards/geo-dashboard/?GLOBAL-STATE={{deviceId}},{{deviceType}}"> href="{{portalUrl}}/portal/dashboards/geo-dashboard/?GLOBAL-STATE={{anchor}}">
<span class="fw-stack"> <span class="fw-stack">
<i class="fw fw-circle-outline fw-stack-2x"></i> <i class="fw fw-circle-outline fw-stack-2x"></i>
<i class="fw fw-map-location fw-stack-1x"></i> <i class="fw fw-map-location fw-stack-1x"></i>
@ -375,7 +376,7 @@
<div class="panel-heading display-none-xs"> <div class="panel-heading display-none-xs">
Installed Applications Installed Applications
<span> <span>
<a href="javascript:void(0);" id="refresh-apps"> <a href="javascript:void(0);" id="refresh-apps">
<i class="fw fw-refresh"></i> <i class="fw fw-refresh"></i>
</a> </a>
@ -391,7 +392,7 @@
</span> </span>
<div id="apps-spinner" class="wr-advance-operations-init hidden"> <div id="apps-spinner" class="wr-advance-operations-init hidden">
<i class="fw fw-settings fw-spin fw-2x"></i> Loading Applications <i class="fw fw-settings fw-spin fw-2x"></i> Loading Applications
List... List...
</div> </div>
<div id="applications-list-container"> <div id="applications-list-container">
<div class="message message-info"> <div class="message message-info">

@ -17,7 +17,7 @@
*/ */
function onRequest(context) { function onRequest(context) {
// var log = new Log("device-view.js"); // var log = new Log("device-view.js");
var deviceType = context["uriParams"]["deviceType"]; var deviceType = context["uriParams"]["deviceType"];
var deviceId = request.getParameter("id"); var deviceId = request.getParameter("id");
var deviceViewData = {}; var deviceViewData = {};
@ -32,7 +32,7 @@ function onRequest(context) {
var filteredDeviceData = response["content"]; var filteredDeviceData = response["content"];
// creating deviceView information model from filtered device data // creating deviceView information model from filtered device data
var viewModel = {}; var viewModel = {};
if (filteredDeviceData["type"]) { if (filteredDeviceData["type"]) {
viewModel["type"] = filteredDeviceData["type"]; viewModel["type"] = filteredDeviceData["type"];
@ -194,7 +194,7 @@ function onRequest(context) {
if (!filteredDeviceData["initialDeviceInfo"] && !filteredDeviceData["latestDeviceInfo"]) { if (!filteredDeviceData["initialDeviceInfo"] && !filteredDeviceData["latestDeviceInfo"]) {
viewModel["deviceInfoAvailable"] = false; viewModel["deviceInfoAvailable"] = false;
} }
viewModel.locationHistory = stringify(filteredDeviceData["locationHistory"]);
deviceViewData["device"] = viewModel; deviceViewData["device"] = viewModel;
} else if (response["status"] == "unauthorized") { } else if (response["status"] == "unauthorized") {
deviceViewData["deviceFound"] = true; deviceViewData["deviceFound"] = true;
@ -213,7 +213,6 @@ function onRequest(context) {
deviceViewData["autoCompleteParams"] = autoCompleteParams; deviceViewData["autoCompleteParams"] = autoCompleteParams;
deviceViewData["portalUrl"] = devicemgtProps['portalURL']; deviceViewData["portalUrl"] = devicemgtProps['portalURL'];
deviceViewData["deviceId"] = deviceId; deviceViewData["anchor"] = encodeURI(JSON.stringify({ "device" : { "id" : deviceId, "type" : deviceType}}));
deviceViewData["deviceType"] = deviceType;
return deviceViewData; return deviceViewData;
} }

@ -22,15 +22,27 @@ function loadLeafletMap() {
var deviceLocationID = "#device-location", var deviceLocationID = "#device-location",
lat = $(deviceLocationID).data("lat"), lat = $(deviceLocationID).data("lat"),
long = $(deviceLocationID).data("long"), long = $(deviceLocationID).data("long"),
locations = $(deviceLocationID).data("locations"),
container = "device-location", container = "device-location",
zoomLevel = 13, zoomLevel = 13,
tileSet = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", tileSet = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
attribution = "&copy; <a href='https://openstreetmap.org/copyright'>OpenStreetMap</a> contributors"; attribution = "&copy; <a href='https://openstreetmap.org/copyright'>OpenStreetMap</a> contributors";
if (lat && long) { if (locations) {
var locationSets = locations.locations;
map = L.map(container).setView([lat, long], zoomLevel); map = L.map(container).setView([lat, long], zoomLevel);
L.tileLayer(tileSet, {attribution: attribution}).addTo(map); L.tileLayer(tileSet, {attribution: attribution}).addTo(map);
L.marker([lat, long]).addTo(map).bindPopup("Device is here...").openPopup();
for(var i = 0; i < locationSets.length; i++){
var m = L.marker(locationSets[i]).addTo(map).bindPopup(new Date(locations.times[i].time).toISOString())
m.on('mouseover', function (e) {
this.openPopup();
});
m.on('mouseout', function (e) {
this.closePopup();
});
}
$("#map-error").hide(); $("#map-error").hide();
$("#device-location").show(); $("#device-location").show();

Loading…
Cancel
Save