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

{% block meta %}
{% leaflet_js %}
{% leaflet_css %}
{% endblock %}
{% load tz %}


{% get_current_timezone as TIME_ZONE %}

{% block title %}{{ workout.name }}{% endblock %}
{% block og_title %}{{ workout.name }}{% endblock %}
{% block description %}{{ workout.name }}
{{ workout.date }} - {{ workout.distance }}m - {{ workout.duration |durationprint:"%H:%M:%S.%f" }}{% endblock %}
{% block og_description %}{{ workout.name }}
{{ workout.date }} - {{ workout.distance }}m - {{ workout.duration |durationprint:"%H:%M:%S.%f" }}{% endblock %}

{% block scripts %}
{% include "monitorjobs.html" %}
<script type='text/javascript'
        src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js'>
</script>
<script type='test/javascript' src='/static/js/boattypes.js'></script>
<script>
  $( document ).ready(function() {
      var boattypes = {
	  '1x': '1x (single)',
	  '2x': '2x (double)',
	  '2x+': '2x+ (coxed double)',
	  '2-': '2- (pair)',
	  '2+': '2+ (coxed pair)',
	  '3x+': '3x+ (coxed triple)',
	  '3x-': '3x- (triple)',
	  '4x': '4x (quad)',
	  '4x+': '4x+ (coxed quad)',
	  '4-': '4- (four)',
	  '4+': '4+ (coxed four)',
	  '8+': '8+ (eight)',
	  '8x+': '8x+ (octuple scull)',
      }
      
      var ergtypes = {
	  'static': 'Concept2 static',
	  'dynamic': 'Concept2 dynamic',
	  'slides': 'Concept2 slides',
	  'rp3': 'RP3',
	  'waterrower': 'Water Rower',
	  'other': 'Other Indoor Rower',	  
      }

      $('#id_workouttype').on('change', function(){
          if (
              $(this).val() == 'water'
		  || $(this).val() == 'coastal'
		  || $(this).val() == 'c-boat'
		  || $(this).val() == 'churchboat'
          ) {
              var $el = $('#id_boattype');
	      $el.empty();
	      $.each(boattypes, function(key,value) {
		  if ( key == '{{ workout.boattype }}') {
		      $el.append($("<option></option").attr("value", key).attr("selected", "selected").text(value));
		  } else {
		      $el.append($("<option></option").attr("value", key).text(value));
		  }
	      });
	      $el.toggle(true);
	      
          }
	  else if (
	      $(this).val() == 'rower'
	  ) {
              var $el = $('#id_boattype');
	      $el.empty();
	      $.each(ergtypes, function(key,value) {
		  if ( key == '{{ workout.boattype }}') {
		      $el.append($("<option></option").attr("value", key).attr("selected", "selected").text(value));
		  } else {
		      $el.append($("<option></option").attr("value", key).text(value));
		  }
	      });
	      $el.toggle(true);	    
	  }
	  else {
              $('#id_boattype').toggle(false);
              $('#id_boattype').val('1x');
	  }
	  if (
              $(this).val() == 'rower'
		  || $(this).val() == 'dynamic'
		  || $(this).val() == 'slides'
	  ) {
              $('#id_dragfactor').toggle(true);
	  } else {
              $('#id_dragfactor').toggle(false);
              $('#id_dragfactor').val('0');
	  }
	  
      });
      $('#id_workouttype').change();
  });
  </script>
{% endblock %}

{% block main %}

<p>
  {% if workout|previousworkout:rower.user %}
  <a href="/rowers/workout/{{ workout|previousworkout:rower.user }}/edit/"
     title="Jump to preceding workout"><em>Previous</em></a>&nbsp;
  {% endif %}
  {% if workout|nextworkout:rower.user %}
  <a href="/rowers/workout/{{ workout|nextworkout:rower.user }}/edit/"
     title="Jump to following workout"><em>Next</em></a>
  {% endif %}
</p>

