From 830133f4aa2baededdd7bddf66e423768c86d8fb Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Wed, 1 Oct 2025 06:57:10 +0000
Subject: [PATCH] =?UTF-8?q?geli=C5=9Ftirme?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/css/custom.css | 14 +++++++++++
 assets/js/main.js     | 54 ++++++++++++++++++++++++++++++++++++++++---
 index.php             | 18 +++++++--------
 3 files changed, 74 insertions(+), 12 deletions(-)

diff --git a/assets/css/custom.css b/assets/css/custom.css
index 686bbf3..34ccfdb 100644
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -53,3 +53,17 @@ h1, h2, h3, h4, h5, h6 {
 .action-icon:hover {
     color: #0d6efd;
 }
+
+.sortable-header {
+    cursor: pointer;
+    user-select: none;
+}
+
+.sortable-header:hover {
+    background-color: rgba(0,0,0,0.05);
+}
+
+.sortable-header .bi {
+    font-size: 0.8em;
+    margin-left: 4px;
+}
diff --git a/assets/js/main.js b/assets/js/main.js
index a9297c2..c7bfebd 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -1,8 +1,56 @@
-// Future JavaScript for interactivity will go here.
 document.addEventListener('DOMContentLoaded', function () {
-    // Example: Add tooltips to action icons
+    // Initialize tooltips
     const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
     const tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
         return new bootstrap.Tooltip(tooltipTriggerEl)
     });
-});
+
+    // Live search functionality
+    const searchInput = document.getElementById('searchInput');
+    const tableBody = document.getElementById('contactTableBody');
+    const tableRows = tableBody.getElementsByTagName('tr');
+
+    searchInput.addEventListener('keyup', function() {
+        const filter = searchInput.value.toLowerCase();
+        for (let i = 0; i < tableRows.length; i++) {
+            const row = tableRows[i];
+            const cells = row.getElementsByTagName('td');
+            let text = '';
+            for (let j = 0; j < cells.length; j++) {
+                const cell = cells[j];
+                if (cell) {
+                    text += cell.textContent || cell.innerText;
+                }
+            }
+            if (text.toLowerCase().indexOf(filter) > -1) {
+                row.style.display = "";
+            } else {
+                row.style.display = "none";
+            }
+        }
+    });
+
+    // Table sorting functionality
+    const headers = document.querySelectorAll('.sortable-header');
+    headers.forEach(header => {
+        header.addEventListener('click', function() {
+            const table = this.closest('table');
+            const tbody = table.querySelector('tbody');
+            const columnIndex = parseInt(this.getAttribute('data-column-index'));
+            const rows = Array.from(tbody.querySelectorAll('tr'));
+
+            // Simple A-Z string sort
+            const sortedRows = rows.sort((a, b) => {
+                const aColText = a.querySelector(`td:nth-child(${columnIndex + 1})`).textContent.trim();
+                const bColText = b.querySelector(`td:nth-child(${columnIndex + 1})`).textContent.trim();
+                return aColText.localeCompare(bColText);
+            });
+
+            // Re-append sorted rows
+            while (tbody.firstChild) {
+                tbody.removeChild(tbody.firstChild);
+            }
+            tbody.append(...sortedRows);
+        });
+    });
+});
\ No newline at end of file
diff --git a/index.php b/index.php
index a0d3dd3..e405a0e 100644
--- a/index.php
+++ b/index.php
@@ -102,7 +102,7 @@ $contacts = [
                 <div class="col-md-6">
                     <div class="input-group">
                         <span class="input-group-text"><i class="bi bi-search"></i></span>
-                        <input type="text" class="form-control" placeholder="Search contacts...">
+                        <input type="text" id="searchInput" class="form-control" placeholder="Search contacts...">
                     </div>
                 </div>
             </div>
@@ -111,17 +111,17 @@ $contacts = [
                 <table class="table table-striped table-hover align-middle">
                     <thead class="thead-light">
                         <tr>
-                            <th>Cust. Code</th>
-                            <th>Ticari Unvan</th>
-                            <th>Şehir</th>
-                            <th>Ad Soyad</th>
-                            <th>Telefon</th>
-                            <th>E-posta</th>
-                            <th>Grup</th>
+                            <th class="sortable-header" data-column-index="0">Cust. Code <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="1">Ticari Unvan <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="2">Şehir <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="3">Ad Soyad <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="4">Telefon <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="5">E-posta <i class="bi bi-arrow-down-up"></i></th>
+                            <th class="sortable-header" data-column-index="6">Grup <i class="bi bi-arrow-down-up"></i></th>
                             <th class="text-end">Actions</th>
                         </tr>
                     </thead>
-                    <tbody>
+                    <tbody id="contactTableBody">
                         <?php foreach ($contacts as $contact): ?>
                         <tr>
                             <td><?php echo htmlspecialchars($contact['Cust.Code']); ?></td>