smooth time slider

rowers/forms.py

@@ -156,9 +156,9 @@ class InstrokeForm(forms.Form):
                                            required=False)
     spm_min = forms.IntegerField(initial=15,label='SPM Min',widget=HiddenInput)
     spm_max = forms.IntegerField(initial=45,label='SPM Max',widget=HiddenInput)
-    activeminutesmin = forms.IntegerField(
+    activeminutesmin = forms.FloatField(
         required=False, initial=0, widget=forms.HiddenInput())
-    activeminutesmax = forms.IntegerField(
+    activeminutesmax = forms.FloatField(
         required=False, initial=0, widget=forms.HiddenInput())
     notes = forms.CharField(required=False,
                             max_length=200, label='Notes',

rowers/interactiveplots.py

@@ -4404,9 +4404,9 @@ def instroke_interactive_chart(df,metric, workout, spm_min, spm_max,
                   text_color='black',
                   )
 
-    s2 = 'Time: {activeminutesmin} - {activeminutesmax} min'.format(
-        activeminutesmin=activeminutesmin,
-        activeminutesmax=activeminutesmax
+    s2 = 'Time: {activeminutesmin} - {activeminutesmax}'.format(
+        activeminutesmin=datetime.timedelta(seconds=60*activeminutesmin),
+        activeminutesmax=datetime.timedelta(seconds=60*activeminutesmax)
     )
 
     label2 = Label(x=50,y=400, x_units='screen', y_units='screen',

rowers/templates/instroke_interactive.html

@@ -83,22 +83,29 @@ $( function() {
   });
 </script>
 <script>
+  function secondsToHMS(s) {
+    var h = Math.floor(s/3600); // Hours
+    s -= h*3600;
+    var m = Math.floor(s/60); // Minutes
+    s -= m*60;
+    return h+":"+(m < 10 ? '0'+m : m)+":"+(s < 10 ? '0'+s : s); //zero padding on minutes and seconds
+}
 $( function() {
   console.log({{ activeminutesmin }}, {{ activeminutesmax}}, 'active range');
   $( "#slider-timerange" ).slider({
     range: true,
     min: 0,
-    max: {{ maxminutes }},
-    step: 0.1,
-    values: [ {{ activeminutesmin }}, {{ activeminutesmax }} ],
+    max: {{ maxminutes|times60 }},
+    step: 1,
+    values: [ {{ activeminutesmin|times60 }}, {{ activeminutesmax|times60 }} ],
     slide: function( event, ui ) {
-      $( "#amount" ).val(ui.values[ 0 ] + " min - " + ui.values[ 1 ] + " min " );
-      $("#id_activeminutesmin").val(ui.values[0]);
-      $("#id_activeminutesmax").val(ui.values[1]);
+      $( "#amount" ).val(secondsToHMS(ui.values[ 0 ]) + " - " + secondsToHMS(ui.values[ 1 ]) );
+      $("#id_activeminutesmin").val(ui.values[0]/60);
+      $("#id_activeminutesmax").val(ui.values[1]/60);
     }
   });
-  $( "#amount" ).val($( "#slider-timerange" ).slider( "values", 0 ) +
-    " min - " + $( "#slider-timerange" ).slider( "values", 1 ) + " min ");
+  $( "#amount" ).val(secondsToHMS($( "#slider-timerange" ).slider( "values", 0 )) +
+    " min - " + secondsToHMS($( "#slider-timerange" ).slider( "values", 1 )));
 } );
 </script>
 {% endblock %}

rowers/templatetags/rowerfilters.py

@@ -393,6 +393,9 @@ def aantalcomments(workout):
 
     return aantalcomments
 
+@register.filter
+def times60(s):
+    return s*60
 
 @register.filter
 def encode(id):