Public/fhem-mirror
1
0
Fork 0
mirror of https://github.com/fhem/fhem-mirror.git synced 2025-05-01 20:20:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

chartingfrontend: fixed bug in zoom, device and readingselection

Browse Source 
git-svn-id: https://svn.fhem.de/fhem/trunk/fhem@4545 2b470e98-0d58-463d-a4d8-8e2adae1ed80
This commit is contained in:
johannnes 2014-01-03 12:44:40 +00:00
parent 54c712c1ae
commit 158a0bbf58
5 changed files with 96 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
www/frontend/controls_frontend.txt
View File

@ -272,14 +272,14 @@ UPD 2013-03-02_01:53:05 524 www/frontend/app/resources/icons/resultset_last.png
UPD 2013-04-03_07:27:17 733 www/frontend/app/resources/icons/add.png UPD 2013-04-03_07:27:17 733 www/frontend/app/resources/icons/add.png
UPD 2013-04-03_07:27:17 389 www/frontend/app/resources/icons/resultset_previous.png UPD 2013-04-03_07:27:17 389 www/frontend/app/resources/icons/resultset_previous.png
UPD 2013-06-30_11:47:12 101 www/frontend/app/resources/application.css UPD 2013-06-30_11:47:12 101 www/frontend/app/resources/application.css
UPD 2013-12-07_12:24:10 2270 www/frontend/app/app.js UPD 2014-01-03_12:47:07 2714 www/frontend/app/app.js
UPD 2013-04-28_02:00:20 1205 www/frontend/app/view/ChartGridPanel.js UPD 2013-04-28_02:00:20 1205 www/frontend/app/view/ChartGridPanel.js
UPD 2013-07-07_12:12:08 16201 www/frontend/app/view/DevicePanel.js UPD 2013-07-07_12:12:08 16201 www/frontend/app/view/DevicePanel.js
UPD 2013-12-26_08:39:37 10257 www/frontend/app/view/TableDataGridPanel.js UPD 2013-12-26_08:39:37 10257 www/frontend/app/view/TableDataGridPanel.js
UPD 2014-01-02_09:38:25 64890 www/frontend/app/view/LineChartPanel.js UPD 2014-01-03_01:24:06 65039 www/frontend/app/view/LineChartPanel.js
UPD 2013-12-27_01:39:11 9980 www/frontend/app/view/Viewport.js UPD 2013-12-27_01:39:11 9980 www/frontend/app/view/Viewport.js
UPD 2014-01-02_02:26:30 19171 www/frontend/app/controller/MainController.js UPD 2014-01-03_01:38:11 19171 www/frontend/app/controller/MainController.js
UPD 2014-01-02_09:34:38 113012 www/frontend/app/controller/ChartController.js UPD 2014-01-03_01:30:11 107834 www/frontend/app/controller/ChartController.js
UPD 2013-06-30_11:46:54 5415 www/frontend/app/controller/TableDataController.js UPD 2013-06-30_11:46:54 5415 www/frontend/app/controller/TableDataController.js
UPD 2013-04-01_07:04:35 202 www/frontend/app/model/ReadingsModel.js UPD 2013-04-01_07:04:35 202 www/frontend/app/model/ReadingsModel.js
UPD 2013-04-01_07:04:36 338 www/frontend/app/model/SavedChartsModel.js UPD 2013-04-01_07:04:36 338 www/frontend/app/model/SavedChartsModel.js

46
www/frontend/www/frontend/app/app.js
View File

