senaduka/old-spike
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

create irradiance composite graph

Browse Source
This commit is contained in:
Eric Hulburd
2016-03-11 17:38:03 -06:00
parent 2dd9389694
commit 782f5cbf91
32 changed files with 824 additions and 379 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
client/dashboard/layout/layout.rt
View File

@@ -1,4 +1,5 @@
<rt-require dependency="./../energy/energy.component" as="Energy"/>
<rt-require dependency="./../irradiance/irradiance.component" as="Irradiance"/>
<rt-require dependency="./../power/power.component" as="Power"/>
<div id="layout">
<div rt-if="!this.house" id="about">
@@ -9,7 +10,7 @@
<ul>
<li>React</li>
<li>React Templates</li>
<li>React Router</li>
<li>ReactJs History</li>
<li>LokiJs - persisting API calls to indexedDb</li>
<li>Webpack - hot mode developing and app bundling</li>
<li>Babel - ES6 transpiler</li>
@@ -22,15 +23,23 @@
<div class="alert alert-warning" rt-if="this.state.loading_houses">Retrieving houses...</div>
<h4>Select household:</h4>
<select id="houses_select" rt-if="this.state.houses && this.state_manager" class="form-control" onChange="{this.setHouse.bind(this)}" value="{this.house_id}">
<option rt-repeat="house in this.state.houses" value="{house.data.id}" key="{house.scoped_id}">{house.data.name}</option>
</select>
<div rt-if="this.dataset !== 'irradiance'">
<h4>Select household:</h4>
<select id="houses_select" rt-if="this.state.houses && this.state_manager" class="form-control" onChange="{this.setHouse.bind(this)}" value="{this.house_id}">
<option rt-repeat="house in this.state.houses" value="{house.data.id}" key="{house.scoped_id}">{house.data.name}</option>
</select>
</div>
<button rt-if="this.house" onClick="{this.refreshData.bind(this)}" class="btn btn-xs btn-default">Refresh House Data</button>
<div rt-if="this.house">
<div>
<h4>Select dataset:</h4>
<div class="btn-group" role="group">
<button
data-param="dataset"
data-value="power"
rt-class="{active: this.state.dataset === 'power'}"
onClick="{this.setParam.bind(this)}"
type="button" class="btn btn-primary">15-minute Power Statistics</button>
<button
data-param="dataset"
data-value="energy"
@@ -39,10 +48,10 @@
type="button" class="btn btn-primary">Daily Energy Statistics</button>
<button
data-param="dataset"
data-value="power"
rt-class="{active: this.state.dataset === 'power'}"
data-value="irradiance"
rt-class="{active: this.state.dataset === 'irradiance'}"
onClick="{this.setParam.bind(this)}"
type="button" class="btn btn-primary">15-minute Power Statistics</button>
type="button" class="btn btn-primary">Daily Mean Irradiance</button>
</div>
<h4>View as:</h4>
@@ -72,26 +81,44 @@
class="btn-info btn btn-sm"
rt-class="{active: year == this.state.year}"
onClick="{this.setParam.bind(this)}">{year}</button>
</div><br/>
<div class="btn-group" rt-if="this.state.dataset === 'power' || this.state.dataset === 'irradiance'">
<button
rt-repeat="month in this.house.availableMonths(this.state.year)"
data-param="month"
data-value="{month}"
key="data-month-{month}"
class="btn-warning btn btn-sm"
rt-class="{active: month === this.state.month}"
onClick="{this.setParam.bind(this)}">{month}</button>
</div><br/>
<div id="date_interval"></div>
<div class="alert alert-warning" rt-if="this.state.loading_data">
Retrieving {this.state.loading_data} data...
</div>
</div><br/>
<Energy
rt-if="this.should_show_energy_data"
house="{this.state.house}"
loading_energy_data="{this.state.loading_energy_data}"
state_manager="{this.state_manager}"
view="{this.state.view}"
graph_attr="{this.state.graph_attr}"
year="{this.state.year}" />
<Irradiance
rt-if="this.state.dataset === 'irradiance'"
view="{this.state.view}"
date_interval="{this.state.date_interval}"
state_manager="{this.state_manager}" />
<Power
rt-if="this.should_show_power_data"
house="{this.state.house}"
loading_power_data="{this.state.loading_power_data}"
state_manager="{this.state_manager}"
view="{this.state.view}"
month="{this.state.month}"
year="{this.state.year}"
power_range="{this.state.power_range}" />
date_interval="{this.state.date_interval}" />
</div>
</div>