Fix Bugs

Autcomplete bugs

laravel/app/Http/Controllers/LandingController.php

@@ -71,7 +71,7 @@ class LandingController extends BaseController
         $stations = array();
         $stations = $this->getStations($request->district, $request->brand, $request->fuelType);
 
-        return View('landing_page', ['districts' => $districts, 'districtsName' => $districtsName, 'brandsName' => $brandsName, 'centerMapCoordinates' => $coordinates, 'stations' => $stations]);
+        return View('landing_page', ['district' => $districts, 'districtsName' => $districtsName, 'brandsName' => $brandsName, 'centerMapCoordinates' => $coordinates, 'stations' => $stations]);
     }
 
     private function getStations($district, $brand, $fuelType)
@@ -384,23 +384,39 @@ $uniqueMatch1 = array();
         #print_r($matches);
         return $matches;
     }
+
 //API
     public function apiDistricts() {
         try{
             $statusCode = 200;
-            $response['districts'] = array();/*[
-              'districts'  => []
-            ];*/
+            $response['districts'] = array();
 
             $districts = District::all();
-//dd($districts);
             foreach($districts as $district){
 
-                array_push($response['districts'], /*[
-                    'id' => $district->id,*/
-                    //'name' =>
+                array_push($response['districts'],
+
                     $district->name
-                //]
+                );
+            }
+
+        }catch (Exception $e){
+            $statusCode = 400;
+        }finally{
+            return Response::json($response, $statusCode);
+        }
+    }
+    public function apiBrands() {
+        try{
+            $statusCode = 200;
+            $response['brands'] = array();
+
+            $brands = Station::select('brand')->distinct()->get();
+            foreach($brands as $brand){
+
+                array_push($response['brands'],
+
+                    $brand->brand
                 );
             }
 

laravel/public/js/javascript.js

@@ -3,23 +3,49 @@ var js = $(document).ready(function(){
 
 	getLocation();
 
-	$("#inputdistrict").autocomplete({
+	var array;
+	$("#district").autocomplete({
 		source: function(request, response){
+			if (array){
+				response($.ui.autocomplete.filter(array, request.term));
+			}else{
 			$.ajax({
 	            url: "api/districts",
 	            type: "GET",
 	            dataType: "json",
 	            //delay: 50,
-	            data: request,
+	            data: request.term,
 
 	            success: function (data) {
-	                response($.map(data["districts"] , function (key, value) {
-	                	//console.log(data["districts"][value]);
+	                response(array = $.map(data["districts"] , function (key, value) {
 		                return data["districts"][value];
 	            }))}
 
 	         });
 		}
+	}
+	});
+
+	$("#brand").autocomplete({
+		source: function(request, response){
+			if (array){
+				response($.ui.autocomplete.filter(array, request.term));
+			}else{
+			$.ajax({
+							url: "api/brands",
+							type: "GET",
+							dataType: "json",
+							//delay: 50,
+							data: request.term,
+
+							success: function (data) {
+									response(array = $.map(data["brands"] , function (key, value) {
+										return data["brands"][value];
+							}))}
+
+					 });
+		}
+	}
 	});
 
 	$("input[name='fuelType']").change(function(){
@@ -30,7 +56,7 @@ var js = $(document).ready(function(){
 
 
 	$("#landingSearch").click(function(){
-		localStorage.setItem("district", $("#inputdistrict").val());
+		localStorage.setItem("district", $("#district").val());
 		localStorage.setItem("brand", $("#brand").val());
 		var fuel = [];
 		$("#landingFuelType input:checked").each(function(){
@@ -41,7 +67,7 @@ var js = $(document).ready(function(){
 
 	function getStations(){
 		if(localStorage.getItem("district")===null || localStorage.getItem("brand")===null || localStorage.getItem("fuelType")===null){
-			/*localStorage.setItem("district", $("#inputdistrict").val());
+			/*localStorage.setItem("district", $("#district").val());
 			localStorage.setItem("brand", $("#brand").val());
 			localStorage.setItem("fuelType", $("#landingFuelType>input[name='fuelType']").val());*/
 			//alert("Please fill the data");
@@ -50,7 +76,7 @@ var js = $(document).ready(function(){
 			var district=localStorage.getItem("district");
 			var brand=localStorage.getItem("brand");
 			fuelType.push(localStorage.getItem("fuelType"));
-		/*var district=$("#inputdistrict").val();
+		/*var district=$("#district").val();
 		var fuelType=$("#landingFuelType>input[name='fuelType']").val();
 		var brand=$("#brand").val();*/
 		var stationsData;
@@ -160,17 +186,17 @@ var js = $(document).ready(function(){
 	}
 
 
-	$("#inputdistrict").keyup(function(){
-		//alert($("#inputdistrict").val());
+	$("#district").keyup(function(){
+		//alert($("#district").val());
 		delay( function(){
-			var brand = $("#inputdistrict").val();
+			var brand = $("#district").val();
 			var geocoder = new google.maps.Geocoder();
 			geocodeAddress(geocoder, map);
 		},1000);
 	});
 
 	$("#landingBack").click(function(){
-		$("#inputdistrict").val('');
+		$("#district").val('');
 		$("#brand").val('');
 		$("#landingFuelType>input[name='fuelType']").prop('checked', false);
 		$("#landingSearch").click();
@@ -185,7 +211,7 @@ var js = $(document).ready(function(){
 	})();
 
 	function geocodeAddress(geocoder, resultsMap) {
-        var address = $('#inputdistrict').val();
+        var address = $('#district').val();
         var location = { 'latitude':null, 'longitude':null};
         geocoder.geocode({'address': address}, function(results, status) {
           if (status === 'OK') {
@@ -245,7 +271,7 @@ var js = $(document).ready(function(){
 				var coordinates = getCoordinates();
 				/*console.table(coordinates.origin);
 				console.table(coordinates.destination);*/
-				
+
 				calculateAndDisplayRoute(directionsService, directionsDisplay);
 		});
 

laravel/resources/views/landing_page.blade.php

@@ -30,19 +30,8 @@
 			<form method="post" action="{{route('home')}}">
 				{{csrf_field()}}
 				<div class="form-group">
-					<label for="districts">Distrito(s): </label>
-					<input class="form-control" id="districts" name="districts" type="text">
-
-					<script>
-						$( function() {
-							var districtsName = <?php echo json_encode($districtsName); ?>
-
-							$( "#districts" ).autocomplete({
-								source: districtsName
-							});
-						} );
-					</script>
-
+					<label for="district">Distrito(s): </label>
+					<input class="form-control" id="district" name="district" type="text">
 				</div>
 				<br>
 				<div class="checkbox" id="landingFuelType">
@@ -77,21 +66,12 @@
 				<div class="form-group">
 					<label for="brand">Marca (Opcional): </label>
 					<input class="form-control" id="brand" name="brand" type="text">
-					<button id="landingSearch" type="submit">Search</button>
+					<br>
 				</div>
+				<button id="landingSearch" type="submit">Search</button>
+
 			</form>
 
-			<br>
-			<script>
-				$( function() {
-					var brandsName = <?php echo json_encode($brandsName); ?>
-
-					$( "#brand" ).autocomplete({
-						source: brandsName
-					});
-				} );
-			</script>
-
 	@else
 	<form method="post" action="{{route('home')}}">
 		{{csrf_field()}}

laravel/routes/web.php

@@ -55,6 +55,7 @@ Route::post('/showGpsCoordinates', 'LandingController@index');
 
 //API
 Route::get('/api/districts', 'LandingController@apiDistricts')->name('apidistricts');
+Route::get('/api/brands', 'LandingController@apiBrands')->name('apibrands');
 Route::get('/api/stations/{district}/{brand}/{fuelType}', 'LandingController@apiStations')->name('apistations');
 Route::get('/userpage/edit/{id}', 'UserPageController@edit')->name('editVehicle');
 Route::post('/userpage', 'UserPageController@postTripData')->name('sendTripData');