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

{% block title %} Force Curve Plot {% endblock %}

{% localtime on %}
{% block main %}

<script src="https://d3js.org/d3.v6.js"></script>


<h1>Empower Force Curve</h1>

<ul class="main-content">
  <canvas hidden id="canvas"></canvas>
  <li class="grid_4">
    <div id="theplot" class="flexplot">
      {{ the_div|safe }}
      {{ the_script |safe }}
    </div>

  </li>
  <li class="grid_4">
    <form enctype="multipart/form-data"  action="" method="post">
      {% csrf_token %}
      <table>
	{{ form.as_table }}
	</table>
      <div class="buttoncontainer">
        <input name="chartform" type="submit" class="button"
               value="Update Chart">
        <input name='_save' class="button" type="submit" value="Save">
        <input name='_save_as_new' class="button" type="submit" value="Save as New">
        <p>
          With the Save buttons, you can save your analysis for future use and to compare
          multiple analyses to each other. You can find the saved analyses under the Analysis
          tab (<a href="/rowers/analysis/forcecurveanalysis/">force curve analysis</a>).
        </p>
      </div>
    </form>
  </li>
</ul>

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script>
      $(document).ready(function() {
	  var label = $('label[for="' + $("#id_plotcircles").attr('id') + '"]');
	  label.attr("class", "hidden")
	  var label2 = $('label[for="' + $("#id_plotlines").attr('id') + '"]');
	  label2.attr("class", "hidden")
	  var label3 = $('label[for="' + $("#id_includereststrokes").attr('id') + '"]');
	  label3.attr("class", "hidden")

        });
    </script>

{% endblock %}
{% endlocaltime %}

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