Add robots.txt

Rename for case sensitive
Optimize search engine
Remove useless options htaccess
Add Modal
Add delete, add contact

static/js/javascript.js

@@ -6,7 +6,7 @@ let displayContacts = (contacts) => {
 
     for (let contact of contacts) {
         tbody.append(`
-            <tr>
+            <tr data-id="${contact["id"]}">
                 <td>${(contact["first_name"] ? contact["first_name"] : (contact["firstName"] ? contact["firstName"] : ""))}</td>
                 <td>${(contact["last_name"] ? contact["last_name"] : (contact["lastName"] ? contact["lastName"] : ""))}</td>
                 <td>${(contact["surname"] ? contact["surname"] : "")}</td>
@@ -14,6 +14,8 @@ let displayContacts = (contacts) => {
                 <td>${(contact["address"] ? contact["address"] : "")}</td>
                 <td>${(contact["phone_number"] ? contact["phone_number"] : (contact["phoneNumber"] ? contact["phoneNumber"] : ""))}</td>
                 <td>${(contact["birthday"] ? new Date(contact["birthday"]).toLocaleDateString() : "")}</td>
+                <td><i class="material-icons left modify">create</i></td>
+                <td><i class="material-icons left delete">delete</i></td>
             </tr>
         `);
     }
@@ -26,7 +28,7 @@ $(document).ready(() => {
     modal.modal();
 
     let search = (query) => {
-        if (query.length >= 3) {
+        if (query.length >= 2) {
             working = true;
             $.ajax({
                 url: "/api/contact/search",
@@ -60,15 +62,85 @@ $(document).ready(() => {
 
         if (!working) {
             search(query);
-        } else {
             lastQuery = query;
+        } else {
+            let i = setInterval(() => {
+                let newQuery = $("#search").val();
+
+                if (newQuery !== query) {
+                    clearInterval(i);
+                } else {
+                    if (!working) {
+                        search(query);
+                        lastQuery = query;
+                        clearInterval(i);
+                    }
+                }
+            }, 50);
         }
     });
 
     $(document).on("click", ".add-contacts", () => {
-        modal.open();
+        $("#modal").addClass("md-show");
     });
 
-    $("[data-tooltip]").tooltip();
+    $(document).on("click", "#md-cancel", () => {
+        $("#modal").removeClass("md-show");
+    });
+
+    $(document).on("click", "#md-validate", () => {
+        let firstName = $("#first_name").val();
+        let lastName = $("#last_name").val();
+        let surname = $("#surname").val();
+        let email = $("#email").val();
+        let address = $("#address").val();
+        let phoneNumber = $("#phone_number").val();
+        let birthday = $("#birthday").val();
+
+        if (firstName !== "" && lastName !== "") {
+            let data = {
+                firstName,
+                lastName,
+                surname: (surname !== "" ? surname : null),
+                email: (email !== "" ? email : null),
+                address: (address !== "" ? address : null),
+                phoneNumber: (phoneNumber !== "" ? phoneNumber : null),
+                birthday: (birthday !== "" ? birthday : null),
+            };
+
+            $.ajax({
+                url: "/api/contact/insert",
+                method: "POST",
+                data,
+                success: function (result) {
+                    result = JSON.parse(result);
+                    data["id"] = parseInt(result.data["id"], 10);
+                    contacts.push(data);
+
+                    $("table tbody").empty();
+                    displayContacts(contacts);
+                    $("#modal").removeClass("md-show");
+                }, error: function () {
+                }
+            });
+        }
+    });
+
+    $(document).on("click", ".delete", function () {
+        let $contact = $(this).closest("tr");
+        let id = parseInt($contact.attr("data-id"), 10);
+
+        $.ajax({
+            url: "/api/contact/delete",
+            method: "POST",
+            data: {
+                id
+            },
+            success: function () {
+                contacts = contacts.filter((c) => c.id !== id);
+                $contact.remove();
+            }
+        })
+    });
 
 });