@ -35,28 +35,32 @@ Ext.application({
url: url, url: url,
success: function(response){ success: function(response){
Ext.getBody().unmask(); Ext.getBody().unmask();
FHEM.info = Ext.decode(response.responseText); try {
FHEM.version = FHEM.info.Results[0].devices[0].ATTR.version; FHEM.info = Ext.decode(response.responseText);
Ext.each(FHEM.info.Results, function(result) { FHEM.version = FHEM.info.Results[0].devices[0].ATTR.version;
if (result.list === "DbLog" && result.devices[0].NAME) { Ext.each(FHEM.info.Results, function(result) {
FHEM.dblogname = result.devices[0].NAME; if (result.list === "DbLog" && result.devices[0].NAME) {
} FHEM.dblogname = result.devices[0].NAME;
if (result.list === "FileLog" && result.devices.length > 0) { }
FHEM.filelogs = result.devices; if (result.list === "FileLog" && result.devices.length > 0) {
} FHEM.filelogs = result.devices;
}); }
if ((!FHEM.dblogname || Ext.isEmpty(FHEM.dblogname)) && !FHEM.filelogs) {
Ext.Msg.alert("Error", "Could not find a DbLog or FileLog Configuration. Do you have them already defined?");
} else {
Ext.create("FHEM.view.Viewport", {
hidden: true
}); });
if ((!FHEM.dblogname || Ext.isEmpty(FHEM.dblogname)) && !FHEM.filelogs) {
//removing the loadingimage Ext.Msg.alert("Error", "Could not find a DbLog or FileLog Configuration. Do you have them already defined?");
var p = Ext.DomQuery.select('p[class=loader]')[0], } else {
img = Ext.DomQuery.select('#loading-overlay')[0]; Ext.create("FHEM.view.Viewport", {
p.removeChild(img); hidden: true
// further configuration of viewport starts in maincontroller });
//removing the loadingimage
var p = Ext.DomQuery.select('p[class=loader]')[0],
img = Ext.DomQuery.select('#loading-overlay')[0];
p.removeChild(img);
// further configuration of viewport starts in maincontroller
}
} catch (e) {
Ext.Msg.alert("Oh no!", "JsonList did not respond correctly. This is a bug in FHEM. This Frontend cannot work without a valid JsonList response. See this link for details and complain there: http://forum.fhem.de/index.php/topic,17292.msg113132.html#msg113132");
} }
}, },
failure: function() { failure: function() {

191
www/frontend/www/frontend/app/controller/ChartController.js
View File

@ -132,7 +132,6 @@ Ext.define('FHEM.controller.ChartController', {
* reconfigure combos to handle dblog / filelog * reconfigure combos to handle dblog / filelog
*/ */
dataSourceChanged: function(radio, newval, oldval) { dataSourceChanged: function(radio, newval, oldval) {
var selection; var selection;
if (radio.getChecked()[0]) { if (radio.getChecked()[0]) {
selection = radio.getChecked()[0].inputValue; selection = radio.getChecked()[0].inputValue;
@ -144,7 +143,6 @@ Ext.define('FHEM.controller.ChartController', {
readingscombo = radio.up().down("combobox[name=yaxiscombo]"); readingscombo = radio.up().down("combobox[name=yaxiscombo]");
if (selection === "filelog") { if (selection === "filelog") {
// disable statistics for the moment // disable statistics for the moment
radio.up().down("combobox[name=yaxisstatisticscombo]").setDisabled(true); radio.up().down("combobox[name=yaxisstatisticscombo]").setDisabled(true);
@ -164,7 +162,7 @@ Ext.define('FHEM.controller.ChartController', {
devicecombo.queryMode = 'local'; devicecombo.queryMode = 'local';
devicecombo.on("select", me.fileLogSelected); devicecombo.on("select", me.fileLogSelected);
readingscombo.setValue(); readingscombo.setValue("");
readingscombo.getStore().removeAll(); readingscombo.getStore().removeAll();
} else { } else {
@ -187,19 +185,22 @@ Ext.define('FHEM.controller.ChartController', {
* gather filelog information to fill combos * gather filelog information to fill combos
*/ */
fileLogSelected: function(combo, selectionArray) { fileLogSelected: function(combo, selectionArray) {
var readingscombo = combo.up().down("combobox[name=yaxiscombo]"), var readingscombo = combo.up().down("combobox[name=yaxiscombo]"),
currentlogfile; currentlogfile,
if (selectionArray[0]) { logname;
var logname = selectionArray[0].data.DEVICE; if (selectionArray[0] && selectionArray[0].data) {
Ext.each(FHEM.filelogs, function(log) { logname = selectionArray[0].data.DEVICE;
if (log.NAME === logname) { } else {
// found the filelog entry, getting the logfile to load values logname = selectionArray[0];
currentlogfile = log.currentlogfile;
return false;
}
});
} }
Ext.each(FHEM.filelogs, function(log) {
if (log.NAME === logname) {
// found the filelog entry, getting the logfile to load values
currentlogfile = log.currentlogfile;
return false;
}
});
if (!Ext.isEmpty(currentlogfile)) { if (!Ext.isEmpty(currentlogfile)) {
// retrieve the filelog, parse its containing fields // retrieve the filelog, parse its containing fields
readingscombo.setLoading(true); readingscombo.setLoading(true);
@ -316,11 +317,6 @@ Ext.define('FHEM.controller.ChartController', {
chart = me.getChart(); chart = me.getChart();
//cleanup chartpanel //cleanup chartpanel
var existingwins = Ext.ComponentQuery.query('window[name=statisticswin]');
Ext.each(existingwins, function(existingwin) {
existingwin.destroy();
});
var existingchartgrid = Ext.ComponentQuery.query('panel[name=chartgridpanel]')[0]; var existingchartgrid = Ext.ComponentQuery.query('panel[name=chartgridpanel]')[0];
if (!existingchartgrid) { if (!existingchartgrid) {
var chartdatagrid = Ext.create('FHEM.view.ChartGridPanel', { var chartdatagrid = Ext.create('FHEM.view.ChartGridPanel', {
@ -532,36 +528,41 @@ Ext.define('FHEM.controller.ChartController', {
icon: 'app/resources/icons/delete.png', icon: 'app/resources/icons/delete.png',
scope: me, scope: me,
handler: function(btn) { handler: function(btn) {
var chart = btn.up().up().down('chart'); var chart = btn.up().up().down('chart'),
cp = chart.up().up();
var existingwins = Ext.ComponentQuery.query('window[name=statisticswin]');
Ext.each(existingwins, function(existingwin) {
existingwin.destroy();
});
chart.restoreZoom(); chart.restoreZoom();
chart.axes.get(0).minimum = chart.up().up().getLastYmin(); chart.axes.get(0).minimum = cp.getLastYmin();
chart.axes.get(0).maximum = chart.up().up().getLastYmax(); chart.axes.get(0).maximum = cp.getLastYmax();
chart.axes.get(1).minimum = chart.up().up().getLastY2min(); chart.axes.get(1).minimum = cp.getLastY2min();
chart.axes.get(1).maximum = chart.up().up().getLastY2max(); chart.axes.get(1).maximum = cp.getLastY2max();
chart.axes.get(2).minimum = chart.up().up().getLastXmin(); chart.axes.get(2).minimum = cp.getLastXmin();
chart.axes.get(2).maximum = chart.up().up().getLastXmax(); chart.axes.get(2).maximum = cp.getLastXmax();
chart.redraw();
//helper to reshow the hidden items after zooming back out //helper to reshow the hidden items after zooming back out
if (chart.up().up().artifactSeries && chart.up().up().artifactSeries.length > 0) { if (cp.artifactSeries && cp.artifactSeries.length > 0) {
Ext.each(chart.up().up().artifactSeries, function(serie) { Ext.each(cp.artifactSeries, function(serie) {
serie.showAll(); serie.showAll();
var showMarkers = false;
Ext.each(serie.group.items, function(item) { Ext.each(serie.group.items, function(item) {
if (item.type === "circle") { // make sure we hit the points
if (item.radius && item.radius > 0) {
item.show(); item.show();
item.redraw(); item.redraw();
showMarkers = true;
} }
}); });
if (showMarkers) {
serie.showMarkers = true;
}
}); });
chart.up().up().artifactSeries = []; cp.artifactSeries = [];
} }
chart.redraw();
// restore the counter as we have zoomed out
cp.timesZoomed = 0;
} }
} }
] ]
@ -641,14 +642,20 @@ Ext.define('FHEM.controller.ChartController', {
select: { select: {
fn: function(chart, zoomConfig, evt) { fn: function(chart, zoomConfig, evt) {
var cp = chart.up().up();
delete chart.axes.get(2).fromDate; delete chart.axes.get(2).fromDate;
delete chart.axes.get(2).toDate; delete chart.axes.get(2).toDate;
chart.up().up().setLastYmax(chart.axes.get(0).maximum);
chart.up().up().setLastYmin(chart.axes.get(0).minimum); //only save the state when we zoom the first time
chart.up().up().setLastY2max(chart.axes.get(1).maximum); if (cp.timesZoomed === 0) {
chart.up().up().setLastY2min(chart.axes.get(1).minimum); chart.up().up().setLastYmax(chart.axes.get(0).maximum);
chart.up().up().setLastXmax(chart.axes.get(2).maximum); chart.up().up().setLastYmin(chart.axes.get(0).minimum);
chart.up().up().setLastXmin(chart.axes.get(2).minimum); chart.up().up().setLastY2max(chart.axes.get(1).maximum);
chart.up().up().setLastY2min(chart.axes.get(1).minimum);
chart.up().up().setLastXmax(chart.axes.get(2).maximum);
chart.up().up().setLastXmin(chart.axes.get(2).minimum);
}
chart.setZoom(zoomConfig); chart.setZoom(zoomConfig);
chart.mask.hide(); chart.mask.hide();
@ -656,99 +663,15 @@ Ext.define('FHEM.controller.ChartController', {
//helper hiding series and items which are out of scope //helper hiding series and items which are out of scope
Ext.each(chart.series.items, function(serie) { Ext.each(chart.series.items, function(serie) {
if (serie.items.length === 0) { if (serie.items.length === 0) {
chart.up().up().artifactSeries.push(serie); cp.artifactSeries.push(serie);
Ext.each(serie.group.items, function(item) { Ext.each(serie.group.items, function(item) {
item.hide(); item.hide();
item.redraw(); item.redraw();
}); });
serie.hideAll(); serie.hideAll();
} else {
//creating statistic windows after zooming
var html,
count = 0,
sum = 0,
average = 0,
min = 99999999,
max = 0,
lastrec,
diffkwh = 0,
winwidth = 125,
winheight = 105;
Ext.each(serie.items, function(item) {
if (Ext.isNumeric(item.value[1])) {
count++;
sum = sum + item.value[1];
if (min > item.value[1]) {
min = item.value[1];
}
if (max < item.value[1]) {
max = item.value[1];
}
if (serie.title.indexOf('actual_kwh') >= 0) {
if (lastrec) {
var diffhrs = Ext.Date.getElapsed(lastrec.value[0], item.value[0]) / 1000 / 3600;
diffkwh = diffkwh + diffhrs * lastrec.value[1];
}
lastrec = item;
winwidth = 165,
winheight = 130;
}
}
});
average = sum / count;
html = '<b>Selected Items: </b>' + count + '<br>';
html += '<b>Sum: </b>' + Ext.util.Format.round(sum, 5) + '<br>';
html += '<b>Average: </b>' + Ext.util.Format.round(average, 5) + '<br>';
html += '<b>Min: </b>' + min + '<br>';
html += '<b>Max: </b>' + max + '<br>';
if (serie.title.indexOf('actual_kwh') >= 0) {
html += '<b>Used kW/h: </b>' + Ext.util.Format.round(diffkwh, 3) + '<br>';
html += '<b>Costs (at 25c/kWh): </b>' + Ext.util.Format.round(diffkwh * 0.25, 2) + '€<br>';
}
var existingwins = Ext.ComponentQuery.query('window[name=statisticswin]'),
matchfound = false,
lastwin,
win;
if (existingwins.length > 0) {
Ext.each(existingwins, function(existingwin) {
lastwin = existingwin;
if (existingwin.title === serie.title) {
existingwin.update(html);
existingwin.showAt(chart.getWidth() - 145, chart.getPosition()[1] + 8);
matchfound = true;
}
});
if (!matchfound) {
win = Ext.create('Ext.window.Window', {
width: winwidth,
height: winheight,
html: html,
title: serie.title,
name: 'statisticswin',
preventHeader: true,
border: false,
plain: true
});
win.showAt(chart.getWidth() - 145, lastwin.getPosition()[1] + lastwin.getHeight());
}
} else {
win = Ext.create('Ext.window.Window', {
width: winwidth,
height: winheight,
html: html,
title: serie.title,
name: 'statisticswin',
preventHeader: true,
border: false,
plain: true
});
win.showAt(chart.getWidth() - 145, chart.getPosition()[1] + 8);
}
} }
}); });
cp.timesZoomed++;
} }
} }
} }
@ -1820,7 +1743,11 @@ Ext.define('FHEM.controller.ChartController', {
logtypename = logtypes[i].getChecked()[0].name; logtypename = logtypes[i].getChecked()[0].name;
eval('logtypes[i].setValue({' + logtypename + ': "' + chartdata.logtype + '"})'); eval('logtypes[i].setValue({' + logtypename + ': "' + chartdata.logtype + '"})');
devices[i].setValue(chartdata.device); devices[i].setValue(chartdata.device);
yaxes[i].getStore().getProxy().url = url = '../../../fhem?cmd=get+' + FHEM.dblogname + '+-+webchart+""+""+' + chartdata.device + '+getreadings&XHR=1'; if (chartdata.logtype === "filelog") {
me.fileLogSelected(devices[i], [chartdata.device]);
} else {
yaxes[i].getStore().getProxy().url = url = '../../../fhem?cmd=get+' + FHEM.dblogname + '+-+webchart+""+""+' + chartdata.device + '+getreadings&XHR=1';
}
yaxes[i].setDisabled(false); yaxes[i].setDisabled(false);
yaxes[i].setValue(chartdata.y); yaxes[i].setValue(chartdata.y);
rowFieldSets[i].styleConfig.linestrokewidth = chartdata.linestrokewidth || 2; rowFieldSets[i].styleConfig.linestrokewidth = chartdata.linestrokewidth || 2;
@ -1868,7 +1795,11 @@ Ext.define('FHEM.controller.ChartController', {
} }
eval('logtypes[i].setValue({' + logtypename + ' : chartdata.' + logtype + '})'); eval('logtypes[i].setValue({' + logtypename + ' : chartdata.' + logtype + '})');
eval('devices[i].setValue(chartdata.' + axisdevice + ')'); eval('devices[i].setValue(chartdata.' + axisdevice + ')');
yaxes[i].getStore().getProxy().url = '../../../fhem?cmd=get+' + FHEM.dblogname + '+-+webchart+""+""+' + eval('chartdata.' + axisdevice) + '+getreadings&XHR=1'; if (eval('chartdata.' + logtype) === "filelog") {
me.fileLogSelected(devices[i], [eval('chartdata.' + axisdevice)]);
} else {
yaxes[i].getStore().getProxy().url = '../../../fhem?cmd=get+' + FHEM.dblogname + '+-+webchart+""+""+' + eval('chartdata.' + axisdevice) + '+getreadings&XHR=1';
}
yaxes[i].setDisabled(false); yaxes[i].setDisabled(false);
eval('yaxes[i].setValue(chartdata.' + axisname + ')'); eval('yaxes[i].setValue(chartdata.' + axisname + ')');
rowFieldSets[i].styleConfig.linestrokewidth = eval('chartdata.' + prefix + 'linestrokewidth') || 2; rowFieldSets[i].styleConfig.linestrokewidth = eval('chartdata.' + prefix + 'linestrokewidth') || 2;

2
www/frontend/www/frontend/app/controller/MainController.js
View File

@ -95,7 +95,7 @@ Ext.define('FHEM.controller.MainController', {
if (Ext.isDefined(FHEM.version)) { if (Ext.isDefined(FHEM.version)) {
var sp = this.getStatustextfield(); var sp = this.getStatustextfield();
sp.setText(FHEM.version + "; Frontend Version: 1.0.6 - 2014-01-02"); sp.setText(FHEM.version + "; Frontend Version: 1.0.7 - 2014-01-03");
} }
this.setupTree(false); this.setupTree(false);

5
www/frontend/www/frontend/app/view/LineChartPanel.js
View File

@ -53,6 +53,11 @@ Ext.define('FHEM.view.LineChartPanel', {
*/ */
lastXmin: null, lastXmin: null,
/**
* used to suppress setting new lastmin and max values when zooming multiple times
*/
timesZoomed: 0,
/** /**
* *
*/ */