Skip to content

Commit

Permalink
added month view
Browse files Browse the repository at this point in the history
  • Loading branch information
@cshagen
cshagen committed Apr 9, 2021
1 parent 9da1ac3 commit dbb51f6
Show file tree
Hide file tree
Showing 7 changed files with 418 additions and 140 deletions.
212 changes: 137 additions & 75 deletions web/themes/colors/powerdata.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,10 @@ class WbData {
this.batteryPowerExport = 0;
this.batteryPowerImport = 0;
this.graphDate = new Date();
this.graphMonth = {
"month": this.graphDate.getMonth(),
"year": this.graphDate.getFullYear()
}
this.consumer = [new Consumer(), new Consumer()];
this.chargePoint = Array.from({ length: 9 }, (v, i) => new ChargePoint(i));
this.shDevice = Array.from({ length: 9 }, (v, i) => new SHDevice(i));
Expand All @@ -34,13 +38,13 @@ class WbData {
"batOut": { name: "Bat >", power: 0, energy: 0, color: "white" }
};

this.usageSummary = [
{ name: "Export", power: 0, energy: 0, color: "white" },
{ name: "Laden", power: 0, energy: 0, color: "white" },
{ name: "Geräte", power: 0, energy: 0, color: "white" },
{ name: "> Bat", power: 0, energy: 0, color: "white" },
{ name: "Haus", power: 0, energy: 0, color: "white" }
];
this.usageSummary = {
"evuOut": { name: "Export", power: 0, energy: 0, color: "white" },
"charging": { name: "Laden", power: 0, energy: 0, color: "white" },
"devices": { name: "Geräte", power: 0, energy: 0, color: "white" },
"batIn": { name: "> Bat", power: 0, energy: 0, color: "white" },
"house": { name: "Haus", power: 0, energy: 0, color: "white" }
};

this.historicSummary = {
"evuIn": { name: "Netz", power: 0, energy: 0, color: "white" },
Expand All @@ -53,9 +57,10 @@ class WbData {
"house": { name: "Haus", power: 0, energy: 0, color: "white" }
};

this.usageDetails = [this.usageSummary[0]];
this.showLiveGraph = true;
this.showTodayGraph = false;
this.usageDetails = [this.usageSummary.evuOut];
this.graphPreference = "live";
this.graphMode = "live";
this.showTodayGraph = true;
this.showGrid = false;
this.displayMode = "gray";
this.usageStackOrder = 0;
Expand All @@ -67,11 +72,11 @@ class WbData {
this.sourceSummary.pv.color = 'var(--color-pv)';
this.sourceSummary.evuIn.color = 'var(--color-evu)';
this.sourceSummary.batOut.color = 'var(--color-battery)';
this.usageSummary[0].color = 'var(--color-export)';
this.usageSummary[1].color = 'var(--color-charging)';
this.usageSummary[2].color = 'var(--color-devices)';
this.usageSummary[3].color = 'var(--color-battery)';
this.usageSummary[4].color = 'var(--color-house)';
this.usageSummary.evuOut.color = 'var(--color-export)';
this.usageSummary.charging.color = 'var(--color-charging)';
this.usageSummary.devices.color = 'var(--color-devices)';
this.usageSummary.batIn.color = 'var(--color-battery)';
this.usageSummary.house.color = 'var(--color-house)';
var i;
for (i = 0; i < 8; i++) {
this.chargePoint[i].color = 'var(--color-lp' + (i + 1) + ')';
Expand All @@ -97,16 +102,20 @@ class WbData {
gridCol = style.getPropertyValue('--gridCol');
evuCol = style.getPropertyValue('--evuCol');



this.readGraphPreferences();

if (this.showLiveGraph) {
powerGraph.deactivateDay();
powerGraph.activateLive();
} else {
powerGraph.deactivateLive();
powerGraph.activateDay();
this.graphMode = this.graphPreference;
switch (this.graphMode) {
case 'live':
powerGraph.deactivateDay();
powerGraph.activateLive();
break;
case 'day':
powerGraph.deactivateLive();
powerGraph.activateDay();
break;
default:
powerGraph.deactivateDay();
powerGraph.activateLive();
}
// set display mode
const doc = d3.select("html");
Expand All @@ -121,14 +130,14 @@ class WbData {
case 'powerEvuIn':
case 'powerEvuOut':
this.updateSourceSummary("evuIn", "power", this.powerEvuIn);
this.updateUsageSummary(0, "power", this.powerEvuOut);
this.updateUsageSummary("evuOut", "power", this.powerEvuOut);
break;
case 'evuiDailyYield':
this.updateSourceSummary("evuIn", "energy", this.evuiDailyYield);

break;
case 'evueDailyYield':
this.updateUsageSummary(0, "energy", this.evueDailyYield);
this.updateUsageSummary("evuOut", "energy", this.evueDailyYield);
break;
default:
break;
Expand All @@ -139,17 +148,17 @@ class WbData {
this[field] = value;
switch (field) {
case 'housePower':
this.updateUsageSummary(4, "power", value);
this.updateUsageSummary("house", "power", value);
break;
case 'chargePower':
this.updateUsageSummary(1, "power", value);
this.updateUsageSummary("charging", "power", value);
break;
case 'chargeEnergy':
this.updateUsageSummary(1, "energy", value)
this.updateUsageSummary("charging", "energy", value)
break;
case 'houseEnergy':
console.log("Update House Energy: " + value);
this.updateUsageSummary(4, "energy", value);
this.updateUsageSummary("house", "energy", value);
break;
case 'currentPowerPrice':
chargePointList.update();
Expand Down Expand Up @@ -230,22 +239,21 @@ class WbData {
this[field] = value;
switch (field) {
case 'batteryPowerImport':
this.usageSummary[3].power = value;
this.updateUsageSummary ("batIn", "power", value);
powerMeter.update();
break;
case 'batteryPowerExport':
this.updateSourceSummary("batOut", "power", value);
powerMeter.update();
break;
case 'batteryEnergyImport':
this.usageSummary[3].energy = value;
this.updateUsageSummary ("batIn", "energy", value);
yieldMeter.update();
break;
case 'batteryEnergyExport':
this.updateSourceSummary("batOut", "energy", value);
yieldMeter.update();
break;

default:
break;
}
Expand All @@ -265,8 +273,8 @@ class WbData {
}
}

updateUsageSummary(index, field, value) {
this.usageSummary[index][field] = value;
updateUsageSummary(cat, field, value) {
this.usageSummary[cat][field] = value;

if (field == "power") {
this.updateUsageDetails();
Expand All @@ -279,22 +287,22 @@ class WbData {
}

updateUsageDetails() {
this.usageDetails = [this.usageSummary[0],
this.usageSummary[1]]
this.usageDetails = [this.usageSummary.evuOut,
this.usageSummary.charging]
.concat(this.shDevice.filter(row => (row.configured && row.showInGraph)))
.concat(this.consumer.filter(row => (row.configured)))
.concat([this.usageSummary[3], this.usageSummary[4]]);
.concat([this.usageSummary.batIn, this.usageSummary.house]);
}

updateConsumerSummary(cat) {
this.updateUsageSummary(2, cat, this.shDevice.filter(dev => dev.configured).reduce((sum, consumer) => sum + consumer[cat], 0)
this.updateUsageSummary("devices", cat, this.shDevice.filter(dev => dev.configured).reduce((sum, consumer) => sum + consumer[cat], 0)
+ this.consumer.filter(dev => dev.configured).reduce((sum, consumer) => sum + consumer[cat], 0));
}

//update cookie
persistGraphPreferences() {
this.prefs.hideSH = this.shDevice.filter(device => !device.showInGraph).map(device => device.id);
this.prefs.showLG = this.showLiveGraph;
this.prefs.showLG = (this.graphPreference == 'live');
this.prefs.displayM = this.displayMode;
this.prefs.stackO = this.usageStackOrder;
this.prefs.showGr = this.showGrid;
Expand All @@ -310,8 +318,7 @@ class WbData {
this.prefs.hideSH.map(i => this.shDevice[i].showInGraph = false)
}
if ('showLG' in this.prefs) {
this.showLiveGraph = this.prefs.showLG;
this.showTodayGraph = !this.prefs.showLG;
this.graphPreference = (this.prefs.showLG) ? "live" : "day";
}
if ('maxPow' in this.prefs) {
powerMeter.maxPower = +this.prefs.maxPow;
Expand All @@ -333,6 +340,11 @@ class WbData {
dayGraphUpdated() {
yieldMeter.update();
}
monthGraphUpdated() {
yieldMeter.update();
}


}


Expand Down Expand Up @@ -394,44 +406,75 @@ function formatTime(seconds) {
}
}

function formatMonth (month, year) {
months = ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'];
return (months[month] + " "+ year);
}
function shiftLeft() {
if (wbdata.showLiveGraph) {
wbdata.showLiveGraph = false;
wbdata.showTodayGraph = true;
powerGraph.deactivateLive();
powerGraph.activateDay();
wbdata.prefs.showLG = false;
wbdata.persistGraphPreferences();
d3.select("button#graphRightButton").classed("disabled", false)
} else {
if (wbdata.showTodayGraph) {
wbdata.showTodayGraph = false;
}
wbdata.graphDate.setTime(wbdata.graphDate.getTime() - 86400000);
powerGraph.activateDay();
}
switch (wbdata.graphMode) {
case 'live':
wbdata.graphMode = 'day';
wbdata.graphPreference = 'day';
wbdata.showTodayGraph = true;
powerGraph.deactivateLive();
powerGraph.activateDay();
wbdata.prefs.showLG = false;
wbdata.persistGraphPreferences();
d3.select("button#graphRightButton").classed("disabled", false)
break;
case 'day':
wbdata.showTodayGraph = false;
wbdata.graphDate.setTime(wbdata.graphDate.getTime() - 86400000);
powerGraph.activateDay();
break;
case 'month':
wbdata.graphMonth.month = wbdata.graphMonth.month - 1;
if (wbdata.graphMonth.month < 0) {
wbdata.graphMonth.month = 11;
wbdata.graphMonth.year = wbdata.graphMonth.year - 1;
}
powerGraph.activateMonth();
break;
default: break;
}
}

function shiftRight() {
today = new Date();
const d = wbdata.graphDate;
if (d.getDate() == today.getDate() && d.getMonth() == today.getMonth() && d.getFullYear() == today.getFullYear()) {
if (!wbdata.showLiveGraph) {
wbdata.showLiveGraph = true;
powerGraph.deactivateDay();
powerGraph.activateLive();
wbdata.prefs.showLG = true;
wbdata.persistGraphPreferences();
d3.select("button#graphLeftButton").classed("disabled", false)
d3.select("button#graphRightButton").classed("disabled", true)
}
} else {
wbdata.graphDate.setTime(wbdata.graphDate.getTime() + 86400000);
const nd = wbdata.graphDate;
if (nd.getDate() == today.getDate() && nd.getMonth() == today.getMonth() && nd.getFullYear() == today.getFullYear()) {
wbdata.showTodayGraph = true;
}
powerGraph.activateDay();
}
switch (wbdata.graphMode) {
case 'live':
break;
case 'day':
if (d.getDate() == today.getDate() && d.getMonth() == today.getMonth() && d.getFullYear() == today.getFullYear()) { // date is today, switch to live graph
wbdata.graphMode = 'live';
powerGraph.deactivateDay();
powerGraph.activateLive();
wbdata.graphPreference = 'live';
wbdata.prefs.showLG = true;
wbdata.persistGraphPreferences();
d3.select("button#graphLeftButton").classed("disabled", false)
d3.select("button#graphRightButton").classed("disabled", true)
} else { // currently looking at a previous day
wbdata.graphDate.setTime(wbdata.graphDate.getTime() + 86400000);
const nd = wbdata.graphDate;
if (nd.getDate() == today.getDate() && nd.getMonth() == today.getMonth() && nd.getFullYear() == today.getFullYear()) {
wbdata.showTodayGraph = true;
}
powerGraph.activateDay();
}
break;
case 'month':
if ((today.getMonth() != wbdata.graphMonth.month) || (today.getFullYear() != wbdata.graphMonth.year)) { // we are looking at a previous month
wbdata.graphMonth.month = wbdata.graphMonth.month + 1;
if (wbdata.graphMonth.month == 12) {
wbdata.graphMonth.month = 0;
wbdata.graphMonth.year = wbdata.graphMonth.year + 1;
}
powerGraph.activateMonth();
}
}

}

function toggleGrid() {
Expand All @@ -440,6 +483,25 @@ function toggleGrid() {
yieldMeter.update();
wbdata.persistGraphPreferences();
}

function toggleMonthView() {
if (wbdata.graphMode == 'month') {
wbdata.graphMode = wbdata.graphPreference;
if (wbdata.graphPreference == 'live') {
powerGraph.activateLive();
powerGraph.deactivateMonth();
} else {
powerGraph.activateDay();
powerGraph.deactivateMonth();
}
} else {
wbdata.graphMode = 'month';
powerGraph.activateMonth();
powerGraph.deactivateDay();
powerGraph.deactivateLive();
}
yieldMeter.update();
}
// required for pricechart to work
var evuCol;
var xgridCol;
Expand Down
Loading

0 comments on commit dbb51f6

Please sign in to comment.