+
diff --git a/client/dashboard/layout/layout.component.js b/client/dashboard/layout/layout.component.js
index 502afb5..a7ccaba 100644
--- a/client/dashboard/layout/layout.component.js
+++ b/client/dashboard/layout/layout.component.js
@@ -12,8 +12,13 @@ class LayoutComponent extends React.Component {
this.state = {
houses: null,
house: null,
- requesting_data: true
+ loading_house_data: true
};
+ this.updates = 0
+ }
+
+ get house(){
+ return this.props.location.state && this.props.location.state.house;
}
componentDidMount() {
@@ -22,30 +27,34 @@ class LayoutComponent extends React.Component {
var house = null;
if (layout.props.params.house_id != undefined){
house = houses.find((h)=>{ return h.data.id == layout.props.params.house_id; });
- var route_helper = new RouteHelper(house, layout.props);
- if (route_helper.paramsHaveDateState()) route_helper.updateHouseToParams();
}
layout.setState({
houses: houses,
- requesting_data: false,
- house: house });
+ loading_house_data: false
+ }, ()=>{
+ if (house){
+ var route_helper = new RouteHelper(layout.context.router, layout.props, {house: house});
+ route_helper.updateRoute();
+ }
+ });
});
}
+ componentDidUpdate(){
+ var layout = this;
+
+ this.updates += 1;
+ console.log(this.updates, ') LayoutComponent#componentDidUpdate');
+ }
+
setHouse(event){
var layout = this,
- house_id = event.target.value,
- old_house = layout.state.house,
- house = layout.state.houses.find((house)=>{ return house.data.id == house_id });
- if (!old_house || old_house.id != house_id){
- var route_helper = new RouteHelper(house, layout.props);
- route_helper.updateHouseToParams();
- layout.setState({house: house}, ()=>{
- if (layout.renders < 10){
- layout.context.router.push(route_helper.newRoute());
- layout.renders += 1
- }
- if (old_house) old_house.closeDb();
+ house_id = event.target.value;
+ if (!layout.house || layout.house.id != house_id){
+ House.ensureHouses().then((houses)=>{
+ var new_house = houses.find((h)=>{ return h.data.id == house_id }),
+ route_helper = new RouteHelper(layout.context.router, layout.props, {house: new_house});
+ route_helper.updateRoute();
});
}
}
@@ -63,11 +72,6 @@ class LayoutComponent extends React.Component {
});
}
- getChildContext(){
- var layout = this;
- return {house: layout.state.house};
- }
-
render() {
var layoutRt = Templates.forComponent('layout');
return layoutRt.call(this);
@@ -78,7 +82,4 @@ LayoutComponent.contextTypes = {
router: React.PropTypes.object.isRequired
};
-LayoutComponent.childContextTypes = {
- house: React.PropTypes.instanceOf(House)
-};
export default LayoutComponent;
diff --git a/client/dashboard/layout/layout.rt b/client/dashboard/layout/layout.rt
index 68578d2..1c81e6d 100644
--- a/client/dashboard/layout/layout.rt
+++ b/client/dashboard/layout/layout.rt
@@ -1,11 +1,11 @@
-
Retrieving houses...
+
Retrieving houses...
Select household:
-
+
{this.props.children}
diff --git a/client/dashboard/power/graph/graph.component.js b/client/dashboard/power/graph/graph.component.js
index 3854725..8a4e016 100644
--- a/client/dashboard/power/graph/graph.component.js
+++ b/client/dashboard/power/graph/graph.component.js
@@ -7,23 +7,28 @@ import SplineStackChart from './../../../d3/line/spline_stack';
class GraphComponent extends React.Component {
componentDidMount(){
- var power_graph = this,
- house = power_graph.context.house;
+ var power_graph = this;
power_graph.graph_title = ' ';
- if (!power_graph.context.loading_power_data) power_graph.updateGraph();
+ if (power_graph.house) power_graph.updateGraph();
+ }
+
+ get house(){
+ return this.props.location.state && this.props.location.state.house;
}
componentDidUpdate(prev_props, prev_state, prev_context){
- var power_graph = this,
- house = power_graph.context.house;
- if (power_graph.context.loading_power_data) {return false;}
- if (!prev_context.house ||
- prev_context.loading_power_data ||
- prev_context.house.id != power_graph.context.house.id) {
+ var power_graph = this;
+ if (power_graph.shouldUpdateGraph(prev_props)) {
power_graph.updateGraph();
}
}
+ shouldUpdateGraph(prev_props){
+ var power_graph = this;
+ return (power_graph.house && !prev_props.location.state.house ||
+ prev_props.location.state.house.id != power_graph.props.location.state.house.id);
+ }
+
updateGraph(){
var power_graph = this,
house = power_graph.context.house;
@@ -83,8 +88,6 @@ class GraphComponent extends React.Component {
}
GraphComponent.contextTypes = {
- house: React.PropTypes.instanceOf(House),
- loading_power_data: React.PropTypes.bool.isRequired,
router: React.PropTypes.object.isRequired
};
diff --git a/client/dashboard/power/power.component.js b/client/dashboard/power/power.component.js
index 137d7da..faf1c0b 100644
--- a/client/dashboard/power/power.component.js
+++ b/client/dashboard/power/power.component.js
@@ -12,36 +12,43 @@ class PowerComponent extends React.Component {
constructor(props){
super(props);
var power = this;
- power.state = {
- loading_power_data: true };
power.updates = 0;
}
+ get house(){
+ console.log('PowerComponent#get house', this.props.location.state && this.props.location.state.house)
+ return this.props.location.state && this.props.location.state.house;
+ }
+
componentDidMount(){
var power = this,
- house = power.context.house;
+ house = power.props.location.state.house;
+
+ console.log(this.updates, ') PowerComponent#componentDidMount')
+ console.log(this.house)
power.renders = 0;
if (!house) return false;
power.initDateRange();
- house.setPowerData()
- .then(()=>{
- power.setState({loading_power_data: false }); });
}
componentDidUpdate(prev_props, prev_state, prev_context){
+ this.updates += 1
+ console.log(this.updates, ') PowerComponent#componentDidUpdate')
+ console.log(this.house)
var power = this,
- house = power.context.house;
- if (!house) return false;
- var route_helper = new RouteHelper(house, power.props);
- if ((!prev_context.house || prev_context.house.data.id != power.context.house.data.id) ||
- !house.matchesPowerRange(prev_props.location.query['dates[]'] || [])) {
- power.setState({loading_power_data: true});
- house.setPowerData()
- .then(()=>{
- power.initDateRange();
- power.setState({loading_power_data: false}); // will update graph or table.
- });
- } else if (!house.matchesMonthState(prev_props.params)) power.initDateRange();
+ route_helper = new RouteHelper(power.props);
+ if (!route_helper.house) return false;
+ if (power.shouldInitDateRange(prev_props)) {
+ power.initDateRange();
+ }
+ }
+
+ shouldInitDateRange(prev_props){
+ var power = this,
+ route_helper = new RouteHelper(power.props);
+ return !prev_props.location.state.house ||
+ prev_props.location.state.house.data.id != power.context.house.data.id ||
+ !route_helper.house.matchesPowerRange(prev_props.params, prev_props.location.query['dates[]'] || []);
}
initDateRange(){
@@ -69,8 +76,7 @@ class PowerComponent extends React.Component {
var power_range = [Math.round(min.getTime() / 1000), Math.round(max.getTime() / 1000)],
route_helper = new RouteHelper(house, power.props, {power_range: power_range});
- route_helper.updateHouseState();
- power.context.router.push(route_helper.newRoute());
+ route_helper.updateRoute();
}, 500);
};
power.date_range_slider.drawData({
@@ -95,25 +101,13 @@ class PowerComponent extends React.Component {
}
}
- getChildContext(){
- var layout = this;
- return {
- loading_power_data: layout.state.loading_power_data
- };
- }
-
render() {
var powerRt = Templates.forComponent('power');
return powerRt.call(this);
}
}
-PowerComponent.childContextTypes = {
- loading_power_data: React.PropTypes.bool.isRequired
-};
-
PowerComponent.contextTypes = {
- house: React.PropTypes.instanceOf(House),
router: React.PropTypes.object.isRequired
};
diff --git a/client/dashboard/power/power.rt b/client/dashboard/power/power.rt
index d18a796..ebd6513 100644
--- a/client/dashboard/power/power.rt
+++ b/client/dashboard/power/power.rt
@@ -1,16 +1,16 @@
-
+
Retrieving power data...
diff --git a/client/dashboard/power/table/table.component.js b/client/dashboard/power/table/table.component.js
index 51471b2..10d81e7 100644
--- a/client/dashboard/power/table/table.component.js
+++ b/client/dashboard/power/table/table.component.js
@@ -12,7 +12,6 @@ class TableComponent extends React.Component {
}
TableComponent.contextTypes = {
- house: React.PropTypes.instanceOf(House),
router: React.PropTypes.object.isRequired
};
diff --git a/client/dashboard/routes.js b/client/dashboard/routes.js
index a44be41..f9fcf8b 100644
--- a/client/dashboard/routes.js
+++ b/client/dashboard/routes.js
@@ -42,13 +42,19 @@ export const ROUTES = [{
export class RouteHelper {
- constructor(house, props, update){
+ constructor(router, props, update){
+ update = update || {};
var route_helper = this;
- route_helper.house = house;
route_helper.props = props;
+ route_helper.router = router;
route_helper.update = update || {};
}
+ get house(){
+ var route_helper = this;
+ return route_helper.update.house || route_helper.props.location.state && route_helper.props.location.state.house;
+ }
+
get view(){
var route_helper = this;
return route_helper.update.view || (route_helper.tableSelected() ? 'table' : 'graph');
@@ -65,8 +71,13 @@ export class RouteHelper {
}
get power_range(){
- var route_helper = this;
- return route_helper.update.power_range || route_helper.props.location.query['dates[]'];
+ var route_helper = this,
+ range = route_helper.update.power_range || route_helper.props.location.query.dates;
+ if (range) {
+ range[0] = +range[0];
+ range[1] = +range[1];
+ }
+ return range;
}
get date_params(){
@@ -76,11 +87,22 @@ export class RouteHelper {
year: route_helper.update.year || route_helper.house.year };
}
+ get new_state(){
+ var route_helper = this;
+ return Object.keys(route_helper.update).reduce((state, key)=>{
+ if (['house'].indexOf(key) >= 0) state[key] = route_helper.update[key];
+ return state;
+ }, {});
+ }
+
+
+ // compare house state to updates or params.
routeUpdated(){
var route_helper = this,
house = route_helper.house;
return (route_helper.energySelected() && !house.matchesYearState(route_helper.date_params)) ||
- (route_helper.powerSelected() && !house.matchesMonthState(route_helper.date_params) || !house.matchesPowerRange(route_helper.power_range));
+ (route_helper.powerSelected() && !house.matchesMonthState(route_helper.date_params) || !house.matchesPowerRange(route_helper.power_range)) &&
+ (!route_helper.update.view || route_helper.update.view !== route_helper.view);
}
// This will update the house state acccording to passed update parameters.
@@ -88,24 +110,25 @@ export class RouteHelper {
var route_helper = this,
house = route_helper.house;
house.setMonthState(route_helper.date_params, route_helper.update.power_range);
+ if (route_helper.energySelected()){
+ route_helper.router.push({state: {loading_energy_data: true}})
+ return house.setEnergyData().then(()=>{ return {loading_energy_data: false} });
+ } else if (route_helper.powerSelected()) {
+ route_helper.router.push({state: {loading_power_data: true}})
+ return house.setPowerData().then(()=>{ return {loading_power_data: false} });
+ } else return Promise.resolve({});
}
- paramsHaveDateState(){
+ updateRoute(){
var route_helper = this;
- return !!route_helper.props.params.year;
- }
-
- // This will update the house according to URL parameters.
- updateHouseToParams(){
- var route_helper = this,
- house = route_helper.house,
- power_range;
- if (route_helper.props.location.query['dates[]']){
- power_range = [];
- power_range[0] = +route_helper.props.location.query['dates[]'][0];
- power_range[1] = +route_helper.props.location.query['dates[]'][1];
- }
- house.setMonthState(route_helper.props.params, power_range);
+ return route_helper.updateHouseState()
+ .then((data_state)=>{
+ route_helper.router.push({
+ pathname: route_helper.newRoute(),
+ query: route_helper.newQuery(),
+ state: Object.assign(data_state, route_helper.new_state)
+ });
+ });
}
// should be run AFTER updateHouseState is called.
@@ -115,10 +138,16 @@ export class RouteHelper {
if (route_helper.dataset === 'energy'){
return `/houses/${house.data.id}/energy/${house.state.year}/${route_helper.graph_attr}/${route_helper.view}`;
} else {
- return `/houses/${house.data.id}/power/${house.state.month}/${house.state.year}/${route_helper.view}?${jQuery.param({dates: house.state.power_range})}`;
+ return `/houses/${house.data.id}/power/${house.state.month}/${house.state.year}/${route_helper.view}`;
}
}
+ newQuery(){
+ var route_helper = this;
+ if (route_helper.dataset === 'power') return {dates: route_helper.house.state.power_range};
+ else return {};
+ }
+
graphSelected(){
return RouteHelper.graphSelected(this.props.routes);
}
diff --git a/client/models/house.js b/client/models/house.js
index ee9b589..06ac46a 100644
--- a/client/models/house.js
+++ b/client/models/house.js
@@ -133,9 +133,9 @@ class House {
return params.month == house.state.month && params.year == house.state.year;
}
- matchesPowerRange(dates){
+ matchesPowerRange(params, dates){
var house = this;
- return house.state.power_range[0] == dates[0] && house.state.power_range[1] == dates[1];
+ return house.matchesMonthState(params) && house.state.power_range[0] == dates[0] && house.state.power_range[1] == dates[1];
}
offset_diff(unix){
diff --git a/server/app.express.js b/server/app.express.js
index 47f6fe7..910d64c 100644
--- a/server/app.express.js
+++ b/server/app.express.js
@@ -62,20 +62,9 @@ import logger from 'morgan';
app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
-// serve fonts in /assets/fonts
-import assets from "connect-assets";
-
// TODO: These routes need to match references in the bootstrap and font awesome files.
app.use("/assets/fonts", express.static("bootstrap/dist/fonts"));
app.use("/assets/fonts", express.static("font-awesome/fonts"));
-// serve compiled vendor assets and application.css.
-app.use(assets({
- paths: ["./../node_modules"],
- build: true,
- buildDir: false,
- // compile: false,
- compress: true
-}));
// serve public static files.
dev_server.app.use('/', express.static(path.resolve(__dirname, 'public')));