rgutierrez/resq
1
0
Fork 0
Code Issues 126 Pull requests 49 Projects Releases 4 Packages Wiki Activity Actions

Add upload KML feature for geofence. #220

Browse source
This commit is contained in:
Korina Cordero 2019-06-03 08:05:10 +00:00
parent 9e9c59cd0b
commit f2a180420a
4 changed files with 134 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
config/routes/geofence.yaml
View file

@ -4,12 +4,12 @@ geofence_list:
path: /geofence
controller: App\Controller\GeofenceController::index
geofence_upload_kml:
path: /geofence/upload
controller: App\Controller\GeofenceController::uploadKML
methods: [POST]
geofence_create:
path: /geofence/create
controller: App\Controller\GeofenceController::addForm
methods: [GET]
geofence_create_submit:
path: /geofence/create
controller: App\Controller\GeofenceController::addSubmit
methods: [POST]

24
src/Controller/GeofenceController.php
View file

@ -5,6 +5,9 @@ namespace App\Controller;
use App\Ramcar\BaseController;
use App\Entity\SupportedArea;
use App\Service\KMLFileImporter;
use App\Service\FileUploader;
use Doctrine\ORM\Query;
use Doctrine\ORM\QueryBuilder;
use Symfony\Component\HttpFoundation\Request;
@ -38,12 +41,27 @@ class GeofenceController extends BaseController
$params = $this->initParameters('geofence_list');
$params['obj'] = new SupportedArea();
$params['mode'] = 'create';
$this->fillFormTags($params);
// response
return $this->render('geofence/form.html.twig', $params);
}
public function uploadKML(Request $req, FileUploader $uploader, KMLFileImporter $importer)
{
// retrieve temporary info for file
$file = $req->files->get('kml_file');
// upload the file
$filename = $uploader->upload($file);
// process the kml file
$kml_file = $uploader->getTargetDir() . '/' . $filename;
$importer->getMapdata($kml_file);
// return response
return $this->json([
'success' => true,
'filename' => $filename
]);
}
}

96
templates/geofence/form.html.twig Normal file
View file

@ -0,0 +1,96 @@
{% extends 'base.html.twig' %}
{% block body %}
<!-- BEGIN: Subheader -->
<div class="m-subheader">
<div class="d-flex align-items-center">
<div class="mr-auto">
<h3 class="m-subheader__title">Geofence</h3>
</div>
</div>
</div>
<!-- END: Subheader -->
<div class="m-content">
<!--Begin::Section-->
<div class="row">
<div class="col-xl-12">
<div class="m-portlet m-portlet--mobile">
<div class="m-portlet__head">
<div class="m-portlet__head-caption">
<div class="m-portlet__head-title">
<span class="m-portlet__head-icon">
<i class="fa fa-building"></i>
</span>
<h3 class="m-portlet__head-text">
New Coverage Area
</h3>
</div>
</div>
</div>
<form id="row-form" class="m-form m-form--label-align-right">
<div class="m-portlet__body">
<div class="form-group m-form__group row no-border">
<div class="col-lg-6">
<label data-field="kml_file">
KML File
</label>
<div class="m-dropzone dropzone m-dropzone--primary" action="{{ url('geofence_upload_kml') }}" id="kml-file">
<div class="m-dropzone__msg dz-message needsclick">
<h3 class="m-dropzone__msg-title">
Drop files here or click to upload.
</h3>
<span class="m-dropzone__msg-desc">
Upload only valid KML files
</span>
</div>
</div>
<div class="form-control-feedback hide" data-field="kml_file"></div>
</div>
</div>
</div>
<div class="m-portlet__foot m-portlet__foot--fit">
<div class="m-form__actions m-form__actions--solid m-form__actions--right">
<div class="row">
<div class="col-lg-12">
<a href="{{ url('geofence_list') }}" class="btn btn-success">Submit</button>
<a href="{{ url('geofence_list') }}" class="btn btn-secondary">Back</a>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
<script>
// image upload
Dropzone.options.kmlFile = {
paramName: "kml_file", // The name that will be used to transfer the file
maxFiles: 1,
uploadMultiple: false,
maxFilesize: 5, // MB
addRemoveLinks: true,
acceptedFiles: "text/xml, .kml",
accept: function(file, done) {
done();
},
init: function() {
this.on("maxfilesexceeded", function(file) {
// limit to one file, overwrite old one
this.removeAllFiles();
this.addFile(file);
});
},
success: function(file, response) {
if (response.success) {
$("input[name='kml_file']").val(response.filename);
}
}
};
</script>
{% endblock %}

18
templates/geofence/list.html.twig
View file

@ -17,23 +17,29 @@
<div class="m-portlet m-portlet--mobile">
<div class="m-portlet__head">
<div class="m-portlet__head-caption">
<div class="m-portlet__head-title">
<div class="m-portlet__head-title col-xl-12">
<span class="m-portlet__head-icon">
<i class="fa fa-building"></i>
</span>
<h3 class="m-portlet__head-text">
<h3 class="m-portlet__head-text col-xl-4">
Covered Areas
</h3>
<h3 class="m-portlet__head-text col-xl-8" align="right">
<a href="{{ url('geofence_create') }}" class="btn btn-focus m-btn m-btn--custom m-btn--icon m-btn--air m-btn--pill">
<span>
<i class="fa fa-building"></i>
<span>New Coverage Area</span>
</span>
</a>
</h3>
</div>
</div>
</div>
<form id="row-form" class="m-form m-form--fit m-form--label-align-right m-form--group-seperator-dashed" method="post" action="{{ url('geofence_create_submit') }}">
<form id="row-form" class="m-form m-form--fit m-form--label-align-right m-form--group-seperator-dashed" }}">
<div class="m-portlet__body">
<div class="form-group m-form__group row">
<div class="col-lg-12">
<label data-field="coordinates">
Map
</label>
<div id="m_gmap" style="height:600px;"></div>
</div>
</div>