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

{% block title %}Rowsandall {% endblock %}

{% block main %}
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
  $(function() {
  
  // Get the form fields and hidden div
  var modality = $("#id_modality");
  var hidden = $("#id_waterboattype");

  
  // Hide the fields.
  // Use JS to do this in case the user doesn't have JS 
  // enabled.

  hidden.hide();
  
  if (modality.val() == 'water') {
  hidden.show();
  }

  
  // Setup an event listener for when the state of the 
  // checkbox changes.
  modality.change(function() {
    // Check to see if the checkbox is checked.
    // If it is, show the fields and populate the input.
  // If not, hide the fields.
    var Value = modality.val();
    if (Value=='water') {
  // Show the hidden fields.
  hidden.show();
  } else {
  // Make sure that the hidden fields are indeed
  // hidden.
  hidden.hide();
      
      // You may also want to clear the value of the 
      // hidden fields here. Just in case somebody 
      // shows the fields, enters data to them and then 
      // unticks the checkbox.
      //
      // This would do the job:
      //
      // $("#hidden_field").val("");
    }
  });


  });



</script>


<div id="id_css_res">
    <link rel="stylesheet" href="https://cdn.pydata.org/bokeh/release/bokeh-1.0.4.min.css" type="text/css" />
    <link rel="stylesheet" href="https://cdn.pydata.org/bokeh/release/bokeh-widgets-1.0.4.min.css" type="text/css" />
</div>
<div id="id_js_res">
  <script src="https://cdn.pydata.org/bokeh/release/bokeh-1.0.4.min.js"></script>
  <script src="https://cdn.pydata.org/bokeh/release/bokeh-widgets-1.0.4.min.js"></script>

</div>

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>


<div id="id_script">

</div>

<ul class="main-content">
  <li>
    <form enctype="multipart/form-data" action="{{ formloc }}" method="post">
      <table>
        {{ optionsform.as_table }}
      </table>
      <input type="hidden" name="options" value="options">
  </li>
  <li>
    <table>
      {{ form.as_table }}
    </table>
  </li>
  <li>
    {% csrf_token %}
    <input class="button green small" value="Submit" type="Submit">
  </form>
  </li>

  <li class="grid_4">
    <p>Summary for {{ theuser.first_name }} {{ theuser.last_name }}
      between {{ startdate|date }} and {{ enddate|date }}</p>
  </li>

  <li class="grid_4">
    {% if stats %}
  <h2>Statistics</h2>
  <table width="100%" class="listtable">
    <thead>
      <tr>
        <th>Metric</th>
        <th>Mean</th>
        <th>Minimum</th>
        <th>25&#37;</th>
        <th>Median</th>
        <th>75&#37;</th>
        <th>Maximum</th>
        <th>Standard Deviation</th>
      </tr>
    </thead>
    <tbody>
      {% for key, value in stats.items %}
      <tr>
        <td>{{ value.verbosename }}</td>
        <td>{{ value.mean|floatformat:-2 }}</td>
        <td>{{ value.min|floatformat:-2 }}</td>
        <td>{{ value.firstq|floatformat:-2 }}</td>
        <td>{{ value.median|floatformat:-2 }}</td>
        <td>{{ value.thirdq|floatformat:-2 }}</td>
        <td>{{ value.max|floatformat:-2 }}</td>
        <td>{{ value.std|floatformat:-2 }}</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>  

    {% endif %}
  </li>
  <li class="grid_4">
    {% if cordict %}
    <h2> Correlation matrix</h2>
    <p>This matrix indicates a positive (+) or negative (-) correlation between two parameters. The Spearman correlation coefficient has values between +1 and -1. Positive correlation between two metrics means that if one metric increases, the other value is also likely to increase. Negative is the opposite. The further from zero, the higher the likelyhood.
  </p>
    <table width="90%" class="cortable">
      <thead>
        <tr>
          <th>&nbsp;</th>
          {% for key,value in cordict.items %}
          <th class="rotate"><div><span>{{ key }}</span></div></th>
          {% endfor %}
        </tr>
      </thead>
      <tbody>
        {% for key, thedict in cordict.items %}
      <tr>
        <th> {{ key }}</th>
        {% for key2,value in thedict.items %}
        <td>
          {% if value > 0.5 %}
          <div class="poscor">{{ value|floatformat:-1 }}</div>
          {% elif value > 0.1 %}
          <div class="weakposcor">{{ value|floatformat:-1 }}</div>
          {% elif value < -0.5 %}
                          <div class="negcor">{{ value|floatformat:-1 }}</div>
                          {% elif value < -0.1 %}
                                          <div class="weaknegcor">{{ value|floatformat:-1 }}</div>
                                          {% else %}
          &nbsp;
                                          {% endif %}
        </td>
        {% endfor %}
      </tr>
      {% endfor %}
      </tbody>
    </table>  
  
  {% endif %}

  </li>
</ul>

{% endblock %}


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