<h1>Edit Workout {{ workout.name }}</h1>
<ul class="main-content">
  <li class="grid_4">
    <p>
      <div class="fb-share-button"
           data-href="https://rowsandall.com/rowers/workout/{{ workout.id|encode }}/"
           data-layout="button" data-size="small" data-mobile-iframe="false">
        <a class="fb-xfbml-parse-ignore" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://rowsandall.com/rowers/workout/{{ workout.id|encode }}">Share</a>
      </div>
    </p>
    <p>
      <a class="twitter-share-button"
         href="https://twitter.com/intent/tweet"
         data-url="https://rowsandall.com/rowers/workout/{{ workout.id|encode }}/"
         data-text="@rowsandall #rowingdata">Tweet</a>
    </p>
    <table width=100%>
      <tr>
        {% localtime on %}
        {% if workout.user.user != user %}
        <th>Rower:</th><td>{{ rower.user.first_name }} {{ rower.user.last_name }}</td>
      </tr><tr>
        {% endif %}
        <th>Date/Time:</th><td>{{ workout.startdatetime|localtime}}</td>
        {% endlocaltime %}
      </tr><tr>
        <th>Distance:</th><td>{{ workout.distance }}m</td>
      </tr><tr>
        <th>Duration:</th><td>{{ workout.duration |durationprint:"%H:%M:%S.%f" }}</td>
      </tr><tr>
        <th>Source:</th><td>{{ workout.workoutsource }}</td>
      </tr>
      {% if workout.privacy != 'hidden' %}
      <tr>
        <th>Public link to this workout:</th>
        <td>
	  <a href="/rowers/workout/{{ workout.id|encode }}/">https://rowsandall.com/rowers/workout/{{ workout.id|encode }}/</a>
        </td>
      </tr>
      {% endif %}
      {% for course in courses %}
      <tr>
	<th>
	  Timed Course:
	</th>
	<td>
	  <a href="/rowers/courses/{{ course.id }}"/>{{ course }}</a>
</td>
</tr>
{% endfor %}
</table>
</li>
<li class="grid_2">
    {% if form.errors %}
    <p style="color: red;">
      Please correct the error{{ form.errors|pluralize }} below.
    </p>
    {% endif %}


    <form id="importantform"
          enctype="multipart/form-data" action="" method="post">
      <table width=100%>
        {{ form.as_table }}
      </table>
      {% csrf_token %}
      <input type="submit" value="Save">
    </form>
  </li>
  <li class="grid_2">

    <h1>Workout Summary</h1>

    <p>
      <pre>
        {{ workout.summary }}
      </pre>
    </p>
  </li>
  {% if indoorraces %}
  <li class="grid_4">
    <h1>Racing</h1>
    {% for race in indoorraces %}
    <p>
      <a href="/rowers/virtualevent/{{ race.id }}/submit/{{ workout.id|encode }}/">Submit this to Indoor Challenge {{ race.name }}</a>
    </p>
    {% endfor %}
  </li>
  {% endif %}
  {% if mapdiv %}
  <li class="grid_2">
    <div class="mapdiv">
    {{ mapdiv|safe }}
    {{ mapscript|safe }}
    </div>
  </li>
  {% endif %}
  {% if suggested_courses %}
<li>
  <h2>Suggested Measured Courses</h2>
  {% for course in suggested_courses %}
  <p>
    {{ course }}
    <br /><a href="/rowers/courses/{{ course.id }}/workout/{{ workout.id|encode }}/" target="_">See course</a>
    <br /><a href="/rowers/workout/{{ workout.id|encode }}/submit/{{ course.id }}/">Measure time on course</a>
  </p>
  {% endfor %}
</li>
{% endif %}
  {% for graph in graphs %}
  <li>
    <a href="/rowers/graph/{{ graph.id }}/">
    <img src="/{{ graph.filename }}"
	 onerror="this.src='/static/img/rowingtimer.gif'"
	 alt="{{ graph.filename }}" width="120" height="100">
    </a>
  </li>
  {% endfor %}
	{% for video in videos %}
	<li>
		<div>{{ video.name }}</div>
		<a href="/rowers/video/{{ video.id|encode }}/">
			<img src="https://img.youtube.com/vi/{{ video.video_id }}/hqdefault.jpg"/>
		</a>
	</li>
	{% endfor %}
</ul>

{% endblock %}

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