{% extends "newbase.html" %}
{% load static %}
{% load rowerfilters %}

{% block scripts %}
{% include "monitorjobs.html" %}
{% endblock %}

{% block title %}Workouts{% endblock %}

{% block main %}

<script src="https://cdn.pydata.org/bokeh/release/bokeh-3.1.1.min.js"></script>
<script async="true" type="text/javascript">
  Bokeh.set_log_level("info");
</script>

{{ interactiveplot |safe }}

{% if theuser %}
<h1>{{ theuser.first_name }}'s Ranking Pieces</h1>
{% else %}
<h1>{{ user.first_name }}'s Ranking Pieces</h1>
{% endif %}

<ul class="main-content">
  <li class="grid_2">
    <p>Summary for {{ theuser.first_name }} {{ theuser.last_name }}
      between {{ startdate|date }} and {{ enddate|date }}</p>

    <p>The table gives the efforts you marked as Ranking Piece.
      The graph shows the best segments from those pieces, plotted as
      average power (over the segment) vs the duration of the segment/
      In other words: How long you can hold that power.
    </p>

    <p>Whenever you load or reload the page, a new calculation is started
      as a background process. The page will reload automatically when the
      calculation is ready.
    </p>

    <p>At the bottom of the page, you will find predictions derived from the model.</p>
  </li>
  <li class="grid_2">
    <p>
      Select start and end date for a date range:
      <form enctype="multipart/form-data" action="" method="post">

        <table>
          {{ dateform.as_table }}
        </table>
        <h2>Pieces used for predictions</h2>
        <table>
          {{ form.as_table }}
        </table>
        <h2>Workout Type</h2>
        <table>
          {{ workouttypeform.as_p }}
        </table>
        {% csrf_token %}
        <input name='daterange' class="button green" type="submit" value="Submit">
      </form>
  </li>
  <li class="grid_4">

    <h2>Critical Power Plot</h2>

    {{ the_div|safe }}

  </li>

  <li class="grid_2">

    <h2>Ranking Piece Results</h2>

    {% if rankingworkouts %}

    <table width="100%" class="listtable">
      <thead>
	<tr>
	  <th> Distance</th>
	  <th> Duration</th>
	  <th> Avg Power</th>
	  <th> Date</th>
	  <th> Avg HR </th>
	  <th> Max HR </th>
	  <th> Edit</th>
	<tr>
      </thead>
      <tbody>
	{% for workout in rankingworkouts %}
	<tr>
	  <td> {{ workout.distance }} m</td>
	  <td> {{ workout.duration |durationprint:"%H:%M:%S.%f" }} </td>
          <td> {{ avgpower|lookup:workout.id }} W</td>
	  <td> {{ workout.date }} </td>
	  <td> {{ workout.averagehr }} </td>
	  <td> {{ workout.maxhr }} </td>
	  <td> 
	    <a href="/rowers/workout/{{ workout.id|encode }}/edit/">{{ workout.name }}</a> </td>
          
	</tr>
	
	{% endfor %}
      </tbody>
    </table>
    {% else %}
    <p> No ranking workouts found </p>
    {% endif %}

  </li>

  <li class="grid_2">
    <h2>Pace predictions for Ranking Pieces</h2>

    <table width="100%" class="listtable">
      <thead>
        <tr>
	  <th> Duration</th>
          <th> Distance</th>
	  <th> Pace (upper)</th>
	  <th> Power &nbsp;&nbsp;&nbsp;</th>
	  <th> Power (upper)</th>
        <tr>
      </thead>
      <tbody>
        {% for pred in cpredictions %}
        <tr>
	  {% for key, value in pred.items %}
	  {% if key == "power" or key == "upper" %}
	  <td> {{ value }} W </td>
	  {% endif %}
	  {% if key == "duration" %}
	  <td> {{ value |deltatimeprint }} </td>
	  {% endif %}
          {% if key == "distance" %}
          <td> {{ value }} m </td>
          {% endif %}
          {% if key == 'pace' %}
          <td> {{ value|paceprint }}</td>
          {% endif %}
	  {% endfor %}
        </tr>
        {% endfor %}
      </tbody>
    </table>
  
  </li>
  


</ul>

{% endblock %}

{% block sidebar %}
{% include 'menu_analytics.html' %}
{% endblock %}