some more fine tuning

rowers/models.py

@@ -2401,7 +2401,8 @@ class PlannedSessionStep(models.Model):
 
     durationtypes = (
         ("Distance", "Distance"),
-        ("Time", "Time")
+        ("Time", "Time"),
+        ('RepeatUntilStepsCmplt','Repeat previous blocks n times')
     )
 
     targettypes = (
@@ -2414,16 +2415,20 @@ class PlannedSessionStep(models.Model):
     manager = models.ForeignKey(User, null=True, on_delete=models.CASCADE)
     name = models.TextField(default='',max_length=200, blank=True, null=True)
     type = models.TextField(default='',max_length=200, blank=True, null=True)
-    durationvalue = models.FloatField(default=0)
-    durationtype = models.TextField(default='',max_length=200, blank=True, null=True,
-                                    choices=durationtypes)
-    targetvalue = models.IntegerField(default=0)
+    durationvalue = models.FloatField(default=0, verbose_name="Duration Value")
+    durationtype = models.TextField(default='Time',max_length=200,
+                                    choices=durationtypes,
+                                    verbose_name='Duration Type')
+    targetvalue = models.IntegerField(default=0, verbose_name="Target Value")
     targettype = models.TextField(default='',max_length=200, blank=True, null=True,
-                                  choices=targettypes)
-    targetvaluelow = models.IntegerField(default=0)
-    targetvaluehigh = models.IntegerField(default=0)
+                                  choices=targettypes, verbose_name="Target Type")
+    targetvaluelow = models.IntegerField(default=0,
+                                         verbose_name="Target Value Low")
+    targetvaluehigh = models.IntegerField(default=0,
+                                          verbose_name="Target Value High")
     intensity = models.TextField(default='',max_length=200, blank=True, null=True,
-                                 choices=intensitytypes)
+                                 choices=intensitytypes,
+                                 verbose_name = "Intensity")
     description = models.TextField(default='',max_length=200, blank=True, null=True)
     color = models.TextField(default='#ddd',max_length=200)
 
@@ -2434,6 +2439,8 @@ class PlannedSessionStep(models.Model):
             self.color = '#90ee90'
         elif self.intensity == "Rest":
             self.color = 'add8e6'
+        if self.durationtype == 'RepeatUntilStepsCmplt':
+            self.color = 'ffffa7'
 
         self.durationvalue = int(self.durationvalue)
 

rowers/templates/stepedit.html

@@ -29,6 +29,65 @@
   <input name="stepsave_and_return" type="submit" value="Update and Return to Steps">
   </form>
 </li>
+<li class="grid_2">
+  <h2>Explanation</h2>
+  <table width=90% class="listtable shortpadded">
+    <tr>
+      <th>Parameter</th>
+      <th>Regular Step</th>
+      <th>Repeat Step</th>
+    </tr>
+    <tr>
+      <th>Duration Type</th><td>Time or Distance</td><td>Repeat</td>
+    </tr>
+    <tr>
+      <th>Duration Value</th><td>Minutes / Meters</td><td>Block number to start repeat from</td>
+    </tr>
+    <tr>
+      <th>Target Type</th><td>Set a target to hold</td><td>---</td>
+    </tr>
+    <tr>
+      <th>Target Value</th>
+      <td>
+        <div>Power: Zone number (1-10), &#37; of FTP (10-1000)</div>
+        <div>Speed: 1000x target speed in m/s</div>
+        <div>Heart Rate: Zone number (1-10), &#37; of max (10-100); </div>
+        <div>Cadence: Strokes per Minute</div>
+      </td>
+      <td>
+        Number of repetitions
+      </td>
+    </tr>
+    <tr>
+      <th>Target Value Low</th>
+      <td>
+        <div>Power: &#37; of FTP (10-1000)</div>
+        <div>Speed: 1000x target speed in m/s</div>
+        <div>Heart Rate: &#37; of max (10-100); </div>
+        <div>Cadence: Strokes per Minute</div>
+      </td>
+      <td>
+      </td>
+    </tr>
+    <tr>
+      <th>Target Value High</th>
+      <td>
+        <div>Power: &#37; of FTP (10-1000)</div>
+        <div>Speed: 1000x target speed in m/s</div>
+        <div>Heart Rate: &#37; of max (10-100); </div>
+        <div>Cadence: Strokes per Minute</div>
+      </td>
+      <td>
+      </td>
+    </tr>
+    <tr>
+      <th>Intensity</th><td>Warming Up, Active, Rest</td><td>Set to Active</td>
+    </tr>
+    <tr>
+      <th>Description</th><td>Any other text</td><td></td>
+    </tr>
+  </table>
+</li>
 </ul>
 {% endblock %}
 

