From af081df0cf31b81c3072a540293b6c2588fa6caf Mon Sep 17 00:00:00 2001
From: Corban-Lee <77944149+XordK@users.noreply.github.com>
Date: Tue, 9 May 2023 09:59:05 +0100
Subject: [PATCH] working on modal for new members

---
 src/mainapp/templates/teams.html |  4 +--
 src/static/js/teams.js           | 44 ++++++++++++++++++++++++--------
 2 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/src/mainapp/templates/teams.html b/src/mainapp/templates/teams.html
index 5c9114e..9173135 100644
--- a/src/mainapp/templates/teams.html
+++ b/src/mainapp/templates/teams.html
@@ -16,10 +16,10 @@
             </div>
             <div class="col-sm-3 col-md-6 col-xl-4 mb-3 mb-sm-0">
                 <div class="input-group justify-content-xl-end">
-                    <button class="btn btn-outline-secondary border-secondary-subtle" data-bs-toggle="tooltip" data-bs-title="Add Member">
+                    <button class="btn btn-outline-secondary border-secondary-subtle" id="addMember" data-bs-toggle="tooltip" data-bs-title="Add Member">
                         <i class="bi bi-person"></i>
                     </button>
-                    <button class="btn btn-outline-secondary border-secondary-subtle" data-bs-toggle="tooltip" data-bs-title="Add Team">
+                    <button class="btn btn-outline-secondary border-secondary-subtle" id="addTeam" data-bs-toggle="tooltip" data-bs-title="Add Team">
                         <i class="bi bi-people"></i>
                     </button>
                 </div>
diff --git a/src/static/js/teams.js b/src/static/js/teams.js
index 01e3f47..1778abe 100644
--- a/src/static/js/teams.js
+++ b/src/static/js/teams.js
@@ -164,6 +164,15 @@ function loadTeams(teams, highlightText="") {
         });
         openEditMemberModal($(this).parent().data("member-id"));
     });
+
+    // Bind new member/team buttons
+    $("#addTeam").on("click", () => {
+        openEditTeamModal(-1);
+    });
+
+    $("#addMember").on("click", () => {
+        openEditMemberModal(-1);
+    });
 }
 
 function fetchAndLoadTeams(search="", sortTeams="", sortMembers="") {
@@ -172,9 +181,9 @@ function fetchAndLoadTeams(search="", sortTeams="", sortMembers="") {
         type: "post",
         data: {
             "csrfmiddlewaretoken": csrfMiddlewareToken,
-            "search": !isEmptyOrSpaces(search) ? search : null,  // might not be necessary? TODO: re-evaluate
-            "sortTeams": sortTeams ? sortTeams : null,
-            "sortMembers": sortMembers ? sortMembers : null
+            "search": search,
+            "sortTeams": sortTeams,
+            "sortMembers": sortMembers
         },
         error: (xhr, textStatus, errorThrown) => { alert(errorThrown); },
         success: (result) => {
@@ -214,12 +223,25 @@ function openEditTeamModal(teamNumber) {
 
 function openEditMemberModal(memberId) {
 
+    var modalTitle = "Add Member";
+    var first = "";
+    var last = "";
+    var teamNumber = $(".team").map(function() { return $(this).data("number"); }).get();  // TODO: shorten this
+    var pegNumber = 0;
+    var firstPlaceholder = "Forename";
+    var lastPlaceholder = "Surname";   
+
     // Member data
-    const member = $(`.team-member[data-member-id='${memberId}']`);
-    const first = member.data("first");
-    const last = member.data("last");
-    const teamNumber = member.data("team-number");
-    const pegNumber = member.data("peg-number");
+    if (memberId !== -1) {
+        const member = $(`.team-member[data-member-id='${memberId}']`);
+        first = member.data("first");
+        last = member.data("last");
+        teamNumber = member.data("team-number");
+        pegNumber = member.data("peg-number");
+        firstPlaceholder = first;
+        lastPlaceholder = last;
+        modalTitle = "Edit: " + first + " " + last        
+    }
 
     // Load teams as options
     $("#editMemberTeam").html("");
@@ -230,14 +252,14 @@ function openEditMemberModal(memberId) {
     });
 
     // Load data to form
-    $("#editMemberName").text(first + " " + last);
+    $("#editMemberName").text(modalTitle);
     $("#editMemberFirstName").val(first);
     $("#editMemberLastName").val(last);
     $("#editMemberTeam").val(teamNumber);
     $("#editMemberPeg").val(pegNumber);
 
-    $("#editMemberFirstName").attr("placeholder", first);
-    $("#editMemberLastName").attr("placeholder", last);
+    $("#editMemberFirstName").attr("placeholder", firstPlaceholder);
+    $("#editMemberLastName").attr("placeholder", lastPlaceholder);
 
     $("#editMemberModal").modal("show");