<html>
<head>
  <title>Fioul</title>
  <link rel="stylesheet" href="/static/classless.css">
  <link rel="stylesheet" href="/static/fioul.css">
  <link rel="icon" type="image/png" href="/static/favicon.png" />
  <script src="/static/plotly-2.12.1.min.js"></script>
</head>
<body>
  <h1>Prix du m³ de fioul pour Languidic</h1>
  <table id="results" class="u-full-width">
    % for x in results:
   <tr class="{{day_classes[x.date.weekday()]}}">
     <td>{{x.date.strftime('%A')}}</td>
     <td>{{x.date.strftime('%d %b %Y')}}</td>
     <td>{{x.price}}</td>
   </tr>
    % end
  </table>
  <div id="price-plot"></div>
  <script>
    var plotDiv = document.getElementById('price-plot');
    var plotData = [{
      x: {{ [str(d.date) for d in results] }},
      y: {{ [d.price for d in results] }},
      type: 'scatter',
    }];
    var plotLayout = {
      margin: { t: 0 }
    };
    var plotConfig = {
      responsive: true,
      displaylogo: false,
    };
	  Plotly.newPlot(
      plotDiv,
      plotData,
      plotLayout,
      plotConfig,
    );
  </script>
</body>
</html>
