<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:tal="http://xml.zope.org/namespaces/tal"
    xmlns:metal="http://xml.zope.org/namespaces/metal"
    xmlns:i18n="http://xml.zope.org/namespaces/i18n"
    metal:use-macro="here/main_template/macros/master"
    i18n:domain="senaite.health">

  <head>
    <metal:block fill-slot="javascript_head_slot">
      <!-- Javascript that renders the D3js chart for historic results -->
      <script tal:define="js string:${portal_url}/++resource++bika.health.js"
              tal:attributes="src string:${js}/bika.health.historicresults.js"
              type="text/javascript"></script>
    </metal:block>

    <metal:block fill-slot="style_slot">
      <style>
        #chart {
          font-size:0.9em;
          overflow: hidden;
        }
        .chart-container {
        }
        .axis path,
        .axis line {
          fill: none;
          stroke: #000;
          shape-rendering: crispEdges;
        }
      </style>
    </metal:block>
  </head>

  <body>
    <metal:content-title fill-slot="content-title">
      <h1>
        <img tal:condition="view/icon | nothing"
             tal:attributes="src view/icon"/>
        <span class="documentFirstHeading" tal:content="view/title"/>
      </h1>
    </metal:content-title>

    <metal:block fill-slot="content-description">
      <div class="documentDescription"
           tal:condition="view/description"
           tal:content="structure view/description"></div>
    </metal:block>

    <metal:content-core fill-slot="content-core">

      <!-- Chart container -->
      <div class="chart-container">
          <div class="chart-options">
              <label for="interpolation">Interpolation</label>
              <select id="interpolation" name="interpolation">
                  <option value="linear" selected>linear</option>
                  <option value="basis">basis</option>
                  <option value="cardinal">cardinal</option>
              </select>
          </div>
          <div id="chart"></div>
      </div>

      <!-- Table of historic results -->
      <tal:historic_table define="dates python:view.get_dates()">
        <div tal:condition="python:len(dates)!=0">
          <table class=" table table-condensed small"
              tal:define="rows python:view.get_rows();
                          cols python:len(dates)+1;">
            <thead>
              <tr>
                <th i18n:translate="">Test</th>
                <tal:datecols repeat="date dates">
                  <th tal:content="python:date" class="center"/>
                </tal:datecols>
              </tr>
            </thead>

            <tbody class="item-listing-body">
              <!-- Group by sample types -->
              <tal:sampletypes repeat="row python:rows.itervalues()">
                <tr tal:define="sample_type python: row['object'];
                                sample_type_title python: sample_type.Title()">
                  <th tal:attributes="colspan python:cols;
                                      cat python:sample_type_title"
                      tal:content="python: sample_type_title"
                      class="cat_header expanded"/>
                </tr>

                <!-- Generate as many rows as analyses for this sample type -->
                <tal:analyses repeat="analysis python:row['analyses'].itervalues()">
                  <tr tal:attributes="cat python:row['object'].Title()">
                    <td>
                      <!-- Test code/keyword -->
                      <span class="small"
                            tal:content="python: analysis['keyword']"/>:&nbsp;
                      <!-- Test name -->
                      <span tal:content="python: analysis['title']"/>
                    </td>

                    <!-- Generate as many columns as dates -->
                    <tal:rowdates repeat="date dates">

                      <!-- There is an analysis with result for this date -->
                      <td tal:define="an_date python: analysis.get(date, {})"
                          tal:condition="python: an_date">

                        <!-- Link to Sample ID -->
                        <div class="row">
                          <div class="col-md-4">
                            <a class="small"
                               tal:define="an_obj python: an_date['object'];
                                           sample python: an_obj.aq_parent;"
                               tal:attributes="href python: sample.absolute_url()"
                               tal:content="python: sample.id"/>
                          </div>

                          <!-- Result -->
                          <div class="col-md-8">
                            <span tal:define="result python: an_date.get('formattedresult', '')"
                                  tal:content="structure result"/>
                            <!-- Units -->
                            <span
                                tal:define="units python: analysis['units']"
                                tal:condition="units"
                                tal:content="structure python: ' {}'.format(units)"/>
                          </div>
                        </div>
                      </td>

                      <!-- There is no analysis with result for this date -->
                      <td tal:define="an_date python: analysis.get(date, {})"
                          tal:condition="python: not an_date"/>

                    </tal:rowdates>
                  </tr>
                </tal:analyses>
              </tal:sampletypes>
            </tbody>
          </table>
        </div>
        <div tal:condition="python:len(dates)==0">
          <dl class="portalMessage">
              <dd i18n:translate="">No historic results found</dd>
          </dl>
        </div>
      </tal:historic_table>
    </metal:content-core>
  </body>
</html>
