Improved dashboard overview graphs and gauges

This commit is contained in:
Sebastian Grewe 2013-09-16 11:36:20 +02:00
parent 6a7d34181a
commit 4bbe40068a
5 changed files with 36 additions and 21 deletions

View File

@ -1,7 +1,6 @@
{if $smarty.session.AUTHENTICATED|default}
{assign var=payout_system value=$GLOBAL.config.payout_system}
{include file="dashboard/graph.tpl"}
{include file="dashboard/overview.tpl"}
{include file="dashboard/default_$payout_system.tpl"}
{include file="dashboard/gauges.tpl"}
{include file="dashboard/js.tpl"}
{/if}

View File

@ -1,12 +1,16 @@
<article class="module width_3_quarter">
<header><h3>Gauges</h3></header>
<div class="module_content">
<div style="display: inline-block; min-height: 250px;">
<div id="hashrate" style="width:150px; height:120px; float: left;"></div>
<div id="poolhashrate" style="width:150px; height:120px; float: left;"></div>
<div id="nethashrate" style="width:150px; height:120px; float: left;"></div>
<div id="sharerate" style="width:150px; height:120px; float: left;"></div>
<div id="querytime" style="width:150px; height:120px; float: left;"></div>
<div style="display: inline-block; width: 103px;">
<div id="poolhashrate" style="width:100px; height:80px;"></div>
<div id="sharerate" style="width:100px; height:80px;"></div>
</div>
<div style="display: inline-block;">
<div id="hashrate" style="width:200px; height:160px;"></div>
</div>
<div style="display: inline-block; width: 103px;">
<div id="nethashrate" style="width:100px; height:80px;"></div>
<div id="querytime" style="width:100px; height:80px;"></div>
</div>
</div>
<footer><p style="margin-left: 25px">Refresh interval: {$GLOBAL.config.statistics_ajax_refresh_interval|default:"10"} seconds. Hashrate based on shares submitted in the past {$INTERVAL|default:"5"} minutes.</p></footer>

View File

@ -1,9 +0,0 @@
<article class="module width_full">
<header><h3>Graphs</h3></header>
<div class="module_content">
<div id="hashrategraph" style="height:200px; width: 95%;"></div>
</div>
<footer>
<p style="margin-left: 25px">Refresh interval: {$GLOBAL.config.statistics_ajax_refresh_interval|default:"10"} seconds. Hashrate based on shares submitted in the past {$INTERVAL|default:"5"} minutes.</p>
</footer>
</article>

View File

@ -24,7 +24,6 @@ $(document).ready(function(){
// jqPlit defaults
var jqPlotOptions = {
title: 'Overview',
grid: { drawBorder: false, background: '#fbfbfb', shadow: false },
stackSeries: false,
seriesColors: [ '#26a4ed', '#ee8310', '#e9e744' ],
@ -36,7 +35,7 @@ $(document).ready(function(){
rendererOptions: { smooth: true }
},
series: [
{ yaxid: 'yaxis', label: 'Own', fill: true },
{ yaxis: 'yaxis', label: 'Own', fill: true },
{ yaxis: 'yaxis', label: 'Pool', fill: false, trendline: { show: false }, lineWidth: 2, markerOptions: { show: true, size: 4 }},
{ yaxis: 'y3axis', label: 'Sharerate', fill: false, trendline: { show: false } },
],
@ -44,7 +43,7 @@ $(document).ready(function(){
axes: {
yaxis: { min: 0, pad: 1.25, label: 'Hashrate' , labelRenderer: $.jqplot.CanvasAxisLabelRenderer },
y3axis: { min: 0, pad: 1.25, label: 'Sharerate', labelRenderer: $.jqplot.CanvasAxisLabelRenderer },
xaxis: { tickInterval: {/literal}{$GLOBAL.config.statistics_ajax_refresh_interval}{literal}, label: 'Time', labelRenderer: $.jqplot.CanvasAxisLabelRenderer, renderer: $.jqplot.DateAxisRenderer, angle: 30, tickOptions: { formatString: '%T' } },
xaxis: { tickInterval: {/literal}{$GLOBAL.config.statistics_ajax_refresh_interval}{literal}, labelRenderer: $.jqplot.CanvasAxisLabelRenderer, renderer: $.jqplot.DateAxisRenderer, angle: 30, tickOptions: { formatString: '%T' } },
},
};
@ -57,7 +56,7 @@ $(document).ready(function(){
g2 = new JustGage({id: "poolhashrate", value: parseFloat(data.getdashboarddata.pool.hashrate).toFixed(2), min: 0, max: Math.round(data.getdashboarddata.pool.hashrate * 2), title: "Pool Hashrate", label: "{/literal}{$GLOBAL.hashunits.pool}{literal}"});
g3 = new JustGage({id: "hashrate", value: parseFloat(data.getdashboarddata.personal.hashrate).toFixed(2), min: 0, max: Math.round(data.getdashboarddata.personal.hashrate * 2), title: "Hashrate", label: "{/literal}{$GLOBAL.hashunits.personal}{literal}"});
g4 = new JustGage({id: "sharerate", value: parseFloat(data.getdashboarddata.personal.sharerate).toFixed(2), min: 0, max: Math.round(data.getdashboarddata.personal.sharerate * 2), title: "Sharerate", label: "shares/s"});
g5 = new JustGage({id: "sharerate", value: parseFloat(data.getdashboarddata.runtime).toFixed(2), min: 0, max: Math.round(data.getdashboarddata.runtime * 3), title: "Querytime", label: "ms"});
g5 = new JustGage({id: "querytime", value: parseFloat(data.getdashboarddata.runtime).toFixed(2), min: 0, max: Math.round(data.getdashboarddata.runtime * 3), title: "Querytime", label: "ms"});
}
// Helper to refresh gauges

View File

@ -0,0 +1,22 @@
<article class="module width_full">
<header><h3>Overview</h3></header>
<div class="module_content">
<div style="display: inline-block;">
<div id="poolhashrate" style="width:100px; height:80px;"></div>
<div id="sharerate" style="width:100px; height:80px;"></div>
</div>
<div style="display: inline-block;">
<div id="hashrate" style="width:200px; height:160px;"></div>
</div>
<div style="display: inline-block;">
<div id="nethashrate" style="width:100px; height:80px;"></div>
<div id="querytime" style="width:100px; height:80px;"></div>
</div>
<div style="margin-left: 50px; display: inline-block; width: 70%;">
<div id="hashrategraph" style="height: 160px; width: 100%;"></div>
</div>
</div>
<footer>
<p style="margin-left: 25px">Refresh interval: {$GLOBAL.config.statistics_ajax_refresh_interval|default:"10"} seconds. Hashrate based on shares submitted in the past {$INTERVAL|default:"5"} minutes.</p>
</footer>
</article>