[UPDATE] block graphs

This commit is contained in:
iAmShorty 2014-02-28 13:41:40 +01:00
parent 161fb98a92
commit 7924ea0545
5 changed files with 96 additions and 61 deletions

View File

@ -40,10 +40,10 @@ $(document).ready(function() {
var plotObj = $.plot($("#flot-line-chart"), [{
data: sin,
label: "sin(x)"
label: "test 1"
}, {
data: cos,
label: "cos(x)"
label: "test 2"
}],
options);
}

6
public/templates/bootstrap/master.tpl Executable file → Normal file
View File

@ -72,14 +72,16 @@
<script src="{$PATH}/js/jquery-1.10.2.js"></script>
<script src="{$PATH}/js/bootstrap.min.js"></script>
<script src="{$PATH}/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<!--[if lte IE 8]><script src="js/excanvas.min.js"></script><![endif]-->
<script src="{$PATH}/js/plugins/flot/jquery.flot.js"></script>
<script src="{$PATH}/js/plugins/flot/jquery.flot.tooltip.min.js"></script>
<script src="{$PATH}/js/plugins/flot/jquery.flot.resize.js"></script>
<script src="{$PATH}/js/plugins/flot/jquery.flot.pie.js"></script>
<script src="{$PATH}/js/plugins/morris/raphael-2.1.0.min.js"></script>
<script src="{$PATH}/js/mpos.js"></script>
<script type="text/javascript" src="{$PATH}/js/justgage.1.0.1.min.js"></script>
<script type="text/javascript" src="{$PATH}/js/justgage.1.0.1.min.js"></script>
<!-- Page-Level Plugin Scripts - Flot -->
<!--[if lte IE 8]><script src="{$PATH}/js/excanvas.min.js"></script><![endif]-->
</body>
</html>

View File

@ -1,3 +1,4 @@
<div class="row">
<div class="col-lg-12">
<div class="panel panel-info">
<div class="panel-heading">
@ -182,3 +183,4 @@
</div>
<!-- /.col-lg-12 -->
</div>
</div>

View File

@ -1,57 +1,86 @@
<article class="module width_full">
<header><h3>Block Shares</h3></header>
<table width="70%" class="visualize" rel="line">
<caption>Block Shares</caption>
<thead>
<tr>
{section block $BLOCKSFOUND step=-1}
<th scope="col">{$BLOCKSFOUND[block].height}</th>
{/section}
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Expected</th>
{section block $BLOCKSFOUND step=-1}
<td>{$BLOCKSFOUND[block].estshares}</td>
{/section}
</tr>
<tr>
<th scope="row">Actual</th>
{section block $BLOCKSFOUND step=-1}
<td>{$BLOCKSFOUND[block].shares|default:"0"}</td>
{/section}
</tr>
{if $GLOBAL.config.payout_system == 'pplns'}<tr>
<th scope="row">PPLNS</th>
{section block $BLOCKSFOUND step=-1}
<td>{$BLOCKSFOUND[block].pplns_shares}</td>
{/section}
</tr>{/if}
{if $USEBLOCKAVERAGE}<tr>
<th scope="row">Average</th>
{section block $BLOCKSFOUND step=-1}
<td>{$BLOCKSFOUND[block].block_avg}</td>
{/section}
</tr>{/if}
</tbody>
</table>
<table class="tablesorter">
<tbody>
<tr>
<td>
<a href="{$smarty.server.SCRIPT_NAME}?page={$smarty.request.page|escape}&action={$smarty.request.action|escape}&height={if is_array($BLOCKSFOUND) && count($BLOCKSFOUND) > ($BLOCKLIMIT - 1)}{$BLOCKSFOUND[$BLOCKLIMIT - 1].height}{/if}&prev=1"><i class="fa fa-chevron-left fa"></i></a>
</td>
<td>
<a href="{$smarty.server.SCRIPT_NAME}?page={$smarty.request.page|escape}&action={$smarty.request.action|escape}&height={if is_array($BLOCKSFOUND) && count($BLOCKSFOUND) > 0}{$BLOCKSFOUND[0].height}{/if}&next=1"><i class="fa fa-chevron-right fa"></i></a>
</td>
</tr>
</tbody>
</table>
<footer>
<p style="padding-left:30px; padding-redight:30px; font-size:10px;">
The graph above illustrates N shares to find a block vs. E Shares expected to find a block based on
target and network difficulty and assuming a zero variance scenario.
</p>
</footer>
</article>
<script type="text/javascript">
$(function() {
var exp = [
{section block $BLOCKSFOUND step=-1}
[{$BLOCKSFOUND[block].time * 1000}, {$BLOCKSFOUND[block].estshares}],
{/section}
];
var act = [
{section block $BLOCKSFOUND step=-1}
[{$BLOCKSFOUND[block].time * 1000}, {$BLOCKSFOUND[block].shares|default:"0"}],
{/section}
];
var avg = [
{section block $BLOCKSFOUND step=-1}
[{$BLOCKSFOUND[block].time * 1000}, {$BLOCKSFOUND[block].block_avg}],
{/section}
];
function doPlot(position) {
$.plot($("#block-line-chart"), [{
data: exp,
label: "Expected Shares"
}, {
data: avg,
label: "Average Shares"
}, {
data: act,
label: "Actual Shares",
yaxis: 2
}], {
xaxes: [{
mode: 'time'
}],
yaxes: [{
min: 0
}, {
// align if we are to the right
alignTicksWithAxis: position == "right" ? 1 : null,
position: position
}],
grid: {
hoverable: true //IMPORTANT! this is needed for tooltip to work
},
tooltip: true,
tooltipOpts: {
content: "%s for %x was %y",
xDateFormat: "%y-%0m-%0d",
onHover: function(flotItem, $tooltipEl) {
// console.log(flotItem, $tooltipEl);
}
}
});
}
doPlot("right");
$("button").click(function() {
doPlot($(this).text());
});
});
</script>
<div class="row">
<div class="col-lg-12">
<div class="panel panel-info">
<div class="panel-heading">
Block Shares
</div>
<div class="panel-body">
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">
<div class="flot-chart">
<div class="flot-chart-content" id="block-line-chart"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -1,3 +1,4 @@
<div class="row">
<div class="col-lg-12">
<div class="panel panel-info">
<div class="panel-heading">
@ -78,3 +79,4 @@
</div>
<!-- /.col-lg-12 -->
</div>
</div>