Adding geo fence exit alerts ui

4.x.x
Rasika Perera 8 years ago
parent 6d02075a99
commit e1c5c72b1b

@ -715,7 +715,9 @@
createGeoToolListItem(geoPublicUri + '/assets/html_templates/modal/stationery_alert.html', createGeoToolListItem(geoPublicUri + '/assets/html_templates/modal/stationery_alert.html',
'Add Stationary Alert', 'glyphicon glyphicon-link', geoToolsMenu); 'Add Stationary Alert', 'glyphicon glyphicon-link', geoToolsMenu);
createGeoToolListItem(geoPublicUri + '/assets/html_templates/modal/within_alert.html', createGeoToolListItem(geoPublicUri + '/assets/html_templates/modal/within_alert.html',
'Add Geo Fence Alert', 'glyphicon glyphicon-edit', geoToolsMenu); 'Add Geo Fence Enter Alert', 'glyphicon glyphicon-edit', geoToolsMenu);
createGeoToolListItem(geoPublicUri + '/assets/html_templates/modal/exit_alert.html',
'Add Geo Fence Exit Alert', 'glyphicon glyphicon-edit', geoToolsMenu);
{{/if}} {{/if}}
} }
}); });

@ -0,0 +1,47 @@
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">
<div class="col-lg-5 col-md-6 col-centered">
<h4>
Set 'Exit Fence' alerts
<br>
</h4>
</div>
</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-lg-8 col-md-8 col-centered">
<div class="">
<table class="table table-hover" id="exit-alert">
<thead>
<tr>
<th>Fence Name</th>
<th>Query Name</th>
<th>Created On</th>
<th></th>
</tr>
</thead>
<tbody>
<div class="alert alert-danger fence-not-exist" role="alert">
<strong>Oh snap!</strong> Can't find any geo-fence areas,please draw a new area or try again.
</div>
</tbody>
</table>
</div>
<div class="pull-right">
<button style="background-color: #f4f4f4;" type="button" class="btn btn-default"
onclick="openTools('Exit')">Draw area
</button>
<button style="background-color: #f4f4f4;" type="button" class="btn btn-default"
onclick="$('#editExitinGeoJSON').modal('toggle')">Enter area
</button>
<br/>
<br/>
</div>
</div>
</div>
</div>
</div>
<script src="/devicemgt/public/cdmf.unit.geo-dashboard/js/geo_exit_fence.js"></script>

@ -0,0 +1,43 @@
/*
* Copyright (c) 2016, 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.
*/
function initializeExit() {
$(".removeGeoFence").tooltip();
var serverUrl = "/api/device-mgt/v1.0/geo-services/alerts/Exit/" + deviceType + "/" + deviceId;
invokerUtil.get(serverUrl, function (response) {
if (response) {
$(".fence-not-exist").hide();
response = JSON.parse(response);
for (var index in response) {
var alertBean = response[index];
$("#exit-alert > tbody").append(
"<tr class='viewGeoFenceRow' style='cursor: pointer' data-areaName='" + alertBean.areaName +
"' data-queryName='" + alertBean.queryName + "'data-geoJson="+ alertBean.geoJson +"><td>" + alertBean.areaName + "</td>" +
"<td>" + alertBean.queryName + "</td><td>" + alertBean.createdTime + "</td>" +
"<td onClick=removeGeoFence(this.parentElement,'Exit') class='removeGeoFence'" +
" data-toggle='tooltip' title='Remove fence' ><i class='fa fa-trash-o'></i></td></tr>");
}
} else{
$(".fence-not-exist").show();
}
$('.viewGeoFenceRow td:not(:last-child)').click(function () {
viewFence(this.parentElement,'Exit');
});
});
}
initializeExit();

@ -366,6 +366,18 @@ function viewFence(geoFenceElement,id) {
// transparent the layer .leaflet-popup-content-wrapper // transparent the layer .leaflet-popup-content-wrapper
$(geometryShape._popup._container.childNodes[0]).css("background", "rgba(255,255,255,0.8)"); $(geometryShape._popup._container.childNodes[0]).css("background", "rgba(255,255,255,0.8)");
}); });
} else if(id=="Exit"){
$('#templateLoader').load(geoPublicUri + "/assets/html_templates/view_fence_popup.html #viewExitAlert", function () {
var popupTemplate = $('#templateLoader').find('#viewWithinAlert');
popupTemplate.find('#exportGeoJson').attr('leaflet_id', geometryShape._leaflet_id);
popupTemplate.find('#hideViewFence').attr('leaflet_id', geometryShape._leaflet_id);
popupTemplate.find('#viewAreaName').html(areaName);
popupTemplate.find('#viewQueryName').html(queryName);
geometryShape.bindPopup(popupTemplate.html(), {closeButton: false}).openPopup();
// transparent the layer .leaflet-popup-content-wrapper
$(geometryShape._popup._container.childNodes[0]).css("background", "rgba(255,255,255,0.8)");
});
} else if(id=="Traffic"){ } else if(id=="Traffic"){
} }
closeAll(); closeAll();

Loading…
Cancel
Save