FHEM/fhem-mirror
2
0
Fork 0
mirror of https://github.com/fhem/fhem-mirror.git synced 2025-03-12 16:46:35 +00:00
Code Issues Releases Wiki Activity

added dynamic time ranges to charts in display and saving

Browse Source 
git-svn-id: https://svn.fhem.de/fhem/trunk@2872 2b470e98-0d58-463d-a4d8-8e2adae1ed80
This commit is contained in:
johannnes 2013-03-08 19:17:20 +00:00
parent 52f3f7a15e
commit 8e23453e60
7 changed files with 141 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
fhem/www/frontend/CHANGED
View File

@ -1,4 +1,5 @@
Update vom 8.3.2013
* Erweiterung der Charts - Anzeige und Speicherung von dynamischen Zeiträumen (Woche, Tag,...)
* Bugfixes in der Darstellung der gespeicherten Farben eines Charts
* Implementation eine Konfigurationsdatei für den Benutzer
* Steuerung über diese Datei ermöglicht z.B. die Konversion in Charts von "on" zu 1, "closed" zu 0 usw.

10
fhem/www/frontend/controls_frontend.txt
View File

@ -38,20 +38,20 @@ DIR www/frontend/lib/ext-4.1.1a/images/gray/util
DIR www/frontend/lib/ext-4.1.1a/images/gray/panel-header
DIR www/frontend/lib/ext-4.1.1a/images/gray/tip
UPD 2013-03-07_12:12:22 49744 FHEM/93_DbLog.pm
UPD 2013-03-06_11:11:22 499 www/frontend/index.html
UPD 2013-03-08_07:13:10 563 www/frontend/index.html
UPD 2013-03-06_11:11:22 236 www/frontend/README.txt
UPD 2013-03-08_01:44:54 613 www/frontend/app/userconfig.js
UPD 2013-03-06_11:11:22 1856 www/frontend/app/app.js
UPD 2013-03-06_11:11:22 20514 www/frontend/app/view/LineChartPanel.js
UPD 2013-03-08_06:58:48 22644 www/frontend/app/view/LineChartPanel.js
UPD 2013-03-06_11:11:22 7826 www/frontend/app/view/Viewport.js
UPD 2013-03-06_11:11:22 4269 www/frontend/app/view/DevicePanel.js
UPD 2013-03-06_11:11:22 2503 www/frontend/app/view/TableDataGridPanel.js
UPD 2013-03-06_11:11:22 1310 www/frontend/app/view/LineChartView.js
UPD 2013-03-08_01:58:22 42032 www/frontend/app/controller/ChartController.js
UPD 2013-03-06_11:11:22 10761 www/frontend/app/controller/MainController.js
UPD 2013-03-08_06:58:22 46090 www/frontend/app/controller/ChartController.js
UPD 2013-03-08_06:15:36 10876 www/frontend/app/controller/MainController.js
UPD 2013-03-06_11:11:22 202 www/frontend/app/model/ReadingsModel.js
UPD 2013-03-06_11:11:22 338 www/frontend/app/model/SavedChartsModel.js
UPD 2013-03-08_01:43:31 1752 www/frontend/app/model/ChartModel.js
UPD 2013-03-08_05:43:31 1751 www/frontend/app/model/ChartModel.js
UPD 2013-03-06_11:11:22 198 www/frontend/app/model/DeviceModel.js
UPD 2013-03-06_11:11:22 685 www/frontend/app/model/TableDataModel.js
UPD 2013-03-06_11:11:22 432 www/frontend/app/store/ChartStore.js

86
fhem/www/frontend/www/frontend/app/controller/ChartController.js
View File

