Finish the page for updating a workout.

controllers/workout.js

@@ -31,7 +31,7 @@ const addNoteRoute = async (req, res, next)=>{
 const updateWorkoutRoute = async (req, res, next)=>{
     try{
         const workout = await Workout.findOne({_id: req.params.workoutId});
-        workout.exercises = updateExercises(workout, req.body);
+        workout.exercises = updateExercises(workout.exercises, req.body);
         await workout.save();
         res.json(responseWorkout(workout));
     }catch(e){next(e)}
@@ -86,16 +86,16 @@ const findExercise = (workout, exerciseId)=>{
 const updateExercises = (exercises, data)=>{
     const newExercises = [];
     const existingIndices = [];
-    for(let i = 0; i < data.length; i++){
-        if(data[i].id){
-            const j = exercises.findIndex(e => e._id.toString() === data[i].id);
+    for(let i = 0; i < data.existingExercises.length; i++){
+        if(data.existingExercises[i].id){
+            const j = exercises.findIndex(e => e._id.toString() === data.existingExercises[i].id);
             newExercises.push(exercises[j]);
             existingIndices.push(j);
-        }else if(data[i].new){
+        }else if(data.existingExercises[i].new){
             newExercises.push({
-                name: data[i].new,
+                name: data.existingExercises[i].new,
                 notes: "",
-                type: data[i].type,
+                type: data.existingExercises[i].type,
                 archived: false
             });
         }

views/css/editWorkout.css

@@ -3,6 +3,10 @@
     position: relative;
 }
 
+#editWorkoutPage h1{
+    margin-top: 35px;
+}
+
 #editWorkoutAddExercise{
     position: absolute;
     top: 5px;
@@ -10,6 +14,9 @@
 }
 
 #editWorkoutExercises{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
     width: 100%;
 }
 
@@ -85,8 +92,9 @@
     margin-left: 15px;
 }
 
-#editWorkoutBack{
+#editWorkoutBack, #editWorkoutSubmit{
     width: 100%;
     max-width: 550px;
     padding: 15px 0;
+    margin: 15px 0;
 }

views/index.html

@@ -197,6 +197,8 @@
             <button id="newExerciseSubmit">&#10003;</button>
         </div>
 
+        <button id="editWorkoutSubmit" class="button">Finish</button>
+
         <button id="editWorkoutBack" class="button">Cancel</button>
 
         <template id="editWorkoutExercise">

views/js/pages/editWorkout.js

@@ -1,7 +1,9 @@
 export default {
     rendered: false,
+    workout: null,
 
     render: function(workout){
+        this.workout = workout;
         document.querySelector("#editWorkoutPage h1").textContent = workout.name;
         this.displayExercises(workout.exercises);
 
@@ -19,12 +21,17 @@ export default {
             container.querySelector("input").focus();
         });
         document.getElementById("newExerciseSubmit").addEventListener("click", this.addExercise.bind(this));
+        document.getElementById("editWorkoutSubmit").addEventListener("click", this.submitWorkout.bind(this));
     },
 
     displayExercises: function(exercises){
         const container = document.getElementById("editWorkoutExercises");
         const template = document.getElementById("editWorkoutExercise").content.children[0];
 
+        while(container.children.length > 0){
+            container.removeChild(container.firstChild);
+        }
+
         for(let i = 0; i < exercises.length; i++){
             const exercise = template.cloneNode(true);
             exercise.setAttribute("data-id", exercises[i]._id);
@@ -76,5 +83,44 @@ export default {
         container.appendChild(exercise);
 
         input.value = "";
+        document.getElementById("newExerciseContainer").style.display = "none";
+    },
+
+    submitWorkout: function(){
+        const container = document.getElementById("editWorkoutExercises");
+
+        const existingExercises = [];
+        for(let i = 0; i < container.children.length; i++){
+            const item = container.children[i];
+            const exerciseId = item.getAttribute("data-id");
+            if(exerciseId){
+                existingExercises.push({id: exerciseId});
+            }else{
+                existingExercises.push({
+                    new: item.querySelector("p").textContent,
+                    type: "weights"
+                });
+            }
+        }
+
+        fetch(`/workout/${this.workout.id}`, {
+            method: "PUT",
+            headers: {
+                "Content-Type": "application/json"
+            },
+            body: JSON.stringify({existingExercises: existingExercises})
+        })
+            .then(r=>r.json())
+            .then((response)=>{
+                if(response.error){
+                    notify("error", response.error.message);
+                }else{
+                    notify("success", "Workout updated");
+                    changePage("workoutMenu", response);
+                }
+            })
+            .catch((err)=>{
+                notify("error", "ERROR: unable to save workout");
+            });
     }
 }