Peta Done

app/Http/Controllers/AdminDataKursusController.php

@@ -34,9 +34,13 @@ public function detail()
     public function destroy(string $id)
     {
         $data = DataKursus::find($id);
-        $data->delete();
+        if ($data) {
+            $data->delete();
+        }
+        return redirect()->route('admin.dataKursus')->with('success', 'Data berhasil dihapus.');
     }
 
+
     public function home()
     {
         return view('user.home');
@@ -46,7 +50,12 @@ public function kursus()
         return view('user.kursus');
     }
     public function maps()
-    {
+{
-        return view('user.peta');
+    // Mengambil data dari tabel data_kursus
-    }
+    $latilongti = DataKursus::all();
+
+    // Mengirim data ke view 'user.peta'
+    return view('user.peta', compact('latilongti'));
+}
+
 }

app/Models/DataKursus.php

@@ -8,5 +8,10 @@
 class DataKursus extends Model
 {
     use HasFactory;
+
+    // Tabel yang digunakan oleh model ini
     protected $table = 'data_kursus';
+
+    // Jika Anda menggunakan timestamp di tabel
+    public $timestamps = true;
 }

database/migrations/2024_08_25_153939_data_kursus.php

@@ -21,7 +21,7 @@ public function up()
             $table->text('fasilitas'); // Kolom fasilitas
             $table->string('lokasi'); // Kolom lokasi
             $table->decimal('latitude', 10, 7); // Kolom latitude (10 digit, 7 desimal)
-            $table->decimal('longitude', 10, 7); // Kolom longitude (10 digit, 7 desimal)
+            $table->decimal('longtitude', 10, 7); // Kolom longitude (10 digit, 7 desimal)
             $table->timestamps(); // Kolom createbed_at dan updated_at
         });
     }

resources/views/admin/dataKursusAdmin.blade.php

@@ -31,24 +31,23 @@
                                         alt="">
                                 </td>
                                 <td class="px-6 py-4 flex space-x-2">
-                                    <form action="#" method="POST"
+                                    <a href="#"
-                                        onsubmit="return confirm('Apakah Anda yakin ingin menghapus?');">
+                                        class="font-medium text-white hover:underline py-2 px-4 bg-[#4F7F81] rounded-xl">
-                                        @csrf
+                                        Edit
-                                        @method('Edit')
+                                    </a>
-                                        <button type="submit"
+                                    <!-- Hapus Link -->
-                                            class="font-medium text-white hover:underline py-2 px-4 bg-[#4F7F81] rounded-xl">Edit</button>
+                                    <a href="#"
-                                    </form>
+                                        onclick="event.preventDefault(); if(confirm('Apakah Anda yakin ingin menghapus?')) document.getElementById('delete-form-{{ $course->id }}').submit();"
-                                    <form action="{{ route('delete', ['id' => $course->id]) }}" method="POST"
+                                        class="font-medium text-white hover:underline py-2 px-4 bg-[#4F7F81] rounded-xl">
-                                        onsubmit="return confirm('Apakah Anda yakin ingin menghapus?');">
+                                        Hapus
+                                    </a>
+                                    <form id="delete-form-{{ $course->id }}" action="{{ route('delete', ['id' => $course->id]) }}" method="POST" style="display: none;">
                                         @csrf
                                         @method('DELETE')
-                                        <button type="submit"
-                                            class="font-medium text-white hover:underline py-2 px-4 bg-[#4F7F81] rounded-xl">Hapus</button>
                                     </form>
                                 </td>
                             </tr>
                         @endforeach
-
                     </tbody>
                 </table>
             </div>

resources/views/components/navbar.blade.php

@@ -1,10 +1,10 @@
 <div class="bg-[#4F7F81]">
     <nav class="border-gray-200 container bg-[#4F7F81] ">
         <div class="max-w-screen-2xl  flex flex-wrap items-center justify-between mx-auto p-4">
-            <a href="#" class="flex items-center">
+            <a href="#" class="flex items-center  ">
-                <img src="{{ asset('img/Rectangle 65.png') }}" class="h-20 object-cover w-20" alt="Flowbite Logo" />
+                <img src="{{ asset('img/Rectangle 65.png') }}" class="h-14 object-cover w-14 lg:mw-20 lg:h-20" alt="Flowbite Logo" />
-                <span
+                <span   
-                    class="self-center text-4xl text-white font-semibold whitespace-nowrap pt-4 aclonica-regular">LearnMap</span>
+                    class="self-center text-2xl sm:text-3xl lg:text-4xl text-white font-semibold whitespace-nowrap pt-4 aclonica-regular">LearnMap</span>
             </a>
             <button data-collapse-toggle="navbar-solid-bg" type="button"
                 class="inline-flex text-white items-center p-2 w-10 h-10 justify-center text-sm rounded-lg md:hidden focus:outline-none focus:ring-2 focus:ring-gray-200 "

resources/views/components/navbarAdmin.blade.php

@@ -2,9 +2,9 @@
     <nav class="border-gray-200 container bg-[#4F7F81] ">
         <div class="max-w-screen-2xl  flex flex-wrap items-center justify-between mx-auto p-4">
             <a href="#" class="flex items-center">
-                <img src="{{ asset('img/Rectangle 65.png') }}" class="h-20 object-cover w-20" alt="Flowbite Logo" />
+                <img src="{{ asset('img/Rectangle 65.png') }}" class="h-14 object-cover w-14 lg:mw-20 lg:h-20" alt="Flowbite Logo" />
                 <span
