From cc724afcbbc076bb4d8fad5666a0c06d8beeb4be Mon Sep 17 00:00:00 2001
From: Sander Roosendaal <roosendaalsander@gmail.com>
Date: Thu, 11 Oct 2018 20:26:23 +0200
Subject: [PATCH] flex chart

---
 rowers/forms.py                      |  11 ++
 rowers/templates/flexchart3otw.html  | 258 ++++++---------------------
 rowers/templates/panel_comments.html |   5 -
 rowers/views.py                      |  63 ++++++-
 4 files changed, 124 insertions(+), 213 deletions(-)

diff --git a/rowers/forms.py b/rowers/forms.py
index 8b9ff819..f4877106 100644
--- a/rowers/forms.py
+++ b/rowers/forms.py
@@ -923,6 +923,17 @@ class VirtualRaceSelectForm(forms.Form):
             choices = get_countries(),initial='All'
             )
 
+class FlexOptionsForm(forms.Form):
+    includereststrokes = forms.BooleanField(initial=True, required = False,
+                                         label='Include Rest Strokes')
+    plotchoices = (
+        ('line','Line Plot'),
+        ('scatter','Scatter Plot'),
+        )
+    plottype = forms.ChoiceField(choices=plotchoices,initial='scatter',
+                                 label='Chart Type')
+    
+        
 class FlexAxesForm(forms.Form):
     axchoices = (
         (ax[0],ax[1]) for ax in axes if ax[0] not in ['cumdist','None']
diff --git a/rowers/templates/flexchart3otw.html b/rowers/templates/flexchart3otw.html
index 7c6180c7..be59e81f 100644
--- a/rowers/templates/flexchart3otw.html
+++ b/rowers/templates/flexchart3otw.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "newbase.html" %}
 {% load staticfiles %}
 {% load rowerfilters %}
 {% load tz %}
@@ -6,7 +6,7 @@
 {% block title %} Flexible Plot {% endblock %}
 
 {% localtime on %}
-{% block content %}
+{% block main %}
 
 {{ js_res | safe }}
 {{ css_res| safe }}
@@ -20,197 +20,45 @@
 {{ the_script |safe }}
 
 
