You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
186 lines
6.5 KiB
186 lines
6.5 KiB
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<link rel="stylesheet" href="css/main.css" id="theme">
|
|
<script src="/js/jquery.js"></script>
|
|
<script src="./js/moment.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script>
|
|
<script src="./js/Chart.Financial.js" type="text/javascript"></script>
|
|
<title>rtbw readout</title>
|
|
</head>
|
|
|
|
<body onload='begin();'>
|
|
<div id='status' style="position: fixed; right: 10; top: 5" class='status'>Connecting...</div>
|
|
|
|
<h1>Real-time board watcher readout</h1>
|
|
<p>
|
|
Spidering board: <em id='board'></em><br />
|
|
Server up since: <em id='uptime'></em><br />
|
|
Cycle interval: <em id='interval'></em><br />
|
|
Archiver interval: <em id='binterval'></em><br />
|
|
Server buffer purge interval: <em id='pinterval'></em><br />
|
|
Server aggregate buffer max size: <em id='spinterval'></em><br />
|
|
</p>
|
|
<hr></hr>
|
|
<h2>Total uptime stats</h2>
|
|
<ul>
|
|
<li>Total server cycles: <em id='at_upcycle'></em></li>
|
|
<li>Last no.: <em id='at_last'></em></li>
|
|
<li>Posts: <em id='at_posts'></em></li><!-- TODO: fill this out></-->
|
|
<li>Flag share: <em id='at_flagshare'></em> <a class='expand' id='at_flagshare_exp'>+</a></li>
|
|
<li>Avg. posts per cycle: <em id='at_avg'>0</em></li>
|
|
</ul>
|
|
<div style='padding-left: 10px'>
|
|
<div class='expshare' hidden id='at_flagshare_container' style="overflow-y: auto; height: 200px;">
|
|
<ul>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<h3>Posts by flag</h3>
|
|
<div style="height: 340px; ">
|
|
<div class='contain' style="height: 300px; width:80%; float:left;">
|
|
<canvas id='tPostsByFlag'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:right;">
|
|
<canvas id='tPostsByFlagPie'></canvas>
|
|
</div>
|
|
</div>
|
|
<h3>Other shares</h3>
|
|
<div style="height: 340px;">
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tNmaes'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tImages'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tThreads'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tIds'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tSubjects'></canvas>
|
|
</div>
|
|
</div>
|
|
Identity breakdown: <a class='expand' id='at_ident_bd_expand'>+</a>
|
|
<div>
|
|
<div class='expshare2' hidden id='at_idbd_share'>
|
|
<div class='indentbar'> </div>
|
|
<div style='padding-left: 17px'>
|
|
<div class='contain' style="height: 300px; width:20%;">
|
|
<canvas id='tNmaesDetailed'></canvas>
|
|
</div>
|
|
Show Anon <input type='checkbox' checked id='at_idbd_showanon' />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr></hr>
|
|
<h2>Session stats</h2>
|
|
<ul>
|
|
<li>Session started: <em id='s_started'></em></li>
|
|
<li>Total session cycles: <em id='s_upcycle'></em></li>
|
|
<li>Posts: <em id='s_posts'></em></li><!-- TODO: fill this out></-->
|
|
<li>Flag share: <em id='s_flagshare'></em> <a class='expand' id='s_flagshare_exp'>+</a></li>
|
|
<li>Avg. posts per cycle: <em id='s_avg'>0</em></li><!--TODO: Move this into another `This session' section></-->
|
|
</ul>
|
|
<div style='padding-left: 10px'>
|
|
<div class='expshare' hidden id='s_flagshare_container' style="overflow-y: auto; height: 200px;">
|
|
<ul>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<h3>Posts by flag</h3>
|
|
<div style="height: 340px; ">
|
|
<div class='contain' style="height: 300px; width:80%; float:left;">
|
|
<canvas id='tsPostsByFlag'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:right;">
|
|
<canvas id='tsPostsByFlagPie'></canvas>
|
|
</div>
|
|
</div>
|
|
<h3>Other shares</h3>
|
|
<div style="height: 340px;">
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tsNmaes'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tsImages'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tsThreads'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tsIds'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:20%; float:left;">
|
|
<canvas id='tsSubjects'></canvas>
|
|
</div>
|
|
</div>
|
|
Identity breakdown: <a class='expand' id='s_ident_bd_expand'>+</a>
|
|
<div>
|
|
<div class='expshare2' hidden id='s_idbd_share'>
|
|
<div class='indentbar'> </div>
|
|
<div style='padding-left: 17px'>
|
|
<div class='contain' style="height: 300px; width:20%;">
|
|
<canvas id='tsNmaesDetailed'></canvas>
|
|
</div>
|
|
Show Anon <input type='checkbox' checked id='s_idbd_showanon' />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h3>Average comparisons</h3>
|
|
<div class='contain' style="height: 300px; width:100%;">
|
|
<canvas id='tsCycleSpeed'></canvas>
|
|
</div>
|
|
<div class='ctlcont'><input id='cs_purge' type='button' value='Purge' /> Rollover at: <input type='textbox' id='cs_rlat' /> <em id='e_cs_rlat' class='error'></em></div>
|
|
|
|
<hr></hr>
|
|
<h2>Aggregate stats</h2>
|
|
<div class='contain' style="height: 300px; width:100%;">
|
|
<canvas id='tAgLine'></canvas>
|
|
</div>
|
|
<div class='contain' style="height: 300px; width:100%;">
|
|
<canvas id='tAgCandle'></canvas>
|
|
</div>
|
|
<div class='ctlcont'><input id='ag_shift' value=">>" type='button' /></div>
|
|
<hr></hr>
|
|
<h2>Live stats</h2>
|
|
<div class='contain' id='cycleSpeedC' style='overflox-x: scroll; position: relative; width: 100%; height: 300px;'>
|
|
<canvas id='cycleSpeed'></canvas>
|
|
</div>
|
|
<!-- style='position: absolute; left: 0; top: 0;pointer-events:none;'></-->
|
|
<div class='contain' style="height: 300px; width:100%;">
|
|
<canvas id='cycleBar'></canvas>
|
|
</div>
|
|
<div>
|
|
<div class='tab' style="overflow-y: auto; height: 200px; ">
|
|
<table id='cytb' style='width: 100%;'>
|
|
<thead>
|
|
<tr id='cytb_headers'>
|
|
<th>Timestamp</th>
|
|
<th>Last no.</th>
|
|
<th>Posts</th>
|
|
<th>% of avg.</th>
|
|
<th>Flag share</th>
|
|
<th>Names</th>
|
|
<th>Trips</th>
|
|
<th>Names+trips</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id='cytb_body'>
|
|
<tr hidden></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class='ctlcont'><input id='cytb_purge' type='button' value='Purge' /> Rollover at: <input type='textbox' id='cytb_rlat' /> <em id='e_rlat' class='error'></em></div>
|
|
</div>
|
|
|
|
|
|
<script src="js/cyclefunc.js"></script>
|
|
<script src="js/client.js"></script>
|
|
<script src="js/renderer.js"></script>
|
|
|
|
</body>
|
|
</html>
|