{% extends "base.html" %}
{% load staticfiles %}
{% load rowerfilters %}

{% block title %}View Workout {% endblock %}

{% block content %}

	<script type="text/javascript" src="/static/js/bokeh-0.12.3.min.js"></script>
	<script async="true" type="text/javascript">
    Bokeh.set_log_level("info");
	</script>

	{{ interactiveplot |safe }}

    <script>
    // Set things up to resize the plot on a window resize. You can play with
    // the arguments of resize_width_height() to change the plot's behavior.
    var plot_resize_setup = function () {
        var plotid = Object.keys(Bokeh.index)[0]; // assume we have just one plot
        var plot = Bokeh.index[plotid];
        var plotresizer = function() {
            // arguments: use width, use height, maintain aspect ratio
            plot.resize_width_height(true, false, false);
        };
        window.addEventListener('resize', plotresizer);
        plotresizer();
    };
    window.addEventListener('load', plot_resize_setup);
    </script>
    <style>
    /* Need this to get the page in "desktop mode"; not having an infinite height.*/
    html, body {height: 100%; margin:5px;}
    </style>


<div id="workouts" class="grid_12 alpha">


	<h1>Interactive Plot</h1>

	{% if user.is_authenticated and mayedit %}
	<div class="grid_2 alpha">
	<p>
	<a class="button gray small" href="/rowers/workout/{{ workout.id }}/edit">Edit Workout</a>
</p>
	</div>
	<div class="grid_2">
	<p>
	<a class="button gray small" href="/rowers/workout/{{ workout.id }}/advanced">Advanced Edit</a>
</p>

	</div>
	<div class="grid_2">
	<a class="button blue small" href="/rowers/workout/{{ workout.id }}/wind">Edit Wind Data</a>
	</div>
	<div class="grid_2">
	<a class="button blue small" href="/rowers/workout/{{ workout.id }}/stream">Edit Stream Data</a>
	</div>
	<div class="grid_2">
	<a class="button blue small" href="/rowers/workout/{{ workout.id }}/otwsetpower">OTW Power</a>
	</div>
	{% endif %}
</div>
<div id="theplot" class="grid_12 alpha flexplot">

    {{ the_div|safe }}
	</div>

	<div class="grid_12">
<p>
<h3>Notes</h3>
 <ul>
	<li>Is your erg pace slower than you expected? This may be a sign of room for improvement regarding your technique. An alternative explanation is that your team mates are fatter than they told you! For example, put 80.0 kg if your four consists of 2 70kg guys and 2 90kg guys.</li>
	<li>In order to speed up the calculation, we are running the calculation only for every 10th datapoint, using interpolation in between. Some very fine pace shifts may disappear.</li>
	<li>While the wind and stream correction is fairly reliable, the OTW to OTE conversion sometimes throws errors. Those data points are omitted and replaced by interpolated values. We are sorry if this messed up some of your plots.</li>
	<li>Read more details about the way we calculate things <a href="/rowers/physics"</a>here</a>.</li>
 </ul>
</p>

</div>

{% endblock %}