first commit
This commit is contained in:
kicap
652
application/views/admin/content/parkir.php
Normal file
652
application/views/admin/content/parkir.php
Normal file
@ -0,0 +1,652 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<?php $this->load->view('admin/header'); ?>
|
||||
<link rel="stylesheet" href="<?= base_url() ?>assets/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<?php $this->load->view('admin/sidebar'); ?>
|
||||
|
||||
|
||||
<div id="wrapper">
|
||||
<div class="main-content">
|
||||
<div class="row small-spacing">
|
||||
<div class="col-xs-12">
|
||||
<div class="box-content card white">
|
||||
<h4 class="box-title">Form Tambah Lahan</h4>
|
||||
<div class="card-content">
|
||||
<form id="form_tambah">
|
||||
<div class="form-group">
|
||||
<label for="kecamatan_select">Kecamatan</label>
|
||||
<select name="kecamatan_select" id="kecamatan_select" class="form-control" onchange="get_kelurahan(this.value)">
|
||||
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="kelurahan_select">Kelurahan</label>
|
||||
<select name="kelurahan_select" id="kelurahan_select" class="form-control" onchange="get_kelurahan_maps(this.value)">
|
||||
<option value="" selected disabled>-Pilih Kecamatan Terlebih Dahulu</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="luas">Luas Area</label>
|
||||
<input type="text" id="luas_input" class="form-control" placeholder="Sila Tanda Area Parkir" disabled>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="alamat">Alamat</label>
|
||||
<textarea name="alamat" id="alamat" cols="30" rows="10" class="form-control" placeholder="Masukkan Alamat" style="resize:none"></textarea>
|
||||
</div>
|
||||
|
||||
<center><button type="button" class="btn btn-primary btn-sm waves-effect waves-light text" onclick="tambah_parkir()">Tambah Area Parkir</button></center>
|
||||
</form>
|
||||
<br>
|
||||
<div id="div_map" style="display: none;">
|
||||
|
||||
<div id="map" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12">
|
||||
<div class="box-content card white">
|
||||
<h4 class="box-title">List Area Parkir</h4>
|
||||
<div class="card-content">
|
||||
<div style="overflow-x: auto;">
|
||||
<table id="table_area_parkir" class="table table-striped table-bordered display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>Alamat</th>
|
||||
<th>Kecamatan</th>
|
||||
<th>Kelurahan</th>
|
||||
<th>Luas Area</th>
|
||||
<th>Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php $this->load->view('admin/footer'); ?>
|
||||
</div>
|
||||
<!-- /.main-content -->
|
||||
</div>
|
||||
<?php $this->load->view('admin/scripts'); ?>
|
||||
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD7B9RynI4hQM_Y4BG9GYxsTLWwYkGASRo&libraries=drawing,places,geometry"></script>
|
||||
<script>
|
||||
function datatables() {
|
||||
table = $('#table_area_parkir').DataTable({
|
||||
// "searching": false,
|
||||
"lengthMenu": [
|
||||
[5, 10, 15, -1],
|
||||
[5, 10, 15, "All"]
|
||||
],
|
||||
"pageLength": 10,
|
||||
"ordering": true,
|
||||
"processing": true,
|
||||
"serverSide": true,
|
||||
// "order": [[ 4, 'desc' ]],
|
||||
|
||||
"ajax": {
|
||||
"url": "<?php echo base_url('home/parkir'); ?>",
|
||||
"type": "POST",
|
||||
data: {
|
||||
proses: 'table_area_parkir'
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
"columnDefs": [{
|
||||
"targets": [0],
|
||||
"orderable": false,
|
||||
}, ],
|
||||
});
|
||||
}
|
||||
datatables()
|
||||
|
||||
|
||||
var map = new google.maps.Map(document.getElementById('map'), {
|
||||
zoom: 12,
|
||||
center: {
|
||||
lat: -5.041461,
|
||||
lng: 121.628891
|
||||
},
|
||||
streetViewControl: false,
|
||||
});
|
||||
|
||||
var polygon = new google.maps.Polygon();
|
||||
var parkir_polygon = new google.maps.Polygon();
|
||||
var parkir_polygon_coord = null;
|
||||
var center_parkir;
|
||||
var kecamatan_id;
|
||||
var kelurahan_id;
|
||||
var luas_parkirnya;
|
||||
|
||||
// know the zoom level
|
||||
google.maps.event.addListener(map, 'zoom_changed', function() {
|
||||
var zoomLevel = map.getZoom();
|
||||
console.log(zoomLevel);
|
||||
});
|
||||
|
||||
// drawing manager set the hand tool as default
|
||||
var drawingManager = new google.maps.drawing.DrawingManager({
|
||||
drawingMode: google.maps.drawing.OverlayType.POLYGON,
|
||||
drawingControl: true,
|
||||
drawingControlOptions: {
|
||||
position: google.maps.ControlPosition.TOP_CENTER,
|
||||
drawingModes: ['polygon']
|
||||
},
|
||||
polygonOptions: {
|
||||
fillColor: '#ffff00',
|
||||
fillOpacity: 0.5,
|
||||
strokeWeight: 1,
|
||||
clickable: false,
|
||||
editable: true,
|
||||
zIndex: 1
|
||||
}
|
||||
});
|
||||
|
||||
// get the polygon coordinates
|
||||
|
||||
|
||||
|
||||
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
|
||||
if (event.type == google.maps.drawing.OverlayType.POLYGON) {
|
||||
var newShape = event.overlay;
|
||||
// console.log(newShape);
|
||||
var newShape_polygon_coords = (newShape.getPath().getArray());
|
||||
|
||||
setSelection(newShape);
|
||||
// polygon onchange event
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var addListenerOnPolygon = function(the_polygon) {
|
||||
google.maps.event.addListener(the_polygon, 'click', function(event) {
|
||||
// var parkir_polygon_coords_array = [];
|
||||
// setSelection(the_polygon);
|
||||
console.log("this is the polygon");
|
||||
google.maps.event.addListener(the_polygon.getPath(), 'set_at', function() {
|
||||
console.log("this is the polygon set_at");
|
||||
var polygon_coords = (the_polygon.getPath().getArray());
|
||||
// console.log(polygon_coords);
|
||||
|
||||
// change the polygon_coords to [{"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}]
|
||||
var polygon_coords_array = [];
|
||||
for (var i = 0; i < polygon_coords.length; i++) {
|
||||
var polygon_coords_obj = {
|
||||
"lat": polygon_coords[i].lat(),
|
||||
"lng": polygon_coords[i].lng()
|
||||
};
|
||||
polygon_coords_array.push(polygon_coords_obj);
|
||||
}
|
||||
console.log(polygon_coords_array);
|
||||
|
||||
// get the center of the polygon_coords by bounds
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for (var i = 0; i < polygon_coords.length; i++) {
|
||||
bounds.extend(polygon_coords[i]);
|
||||
}
|
||||
var center = bounds.getCenter();
|
||||
// console.log(center);
|
||||
// chnage the center to {"lat" : lat, "lng" : lng}
|
||||
center_parkir = {
|
||||
"lat": center.lat(),
|
||||
"lng": center.lng()
|
||||
};
|
||||
console.log(center_parkir);
|
||||
|
||||
// get luas
|
||||
var luas = google.maps.geometry.spherical.computeArea(polygon_coords);
|
||||
// 2 digit after the decimal point
|
||||
luas = luas.toFixed(2);
|
||||
console.log(luas);
|
||||
$("#luas_input").val(luas + " m2");
|
||||
luas_parkirnya = luas;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
google.maps.event.addListener(the_polygon.getPath(), 'insert_at', function() {
|
||||
console.log("this is the polygon insert_at");
|
||||
var polygon_coords = (the_polygon.getPath().getArray());
|
||||
// console.log(polygon_coords);
|
||||
|
||||
// change the polygon_coords to [{"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}]
|
||||
var polygon_coords_array = [];
|
||||
for (var i = 0; i < polygon_coords.length; i++) {
|
||||
var polygon_coords_obj = {
|
||||
"lat": polygon_coords[i].lat(),
|
||||
"lng": polygon_coords[i].lng()
|
||||
};
|
||||
polygon_coords_array.push(polygon_coords_obj);
|
||||
}
|
||||
console.log(polygon_coords_array);
|
||||
|
||||
// get the center of the polygon_coords by bounds
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for (var i = 0; i < polygon_coords.length; i++) {
|
||||
bounds.extend(polygon_coords[i]);
|
||||
}
|
||||
var center = bounds.getCenter();
|
||||
// console.log(center);
|
||||
// chnage the center to {"lat" : lat, "lng" : lng}
|
||||
center_parkir = {
|
||||
"lat": center.lat(),
|
||||
"lng": center.lng()
|
||||
};
|
||||
console.log(center_parkir);
|
||||
|
||||
// get luas
|
||||
var luas = google.maps.geometry.spherical.computeArea(polygon_coords);
|
||||
// 2 digit after the decimal point
|
||||
luas = luas.toFixed(2);
|
||||
console.log(luas);
|
||||
$("#luas_input").val(luas + " m2");
|
||||
luas_parkirnya = luas;
|
||||
|
||||
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
function setSelection(shape) {
|
||||
clearSelection();
|
||||
var the_polygon = shape;
|
||||
parkir_polygon = the_polygon;
|
||||
|
||||
var parkir_polygon_coords = (parkir_polygon.getPath().getArray());
|
||||
// var polygon_coords = (polygon.getPath().getArray());
|
||||
|
||||
// if parkir_polygon_coords is outside polygon_coords
|
||||
if (google.maps.geometry.poly.containsLocation(parkir_polygon_coords[0], polygon) == false) {
|
||||
alert('Area Parkir Tidak Boleh Diluar Area Parkir');
|
||||
parkir_polygon.setMap(null);
|
||||
} else {
|
||||
// change the parkir_polygon_coords to [{"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}, {"lat" : lat, "lng" : lng}]
|
||||
var parkir_polygon_coords_array = [];
|
||||
for (var i = 0; i < parkir_polygon_coords.length; i++) {
|
||||
var parkir_polygon_coords_obj = {
|
||||
"lat": parkir_polygon_coords[i].lat(),
|
||||
"lng": parkir_polygon_coords[i].lng()
|
||||
};
|
||||
parkir_polygon_coords_array.push(parkir_polygon_coords_obj);
|
||||
}
|
||||
// console.log(parkir_polygon_coords_array);
|
||||
|
||||
parkir_polygon_coord = parkir_polygon_coords_array;
|
||||
console.log(parkir_polygon_coord);
|
||||
|
||||
// get the center of the parkir_polygon_coords by bounds
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for (var i = 0; i < parkir_polygon_coords.length; i++) {
|
||||
bounds.extend(parkir_polygon_coords[i]);
|
||||
}
|
||||
var center = bounds.getCenter();
|
||||
// chnage the center to {"lat" : lat, "lng" : lng}
|
||||
center_parkir = {
|
||||
"lat": center.lat(),
|
||||
"lng": center.lng()
|
||||
};
|
||||
|
||||
console.log(center_parkir);
|
||||
|
||||
// get luas
|
||||
var luas = google.maps.geometry.spherical.computeArea(parkir_polygon_coords);
|
||||
// 2 digit after the decimal point
|
||||
luas = luas.toFixed(2);
|
||||
console.log(luas);
|
||||
$("#luas_input").val(luas + " m2");
|
||||
luas_parkirnya = luas;
|
||||
addListenerOnPolygon(parkir_polygon);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
function clearSelection() {
|
||||
if (parkir_polygon) {
|
||||
parkir_polygon.setMap(null);
|
||||
parkir_polygon_coord = null;
|
||||
center_parkir = null;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function get_all_kecamatan() {
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/all_kecamatan') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
let all_kecamatan = data.data;
|
||||
// console.log(all_kecamatan);
|
||||
$("#kecamatan_select").append('<option value="" selected disabled>Pilih Kecamatan</option>');
|
||||
|
||||
$.each(all_kecamatan, function(index, value) {
|
||||
$("#kecamatan_select").append('<option value="' + value.no + '">' + value.kecamatan + '</option>');
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
});
|
||||
}
|
||||
get_all_kecamatan();
|
||||
|
||||
|
||||
function get_kelurahan(id_kecamatan) {
|
||||
kecamatan_id = id_kecamatan;
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/all_kelurahan') ?>?id_kecamatan=" + id_kecamatan,
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
// console.log(data)
|
||||
let data_kelurahan = data.data;
|
||||
|
||||
$("#kelurahan_select").empty();
|
||||
$("#kelurahan_select").append('<option value="" selected disabled>Pilih Kelurahan</option>');
|
||||
|
||||
$.each(data_kelurahan, function(index, value) {
|
||||
$("#kelurahan_select").append('<option value="' + value.no + '">' + value.kelurahan + '</option>');
|
||||
});
|
||||
|
||||
let maps = data.maps[0].kordinat;
|
||||
polygon.setMap(null);
|
||||
// console.log(maps)
|
||||
|
||||
the_polygon = []
|
||||
|
||||
for (let i = 0; i < maps.length; i++) {
|
||||
the_polygon.push({
|
||||
lat: parseFloat(maps[i].lat),
|
||||
lng: parseFloat(maps[i].lng)
|
||||
});
|
||||
}
|
||||
|
||||
polygon = new google.maps.Polygon({
|
||||
paths: the_polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
polygon.setMap(map);
|
||||
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for (var i = 0; i < polygon.getPath().getLength(); i++) {
|
||||
bounds.extend(polygon.getPath().getAt(i));
|
||||
}
|
||||
map.fitBounds(bounds);
|
||||
|
||||
// drawing manager
|
||||
drawingManager.setMap(null);
|
||||
|
||||
$("#div_map").attr('style', 'display:block;');
|
||||
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function get_kelurahan_maps(id_kelurahan) {
|
||||
kelurahan_id = id_kelurahan;
|
||||
// console.log(id_kelurahan)
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/kelurahan_maps') ?>?id_kelurahan=" + id_kelurahan,
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
// console.log(data)
|
||||
|
||||
let maps = data.data[0].kordinat;
|
||||
polygon.setMap(null);
|
||||
|
||||
the_polygon = []
|
||||
|
||||
for (let i = 0; i < maps.length; i++) {
|
||||
the_polygon.push({
|
||||
lat: parseFloat(maps[i].lat),
|
||||
lng: parseFloat(maps[i].lng)
|
||||
});
|
||||
}
|
||||
|
||||
polygon = new google.maps.Polygon({
|
||||
paths: the_polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1,
|
||||
// editable: true
|
||||
});
|
||||
|
||||
polygon.setMap(map);
|
||||
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for (var i = 0; i < polygon.getPath().getLength(); i++) {
|
||||
bounds.extend(polygon.getPath().getAt(i));
|
||||
}
|
||||
|
||||
map.fitBounds(bounds);
|
||||
|
||||
drawingManager.setMap(map);
|
||||
|
||||
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function tambah_parkir() {
|
||||
if (parkir_polygon_coord == null) {
|
||||
alert('Silahkan tanda lokasi area parkir');
|
||||
return false;
|
||||
}
|
||||
|
||||
const alamat = $("#alamat").val();
|
||||
|
||||
if (alamat == '') {
|
||||
alert('Silahkan isi alamat parkir');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (confirm("Area parkir baru akan ditambahkan ke sistem")) {
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/tambah_parkir') ?>",
|
||||
type: "POST",
|
||||
dataType: "JSON",
|
||||
data: {
|
||||
kecamatan_id: kecamatan_id,
|
||||
kelurahan_id: kelurahan_id,
|
||||
kordinat: JSON.stringify(parkir_polygon_coord),
|
||||
center: JSON.stringify(center_parkir),
|
||||
luas: luas_parkirnya,
|
||||
alamat: alamat
|
||||
},
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
console.log(data)
|
||||
|
||||
parkir_polygon_coord = null;
|
||||
center_parkir = null;
|
||||
luas_parkirnya = null;
|
||||
$("#alamat").val('');
|
||||
$("#luas_input").val('');
|
||||
|
||||
// parkir_polygon.setMap(null);
|
||||
clearSelection();
|
||||
$('#table_area_parkir').dataTable().fnDestroy();
|
||||
datatables()
|
||||
alert('Area parkir berhasil ditambahkan');
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
console.log(jqXHR)
|
||||
console.log(textStatus)
|
||||
console.log(errorThrown)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function hapus_area_parkir(id_parkir){
|
||||
// console.log(id_parkir)
|
||||
if (confirm("Area parkir akan dihapus dari sistem")) {
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/area_parkir') ?>",
|
||||
type: "DELETE",
|
||||
dataType: "JSON",
|
||||
data: {
|
||||
id: id_parkir
|
||||
},
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
console.log(data)
|
||||
|
||||
$('#table_area_parkir').dataTable().fnDestroy();
|
||||
datatables()
|
||||
alert('Area parkir berhasil dihapus');
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
console.log(jqXHR)
|
||||
console.log(textStatus)
|
||||
console.log(errorThrown)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
8
application/views/admin/footer.php
Normal file
8
application/views/admin/footer.php
Normal file
@ -0,0 +1,8 @@
|
||||
<footer class="footer">
|
||||
<ul class="list-inline">
|
||||
<li>2023 © Kicap Karan.</li>
|
||||
<li><a href="#">Privacy</a></li>
|
||||
<li><a href="#">Terms</a></li>
|
||||
<li><a href="#">Help</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
28
application/views/admin/header.php
Normal file
28
application/views/admin/header.php
Normal file
@ -0,0 +1,28 @@
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>Sistem Parkir Parepare - <?=$header?></title>
|
||||
|
||||
<!-- Main Styles -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/styles/style.min.css">
|
||||
|
||||
<!-- mCustomScrollbar -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
|
||||
|
||||
<!-- Waves Effect -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/waves/waves.min.css">
|
||||
|
||||
<!-- Sweet Alert -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/sweet-alert/sweetalert.css">
|
||||
|
||||
<!-- Color Picker -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/color-switcher/color-switcher.min.css">
|
||||
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/fonts/material-design/css/materialdesignicons.css">
|
||||
|
||||
<!-- Data Tables -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/datatables/media/css/dataTables.bootstrap.min.css">
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css">
|
||||
364
application/views/admin/index.php
Normal file
364
application/views/admin/index.php
Normal file
@ -0,0 +1,364 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<?php $this->load->view('admin/header'); ?>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<?php $this->load->view('admin/sidebar'); ?>
|
||||
|
||||
|
||||
<div id="wrapper">
|
||||
<div class="main-content">
|
||||
<div class="row small-spacing">
|
||||
<div class="col-xs-12">
|
||||
<div class="box-content card white">
|
||||
<h4 class="box-title">Peta Lahan Parkir Parepare</h4>
|
||||
<div class="card-content">
|
||||
<div id="map" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php $this->load->view('admin/footer'); ?>
|
||||
</div>
|
||||
<!-- /.main-content -->
|
||||
</div>
|
||||
<?php $this->load->view('admin/scripts'); ?>
|
||||
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD7B9RynI4hQM_Y4BG9GYxsTLWwYkGASRo&libraries=drawing,places,geometry"></script>
|
||||
<script src="https://unpkg.com/@googlemaps/markerclusterer/dist/index.min.js"></script>
|
||||
<!-- <script src="<?= base_url() ?>assets/cluster.js"></script> -->
|
||||
<script>
|
||||
// import { MarkerClusterer } from "https://cdn.skypack.dev/@googlemaps/markerclusterer@2.0.3";
|
||||
var map = new google.maps.Map(document.getElementById('map'), {
|
||||
zoom: 12,
|
||||
center: {
|
||||
lat: -5.041461,
|
||||
lng: 121.628891
|
||||
},
|
||||
});
|
||||
var markers = [];
|
||||
var markers1 = [];
|
||||
var polygon_parkir = [];
|
||||
var polygon_parkir1 = [];
|
||||
var cluster;
|
||||
var infowindow_data = [];
|
||||
|
||||
|
||||
|
||||
|
||||
function get_kabupaten() {
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/kabupaten_maps') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
// console.log(data.area_parkir.length)
|
||||
let map_data = data.data;
|
||||
// console.log(map_data[0])
|
||||
var bound = new google.maps.LatLngBounds();
|
||||
for (let i = 0; i < map_data.length; i++) {
|
||||
let map_1 = map_data[i].kordinat;
|
||||
let polygon = [];
|
||||
|
||||
for (let i = 0; i < map_1.length; i++) {
|
||||
// map_1[i].lng value return like 119.62361145
|
||||
// map_1[i].lat value return like -4.00000000
|
||||
// push value to polygon array
|
||||
polygon.push({
|
||||
lat: parseFloat(map_1[i].lat),
|
||||
lng: parseFloat(map_1[i].lng)
|
||||
});
|
||||
}
|
||||
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
show_polygon.setMap(map);
|
||||
|
||||
for (var j = 0; j < polygon.length; j++) {
|
||||
bound.extend(polygon[j]);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
map.fitBounds(bound);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
get_kabupaten();
|
||||
|
||||
|
||||
async function get_marker_parkir() {
|
||||
try {
|
||||
const data = await $.ajax({
|
||||
url: "<?php echo base_url('api/area_parkir') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
async: false,
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
}
|
||||
}).responseJSON;
|
||||
$.unblockUI();
|
||||
// console.log(data.area_parkir.length)
|
||||
let area_parkir = data.data;
|
||||
|
||||
// console.log(area_parkir.length)
|
||||
if (area_parkir.length > 0) {
|
||||
|
||||
|
||||
for (let i = 0; i < area_parkir.length; i++) {
|
||||
let area_parkir_1 = area_parkir[i];
|
||||
// console.log(JSON.parse(area_parkir_1.center))
|
||||
let coordinate = JSON.parse(area_parkir_1.center);
|
||||
let marker = new google.maps.Marker({
|
||||
position: {
|
||||
lat: parseFloat(coordinate.lat),
|
||||
lng: parseFloat(coordinate.lng)
|
||||
},
|
||||
map: map,
|
||||
title: area_parkir_1.alamat,
|
||||
|
||||
});
|
||||
|
||||
markers1.push(marker);
|
||||
let infowindow = new google.maps.InfoWindow({
|
||||
content: "Alamat : " + area_parkir_1.alamat + "<br>Luas : " + area_parkir_1.luas + " m2<br>"
|
||||
});
|
||||
infowindow_data.push(infowindow);
|
||||
marker.addListener('click', function() {
|
||||
// console.log(area_parkir_1)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
infowindow.open(map, marker);
|
||||
});
|
||||
markers.push(marker);
|
||||
}
|
||||
|
||||
// marker cluster
|
||||
cluster = new markerClusterer.MarkerClusterer({
|
||||
map,
|
||||
markers
|
||||
});
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
$.unblockUI();
|
||||
console.log(error)
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get_marker_parkir();
|
||||
|
||||
async function get_polygon_parkir() {
|
||||
try {
|
||||
const data = await $.ajax({
|
||||
url: "<?php echo base_url('api/area_parkir') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
async: false,
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
}
|
||||
}).responseJSON;
|
||||
$.unblockUI();
|
||||
// console.log(data)
|
||||
let area_parkir = data.data;
|
||||
|
||||
// // console.log(area_parkir)
|
||||
if (area_parkir.length > 0) {
|
||||
if (polygon_parkir.length == 0) {
|
||||
for (let i = 0; i < area_parkir.length; i++) {
|
||||
let the_polygon = JSON.parse(area_parkir[i].kordinat);
|
||||
// console.log(the_polygon)
|
||||
|
||||
let polygon = [];
|
||||
for (let i = 0; i < the_polygon.length; i++) {
|
||||
// map_1[i].lng value return like 119.62361145
|
||||
// map_1[i].lat value return like -4.00000000
|
||||
// push value to polygon array
|
||||
polygon.push({
|
||||
lat: parseFloat(the_polygon[i].lat),
|
||||
lng: parseFloat(the_polygon[i].lng)
|
||||
});
|
||||
}
|
||||
polygon_parkir.push(polygon);
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
polygon_parkir1.push(show_polygon);
|
||||
show_polygon.setMap(map);
|
||||
|
||||
|
||||
// google.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
} catch (error) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get_polygon_parkir();
|
||||
|
||||
google.maps.event.addListener(map, 'zoom_changed', function() {
|
||||
var zoomLevel = map.getZoom();
|
||||
console.log(zoomLevel);
|
||||
if (zoomLevel >= 16) {
|
||||
// console.log('zoom in')
|
||||
console.log(markers.length)
|
||||
for (let i = 0; i < markers.length; i++) {
|
||||
markers[i].setMap(null);
|
||||
}
|
||||
markers = [];
|
||||
// clear all marker
|
||||
// get_polygon_parkir();
|
||||
// for (let i = 0; i < polygon_parkir.length; i++) {
|
||||
// polygon_parkir1[i].setMap(map);
|
||||
// }
|
||||
// console.log(polygon_parkir)
|
||||
for (let i = 0; i < polygon_parkir.length; i++) {
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon_parkir[i],
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
show_polygon.setMap(map);
|
||||
polygon_parkir1.push(show_polygon);
|
||||
|
||||
google.maps.event.addListener(show_polygon, 'click', function(event) {
|
||||
// console.log("click polygon")
|
||||
// console.log(event.latLng.lng())
|
||||
console.log(infowindow_data)
|
||||
let infowindow = infowindow_data[i];
|
||||
// console.log(infowindow)
|
||||
|
||||
// get the lat and lng of the point
|
||||
var latLng = event.latLng;
|
||||
// console.log(latLng)
|
||||
infowindow.setPosition(latLng);
|
||||
infowindow.open(map);
|
||||
// infowindow_data.push(infowindow);
|
||||
|
||||
// infowindow.open(map, show_polygon);
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
// remove cluster
|
||||
cluster.clearMarkers();
|
||||
|
||||
|
||||
}
|
||||
if (zoomLevel < 16) {
|
||||
console.log('zoom out')
|
||||
console.log(markers.length)
|
||||
console.log(markers1.length)
|
||||
if (polygon_parkir1.length > 0) {
|
||||
// clear all polygon
|
||||
for (let i = 0; i < polygon_parkir1.length; i++) {
|
||||
polygon_parkir1[i].setMap(null);
|
||||
}
|
||||
}
|
||||
|
||||
markers = markers1;
|
||||
for (let i = 0; i < markers.length; i++) {
|
||||
markers[i].setMap(map);
|
||||
}
|
||||
// add cluster
|
||||
cluster.addMarkers(markers);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
33
application/views/admin/scripts.php
Normal file
33
application/views/admin/scripts.php
Normal file
@ -0,0 +1,33 @@
|
||||
<!--/#wrapper -->
|
||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="<?=base_url()?>assets/script/html5shiv.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/script/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<!--
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<script src="<?=base_url()?>assets/scripts/jquery.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/scripts/modernizr.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/nprogress/nprogress.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/waves/waves.min.js"></script>
|
||||
<!-- Full Screen Plugin -->
|
||||
<script src="<?=base_url()?>assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
||||
<script src="<?=base_url()?>assets/block/jquery.blockUI.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
||||
|
||||
<script src="<?=base_url()?>assets/scripts/main.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/color-switcher/color-switcher.min.js"></script>
|
||||
|
||||
<script>
|
||||
function logout(){
|
||||
if(confirm("Apakah anda yakin ingin keluar?")){
|
||||
window.location.href = "<?=base_url()?>home/logout";
|
||||
}
|
||||
// window.location.href = "<?=base_url()?>home/logout";
|
||||
}
|
||||
</script>
|
||||
56
application/views/admin/sidebar.php
Normal file
56
application/views/admin/sidebar.php
Normal file
@ -0,0 +1,56 @@
|
||||
<div class="main-menu">
|
||||
<header class="header">
|
||||
<a href="index.html" class="logo">Parepare</a>
|
||||
<button type="button" class="button-close fa fa-times js__menu_close"></button>
|
||||
<div class="user">
|
||||
<a href="#" class="avatar"><img src="<?=base_url()?>assets/images/admin.png" alt=""><span class="status online"></span></a>
|
||||
<h5 class="name"><a href="profile.html">Admin</a></h5>
|
||||
<h5 class="position">Administrator</h5>
|
||||
|
||||
</div>
|
||||
<!-- /.user -->
|
||||
</header>
|
||||
<!-- /.header -->
|
||||
<div class="content">
|
||||
|
||||
<div class="navigation">
|
||||
<h5 class="title">Navigasi</h5>
|
||||
<!-- /.title -->
|
||||
<ul class="menu js__accordion">
|
||||
<li <?php if ($header == 'Halaman Utama') {
|
||||
echo 'class="current"';
|
||||
} ?>>
|
||||
<a class="waves-effect" href="<?= base_url('home') ?>"><i class="menu-icon fa fa-home"></i><span>Halaman Utama</span></a>
|
||||
</li>
|
||||
<li <?php if ($header == 'Pengaturan Parkir') {
|
||||
echo 'class="current"';
|
||||
} ?>>
|
||||
<a class="waves-effect" href="<?= base_url('home/parkir') ?>"><i class="menu-icon fa fa-car"></i><span>Pengaturan Parkir</span></a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="waves-effect" href="#" onclick="logout()"><i class="menu-icon mdi mdi-logout"></i><span>Logout</span></a>
|
||||
</li>
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<!-- /.navigation -->
|
||||
</div>
|
||||
<!-- /.content -->
|
||||
</div>
|
||||
<!-- /.main-menu -->
|
||||
|
||||
<div class="fixed-navbar">
|
||||
<div class="pull-left">
|
||||
<button type="button" class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
|
||||
<h1 class="page-title"><?= $header ?></h1>
|
||||
<!-- /.page-title -->
|
||||
</div>
|
||||
<!-- /.pull-left -->
|
||||
<div class="pull-right">
|
||||
|
||||
<a href="#" class="ico-item fa fa-power-off js__logout"></a>
|
||||
</div>
|
||||
<!-- /.pull-right -->
|
||||
</div>
|
||||
8
application/views/errors/cli/error_404.php
Executable file
8
application/views/errors/cli/error_404.php
Executable file
@ -0,0 +1,8 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
|
||||
echo "\nERROR: ",
|
||||
$heading,
|
||||
"\n\n",
|
||||
$message,
|
||||
"\n\n";
|
||||
8
application/views/errors/cli/error_db.php
Executable file
8
application/views/errors/cli/error_db.php
Executable file
@ -0,0 +1,8 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
|
||||
echo "\nDatabase error: ",
|
||||
$heading,
|
||||
"\n\n",
|
||||
$message,
|
||||
"\n\n";
|
||||
21
application/views/errors/cli/error_exception.php
Executable file
21
application/views/errors/cli/error_exception.php
Executable file
@ -0,0 +1,21 @@
|
||||
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
|
||||
|
||||
An uncaught Exception was encountered
|
||||
|
||||
Type: <?php echo get_class($exception), "\n"; ?>
|
||||
Message: <?php echo $message, "\n"; ?>
|
||||
Filename: <?php echo $exception->getFile(), "\n"; ?>
|
||||
Line Number: <?php echo $exception->getLine(); ?>
|
||||
|
||||
<?php if (defined('SHOW_DEBUG_BACKTRACE') && SHOW_DEBUG_BACKTRACE === TRUE): ?>
|
||||
|
||||
Backtrace:
|
||||
<?php foreach ($exception->getTrace() as $error): ?>
|
||||
<?php if (isset($error['file']) && strpos($error['file'], realpath(BASEPATH)) !== 0): ?>
|
||||
File: <?php echo $error['file'], "\n"; ?>
|
||||
Line: <?php echo $error['line'], "\n"; ?>
|
||||
Function: <?php echo $error['function'], "\n\n"; ?>
|
||||
<?php endif ?>
|
||||
<?php endforeach ?>
|
||||
|
||||
<?php endif ?>
|
||||
8
application/views/errors/cli/error_general.php
Executable file
8
application/views/errors/cli/error_general.php
Executable file
@ -0,0 +1,8 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
|
||||
echo "\nERROR: ",
|
||||
$heading,
|
||||
"\n\n",
|
||||
$message,
|
||||
"\n\n";
|
||||
21
application/views/errors/cli/error_php.php
Executable file
21
application/views/errors/cli/error_php.php
Executable file
@ -0,0 +1,21 @@
|
||||
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
|
||||
|
||||
A PHP Error was encountered
|
||||
|
||||
Severity: <?php echo $severity, "\n"; ?>
|
||||
Message: <?php echo $message, "\n"; ?>
|
||||
Filename: <?php echo $filepath, "\n"; ?>
|
||||
Line Number: <?php echo $line; ?>
|
||||
|
||||
<?php if (defined('SHOW_DEBUG_BACKTRACE') && SHOW_DEBUG_BACKTRACE === TRUE): ?>
|
||||
|
||||
Backtrace:
|
||||
<?php foreach (debug_backtrace() as $error): ?>
|
||||
<?php if (isset($error['file']) && strpos($error['file'], realpath(BASEPATH)) !== 0): ?>
|
||||
File: <?php echo $error['file'], "\n"; ?>
|
||||
Line: <?php echo $error['line'], "\n"; ?>
|
||||
Function: <?php echo $error['function'], "\n\n"; ?>
|
||||
<?php endif ?>
|
||||
<?php endforeach ?>
|
||||
|
||||
<?php endif ?>
|
||||
11
application/views/errors/cli/index.html
Executable file
11
application/views/errors/cli/index.html
Executable file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>403 Forbidden</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>Directory access is forbidden.</p>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
64
application/views/errors/html/error_404.php
Executable file
64
application/views/errors/html/error_404.php
Executable file
@ -0,0 +1,64 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?><!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>404 Page Not Found</title>
|
||||
<style type="text/css">
|
||||
|
||||
::selection { background-color: #E13300; color: white; }
|
||||
::-moz-selection { background-color: #E13300; color: white; }
|
||||
|
||||
body {
|
||||
background-color: #fff;
|
||||
margin: 40px;
|
||||
font: 13px/20px normal Helvetica, Arial, sans-serif;
|
||||
color: #4F5155;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #003399;
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #444;
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid #D0D0D0;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
margin: 0 0 14px 0;
|
||||
padding: 14px 15px 10px 15px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: Consolas, Monaco, Courier New, Courier, monospace;
|
||||
font-size: 12px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #D0D0D0;
|
||||
color: #002166;
|
||||
display: block;
|
||||
margin: 14px 0 14px 0;
|
||||
padding: 12px 10px 12px 10px;
|
||||
}
|
||||
|
||||
#container {
|
||||
margin: 10px;
|
||||
border: 1px solid #D0D0D0;
|
||||
box-shadow: 0 0 8px #D0D0D0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 12px 15px 12px 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<h1><?php echo $heading; ?></h1>
|
||||
<?php echo $message; ?>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
64
application/views/errors/html/error_db.php
Executable file
64
application/views/errors/html/error_db.php
Executable file
@ -0,0 +1,64 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?><!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Database Error</title>
|
||||
<style type="text/css">
|
||||
|
||||
::selection { background-color: #E13300; color: white; }
|
||||
::-moz-selection { background-color: #E13300; color: white; }
|
||||
|
||||
body {
|
||||
background-color: #fff;
|
||||
margin: 40px;
|
||||
font: 13px/20px normal Helvetica, Arial, sans-serif;
|
||||
color: #4F5155;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #003399;
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #444;
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid #D0D0D0;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
margin: 0 0 14px 0;
|
||||
padding: 14px 15px 10px 15px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: Consolas, Monaco, Courier New, Courier, monospace;
|
||||
font-size: 12px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #D0D0D0;
|
||||
color: #002166;
|
||||
display: block;
|
||||
margin: 14px 0 14px 0;
|
||||
padding: 12px 10px 12px 10px;
|
||||
}
|
||||
|
||||
#container {
|
||||
margin: 10px;
|
||||
border: 1px solid #D0D0D0;
|
||||
box-shadow: 0 0 8px #D0D0D0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 12px 15px 12px 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<h1><?php echo $heading; ?></h1>
|
||||
<?php echo $message; ?>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
32
application/views/errors/html/error_exception.php
Executable file
32
application/views/errors/html/error_exception.php
Executable file
@ -0,0 +1,32 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?>
|
||||
|
||||
<div style="border:1px solid #990000;padding-left:20px;margin:0 0 10px 0;">
|
||||
|
||||
<h4>An uncaught Exception was encountered</h4>
|
||||
|
||||
<p>Type: <?php echo get_class($exception); ?></p>
|
||||
<p>Message: <?php echo $message; ?></p>
|
||||
<p>Filename: <?php echo $exception->getFile(); ?></p>
|
||||
<p>Line Number: <?php echo $exception->getLine(); ?></p>
|
||||
|
||||
<?php if (defined('SHOW_DEBUG_BACKTRACE') && SHOW_DEBUG_BACKTRACE === TRUE): ?>
|
||||
|
||||
<p>Backtrace:</p>
|
||||
<?php foreach ($exception->getTrace() as $error): ?>
|
||||
|
||||
<?php if (isset($error['file']) && strpos($error['file'], realpath(BASEPATH)) !== 0): ?>
|
||||
|
||||
<p style="margin-left:10px">
|
||||
File: <?php echo $error['file']; ?><br />
|
||||
Line: <?php echo $error['line']; ?><br />
|
||||
Function: <?php echo $error['function']; ?>
|
||||
</p>
|
||||
<?php endif ?>
|
||||
|
||||
<?php endforeach ?>
|
||||
|
||||
<?php endif ?>
|
||||
|
||||
</div>
|
||||
64
application/views/errors/html/error_general.php
Executable file
64
application/views/errors/html/error_general.php
Executable file
@ -0,0 +1,64 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?><!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Error</title>
|
||||
<style type="text/css">
|
||||
|
||||
::selection { background-color: #E13300; color: white; }
|
||||
::-moz-selection { background-color: #E13300; color: white; }
|
||||
|
||||
body {
|
||||
background-color: #fff;
|
||||
margin: 40px;
|
||||
font: 13px/20px normal Helvetica, Arial, sans-serif;
|
||||
color: #4F5155;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #003399;
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #444;
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid #D0D0D0;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
margin: 0 0 14px 0;
|
||||
padding: 14px 15px 10px 15px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: Consolas, Monaco, Courier New, Courier, monospace;
|
||||
font-size: 12px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #D0D0D0;
|
||||
color: #002166;
|
||||
display: block;
|
||||
margin: 14px 0 14px 0;
|
||||
padding: 12px 10px 12px 10px;
|
||||
}
|
||||
|
||||
#container {
|
||||
margin: 10px;
|
||||
border: 1px solid #D0D0D0;
|
||||
box-shadow: 0 0 8px #D0D0D0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 12px 15px 12px 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<h1><?php echo $heading; ?></h1>
|
||||
<?php echo $message; ?>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
33
application/views/errors/html/error_php.php
Executable file
33
application/views/errors/html/error_php.php
Executable file
@ -0,0 +1,33 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?>
|
||||
|
||||
<div style="border:1px solid #990000;padding-left:20px;margin:0 0 10px 0;">
|
||||
|
||||
<h4>A PHP Error was encountered</h4>
|
||||
|
||||
<p>Severity: <?php echo $severity; ?></p>
|
||||
<p>Message: <?php echo $message; ?></p>
|
||||
<p>Filename: <?php echo $filepath; ?></p>
|
||||
<p>Line Number: <?php echo $line; ?></p>
|
||||
|
||||
<?php if (defined('SHOW_DEBUG_BACKTRACE') && SHOW_DEBUG_BACKTRACE === TRUE): ?>
|
||||
|
||||
<p>Backtrace:</p>
|
||||
<?php foreach (debug_backtrace() as $error): ?>
|
||||
|
||||
<?php if (isset($error['file']) && strpos($error['file'], realpath(BASEPATH)) !== 0): ?>
|
||||
|
||||
<p style="margin-left:10px">
|
||||
File: <?php echo $error['file'] ?><br />
|
||||
Line: <?php echo $error['line'] ?><br />
|
||||
Function: <?php echo $error['function'] ?>
|
||||
</p>
|
||||
|
||||
<?php endif ?>
|
||||
|
||||
<?php endforeach ?>
|
||||
|
||||
<?php endif ?>
|
||||
|
||||
</div>
|
||||
11
application/views/errors/html/index.html
Executable file
11
application/views/errors/html/index.html
Executable file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>403 Forbidden</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>Directory access is forbidden.</p>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
11
application/views/errors/index.html
Executable file
11
application/views/errors/index.html
Executable file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>403 Forbidden</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>Directory access is forbidden.</p>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
11
application/views/index.html
Executable file
11
application/views/index.html
Executable file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>403 Forbidden</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>Directory access is forbidden.</p>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
96
application/views/login/index.php
Normal file
96
application/views/login/index.php
Normal file
@ -0,0 +1,96 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>Sistem Parkir Parepare - Halaman Login</title>
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/styles/style.min.css">
|
||||
|
||||
<!-- Waves Effect -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/waves/waves.min.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="single-wrapper">
|
||||
<form onsubmit="login(event)" class="frm-single">
|
||||
<div class="inside">
|
||||
<div class="title"><strong>Sistem Parkir </strong>Parepare</div>
|
||||
<!-- /.title -->
|
||||
<div class="frm-title">Form Login</div>
|
||||
<!-- /.frm-title -->
|
||||
<div class="frm-input"><input type="text" placeholder="Username" id="username" name="username" class="frm-inp" required><i class="fa fa-user frm-ico"></i></div>
|
||||
<!-- /.frm-input -->
|
||||
<div class="frm-input"><input type="password" placeholder="Password" class="frm-inp" id="password" name="password" required><i class="fa fa-lock frm-ico"></i></div>
|
||||
|
||||
<button type="submit" class="frm-submit">Login<i class="fa fa-arrow-circle-right"></i></button>
|
||||
|
||||
<!-- <a href="page-register.html" class="a-link"><i class="fa fa-key"></i>New to NinjaAdmin? Register.</a> -->
|
||||
<div class="frm-footer">Kicap Karan © 2023.</div>
|
||||
<!-- /.footer -->
|
||||
</div>
|
||||
<!-- .inside -->
|
||||
</form>
|
||||
<!-- /.frm-single -->
|
||||
</div><!--/#single-wrapper -->
|
||||
|
||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="assets/script/html5shiv.min.js"></script>
|
||||
<script src="assets/script/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<!--
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<script src="<?=base_url()?>assets/scripts/jquery.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/scripts/modernizr.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/nprogress/nprogress.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/waves/waves.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/block/jquery.blockUI.js"></script>
|
||||
<script src="<?=base_url()?>assets/scripts/main.min.js"></script>
|
||||
<script>
|
||||
function login(e){
|
||||
e.preventDefault();
|
||||
var username = $('#username').val();
|
||||
var password = $('#password').val();
|
||||
|
||||
// ajax
|
||||
$.ajax({
|
||||
url: '<?= base_url('api/login') ?>?username='+username+'&password='+password,
|
||||
type: 'GET',
|
||||
dataType: 'JSON',
|
||||
|
||||
beforeSend: function(){
|
||||
// loading
|
||||
$.blockUI({
|
||||
message: 'Login',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data){
|
||||
$.unblockUI();
|
||||
window.location.href = '<?= base_url('home') ?>';
|
||||
},
|
||||
error: function( XMLHttpRequest, textStatus, errorThrown ){
|
||||
$.unblockUI();
|
||||
alert('Username atau Password Salah');
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
8
application/views/user/footer.php
Normal file
8
application/views/user/footer.php
Normal file
@ -0,0 +1,8 @@
|
||||
<footer class="footer">
|
||||
<ul class="list-inline">
|
||||
<li>2023 © Kicap Karan.</li>
|
||||
<li><a href="#">Privacy</a></li>
|
||||
<li><a href="#">Terms</a></li>
|
||||
<li><a href="#">Help</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
28
application/views/user/header.php
Normal file
28
application/views/user/header.php
Normal file
@ -0,0 +1,28 @@
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>Sistem Parkir Parepare - <?=$header?></title>
|
||||
|
||||
<!-- Main Styles -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/styles/style.min.css">
|
||||
|
||||
<!-- mCustomScrollbar -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
|
||||
|
||||
<!-- Waves Effect -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/waves/waves.min.css">
|
||||
|
||||
<!-- Sweet Alert -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/sweet-alert/sweetalert.css">
|
||||
|
||||
<!-- Color Picker -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/color-switcher/color-switcher.min.css">
|
||||
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/fonts/material-design/css/materialdesignicons.css">
|
||||
|
||||
<!-- Data Tables -->
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/datatables/media/css/dataTables.bootstrap.min.css">
|
||||
<link rel="stylesheet" href="<?=base_url()?>assets/plugin/datatables/extensions/Responsive/css/responsive.bootstrap.min.css">
|
||||
364
application/views/user/index.php
Normal file
364
application/views/user/index.php
Normal file
@ -0,0 +1,364 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<?php $this->load->view('user/header'); ?>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<?php $this->load->view('user/sidebar'); ?>
|
||||
|
||||
|
||||
<div id="wrapper">
|
||||
<div class="main-content">
|
||||
<div class="row small-spacing">
|
||||
<div class="col-xs-12">
|
||||
<div class="box-content card white">
|
||||
<h4 class="box-title">Peta Lahan Parkir Parepare</h4>
|
||||
<div class="card-content">
|
||||
<div id="map" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php $this->load->view('user/footer'); ?>
|
||||
</div>
|
||||
<!-- /.main-content -->
|
||||
</div>
|
||||
<?php $this->load->view('user/scripts'); ?>
|
||||
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD7B9RynI4hQM_Y4BG9GYxsTLWwYkGASRo&libraries=drawing,places,geometry"></script>
|
||||
<script src="https://unpkg.com/@googlemaps/markerclusterer/dist/index.min.js"></script>
|
||||
<!-- <script src="<?= base_url() ?>assets/cluster.js"></script> -->
|
||||
<script>
|
||||
// import { MarkerClusterer } from "https://cdn.skypack.dev/@googlemaps/markerclusterer@2.0.3";
|
||||
var map = new google.maps.Map(document.getElementById('map'), {
|
||||
zoom: 12,
|
||||
center: {
|
||||
lat: -5.041461,
|
||||
lng: 121.628891
|
||||
},
|
||||
});
|
||||
var markers = [];
|
||||
var markers1 = [];
|
||||
var polygon_parkir = [];
|
||||
var polygon_parkir1 = [];
|
||||
var cluster;
|
||||
var infowindow_data = [];
|
||||
|
||||
|
||||
|
||||
|
||||
function get_kabupaten() {
|
||||
$.ajax({
|
||||
url: "<?php echo base_url('api/kabupaten_maps') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
},
|
||||
success: function(data) {
|
||||
$.unblockUI();
|
||||
// console.log(data.area_parkir.length)
|
||||
let map_data = data.data;
|
||||
// console.log(map_data[0])
|
||||
var bound = new google.maps.LatLngBounds();
|
||||
for (let i = 0; i < map_data.length; i++) {
|
||||
let map_1 = map_data[i].kordinat;
|
||||
let polygon = [];
|
||||
|
||||
for (let i = 0; i < map_1.length; i++) {
|
||||
// map_1[i].lng value return like 119.62361145
|
||||
// map_1[i].lat value return like -4.00000000
|
||||
// push value to polygon array
|
||||
polygon.push({
|
||||
lat: parseFloat(map_1[i].lat),
|
||||
lng: parseFloat(map_1[i].lng)
|
||||
});
|
||||
}
|
||||
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
show_polygon.setMap(map);
|
||||
|
||||
for (var j = 0; j < polygon.length; j++) {
|
||||
bound.extend(polygon[j]);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
map.fitBounds(bound);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
get_kabupaten();
|
||||
|
||||
|
||||
async function get_marker_parkir() {
|
||||
try {
|
||||
const data = await $.ajax({
|
||||
url: "<?php echo base_url('api/area_parkir') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
async: false,
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
}
|
||||
}).responseJSON;
|
||||
$.unblockUI();
|
||||
// console.log(data.area_parkir.length)
|
||||
let area_parkir = data.data;
|
||||
|
||||
// console.log(area_parkir.length)
|
||||
if (area_parkir.length > 0) {
|
||||
|
||||
|
||||
for (let i = 0; i < area_parkir.length; i++) {
|
||||
let area_parkir_1 = area_parkir[i];
|
||||
// console.log(JSON.parse(area_parkir_1.center))
|
||||
let coordinate = JSON.parse(area_parkir_1.center);
|
||||
let marker = new google.maps.Marker({
|
||||
position: {
|
||||
lat: parseFloat(coordinate.lat),
|
||||
lng: parseFloat(coordinate.lng)
|
||||
},
|
||||
map: map,
|
||||
title: area_parkir_1.alamat,
|
||||
|
||||
});
|
||||
|
||||
markers1.push(marker);
|
||||
let infowindow = new google.maps.InfoWindow({
|
||||
content: "Alamat : " + area_parkir_1.alamat + "<br>Luas : " + area_parkir_1.luas + " m2<br>"
|
||||
});
|
||||
infowindow_data.push(infowindow);
|
||||
marker.addListener('click', function() {
|
||||
// console.log(area_parkir_1)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
infowindow.open(map, marker);
|
||||
});
|
||||
markers.push(marker);
|
||||
}
|
||||
|
||||
// marker cluster
|
||||
cluster = new markerClusterer.MarkerClusterer({
|
||||
map,
|
||||
markers
|
||||
});
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
$.unblockUI();
|
||||
console.log(error)
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get_marker_parkir();
|
||||
|
||||
async function get_polygon_parkir() {
|
||||
try {
|
||||
const data = await $.ajax({
|
||||
url: "<?php echo base_url('api/area_parkir') ?>",
|
||||
type: "GET",
|
||||
dataType: "JSON",
|
||||
async: false,
|
||||
beforeSend: function() {
|
||||
$.blockUI({
|
||||
message: 'Loading...',
|
||||
css: {
|
||||
border: 'none',
|
||||
padding: '15px',
|
||||
backgroundColor: '#000',
|
||||
'-webkit-border-radius': '10px',
|
||||
'-moz-border-radius': '10px',
|
||||
opacity: .5,
|
||||
color: '#fff'
|
||||
}
|
||||
});
|
||||
}
|
||||
}).responseJSON;
|
||||
$.unblockUI();
|
||||
// console.log(data)
|
||||
let area_parkir = data.data;
|
||||
|
||||
// // console.log(area_parkir)
|
||||
if (area_parkir.length > 0) {
|
||||
if (polygon_parkir.length == 0) {
|
||||
for (let i = 0; i < area_parkir.length; i++) {
|
||||
let the_polygon = JSON.parse(area_parkir[i].kordinat);
|
||||
// console.log(the_polygon)
|
||||
|
||||
let polygon = [];
|
||||
for (let i = 0; i < the_polygon.length; i++) {
|
||||
// map_1[i].lng value return like 119.62361145
|
||||
// map_1[i].lat value return like -4.00000000
|
||||
// push value to polygon array
|
||||
polygon.push({
|
||||
lat: parseFloat(the_polygon[i].lat),
|
||||
lng: parseFloat(the_polygon[i].lng)
|
||||
});
|
||||
}
|
||||
polygon_parkir.push(polygon);
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
polygon_parkir1.push(show_polygon);
|
||||
show_polygon.setMap(map);
|
||||
|
||||
|
||||
// google.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
} catch (error) {
|
||||
$.unblockUI();
|
||||
alert('Error get data from ajax');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get_polygon_parkir();
|
||||
|
||||
google.maps.event.addListener(map, 'zoom_changed', function() {
|
||||
var zoomLevel = map.getZoom();
|
||||
console.log(zoomLevel);
|
||||
if (zoomLevel >= 16) {
|
||||
// console.log('zoom in')
|
||||
console.log(markers.length)
|
||||
for (let i = 0; i < markers.length; i++) {
|
||||
markers[i].setMap(null);
|
||||
}
|
||||
markers = [];
|
||||
// clear all marker
|
||||
// get_polygon_parkir();
|
||||
// for (let i = 0; i < polygon_parkir.length; i++) {
|
||||
// polygon_parkir1[i].setMap(map);
|
||||
// }
|
||||
// console.log(polygon_parkir)
|
||||
for (let i = 0; i < polygon_parkir.length; i++) {
|
||||
let show_polygon = new google.maps.Polygon({
|
||||
paths: polygon_parkir[i],
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWeight: 0.8,
|
||||
// fillColor: '#FF0000',
|
||||
fillOpacity: 0.1
|
||||
});
|
||||
|
||||
show_polygon.setMap(map);
|
||||
polygon_parkir1.push(show_polygon);
|
||||
|
||||
google.maps.event.addListener(show_polygon, 'click', function(event) {
|
||||
// console.log("click polygon")
|
||||
// console.log(event.latLng.lng())
|
||||
console.log(infowindow_data)
|
||||
let infowindow = infowindow_data[i];
|
||||
// console.log(infowindow)
|
||||
|
||||
// get the lat and lng of the point
|
||||
var latLng = event.latLng;
|
||||
// console.log(latLng)
|
||||
infowindow.setPosition(latLng);
|
||||
infowindow.open(map);
|
||||
// infowindow_data.push(infowindow);
|
||||
|
||||
// infowindow.open(map, show_polygon);
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
// remove cluster
|
||||
cluster.clearMarkers();
|
||||
|
||||
|
||||
}
|
||||
if (zoomLevel < 16) {
|
||||
console.log('zoom out')
|
||||
console.log(markers.length)
|
||||
console.log(markers1.length)
|
||||
if (polygon_parkir1.length > 0) {
|
||||
// clear all polygon
|
||||
for (let i = 0; i < polygon_parkir1.length; i++) {
|
||||
polygon_parkir1[i].setMap(null);
|
||||
}
|
||||
}
|
||||
|
||||
markers = markers1;
|
||||
for (let i = 0; i < markers.length; i++) {
|
||||
markers[i].setMap(map);
|
||||
}
|
||||
// add cluster
|
||||
cluster.addMarkers(markers);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
33
application/views/user/scripts.php
Normal file
33
application/views/user/scripts.php
Normal file
@ -0,0 +1,33 @@
|
||||
<!--/#wrapper -->
|
||||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="<?=base_url()?>assets/script/html5shiv.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/script/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<!--
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<script src="<?=base_url()?>assets/scripts/jquery.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/scripts/modernizr.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/nprogress/nprogress.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/sweet-alert/sweetalert.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/waves/waves.min.js"></script>
|
||||
<!-- Full Screen Plugin -->
|
||||
<script src="<?=base_url()?>assets/plugin/fullscreen/jquery.fullscreen-min.js"></script>
|
||||
<script src="<?=base_url()?>assets/block/jquery.blockUI.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
|
||||
|
||||
<script src="<?=base_url()?>assets/scripts/main.min.js"></script>
|
||||
<script src="<?=base_url()?>assets/color-switcher/color-switcher.min.js"></script>
|
||||
|
||||
<script>
|
||||
function logout(){
|
||||
if(confirm("Apakah anda yakin ingin keluar?")){
|
||||
window.location.href = "<?=base_url()?>home/logout";
|
||||
}
|
||||
// window.location.href = "<?=base_url()?>home/logout";
|
||||
}
|
||||
</script>
|
||||
49
application/views/user/sidebar.php
Normal file
49
application/views/user/sidebar.php
Normal file
@ -0,0 +1,49 @@
|
||||
<div class="main-menu">
|
||||
<header class="header">
|
||||
<a href="index.html" class="logo">Parepare</a>
|
||||
<button type="button" class="button-close fa fa-times js__menu_close"></button>
|
||||
<div class="user">
|
||||
<a href="#" class="avatar"><img src="<?=base_url()?>assets/images/admin.png" alt=""><span class="status online"></span></a>
|
||||
<h5 class="name"><a href="#">Pengunjung</a></h5>
|
||||
<h5 class="position">Pengunjung</h5>
|
||||
|
||||
</div>
|
||||
<!-- /.user -->
|
||||
</header>
|
||||
<!-- /.header -->
|
||||
<div class="content">
|
||||
|
||||
<div class="navigation">
|
||||
<h5 class="title">Navigasi</h5>
|
||||
<!-- /.title -->
|
||||
<ul class="menu js__accordion">
|
||||
<li <?php if ($header == 'Halaman Utama') {
|
||||
echo 'class="current"';
|
||||
} ?>>
|
||||
<a class="waves-effect" href="<?= base_url('user') ?>"><i class="menu-icon fa fa-home"></i><span>Halaman Utama</span></a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<!-- /.navigation -->
|
||||
</div>
|
||||
<!-- /.content -->
|
||||
</div>
|
||||
<!-- /.main-menu -->
|
||||
|
||||
<div class="fixed-navbar">
|
||||
<div class="pull-left">
|
||||
<button type="button" class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
|
||||
<h1 class="page-title"><?= $header ?></h1>
|
||||
<!-- /.page-title -->
|
||||
</div>
|
||||
<!-- /.pull-left -->
|
||||
<div class="pull-right">
|
||||
|
||||
<!-- <a href="#" class="ico-item fa fa-power-off"></a> -->
|
||||
</div>
|
||||
<!-- /.pull-right -->
|
||||
</div>
|
||||
89
application/views/welcome_message.php
Executable file
89
application/views/welcome_message.php
Executable file
@ -0,0 +1,89 @@
|
||||
<?php
|
||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
||||
?><!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Welcome to CodeIgniter</title>
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
::selection { background-color: #E13300; color: white; }
|
||||
::-moz-selection { background-color: #E13300; color: white; }
|
||||
|
||||
body {
|
||||
background-color: #fff;
|
||||
margin: 40px;
|
||||
font: 13px/20px normal Helvetica, Arial, sans-serif;
|
||||
color: #4F5155;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #003399;
|
||||
background-color: transparent;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #444;
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid #D0D0D0;
|
||||
font-size: 19px;
|
||||
font-weight: normal;
|
||||
margin: 0 0 14px 0;
|
||||
padding: 14px 15px 10px 15px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: Consolas, Monaco, Courier New, Courier, monospace;
|
||||
font-size: 12px;
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #D0D0D0;
|
||||
color: #002166;
|
||||
display: block;
|
||||
margin: 14px 0 14px 0;
|
||||
padding: 12px 10px 12px 10px;
|
||||
}
|
||||
|
||||
#body {
|
||||
margin: 0 15px 0 15px;
|
||||
}
|
||||
|
||||
p.footer {
|
||||
text-align: right;
|
||||
font-size: 11px;
|
||||
border-top: 1px solid #D0D0D0;
|
||||
line-height: 32px;
|
||||
padding: 0 10px 0 10px;
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
|
||||
#container {
|
||||
margin: 10px;
|
||||
border: 1px solid #D0D0D0;
|
||||
box-shadow: 0 0 8px #D0D0D0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="container">
|
||||
<h1>Welcome to CodeIgniter!</h1>
|
||||
|
||||
<div id="body">
|
||||
<p>The page you are looking at is being generated dynamically by CodeIgniter.</p>
|
||||
|
||||
<p>If you would like to edit this page you'll find it located at:</p>
|
||||
<code>application/views/welcome_message.php</code>
|
||||
|
||||
<p>The corresponding controller for this page is found at:</p>
|
||||
<code>application/controllers/Welcome.php</code>
|
||||
|
||||
<p>If you are exploring CodeIgniter for the very first time, you should start by reading the <a href="user_guide/">User Guide</a>.</p>
|
||||
</div>
|
||||
|
||||
<p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds. <?php echo (ENVIRONMENT === 'development') ? 'CodeIgniter Version <strong>' . CI_VERSION . '</strong>' : '' ?></p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user