{% extends "base.html" %}

{% block title %}
	Sites &raquo; {{site.code}} {{site.name}} &raquo; HH data
{% endblock %}

{% block nav %}
	&raquo; <a href="/sites">Sites</a> &raquo;
	<a href="/sites/{{site.id}}">
	{{site.code}} {{site.name}}</a> &raquo; HH data
{% endblock %}

{% block content %}
	<!-- Layer Section -->
	<div class="layer-section">
		<!-- Section Header -->
		<div class="section-header">
			<h2>Show data</h2>	
		</div>
		<!-- End Section Header -->
		<!-- Section Content -->
		<div class="section-content">
			<div class="section-data">
				<form>
					<fieldset>						
						<label>Site Code </label>
						{{input_text('site_code', site.code)}}
						<label>Month</label>
						{{input_date(None, None, 'month')}}
						<input type="submit" value="Show">
					</fieldset>
				</form>
			</div>
			<div class="section-data">
				<table class="etheling etheling_sticky">
						<caption>HH Data</caption>
					<thead>
						<tr>
							<th>HH Starting</th>
							<th>Imported kWh</th>
							<th>Used kWh</th>
							<th>Displaced kWh</th>
							<th>Generated kWh</th>
							<th>Exported kWh</th>
							<th>Parasitic kWh</th>
							{% for supply in supplies %}
								{% set pref = supply.name + ' '+ supply.source.code +
								(' ' + supply.generator_type.code if
								supply.generator_type != None else '') %}
								<th style="border-left-width: medium;">{{pref}} Imp kWh</th>
								<th>{{pref}} Imp Status</th>
								<th>{{pref}} Exp kWh</th>
								<th>{{pref}} Exp Status</th>
							{% endfor %}
						</tr>
					</thead>
					<tbody>
						{% for hh in hh_data %}
							<tr>
								<td style="white-space: nowrap">{{hh.start_date|hh_format}}</td>
								<td>{{hh.import_kwh}}</td>
								<td>{{hh.used_kwh}}</td>
								<td>{{hh.displaced_kwh}}</td>
								<td>{{hh.generated_kwh}}</td>
								<td>{{hh.export_kwh}}</td>
								<td>{{hh.parasitic_kwh}}</td>
								{% for datum in hh.supplies %}
									<td style="border-left-width: medium;"
										>{{datum.import_kwh}}</td>
									<td>{{datum.import_status}}</td>
									<td>{{datum.export_kwh}}</td>
									<td>{{datum.export_status}}</td>
								{% endfor %}
							</tr>
						{% endfor %}
					</tbody>
				</table>
			</div>
		</div>
		<!-- End Section Content -->
	</div>
	<!-- End Layer Section -->                                      
{% endblock %}