-<style>
-  /* Need this to get the page in "desktop mode"; not having an infinite height.*/
-  html, body {height: 100%; margin:5px;}
-</style>
-
-<div id="navigation" class="grid_12 alpha">
-  {% if user.is_authenticated and mayedit %}
-  <div class="grid_2 alpha">
-    <p>
-      <a class="button gray small" href="/rowers/workout/{{ id }}/edit">Edit Workout</a>
-    </p>
-  </div>
-  <div class="grid_2">
-    <p>
-      <a class="button gray small" href="/rowers/workout/{{ id }}/workflow">Workflow View</a>
-    </p>
-  </div>    
-  <div class="grid_2 suffix_6 omega">
-    <p>
-      <a class="button gray small" href="/rowers/workout/{{ id }}/advanced">Advanced Edit</a>
-    </p>
-
-  </div>
-  {% endif %}
-</div>
-
-
-<p>&nbsp;</p>
-
-<div id="plotbuttons" class="grid_12 alpha">
-
-
-  <div id="x-axis" class="grid_9 alpha">
-    <div class="grid_3 alpha dropdown">
-      <button class="grid_2 alpha button blue small dropbtn">X-axis</button>
-      <div class="dropdown-content">
-        <div style="float: left; width:67%;">
-        {% for key, value in axchoicesbasic.items %}
-        {% if key != 'None' %}
-        <a class="button blue small alpha" href="/rowers/workout/{{ id }}/flexchart/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ plottype }}">{{ value }}</a>
-        {% endif %}
-        {% endfor %}
-	{% if promember %}
-        {% for key, value in axchoicespro.items %}
-	<a class="button blue small alpha" href="/rowers/workout/{{ id }}/flexchart/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/scatter">{{ value }}</a>
-        {% endfor %}
-	{% else %}
-        {% for key, value in axchoicespro.items %}
-	<a class="button rosy small" href="/rowers/promembership">{{ value }}</a>
-        {% endfor %}
-	{% endif %}
-        </div>
-        <div style="float: right; width: 33%;">
-        {% if promember %}
-        {% for key, value in extrametrics.items %}
-        <a class="button orange small" href="/rowers/workout/{{ id }}/flexchart/{{ key }}/{{ yparam1 }}/{{ yparam2 }}/{{ plottype }}">{{ value }}</a>
-        {% endfor %}
-        {% else %}
-        {% for key, value in extrametrics.items %}
-        <a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
-        {% endfor %}
-        {% endif %}
-        </div>
-      </div>
-    </div>
-		
-    <div id="left-y" class="grid_3 dropdown">
-      <button class="grid_2 alpha button blue small dropbtn">Left</button>
-      <div class="dropdown-content">
-        <div style="float: left; width:67%;">
-        {% for key, value in axchoicesbasic.items %}
-        {% if key not in noylist and key != 'None' %}
-	<a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ plottype }}">{{ value }}</a>
-        {% endif %}
-        {% endfor %}
-	{% if promember %}
-        {% for key, value in axchoicespro.items %}
-        {% if key not in noylist %}
-	<a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ plottype }}">{{ value }}</a>
-        {% endif %}
-        {% endfor %}
-	{% else %}
-        {% for key, value in axchoicespro.items %}
-        {% if key not in noylist %}
-	<a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
-        {% endif %}
-        {% endfor %}
-	{% endif %}
-        </div>
-        <div style="float: right; width:33%;">
-        {% if promember %}
-        {% for key, value in extrametrics.items %}
-        <a class="button orange small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ key }}/{{ yparam2 }}/{{ plottype }}">{{ value }}</a>
-        {% endfor %}
-        {% else %}
-        {% for key, value in extrametrics.items %}
-        <a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
-        {% endfor %}
-        {% endif %}
-        </div>
-      </div>
-    </div>
+<h1>Flexible Chart</h1>
     
-    <div id="right-y" class="grid_3 dropdown omega">
-      <button class="grid_2 alpha button blue small dropbtn">Right</button>
-      <div class="dropdown-content">
-      <div style="float: left; width:67%;">
-        {% for key, value in axchoicesbasic.items %}
-        {% if key not in noylist %}
-	<a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ plottype }}">{{ value }}</a>
-        {% endif %}
-        {% endfor %}
-	{% if promember %}
-        {% for key, value in axchoicespro.items %}
-        {% if key not in noylist %}
-	<a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ plottype }}">{{ value }}</a>
-        {% endif %}
-        {% endfor %}
-	{% else %}
-        {% for key, value in axchoicespro.items %}
-        {% if key not in noylist %}
-	<a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
-        {% endif %}
-        {% endfor %}
-	{% endif %}
-      </div>
-      <div style="float: right; width:33%;">
-        {% if promember %}
-        {% for key, value in extrametrics.items %}
-        <a class="button orange small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ yparam1 }}/{{ key }}/{{ plottype }}">{{ value }}</a>
-        {% endfor %}
-        {% else %}
-        {% for key, value in extrametrics.items %}
-        <a class="button rosy small" href="/rowers/promembership">{{ value }} (Pro)</a>
-        {% endfor %}
-        {% endif %}
-        </div>
-      </div>
+<ul class="main-content">
+  <li class="grid_4">
+    <div id="theplot">
+      {{ the_div|safe }}
     </div>
+  </li>
+  <li class="grid_2">
+    <form enctype="multipart/form-data"
+          action=""
+          method="post">
+      {% csrf_token %}
+      <table>
+        {{ chartform.as_table }}
+      </table>
+      <table>
+        {{ optionsform.as_table }}
+      </table>
+      <p>
+        <input name="chartform" class="button green" type="submit"
+               value="Submit">
+      </p>
+    </form>
+  </li>
     
