github/vesta
1
0
Fork 0
mirror of https://github.com/serghey-rodin/vesta.git synced 2025-08-14 02:28:03 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

[js, css] stats period added

Browse source
This commit is contained in:
naumov-socolov 2012-02-10 02:18:47 +03:00
commit d91adf9b1e
5 changed files with 205 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

4
web/js/actions.js
View file

@ -733,8 +733,8 @@ App.Actions.loadStats = function(type)
break;
}
$('#actions-toolbar .sub-active').removeClass('sub-active');
$('#actions-toolbar .'+type).addClass('sub-active');
$('#actions-toolbar .active').removeClass('active');
$('#actions-toolbar .'+type).addClass('active');
App.Ajax.request('STATS.getList', {period: period}, function(reply) {
if (!reply.result) {

26
web/js/html.js
View file

@ -512,7 +512,6 @@ App.HTML.Build.stats_list = function(stats)
if (!stats || stats.length == 0) {
return '<br /><br /><center><h1>Stats are not available</h1></center>';
}
var acc = [];
$.each(stats, function(key) {
var stat = stats[key];
@ -523,8 +522,31 @@ App.HTML.Build.stats_list = function(stats)
acc[acc.length++] = tpl.finalize()
});
var wrap = App.Templates.get('WRAPPER', 'backup');
var wrap = App.Templates.get('WRAPPER', 'stats');
var period_start = new Date();
var period_end = new Date();
switch (stats[1]['PERIOD'])
{
case "daily": period_start.setDate(period_start.getDate()-1); break;
case "weekly": period_start.setDate(period_start.getDate()-7); break;
case "monthly": period_start.setMonth(period_start.getMonth()-1); break;
case "yearly": period_start.setFullYear(period_start.getFullYear()-1); break;
}
var month = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var period_tpl = App.Templates.get('PERIOD', 'stats');
period_tpl.set(':PERIOD_START_DATE', period_start.getDate() + ' ' + month[period_start.getMonth()] + ' ' + period_start.getFullYear());
period_tpl.set(':PERIOD_START_TIME', (period_start.getHours() < 10 ? '0' + period_start.getHours() : period_start.getHours())
+ ':' + (period_start.getMinutes() < 10 ? '0' + period_start.getMinutes() : period_start.getMinutes()));
period_tpl.set(':PERIOD_END_DATE', period_end.getDate() + ' ' + month[period_end.getMonth()] + ' ' + period_end.getFullYear());
period_tpl.set(':PERIOD_END_TIME', (period_end.getHours() < 10 ? '0' + period_end.getHours() : period_end.getHours())
+ ':' + (period_end.getMinutes() < 10 ? '0' + period_end.getMinutes() : period_end.getMinutes()));
var period = period_tpl.finalize();
wrap.set(':CONTENT', acc.done());
wrap.set(':PERIOD', period);
return wrap.finalize();
}

5
web/js/pages.js
View file

@ -41,6 +41,7 @@ App.Pages.prepareHTML = function()
$('.d-popup').remove();
App.Actions.reset_batch();
$('#actions-toolbar .stats-subbar').remove();
$('#actions-toolbar .stats-components').remove();
$('#actions-toolbar .do_action_new_entry').removeClass('hidden');
$('.active').removeClass('active');
$('.row-filters').removeClass('hidden');
@ -176,8 +177,12 @@ App.Pages.STATS.prepareHTML = function()
$('.row-filters').addClass('hidden');
$('#actions-toolbar .do_action_new_entry').addClass('hidden');
$('#actions-toolbar .stats-subbar').remove();
$('#actions-toolbar .stats-components').remove();
$('#actions-toolbar .do_action_new_entry').after(App.Templates.get('SUBMENU', 'stats').finalize());
$('#actions-toolbar .date-range-controls').after(App.Templates.get('FILTERS', 'stats').finalize());
$('#content .stats-list').after('zzz');
$('#primary-nav-box .active').removeClass('active');
$('#STATS').addClass('active');
$('#new-entry-keyword').text(App.Helpers.getHumanTabName());

65
web/js/templates.js
View file

@ -1091,17 +1091,70 @@ App.Templates.html = {
</div><!-- // .row 1 -->']
},
stats: {
WRAPPER: ['<div class="stats-list">~!:CONTENT~!</div>'],
ENTRY: ['<div class="stats-block" style="min-height: 252px">\
WRAPPER: ['<div class="stats-list">\
~!:PERIOD~!\
~!:CONTENT~!\
</div>'],
PERIOD: ['<div class="stats-period">\
<span class="stats-period-title">Statistics for:</span>\
<span class="stats-dtstart">\
<span class="dt-day">~!:PERIOD_START_DATE~!</span>\
<span class="dt-time">~!:PERIOD_START_TIME~!</span>\
</span>\
<span class="stats-period-devider">&mdash;</span>\
<span class="stats-dtend">\
<span class="dt-day">~!:PERIOD_END_DATE~!</span>\
<span class="dt-time">~!:PERIOD_END_TIME~!</span>\
</span>\
</div>'],
ENTRY: ['<div class="stats-block">\
<h2 class="stats-block-header">~!:HEADER~!</h2>\
<div class="stats-block-wrap">\
<img class="stats-graph" src="~!:IMG_SRC~!" alt="" />\
</div>\
</div>'],
SUBMENU: ['<span class="stats-subbar"><span class="today sub-active" onClick="App.Actions.loadStats(\'today\')">today</span>\
<span class="week" onClick="App.Actions.loadStats(\'week\')">week</span>\
<span class="month" onClick="App.Actions.loadStats(\'month\')">month</span>\
<span class="year" onClick="App.Actions.loadStats(\'year\')">year</span></div>']
SUBMENU: ['<div class="date-range-controls stats-subbar"><span class="motive">Genarate For:</span><span class="date-range-control today active" onClick="App.Actions.loadStats(\'today\')">today</span>\
<span class="date-range-control week" onClick="App.Actions.loadStats(\'week\')">week</span>\
<span class="date-range-control month" onClick="App.Actions.loadStats(\'month\')">month</span>\
<span class="date-range-control year" onClick="App.Actions.loadStats(\'year\')">year</span></div>'],
FILTERS: ['<div class="stats-components">\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-la" class="cust-checkbox" type="checkbox" value=""/>\
<label for="stats-la" class="cust-checkbox-title">la</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-mem" class="cust-checkbox" type="checkbox" value=""/>\
<label for="stats-mem" class="cust-checkbox-title">mem</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-mysql" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-mysql" class="cust-checkbox-title">mysql</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-postgres" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-postgres" class="cust-checkbox-title">postgres</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-vsftpd" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-vsftpd" class="cust-checkbox-title">vsftpd</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-httpd" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-httpd" class="cust-checkbox-title">httpd</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-nginx" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-nginx" class="cust-checkbox-title">nginx</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-bandwidth" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-bandwidth" class="cust-checkbox-title">bandwidth</label>\
</span>\
<span class="cust-checkbox-wrap stats-component">\
<input id="stats-ssh" class="cust-checkbox" type="checkbox" value="" />\
<label for="stats-ssh" class="cust-checkbox-title">ssh</label>\
</span>\
</div>']
}
}