Work on exercise type support for create workout

5 files changed, 86 insertions, 67 deletions

diff --git a/app/forms/workout.py b/app/forms/workout.py
index ecc72c8..a84eb6a 100644
--- a/app/forms/workout.py
+++ b/app/forms/workout.py
@@ -7,6 +7,7 @@ class ExerciseCreateForm(Form):
     name = StringField("name",  [DataRequired()])
     sets = IntegerField("sets", [DataRequired()])
     units = IntegerField("units", [DataRequired()])
+    type = StringField("type", [DataRequired()]) # TODO: make sure its time or reps
 
 class SetForm(Form):
     lbs = IntegerField("lbs", [DataRequired()])
diff --git a/app/static/js/create.js b/app/static/js/create.js
index 7cdf328..832bbe2 100644
--- a/app/static/js/create.js
+++ b/app/static/js/create.js
@@ -18,7 +18,9 @@ function handleAdd() {
 	exerciseUnitInput.placeholder = 'Reps';
 	exerciseUnitInput.name = 'exercises-' + rowId + '-units';
 
-	exerciseUnitInput.parentNode.children[0].children[0].children[0].addEventListener("input", handleChange);
+	exerciseUnitSelect = exerciseUnitInput.parentNode.children[0].children[0].children[0];
+	exerciseUnitSelect.addEventListener("input", handleChange);
+	exerciseUnitSelect.name = 'exercises-' + rowId + '-type';
 
 	rowId++;
 	rowsDiv.append(newRow);
diff --git a/app/tables/workout.py b/app/tables/workout.py
index cff0762..164f547 100644
--- a/app/tables/workout.py
+++ b/app/tables/workout.py
@@ -1,4 +1,9 @@
 from app import db, login_manager
+import enum
+
+class ExerciseType(enum.Enum):
+    TIME = "Seconds"
+    REPS = "Reps"
 
 # Represents an individual exercise
 class Exercise(db.Model):
@@ -7,13 +12,15 @@ class Exercise(db.Model):
     name = db.Column(db.String(100), nullable=False)
     sets = db.Column(db.Integer)
     units = db.Column(db.Integer)
+    type = db.Column(db.Enum(ExerciseType))
     # Workout Relationship
     workout_id = db.Column(db.Integer, db.ForeignKey('workouts.id'))
 
-    def __init__(self, name, sets, units):
+    def __init__(self, name, sets, units, type):
         self.name = name
         self.sets = sets
-        self.unit = units 
+        self.units = units 
+        self.type = type
 
     def __repr__(self):
         return f'<Exercise {self.name} {self.sets}x{self.units}>'
@@ -34,7 +41,8 @@ class Workout(db.Model):
 
         # Create exercises
         for exercise in exercises:
-            self.exercises.append(Exercise(exercise['name'], exercise['sets'], exercise['units']))
+            type = ExerciseType.TIME if exercise['type'] == 'time'else ExerciseType.REPS;
+            self.exercises.append(Exercise(exercise['name'], exercise['sets'], exercise['units'], type))
 
     def __repr__(self):
         return f'<Workout {self.name}>'
diff --git a/app/templates/base/form.html b/app/templates/base/form.html
index 9f356e0..98200c9 100644
--- a/app/templates/base/form.html
+++ b/app/templates/base/form.html
@@ -8,17 +8,17 @@
 
 				<!-- TODO: render errors -->
 				{% with messages = get_flashed_messages(with_categories=true) %}
-				{% if messages %}
-				{% for category, message in messages %}
-					{% if category == "message" %}
-						<div class="notification is-info">
-					{% else %}
-						<div class="notification is-{{ category }}">
+					{% if messages %}
+						{% for category, message in messages %}
+							{% if category == "message" %}
+								<div class="notification is-info">
+							{% else %}
+								<div class="notification is-{{ category }}">
+							{% endif %}
+								{{ message }}
+							</div>
+						{% endfor %}
 					{% endif %}
-						{{ message }}
-					</div>
-				{% endfor %}
-				{% endif %}
 				{% endwith %}
 
 				<form method="POST" class="box">
diff --git a/app/templates/workout/create.html b/app/templates/workout/create.html
index d5178fc..88095f7 100644
--- a/app/templates/workout/create.html
+++ b/app/templates/workout/create.html
@@ -1,5 +1,7 @@
 {% extends 'base/form.html' %}
 
+{% block title %}Create Workout{% endblock %}
+
 {% block form %}
 <div class="field is-horizontal">
 	<div class="field-body">
@@ -12,67 +14,73 @@
 		</div>
 	</div>
 </div>
-<div id="rows" class="field"> {% for entry in form.exercises.entries %} <div class="field is-horizontal">
-			<div class="field-body">
-				<div class="field">
-					<p class="control is-expanded has-icons-left">
+
+<div id="rows" class="field">
+	{% for entry in form.exercises.entries %}
+	<div class="field is-horizontal">
+		<div class="field-body">
+			<div class="field">
+				<p class="control is-expanded has-icons-left">
 					<input class="input" name='exercises-0-name' type="text" placeholder="Exercise Name", value="{{ entry.data['name'] or "" }}">
-						<span class="icon is-small is-left">
-							<i class="fa fa-tag"></i>
-						</span>
-					</p>
-					<p class="control is-expanded has-icons-left">
-					<input class="input" name='exercises-0-reps' type="hidden" placeholder="Reps" min="1" max="100" value="{{ entry.data['reps'] or "" }}">
-						<span class="icon is-small is-left">
-							<i class="fa"></i>
-						</span>
-					</p>
-				</div>
-				<div class="field">
-					<p class="control is-expanded has-icons-left">
-					<input class="input" name='exercises-0-sets' type="number" placeholder="Sets" min="1" max="100" value="{{ entry.data['sets'] or "" }}">
-						<span class="icon is-small is-left">
-							<i class="fa fa-calculator"></i>
-						</span>
-					</p>
-				</div>
-				<div class="field has-addons">
-                    <div class="control has-icons-left">
-                        <div class="select">
-                            <select class="exercise-unit">
-                                <option value="reps">Reps</option>
-                                <option value="time">Time</option>
-                            </select>
-                        </div>
-                        <div class="icon is-small is-left">
-                            <i class="fa fa-calculator"></i>
-                        </div>
-                    </div>
-					<input class="input" name='exercises-0-units' type="number" placeholder="Reps" min="1" max="100" value="{{ entry.data['reps'] or "" }}">
+					<span class="icon is-small is-left">
+						<i class="fa fa-tag"></i>
+					</span>
+				</p>
+				<p class="control is-expanded has-icons-left">
+					<input class="input" name='exercises-0-reps' type="hidden" placeholder="Reps" min="1" value="{{ entry.data['reps'] or "" }}">
+					<span class="icon is-small is-left">
+						<i class="fa"></i>
+					</span>
+				</p>
+			</div>
+			<div class="field">
+				<p class="control is-expanded has-icons-left">
+					<input class="input" name='exercises-0-sets' type="number" placeholder="Sets" min="1" value="{{ entry.data['sets'] or "" }}">
+					<span class="icon is-small is-left">
+						<i class="fa fa-calculator"></i>
+					</span>
+				</p>
+			</div>
+			<div class="field has-addons">
+				 <div class="control has-icons-left">
+					<div class="select">
+						<select name="exercise-0-type">
+							<option value="reps">Reps</option>
+							<option value="time">Time</option>
+						</select>
+					</div>
+					<div class="icon is-small is-left">
+						<i class="fa fa-calculator"></i>
+					</div>
 				</div>
-                <p class="button is-danger" onclick="handleDel(this)">
-                    <span class="icon is-small">
-                        <i class="fa fa-minus"></i>
-                    </span>
-                </p>
+				<input class="input" name='exercises-0-units' type="number" placeholder="Reps" min="1" value="{{ entry.data['units'] or "" }}">
 			</div>
+			<p class="button is-danger" onclick="handleDel(this)">
+				<span class="icon is-small">
+					<i class="fa fa-minus"></i>
+				</span>
+			</p>
 		</div>
+	</div>
 	{% endfor %}
 </div>
+
 <div class="field is-horizontal is-grouped is-grouped-right">
-    <p id="add" class="button is-primary">
-    <span class="icon is-small">
-        <i class="fa fa-plus"></i>
-    </span>
-    </p>
+	<p id="add" class="button is-primary">
+		<span class="icon is-small">
+			<i class="fa fa-plus"></i>
+		</span>
+	</p>
 </div>
+
 <div class="field is-horizontal is-grouped is-grouped-right">
-    <button class="button is-success ">
-        <span class="icon is-small">
-            <i class="fa fa-check"></i>
-        </span>
-        <span>Create Workout</span>
-    </button>
+	<button class="button is-success ">
+		<span class="icon is-small">
+			<i class="fa fa-check"></i>
+		</span>
+		<span>Create Workout</span>
+	</button>
 </div>
-<script src="../../static/js/create.js"></script>
+
+<script src="/static/js/create.js"></script>
 {% endblock %}