-                    class="self-center text-4xl text-white font-semibold whitespace-nowrap pt-4 aclonica-regular">LearnMap</span>
+                    class="self-center text-2xl sm:text-3xl lg:text-4xl text-white font-semibold whitespace-nowrap pt-4 aclonica-regular">LearnMap</span>
             </a>
             <button data-collapse-toggle="navbar-solid-bg" type="button"
                 class="inline-flex text-white items-center p-2 w-10 h-10 justify-center text-sm rounded-lg md:hidden focus:outline-none focus:ring-2 focus:ring-gray-200 "

resources/views/user/peta.blade.php

@@ -2,8 +2,7 @@
     <style>
         /* Set the height of the map */
         #map {
-            height: 500px;
+            /* Height will be controlled by Tailwind CSS classes */
-            /* Adjust the height as needed */
             max-width: 100%;
         }
     </style>
@@ -14,42 +13,66 @@
             </div>
         </div>
         <div class="pb-10">
-            <div id="map" class="w-full max-w-4xl rounded-lg shadow-lg"></div>
+            <!-- Apply Tailwind CSS classes for responsive width and height -->
+            <div id="map"
+                class="w-full h-56 sm:h-64 md:h-96 lg:h-[500px] xl:h-[650px] max-w-4xl rounded-lg shadow-lg"></div>
 
             <!-- Leaflet JS -->
             <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
             <script>
-                // Initialize the map
+                // Initialize the map with default center and zoom level
-                const map = L.map('map').setView([-7.7530273, 112.1816449], 15); // Latitude and Longitude
+                const map = L.map('map').setView([-7.750835, 112.1797279], 15); // Latitude and Longitude
 
-                // Add a tile layer (OpenStreetMap)
+                // Add a tile layer from OpenStreetMap
                 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                     attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
                 }).addTo(map);
 
-                // Manually add markers with fixed coordinates
+                // Array to hold markers data from the database
-                const markers = [{
+                const markers = [
-                        coords: [-7.7530273, 112.1816449],
+                    @foreach ($latilongti as $latilongti)
-                        popupText: 'Kampung Inggris LC'
+                        {
-                    },
+                            coords: [{{ $latilongti->latitude }}, {{ $latilongti->longtitude }}],
-                    {
+                            popupText: '{{ $latilongti->nama_kursus }}'
-                        coords: [-7.7529288, 112.1838178],
+                        },
-                        popupText: 'OKE'
+                    @endforeach
-                    },
-                    {
-                        coords: [-7.7540000, 112.1800000],
-                        popupText: 'Lokasi Baru 1'
-                    },
-                    {
-                        coords: [-7.7510000, 112.1850000],
-                        popupText: 'Lokasi Baru 2'
-                    }
                 ];
 
+                // Add markers to the map
                 markers.forEach(marker => {
                     L.marker(marker.coords).addTo(map)
                         .bindPopup(marker.popupText);
                 });
+
+                // Function to handle the successful retrieval of the user's location
+                function onLocationFound(e) {
+                    // Create a custom icon for the user's location
+                    const userIcon = L.icon({
+                        iconUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/images/marker-icon-red.png', // Red marker icon
+                        iconSize: [25, 41], // Size of the icon
+                        iconAnchor: [12, 41], // Point of the icon which will correspond to marker's location
+                        popupAnchor: [1, -34], // Point from which the popup should open relative to the iconAnchor
+                    });
+
+                    // Add a marker for the user's location with the custom red icon
+                    const userMarker = L.marker(e.latlng, { icon: userIcon }).addTo(map);
+                    userMarker.bindPopup("You are here").openPopup();
+
+                    // Center the map on the user's location
+                    map.setView(e.latlng, 15);
+                }
+
+                // Function to handle the error in retrieving the user's location
+                function onLocationError(e) {
+                    alert("Unable to retrieve your location.");
+                }
+
+                // Request the user's location
+                if (navigator.geolocation) {
+                    navigator.geolocation.getCurrentPosition(onLocationFound, onLocationError);
+                } else {
+                    alert("Geolocation is not supported by this browser.");
+                }
             </script>
         </div>
     </div>

routes/web.php

@@ -11,6 +11,7 @@
 Route::get('/admin/data-kursus', [AdminDataKursusController::class, 'dataKursus'])->name('admin.dataKursus');
 Route::get('/admin/tambahdata', [AdminDataKursusController::class, 'create'])->name('admin.tambahDataKursus');
 
+Route::delete('/admin/delete/{id}', [AdminDataKursusController::class, 'destroy'])->name('delete');
 
 Route::get('/admin/courses', [AdminDataKursusController::class, 'index']);
 
@@ -22,8 +23,8 @@
 Route::get('/', [AdminDataKursusController::class, 'home'])->name('home');
 Route::get('/kursus', [AdminDataKursusController::class, 'kursus'])->name('user.kursus'); // Perbaikan pada rute ini
 Route::get('/peta', [AdminDataKursusController::class, 'maps'])->name('user.peta');
+
 Route::get('/detailkursus', [AdminDataKursusController::class, 'detail'])->name('user.detailKursus');
-Route::delete('/admin/delete/{id}', [AdminDataKursusController::class, 'destroy'])->name('delete');