diff --git a/assets/js/app/filter.js b/assets/js/app/filter.js
new file mode 100644
index 0000000..4b29937
--- /dev/null
+++ b/assets/js/app/filter.js
@@ -0,0 +1,49 @@
+export function filterAddressesByCase() {
+    if (!document.getElementById('case-filter').value) {
+        return;
+    }
+    fetch('/index.php/api/filter-address-by-case/' + document.getElementById('case-filter').value, {
+        method: 'POST',
+        header: {
+            'Content-Type': 'application/json'
+        }
+    })
+        .then(response => response.json())
+        .then(result => {
+            const addressList = document.getElementById('addressList');
+            const origin = document.getElementById('origin');
+            const destination = document.getElementById('destination');
+
+            origin.innerHTML = '';
+            destination.innerHTML = '';
+            addressList.innerHTML = '';
+
+            origin.innerHTML += '<option value="">-- Origin --</option>';
+            destination.innerHTML += '<option value="0">-- Destination --</option>';
+
+            result.forEach(a => {
+                origin.innerHTML += `<option value='${a.id}'>${a.name}</option>`;
+                destination.innerHTML += `<option value='${a.id}'>${a.name}</option>`;
+                addressList.innerHTML += `
+                <tr>
+                    <td>
+                        <div class='d-flex px-2 py-1'>
+                            <div class='d-flex flex-column justify-content-center'>
+                                <h6 class='mb-0 text-small'>
+                                    ${a.name}
+                                </h6>
+                            </div>
+                        </div>
+                    </td>
+                    <td>${a.formattedAddress}</td>
+                    <td class='align-middle text-center text-xs'>${a.lat}/${a.lon}</td>
+                    <td class='align-middle'>
+                        <a href='/index.php/addresses/edit/${a.id}' title='Edit Address'>
+                            <i class='material-symbols-rounded opacity-5'>edit</i>
+                        </a>
+                    </td>
+                </tr>`;
+            })
+        });
+}
+
diff --git a/assets/js/app/itinerary.js b/assets/js/app/itinerary.js
new file mode 100644
index 0000000..a73ca72
--- /dev/null
+++ b/assets/js/app/itinerary.js
@@ -0,0 +1,56 @@
+export function createItinerary() {
+    if (!document.getElementById('case-filter').value) {
+        return;
+    }
+
+    let date = document.getElementById('date');
+    date.value = new Date().toLocaleDateString();
+
+    let btn = document.getElementById('create-itinerary');
+    btn.setAttribute('data-bs-toggle', 'modal');
+    btn.setAttribute('data-bs-target', '#exampleModalMessage');
+    btn.click();
+}
+
+export function addLocationToItinerary() {
+    let date = document.getElementById('date').value;
+    let origin = document.getElementById('origin').value;
+    let destination = document.getElementById('destination').value;
+    let departure = document.getElementById('departure').value;
+    let arrival = document.getElementById('arrival').value;
+    let caseMileage = document.getElementById('case-mileage').checked;
+    let caseId = document.getElementById('case-filter').value;
+
+    fetch('/index.php/api/add-location-to-itinerary', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+            date: date,
+            origin: origin,
+            destination: destination,
+            departure: departure,
+            arrival: arrival,
+            caseMileage: caseMileage,
+            caseId: caseId
+        })
+    })
+        .then(response => response.json())
+        .then(data => {
+            if (data.success === true) {
+                $('#close-modal').click();
+            }
+        });
+}
+
+export function openMap() {
+    if (!document.getElementById('case-filter').value || !document.getElementById('date-filter').value) {
+        return false;
+    }
+
+    document.getElementById('caseId').value = document.getElementById('case-filter').value;
+    document.getElementById('caseDate').value = document.getElementById('date-filter').value;
+
+    document.getElementById('map-form').submit();
+}
\ No newline at end of file