@ -260,6 +260,7 @@ Ext.define('FHEM.controller.ChartController', {
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s'),
endtime = me.getEndtimepicker().getValue(),
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s'),
dynamicradio = Ext.ComponentQuery.query('radiogroup[name=dynamictime]')[0],
view = me.getLinechartview(),
store = me.getLinechartview().getStore(),
proxy = store.getProxy();
@ -279,6 +280,65 @@ Ext.define('FHEM.controller.ChartController', {
//setting x-axis title
view.axes.get(1).setTitle(xaxis);
//check if timerange or dynamic time should be used
dynamicradio.eachBox(function(box, idx){
var date = new Date();
if (box.checked) {
if (box.inputValue === "year") {
starttime = Ext.Date.parse(date.getUTCFullYear() + "-01-01", "Y-m-d");
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s');
endtime = Ext.Date.parse(date.getUTCFullYear() + 1 + "-01-01", "Y-m-d");
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s');
} else if (box.inputValue === "month") {
starttime = Ext.Date.getFirstDateOfMonth(date);
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s');
endtime = Ext.Date.getLastDateOfMonth(date);
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s');
} else if (box.inputValue === "week") {
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);
//monday starts with 0 till sat with 5, sund with -1
var dayoffset = date.getDay() - 1,
monday,
sunday;
if (dayoffset >= 0) {
monday = Ext.Date.add(date, Ext.Date.DAY, -dayoffset);
} else {
//we have a sunday
monday = Ext.Date.add(date, Ext.Date.DAY, 1);
}
sunday = Ext.Date.add(monday, Ext.Date.DAY, 6);
starttime = monday;
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s');
endtime = sunday;
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s');
} else if (box.inputValue === "day") {
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);
starttime = date;
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s');
endtime = Ext.Date.add(date, Ext.Date.DAY, 1);
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s');
} else if (box.inputValue === "hour") {
date.setMinutes(0);
date.setSeconds(0);
starttime = date;
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s');
endtime = Ext.Date.add(date, Ext.Date.HOUR, 1);
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s');
} else {
Ext.Msg.alert("Error", "Could not setup the dynamic time.");
}
}
});
// set the x axis range dependent on user given timerange
view.axes.get(1).fromDate = starttime;
@ -731,8 +791,18 @@ Ext.define('FHEM.controller.ChartController', {
dbstarttime = Ext.Date.format(starttime, 'Y-m-d_H:i:s'),
endtime = this.getEndtimepicker().getValue(),
dbendtime = Ext.Date.format(endtime, 'Y-m-d_H:i:s'),
dynamicradio = Ext.ComponentQuery.query('radiogroup[name=dynamictime]')[0],
view = this.getLinechartview();
//setting the starttime parameter in the chartconfig to the string of the radiofield, gets parsed on load
if (this.getStarttimepicker().isDisabled()) {
dynamicradio.eachBox(function(box, idx) {
if (box.checked) {
dbstarttime = box.inputValue;
}
});
}
var jsonConfig = '{"x":"' + xaxis + '","y":"' + yaxis + '","device":"' + device + '",';
jsonConfig += '"yaxiscolorcombo":"' + yaxiscolorcombo + '","yaxisfillcheck":"' + yaxisfillcheck + '",';
jsonConfig += '"y2device":"' + y2device + '",';
@ -871,10 +941,20 @@ Ext.define('FHEM.controller.ChartController', {
}
//convert time
var start = chartdata.starttime.replace("_", " "),
var dynamicradio = Ext.ComponentQuery.query('radiogroup[name=dynamictime]')[0],
st = chartdata.starttime;
if (st === "year" || st === "month" || st === "week" || st === "day" || st === "hour") {
dynamicradio.eachBox(function(box, idx) {
if (box.inputValue === st) {
box.setValue(true);
}
});
} else {
var start = chartdata.starttime.replace("_", " "),
end = chartdata.endtime.replace("_", " ");
this.getStarttimepicker().setValue(start);
this.getEndtimepicker().setValue(end);
this.getStarttimepicker().setValue(start);
this.getEndtimepicker().setValue(end);
}
this.requestChartData();
this.getLinechartpanel().setTitle(name);

11
fhem/www/frontend/www/frontend/app/controller/MainController.js
View File

@ -73,7 +73,7 @@ Ext.define('FHEM.controller.MainController', {
if (Ext.isDefined(FHEM.version)) {
var sp = this.getStatustextfield();
sp.setText(FHEM.version + "; Frontend Version: 0.2");
sp.setText(FHEM.version + "; Frontend Version: 0.2 - 2013-03-08");
}
//setup west accordion
@ -163,7 +163,8 @@ Ext.define('FHEM.controller.MainController', {
opacity: 0,
easing: 'easeOut',
duration: 3000,
delay: 2000
delay: 2000,
remove: true
});
},
failure: function() {
@ -230,7 +231,8 @@ Ext.define('FHEM.controller.MainController', {
opacity: 0,
easing: 'easeOut',
duration: 3000,
delay: 2000
delay: 2000,
remove: true
});
}
@ -265,7 +267,8 @@ Ext.define('FHEM.controller.MainController', {
opacity: 0,
easing: 'easeOut',
duration: 3000,
delay: 2000
delay: 2000,
remove: true
});
},

4
fhem/www/frontend/www/frontend/app/model/ChartModel.js
View File

@ -41,12 +41,10 @@ Ext.define('FHEM.model.ChartModel', {
}
],
parseToNumber: function(value) {
if (value === "") {
return 0;
} else if (parseFloat(value, 10) === "NaN") {
} else if (parseFloat(value, 10).toString().toUpperCase() === "NAN") {
if (Ext.isDefined(FHEM) && Ext.isDefined(FHEM.userconfig)) {
var convertednumber = 0;
Ext.iterate(FHEM.userconfig.chartkeys, function(k, v) {
if (value === k) {

46
fhem/www/frontend/www/frontend/app/view/LineChartPanel.js
View File

@ -386,19 +386,57 @@ Ext.define('FHEM.view.LineChartPanel', {
margin: '0 0 0 10'
},
items: [
{
xtype: 'radiofield',
fieldLabel: 'Timerange',
labelWidth: 60,
name: 'rb',
checked: true,
inputValue: 'timerange',
listeners: {
change: function(rb, newval, oldval) {
if (newval === false) {
rb.up().down('datefield[name=starttimepicker]').setDisabled(true);
rb.up().down('datefield[name=endtimepicker]').setDisabled(true);
} else {
rb.up().down('datefield[name=starttimepicker]').setDisabled(false);
rb.up().down('datefield[name=endtimepicker]').setDisabled(false);
}
}
}
},
{
xtype: 'datefield',
name: 'starttimepicker',
format: 'Y-m-d H:i:s',
fieldLabel: 'Select Starttime',
labelWidth: 90
fieldLabel: 'Starttime',
labelWidth: 70
},
{
xtype: 'datefield',
name: 'endtimepicker',
format: 'Y-m-d H:i:s',
fieldLabel: 'Select Endtime',
labelWidth: 90
fieldLabel: 'Endtime',
labelWidth: 70
},
{
xtype: 'radiogroup',
name: 'dynamictime',
fieldLabel: 'or select a dynamic time',
labelWidth: 140,
allowBlank: true,
defaults: {
labelWidth: 60,
padding: "0 25px 0 0",
checked: false
},
items: [
{ fieldLabel: 'this year', name: 'rb', inputValue: 'year' },
{ fieldLabel: 'this month', name: 'rb', inputValue: 'month' },
{ fieldLabel: 'this week', name: 'rb', inputValue: 'week' },
{ fieldLabel: 'this day', name: 'rb', inputValue: 'day' },
{ fieldLabel: 'this hour', name: 'rb', inputValue: 'hour' }
]
}
]
},

3
fhem/www/frontend/www/frontend/index.html
View File

@ -4,9 +4,10 @@
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>FHEM Frontend</title>
<title>Frontend</title>
<link rel="stylesheet" type="text/css" href="lib/ext-4.1.1a/ext-all-gray-debug.css" />
<script type="text/javascript" src="lib/ext-4.1.1a/ext-all.js"></script>
<script type="text/javascript" src="app/userconfig.js"></script>
<script type="text/javascript" src="app/app.js"></script>
</head>
<body>