rowers/templates/stepeditor.html

@@ -26,9 +26,15 @@
 </form>
 </p>
 {% for step in currentsteps %}
-<div id="{{ step.id }}" draggable="true" class="trainingstep {{ step.intensity }}" >
+<div id="{{ step.id }}" draggable="true" class="trainingstep {{ step.intensity }} {{ step.durationtype }}" >
+  <span id="{{ step.id }}" class="stepid">
+    ({{ forloop.counter|add:-1 }})
+  </span>
   <span  id="{{ step.id }}" class="stepcontent">
   {{ step.name }}
+  {% if step.durationtype == "RepeatUntilStepsCmplt" %}
+  - repeat {{ step.targetvalue }}x from block {{ step.durationvalue|floatformat }}
+  {% endif %}
   </span>
   <span id="{{ step.id }}">
     <a href="/rowers/plans/step/{{ step.id }}/edit/{{ ps.id }}/">
@@ -43,12 +49,22 @@
 </div>
 {% endfor %}
 </section>
+<section class="allcentered">
+  <div class="allcenteredchild">
+  <h1><i class="fas fa-arrow-left fa-fw"></i></h1>
+  </div>
+</section>
 <section class="library">
-  <h2>Library</h2>
+  <h2>Step Library</h2>
   {% for step in steps %}
-  <div id="{{ step.id }}" draggable="true" class="trainingstep {{ step.intensity }}" >
+  <div id="{{ step.id }}" draggable="true" class="trainingstep {{ step.intensity }} {{ step.durationtype}}" >
+    <span id="{{ step.id }}" class="stepid">
+    </span>
     <span  id="{{ step.id }}" class="stepcontent">
     {{ step.name }}
+    {% if step.durationtype == "RepeatUntilStepsCmplt" %}
+    - repeat {{ step.targetvalue }}x from block {{ step.durationvalue|floatformat }}
+    {% endif %}
     </span>
     <span id="{{ step.id }}">
       <a href="/rowers/plans/step/{{ step.id }}/edit/{{ ps.id }}/">
@@ -142,9 +158,11 @@
           console.log(result)
         }
     })
+    window.location.reload(true);
     }
 
     function saveState() {
+      var cntr = 0;
       var list = [];
       steps = document.querySelector('.drop-zone');
       steps.childNodes.forEach(function(item) {
@@ -153,6 +171,11 @@
             if (child.id && child.className == 'stepcontent') {
               list.push(child.id);
             }
+            if (child.className == "stepid") {
+              s = `(${cntr})`
+              child.replaceWith(s);
+              cntr++;
+            }
           })
         }
       });
@@ -193,6 +216,7 @@
         dragged = null;
         origcolor = null;
       }
+      saveState();
     }
 
     function handleMouseOver(event) {
@@ -242,6 +266,7 @@
       if (dragged.parentNode.className.includes("drop-zone")) {
         trash(event);
       }
+      saveState();
     }
 
     function trash(event) {
@@ -251,7 +276,6 @@
         event.preventDefault();
         if (dragged.parentNode.className.includes("drop-zone")) {
           dragged.remove();
-          saveState();
         }
       }
     }

static/css/rowsandall2.css

@@ -325,7 +325,7 @@ th.rotate > div > span {
 
 .stepcontainer {
   display: grid;
-  grid-template-columns: repeat(2, 1fr);
+  grid-template-columns: 4fr 1fr 4fr;
   gap: 10px;
 }
 
@@ -353,23 +353,39 @@ th.rotate > div > span {
     background-color: #add8e6;
 }
 
+.RepeatUntilStepsCmplt {
+    background-color: #ffffa7;
+}
+
 .drop-zone {
   position: relative;
   overflow: hidden;
-  background: #878787;
+  background-color: #D7D7D7;
   /* color: white; */
   padding: 10px;
   padding-bottom: 40px;
 }
 
+.allcentered {
+  /* Center vertically and horizontally */
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.allcenteredchild {
+    margin-top: 50%;
+}
+
 .divlines {
-    display: block;
-    overflow-x: hidden;
-    border-width: 1px 0 0 0;
-    border-color: #333 #333 #333 #333;
-    border-style: solid;
-    padding: 0px;
-    margin: 0px;
+  width: 50px;
+  height: 50px;
+  background-color: red;
+  /* Center vertically and horizontally */
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -25px 0 0 -25px; /* Apply negative top and left margins to truly center the element */
 }
 
 .workoutcontainer {