{% extends 'base.html' %}
{% load static from staticfiles %}

{% block content %}
<div class="row">
  <div class="col-xs-12">
    <div class="col-xs-1"><h2><i class="glyphicon glyphicon-{% if result.status_check.polymorphic_ctype.model == 'graphitestatuscheck' %}signal{% elif result.status_check.polymorphic_ctype.model == 'httpstatuscheck' %}arrow-up{% elif result.status_check.polymorphic_ctype.model == 'jenkinsstatuscheck' %}ok{% endif %}"></i></h2></div>
    <div class="col-xs-9">
      <h2>Check result: <a href="{% url "check" result.status_check.id %}">{{ result.status_check.name }}</a></h2>
    </div>
    <div class="col-xs-2 text-right"><h2><span class="label label-{% if result.succeeded %}success{% else %}danger{% endif %}">{{ result.status|capfirst }}</span></h2></div>
  </div>
  <div class="col-xs-12">
    <table class="table table-striped table-bordered">
      <tbody>
        <tr><th>Name</th><td>{{ result.status_check.name }}</td></tr>

        <tr><th>Status</th><td>{{ result.status|capfirst }}</td></tr>
        <tr><th>Time started</th><td>{{ result.time }}</td></tr>
        <tr><th>Time complete</th><td>{{ result.time_complete }}</td></tr>
        <tr><th>Took</th><td>{{ result.took }}ms</td></tr>
        <tr><th>Error</th><td>{{ result.error }}</td></tr>
        <tr><th>Raw data</th><td><div id="graph" style="height: 200px; width:100%;"></div><pre>{{ result.raw_data }}</pre></td></tr>
      </tbody>
    </table>
  </div>
</div>

{% endblock %}

{% block js %}
{% load compress %}
{{ block.super }}
<script type="text/javascript">
try {
  window.DATA = JSON.parse("{{ result.raw_data|escapejs }}");
} catch (e) {
  window.DATA = {};
}
</script>
{% compress js %}
<script type="text/javascript" src="{% static 'arachnys/js/raphael.js' %}"></script>
<script type="text/coffeescript">
kvs = []
labels = []
for series in window.DATA
  label = series.target
  labels.push label
  for point in series.datapoints
    tmp = {}
    tmp['time'] = point[1]*1000
    tmp[label] = point[0]
    kvs.push tmp

Morris.Line
  element: 'graph'
  data: kvs
  xkey: 'time'
  ykeys: labels
  labels: (label[0..20] for label in labels)
  hideHover: true
</script>
{% endcompress %}
{% endblock js %}