-  </div>
-
-  <div id="y-axis" class="grid_3 omega">
-    <div class="grid_2 alpha tooltip">
-      <form enctype="multipart/form-data" action="{{ formloc }}" method="post">
-        {% csrf_token %}
-	{% if workstrokesonly %}
-	<input type="hidden" name="workstrokesonly" value="True">
-	<input class="grid_2 alpha button blue small" value="Remove Rest Strokes" type="Submit">
-	{% else %}
-	<input class="grid_2 alpha button blue small" type="hidden" name="workstrokesonly" value="False">
-	<input class="grid_2 alpha button blue small" value="Include Rest Strokes" type="Submit">
-	{% endif %}
-      </form>
-      <span class="tooltiptext">If your data source allows, this will show or hide strokes taken during rest intervals.</span>
-    </div>
-    <div class="grid_1 omega">
-      {% if plottype == 'scatter' %}
-      <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ yparam1 }}/{{ yparam2 }}/line">Line</a>
-    {% else %}
-      <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart/{{ xparam }}/{{ yparam1 }}/{{ yparam2 }}/scatter">Scatter</a>
-      {% endif %}
-    </div>
-  </div>
-
-</div>
-
-<div id="theplot" class="grid_12 alpha">
-
-
-  {{ the_div|safe }}
-
-</div>
-
-<div id="favorites" class="grid_12 alpha">
-  <div class="grid_2 suffix_4 alpha">
-    {% if maxfav >= 0 %}
-    <a class="button gray small" href="/rowers/me/favoritecharts">Manage Favorites</a>
-    {% else %}
-    &nbsp;
-    {% endif %}
-  </div>
-  <div class="grid_1">
-    {% if favoritenr > 0 %}
-    <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ favoritenr|add:-1 }}">&lt</a>
-    {% else %}
-    <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ maxfav }}">&lt</a>
-    {% endif %}
-  </div>
-  <div class="grid_2">
+  <li class="grid_2">
     <form enctype="multipart/form-data" action="{{ formloc }}" method="post">
+    {% if favoritenr > 0 %}
+    <a class="wh"
+       href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ favoritenr|add:-1 }}">
+      <i class="fas fa-arrow-alt-left"></i>
+    </a>
+    {% else %}
+    <a class="wh"
+       href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ maxfav }}">
+      <i class="fas fa-arrow-alt-left"></i>
+    </a>
+    {% endif %}
       {% csrf_token %}
       <input class="grid_2 alpha button blue small" type="hidden" name="savefavorite" value="True">
       {% if workstrokesonly %}
@@ -218,22 +66,28 @@
       {% else %}
       <input type="hidden" name="workstrokesonlysave" value="True">
       {% endif %}
-      <input class="grid_2 alpha button blue small" value="Make Favorite" type="Submit">
-    </form>
-  </div>
-  <div class="grid_1">
-  {% if favoritenr < maxfav %}
-  <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ favoritenr|add:1 }}">&gt</a>
+      <input value="Make Favorite" type="Submit">
+    {% if favoritenr < maxfav %}
+    <a class="wh"
+       href="/rowers/workout/{{ id }}/flexchart?favoritechart={{ favoritenr|add:1 }}">
+      <i class="fas fa-arrow-alt-right"></i>
+    </a>
     {% else %}
-  <a class="button blue small" href="/rowers/workout/{{ id }}/flexchart?favoritechart=0">&gt</a>
+    <a class="wh"
+       href="/rowers/workout/{{ id }}/flexchart?favoritechart=0">
+      <i class="fas fa-arrow-alt-right"></i>
+    </a>
     {% endif %}
-  </div>
-  {% if favoritechartnotes %}
-  <div class="grid_6 prefix_6 alpha">
+    </form>
+    {% if favoritechartnotes %}
     <p>Chart {{ favoritenr|add:1 }}:{{ favoritechartnotes }}</p>
-  </div>
-  {% endif %}
-</div>
+    {% endif %}
+  </li>
+</ul>
 
 {% endblock %}
 {% endlocaltime %}
+
+{% block sidebar %}
+{% include 'menu_workout.html' %}
+{% endblock %}
diff --git a/rowers/templates/panel_comments.html b/rowers/templates/panel_comments.html
index db1bd207..3250e4fd 100644
--- a/rowers/templates/panel_comments.html
+++ b/rowers/templates/panel_comments.html
@@ -22,11 +22,6 @@
           <a href="/rowers/workout/{{ workout.id }}/comment">Comment ({{ aantalcomments }})</a>
         </td>
         
-      </tr><tr>
-        <th>Public link to interactive chart</th>
-        <td>
-          <a href="/rowers/workout/{{ workout.id }}/interactiveplot">https://rowsandall.com/rowers/workout/{{ workout.id }}/interactiveplot</a>
-        <td>
       </tr>
     </table>
   </li>
diff --git a/rowers/views.py b/rowers/views.py
index 124c5414..b9b544ae 100644
--- a/rowers/views.py
+++ b/rowers/views.py
@@ -44,6 +44,7 @@ from rowers.forms import (
     PlannedSessionTeamForm,PlannedSessionTeamMemberForm,
     VirtualRaceSelectForm,WorkoutRaceSelectForm,CourseSelectForm,
     RaceResultFilterForm,PowerIntervalUpdateForm,FlexAxesForm,
+    FlexOptionsForm
     )
 from django.core.urlresolvers import reverse, reverse_lazy
 
@@ -8705,12 +8706,23 @@ def workout_flexchart3_view(request,*args,**kwargs):
             except KeyError:
                 messages.error(request,'We cannot save the ad hoc metrics in a favorite chart')
 
-    if request.method == 'POST' and 'workstrokesonly' in request.POST:
-	workstrokesonly = request.POST['workstrokesonly']
-	if workstrokesonly == 'True':
-	    workstrokesonly = True
-	else:
-	    workstrokesonly = False
+    if request.method == 'POST' and 'xaxis' in request.POST:
+        flexoptionsform = FlexOptionsForm(request.POST)
+        if flexoptionsform.is_valid():
+            cd = flexoptionsform.cleaned_data
+            includereststrokes = cd['includereststrokes']
+            plottype = cd['plottype']
+
+            workstrokesonly = not includereststrokes
+            
+        flexaxesform = FlexAxesForm(request,request.POST)
+    
+
+        if flexaxesform.is_valid():
+            cd = flexaxesform.cleaned_data
+            xparam = cd['xaxis']
+            yparam1 = cd['yaxis1']
+            yparam2 = cd['yaxis2']
 
     if not promember:
         for name,d in rowingmetrics:
@@ -8803,10 +8815,49 @@ def workout_flexchart3_view(request,*args,**kwargs):
         except KeyError:
             pass
 
+    initial = {
+        'xaxis':xparam,
+        'yaxis1':yparam1,
+        'yaxis2':yparam2
+    }
+    flexaxesform = FlexAxesForm(request,initial=initial)
+
+    initial = {
+        'includereststrokes': not workstrokesonly,
+        'plottype':plottype
+        }
+
+    flexoptionsform = FlexOptionsForm(initial=initial)
+
+    row = Workout.objects.get(id=id)
+
+    breadcrumbs = [
+            {
+                'url':'/rowers/list-workouts',
+                'name':'Workouts'
+                },
+            {
+                'url':get_workout_default_page(request,id),
+                'name': str(row.id)
+                },
+            {
+                'url':reverse(workout_flexchart3_view,kwargs=kwargs),
+                'name': 'Flex Chart'
+                }
+            
+            ]
+
+    
     return render(request,
 		  'flexchart3otw.html',
 		  {'the_script':script,
 		   'the_div':div,
+                   'breadcrumbs':breadcrumbs,
+                   'rower':r,
+                   'active':'nav-workouts',
+                   'workout':row,
+                   'chartform':flexaxesform,
+                   'optionsform':flexoptionsform,
 		   'js_res': js_resources,
 		   'css_res':css_resources,
 		   'teams':get_my_teams(request.user),