mirror of
https://github.com/pi-hole/web.git
synced 2024-12-06 19:36:21 +01:00
Mcat12
@@ -1,3 +1,52 @@
|
||||
<?php
|
||||
echo exec("/usr/local/bin/chronometer.sh -j");
|
||||
<?php
|
||||
include('data.php');
|
||||
header('Content-type: application/json');
|
||||
|
||||
$data = array();
|
||||
|
||||
if (isset($_GET['summaryRaw'])) {
|
||||
$data = array_merge($data, getSummaryData());
|
||||
}
|
||||
|
||||
if (isset($_GET['summary'])) {
|
||||
$sum = getSummaryData();
|
||||
$sum['ads_blocked_today'] = number_format( $sum['ads_blocked_today']);
|
||||
$sum['dns_queries_today'] = number_format( $sum['dns_queries_today']);
|
||||
$sum['ads_percentage_today'] = number_format( $sum['ads_percentage_today'], 1, '.', '');
|
||||
$sum['domains_being_blocked'] = number_format( $sum['domains_being_blocked']);
|
||||
$data = array_merge($data, $sum);
|
||||
}
|
||||
|
||||
if (isset($_GET['overTimeData'])) {
|
||||
$data = array_merge($data, getOverTimeData());
|
||||
}
|
||||
|
||||
if (isset($_GET['topItems'])) {
|
||||
$data = array_merge($data, getTopItems());
|
||||
}
|
||||
|
||||
if (isset($_GET['recentItems'])) {
|
||||
if (is_numeric($_GET['recentItems'])) {
|
||||
$data = array_merge($data, getRecentItems($_GET['recentItems']));
|
||||
}
|
||||
}
|
||||
|
||||
if (isset($_GET['getQueryTypes'])) {
|
||||
$data = array_merge($data, getIpvType());
|
||||
}
|
||||
|
||||
if (isset($_GET['getForwardDestinations'])) {
|
||||
$data = array_merge($data, getForwardDestinations());
|
||||
}
|
||||
|
||||
if (isset($_GET['getQuerySources'])) {
|
||||
$data = array_merge($data, getQuerySources());
|
||||
}
|
||||
|
||||
if (isset($_GET['getAllQueries'])) {
|
||||
$data = array_merge($data, getAllQueries());
|
||||
}
|
||||
|
||||
|
||||
echo json_encode($data);
|
||||
?>
|
||||
|
||||
@@ -0,0 +1,254 @@
|
||||
<?php
|
||||
$domains = Array();
|
||||
$log = Array();
|
||||
$ipv6 = file_exists("/etc/pihole/.useIPv6");
|
||||
|
||||
/******* Public Members ********/
|
||||
function getSummaryData() {
|
||||
global $ipv6;
|
||||
$domains = readInBlockList();
|
||||
$log = readInLog();
|
||||
$domains_being_blocked = count($domains) / ($ipv6 ? 2 : 1);
|
||||
|
||||
$dns_queries_today = count(getDnsQueries($log));
|
||||
|
||||
$ads_blocked_today = count(getBlockedQueries($log));
|
||||
|
||||
$ads_percentage_today = $ads_blocked_today / $dns_queries_today * 100;
|
||||
|
||||
return array(
|
||||
'domains_being_blocked' => $domains_being_blocked,
|
||||
'dns_queries_today' => $dns_queries_today,
|
||||
'ads_blocked_today' => $ads_blocked_today,
|
||||
'ads_percentage_today' => $ads_percentage_today,
|
||||
);
|
||||
}
|
||||
|
||||
function getOverTimeData() {
|
||||
$domains = readInBlockList();
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
$ads_blocked = getBlockedQueries($log);
|
||||
|
||||
$domains_over_time = overTime($dns_queries);
|
||||
$ads_over_time = overTime($ads_blocked);
|
||||
alignTimeArrays($ads_over_time, $domains_over_time);
|
||||
return Array(
|
||||
'domains_over_time' => $domains_over_time,
|
||||
'ads_over_time' => $ads_over_time,
|
||||
);
|
||||
}
|
||||
|
||||
function getTopItems() {
|
||||
$domains = readInBlockList();
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
$ads_blocked = getBlockedQueries($log);
|
||||
|
||||
$topAds = topItems($ads_blocked);
|
||||
$topQueries = topItems($dns_queries, $topAds);
|
||||
|
||||
return Array(
|
||||
'top_queries' => $topQueries,
|
||||
'top_ads' => $topAds,
|
||||
);
|
||||
}
|
||||
|
||||
function getRecentItems($qty) {
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
return Array(
|
||||
'recent_queries' => getRecent($dns_queries, $qty)
|
||||
);
|
||||
}
|
||||
|
||||
function getIpvType() {
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
$queryTypes = array();
|
||||
|
||||
foreach($dns_queries as $query) {
|
||||
$info = trim(explode(": ", $query)[1]);
|
||||
$queryType = explode(" ", $info)[0];
|
||||
if (isset($queryTypes[$queryType])) {
|
||||
$queryTypes[$queryType]++;
|
||||
}
|
||||
else {
|
||||
$queryTypes[$queryType] = 1;
|
||||
}
|
||||
}
|
||||
|
||||
return $queryTypes;
|
||||
}
|
||||
|
||||
function getForwardDestinations() {
|
||||
$log = readInLog();
|
||||
$forwards = getForwards($log);
|
||||
$destinations = array();
|
||||
foreach ($forwards as $forward) {
|
||||
$exploded = explode(" ", trim($forward));
|
||||
$dest = $exploded[count($exploded) - 1];
|
||||
if (isset($destinations[$dest])) {
|
||||
$destinations[$dest]++;
|
||||
}
|
||||
else {
|
||||
$destinations[$dest] = 0;
|
||||
}
|
||||
}
|
||||
|
||||
return $destinations;
|
||||
|
||||
}
|
||||
|
||||
function getQuerySources() {
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
$sources = array();
|
||||
foreach($dns_queries as $query) {
|
||||
$exploded = explode(" ", $query);
|
||||
$ip = trim($exploded[count($exploded)-1]);
|
||||
if (isset($sources[$ip])) {
|
||||
$sources[$ip]++;
|
||||
}
|
||||
else {
|
||||
$sources[$ip] = 1;
|
||||
}
|
||||
}
|
||||
return $sources;
|
||||
}
|
||||
|
||||
function getAllQueries() {
|
||||
$allQueries = array("data" => array());
|
||||
$log = readInLog();
|
||||
$dns_queries = getDnsQueries($log);
|
||||
|
||||
foreach ($dns_queries as $query) {
|
||||
$time = date_create(substr($query, 0, 16), new DateTimeZone('GMT'))->SetTimeZone(new DateTimeZone(date_default_timezone_get()));
|
||||
|
||||
$exploded = explode(" ", trim($query));
|
||||
array_push($allQueries['data'], array(
|
||||
$time->format('Y-m-d\TH:i:s'),
|
||||
substr($exploded[4], 6, -1),
|
||||
$exploded[5],
|
||||
$exploded[7],
|
||||
));
|
||||
}
|
||||
|
||||
return $allQueries;
|
||||
}
|
||||
|
||||
/******** Private Members ********/
|
||||
function readInBlockList() {
|
||||
global $domains;
|
||||
return count($domains) > 1 ? $domains :
|
||||
file("/etc/pihole/gravity.list");
|
||||
}
|
||||
function readInLog() {
|
||||
global $log;
|
||||
return count($log) > 1 ? $log :
|
||||
file("/var/log/pihole.log");
|
||||
}
|
||||
function getDnsQueries($log) {
|
||||
return array_filter($log, "findQueries");
|
||||
}
|
||||
function getBlockedQueries($log) {
|
||||
return array_filter($log, "findAds");
|
||||
}
|
||||
function getForwards($log) {
|
||||
return array_filter($log, "findForwards");
|
||||
}
|
||||
|
||||
|
||||
function topItems($queries, $exclude = array(), $qty=10) {
|
||||
$splitQueries = array();
|
||||
foreach ($queries as $query) {
|
||||
$exploded = explode(" ", $query);
|
||||
$domain = trim($exploded[count($exploded) - 3]);
|
||||
if (!isset($exclude[$domain])) {
|
||||
if (isset($splitQueries[$domain])) {
|
||||
$splitQueries[$domain]++;
|
||||
}
|
||||
else {
|
||||
$splitQueries[$domain] = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
arsort($splitQueries);
|
||||
return array_slice($splitQueries, 0, $qty);
|
||||
}
|
||||
|
||||
function overTime($entries) {
|
||||
$byTime = array();
|
||||
foreach ($entries as $entry) {
|
||||
$time = date_create(substr($entry, 0, 16), new DateTimeZone('GMT'))->SetTimeZone(new DateTimeZone(date_default_timezone_get()));
|
||||
$hour = $time->format('G');
|
||||
|
||||
if (isset($byTime[$hour])) {
|
||||
$byTime[$hour]++;
|
||||
}
|
||||
else {
|
||||
$byTime[$hour] = 1;
|
||||
}
|
||||
}
|
||||
return $byTime;
|
||||
}
|
||||
|
||||
function alignTimeArrays(&$times1, &$times2) {
|
||||
$max = max(array(max(array_keys($times1)), max(array_keys($times2))));
|
||||
$min = min(array(min(array_keys($times1)), min(array_keys($times2))));
|
||||
|
||||
for ($i = $min; $i <= $max; $i++) {
|
||||
if (!isset($times2[$i])) {
|
||||
$times2[$i] = 0;
|
||||
}
|
||||
if (!isset($times1[$i])) {
|
||||
$times1[$i] = 0;
|
||||
}
|
||||
}
|
||||
|
||||
ksort($times1);
|
||||
ksort($times2);
|
||||
}
|
||||
|
||||
function getRecent($queries, $qty){
|
||||
$recent = array();
|
||||
foreach (array_slice($queries, -$qty) as $query) {
|
||||
$queryArray = array();
|
||||
$exploded = explode(" ", $query);
|
||||
$time = date_create(substr($query, 0, 16), new DateTimeZone('GMT'))->SetTimeZone(new DateTimeZone(date_default_timezone_get()));
|
||||
$queryArray['time'] = $time->format('h:i:s a');
|
||||
$queryArray['domain'] = trim($exploded[count($exploded) - 3]);
|
||||
$queryArray['ip'] = trim($exploded[count($exploded)-1]);
|
||||
array_push($recent, $queryArray);
|
||||
|
||||
}
|
||||
return array_reverse($recent);
|
||||
}
|
||||
|
||||
function findQueries($var) {
|
||||
return strpos($var, ": query[") !== false;
|
||||
}
|
||||
|
||||
function findAds($var) {
|
||||
return strpos($var, "gravity.list") !== false;
|
||||
}
|
||||
|
||||
function findForwards($var) {
|
||||
return strpos($var, ": forwarded") !== false;
|
||||
}
|
||||
|
||||
/*
|
||||
$data = array(
|
||||
'domains_being_blocked' => $domains_being_blocked,
|
||||
'dns_queries_today' => $dns_queries_today,
|
||||
'ads_blocked_today' => $ads_blocked_today,
|
||||
'ads_percentage_today' => $ads_percentage_today,
|
||||
'top_queries' => $topQueries,
|
||||
'top_ads' => $topAds,
|
||||
'domains_over_time' => $domains_over_time,
|
||||
'ads_over_time' => $ads_over_time,
|
||||
'recent_queries' => getRecent($dns_queries, 20),
|
||||
);
|
||||
|
||||
*/
|
||||
?>
|
||||
@@ -16,5 +16,9 @@
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="./js/app.min.js" type="text/javascript"></script>
|
||||
|
||||
<script src="https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js" type="text/javascript"></script>
|
||||
<script src="https://cdn.datatables.net/1.10.11/js/dataTables.bootstrap.min.js" type="text/javascript"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
+18
-4
@@ -9,11 +9,15 @@
|
||||
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="https://cdn.datatables.net/1.10.10/css/dataTables.bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="https://cdn.datatables.net/1.10.11/css/dataTables.bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<link href="./css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="./css/skin-blue.min.css" rel="stylesheet" type="text/css" />
|
||||
<link rel="icon" type="image/png" href="img/pihole-160x160.jpg" />
|
||||
<style type="text/css">
|
||||
.glow { text-shadow: 0px 0px 5px #fff; }
|
||||
h3 { transition-duration: 500ms }
|
||||
</style>
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
@@ -108,24 +112,34 @@
|
||||
<i class="fa fa-home"></i> <span>Main Page</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Donate -->
|
||||
<!-- Query Log -->
|
||||
<li>
|
||||
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=3J2L3Z4DHW9UY">
|
||||
<i class="fa fa-paypal"></i> <span>Donate</span>
|
||||
<a href="queries.php">
|
||||
<i class="fa fa-file-text-o"></i> <span>Query Log</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Whitelist -->
|
||||
<!--
|
||||
<li>
|
||||
<a href="list.php?l=white">
|
||||
<i class="fa fa-pencil-square-o"></i> <span>Whitelist</span>
|
||||
</a>
|
||||
</li>
|
||||
-->
|
||||
<!-- Blacklist -->
|
||||
<!--
|
||||
<li>
|
||||
<a href="list.php?l=black">
|
||||
<i class="fa fa-pencil-square-o"></i> <span>Blacklist</span>
|
||||
</a>
|
||||
</li>
|
||||
-->
|
||||
<!-- Donate -->
|
||||
<li>
|
||||
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=3J2L3Z4DHW9UY">
|
||||
<i class="fa fa-paypal"></i> <span>Donate</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<!-- /.sidebar -->
|
||||
|
||||
@@ -1,13 +1,5 @@
|
||||
<?php
|
||||
require "header.html";
|
||||
|
||||
$output = exec('/usr/local/bin/chronometer.sh -j');
|
||||
$outj = json_decode($output);
|
||||
$domains_being_blocked = $outj->domains_being_blocked;
|
||||
$dns_queries_today = $outj->dns_queries_today;
|
||||
$ads_blocked_today = $outj->ads_blocked_today;
|
||||
$ads_percentage_today = $outj->ads_percentage_today;
|
||||
exec('grep -F "query[A]" /var/log/pihole.log | cut -d " " -f 6 | sort | uniq -c | sort -nr | head -n 100', $frequent_queries);
|
||||
?>
|
||||
|
||||
<!-- Small boxes (Stat box) -->
|
||||
@@ -16,13 +8,12 @@
|
||||
<!-- small box -->
|
||||
<div class="small-box bg-aqua">
|
||||
<div class="inner">
|
||||
<h3><?php echo number_format($ads_blocked_today) ?></h3>
|
||||
<h3 class="statistic" id="ads_blocked_today">---</h3>
|
||||
<p>Ads Blocked Today</p>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<i class="ion ion-android-hand"></i>
|
||||
</div>
|
||||
<a href="#frequent_queries_box" role="button" data-toggle="collapse" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ./col -->
|
||||
@@ -30,13 +21,12 @@
|
||||
<!-- small box -->
|
||||
<div class="small-box bg-green">
|
||||
<div class="inner">
|
||||
<h3><?php echo number_format($dns_queries_today) ?></h3>
|
||||
<h3 class="statistic" id="dns_queries_today">---</h3>
|
||||
<p>DNS Queries Today</p>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<i class="ion ion-earth"></i>
|
||||
</div>
|
||||
<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ./col -->
|
||||
@@ -44,14 +34,12 @@
|
||||
<!-- small box -->
|
||||
<div class="small-box bg-yellow">
|
||||
<div class="inner">
|
||||
<h3><?php echo number_format($ads_percentage_today, 2, '.', '') ?><sup style="font-size: 20px">%</sup></h3>
|
||||
<h3 class="statistic" id="ads_percentage_today">---</h3>
|
||||
<p>Of Today's Traffic Is Ads</p>
|
||||
</div>
|
||||
|
||||
<div class="icon">
|
||||
<i class="ion ion-pie-graph"></i>
|
||||
</div>
|
||||
<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ./col -->
|
||||
@@ -59,47 +47,310 @@
|
||||
<!-- small box -->
|
||||
<div class="small-box bg-red">
|
||||
<div class="inner">
|
||||
<h3><sup style="font-size: 30px"><?php echo number_format($domains_being_blocked) ?></sup></h3>
|
||||
<h3 class="statistic" id="domains_being_blocked"><sup style="font-size: 30px">---</sup></h3>
|
||||
<p>Domains Being Blocked</p>
|
||||
</div>
|
||||
<div class="icon">
|
||||
<i class="ion ion-ios-list"></i>
|
||||
</div>
|
||||
<a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ./col -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
<div class="box box-success collapse" id="frequent_queries_box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Frequent queries</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<!-- Buttons, labels, and many other things can be placed here! -->
|
||||
<!-- Here is a label for example -->
|
||||
</div><!-- /.box-tools -->
|
||||
</div><!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<table id="frequent_queries" class="table table-striped table-bordered" cellspacing="0">
|
||||
<thead><tr><th>N. of queries</th><th>Domain</th></tr></thead>
|
||||
<?php
|
||||
foreach ($frequent_queries as $key => $value) {
|
||||
$a = explode(" ", trim($value));
|
||||
echo "<tr><td>{$a[0]}</td><td>{$a[1]}</td></tr>";
|
||||
}
|
||||
?>
|
||||
</table>
|
||||
</div><!-- /.box-body -->
|
||||
</div><!-- /.box -->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="box" id="queries-over-time">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Queries over time</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="queryOverTimeChart" style="height: 247px; width: 466px;" width="932" height="494"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="box" id="query-types">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Query Types</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="queryTypeChart" style="height: 247px; width: 466px;" width="932" height="494"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="box" id="top-clients">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Top Clients</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="topClientsChart" style="height: 247px; width: 466px;" width="932" height="494"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="box" id="forward-destinations">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Forward Destinations</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="chart">
|
||||
<canvas id="forwardDestinationChart" style="height: 247px; width: 466px;" width="932" height="494"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="box" id="domain-frequency">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Top Domains</h3>
|
||||
</div>
|
||||
<!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<table class="table table-bordered">
|
||||
<tbody><tr>
|
||||
<th>Domain</th>
|
||||
<th>Hits</th>
|
||||
<th>Frequency</th>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
<!-- /.box -->
|
||||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-md-6">
|
||||
<div class="box" id="ad-frequency">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Top Advertisers</h3>
|
||||
</div>
|
||||
<!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<table class="table table-bordered">
|
||||
<tbody><tr>
|
||||
<th>Domain</th>
|
||||
<th>Hits</th>
|
||||
<th>Frequency</th>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</div>
|
||||
<div class="overlay">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
<!-- /.box -->
|
||||
</div>
|
||||
<!-- /.col -->
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
|
||||
<?php
|
||||
require "footer.php";
|
||||
?>
|
||||
|
||||
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js" type="text/javascript"></script>
|
||||
<script src="https://cdn.datatables.net/1.10.10/js/dataTables.bootstrap.min.js" type="text/javascript"></script>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$('#frequent_queries').DataTable({"order": [[ 0, "desc" ]]});
|
||||
<script type="text/javascript">
|
||||
summaryData = <?=json_encode($data)?>;
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
// Pull in data via AJAX
|
||||
|
||||
updateSummaryData();
|
||||
|
||||
updateQueriesOverTime();
|
||||
|
||||
updateQueryTypes();
|
||||
|
||||
updateTopClientsChart();
|
||||
|
||||
updateForwardDestinations();
|
||||
|
||||
updateTopLists();
|
||||
|
||||
|
||||
// Create charts
|
||||
var chartData = {
|
||||
labels: [],
|
||||
datasets: [
|
||||
{
|
||||
label: "All Queries",
|
||||
fillColor: "rgba(220,220,220,0.5)",
|
||||
strokeColor: "rgba(0, 166, 90,.8)",
|
||||
},
|
||||
{
|
||||
label: "Ad Queries",
|
||||
fillColor: "rgba(243,156,18,0.5)",
|
||||
strokeColor: "rgba(243,156,18,1)",
|
||||
pointColor: "rgba(243,156,18,1)",
|
||||
}
|
||||
]
|
||||
};
|
||||
var ctx = document.getElementById("queryOverTimeChart").getContext("2d");
|
||||
timeLineChart = new Chart(ctx).Line(chartData, {pointDot : false, legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>"
|
||||
});
|
||||
|
||||
ctx = document.getElementById("queryTypeChart").getContext("2d");
|
||||
queryTypeChart = new Chart(ctx).Doughnut([],{ legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].strokeColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>" });
|
||||
|
||||
ctx = document.getElementById("forwardDestinationChart").getContext("2d");
|
||||
forwardDestinationChart = new Chart(ctx).Doughnut([],{ legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].strokeColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>" });
|
||||
|
||||
var radarChartData = {
|
||||
labels: [],
|
||||
datasets: [
|
||||
{
|
||||
label: "Top Clients",
|
||||
fillColor: "rgba(220,220,220,0.5)",
|
||||
strokeColor: "rgba(0, 166, 90,.8)",
|
||||
data: []
|
||||
}
|
||||
]
|
||||
};
|
||||
ctx = document.getElementById("topClientsChart").getContext("2d");
|
||||
topClientsChart = new Chart(ctx).Radar(radarChartData, {});
|
||||
});
|
||||
|
||||
|
||||
// Functions to oupdate data in page
|
||||
|
||||
function updateSummaryData(runOnce) {
|
||||
$.getJSON("api.php?summary", function LoadSummaryData(data) {
|
||||
//$("h3.statistic").addClass("glow");
|
||||
if ($("h3#ads_blocked_today").text() != data.ads_blocked_today) {
|
||||
$("h3#ads_blocked_today").addClass("glow");
|
||||
}
|
||||
if ($("h3#dns_queries_today").text() != data.dns_queries_today) {
|
||||
$("h3#dns_queries_today").addClass("glow");
|
||||
}
|
||||
if ($("h3#ads_percentage_today").text() != data.ads_percentage_today) {
|
||||
$("h3#ads_percentage_today").addClass("glow");
|
||||
}
|
||||
|
||||
window.setTimeout(function(){
|
||||
$("h3#ads_blocked_today").text(data.ads_blocked_today);
|
||||
$("h3#dns_queries_today").text(data.dns_queries_today);
|
||||
$("h3#domains_being_blocked").text(data.domains_being_blocked);
|
||||
$("h3#ads_percentage_today").text(data.ads_percentage_today + "%");
|
||||
$("h3.statistic.glow").removeClass("glow")
|
||||
}, 500);
|
||||
}).done(function() {
|
||||
if (runOnce !== true) {
|
||||
setTimeout(updateSummaryData, 10000);
|
||||
}
|
||||
}).fail(function() {
|
||||
if (runOnce !== true) {
|
||||
setTimeout(updateSummaryData, (1000 * 60 * 5));
|
||||
}
|
||||
});;
|
||||
}
|
||||
|
||||
function updateQueriesOverTime() {
|
||||
$.getJSON("api.php?overTimeData", function(data) {
|
||||
for (hour in data.ads_over_time) {
|
||||
timeLineChart.addData([data.domains_over_time[hour], data.ads_over_time[hour]], hour + ":00");
|
||||
}
|
||||
$('#queries-over-time .overlay').remove();
|
||||
//$('#queries-over-time').append(timeLineChart.generateLegend());
|
||||
});
|
||||
}
|
||||
|
||||
function updateTopClientsChart() {
|
||||
$.getJSON("api.php?getQuerySources", function(data) {
|
||||
console.log(data);
|
||||
$.each(data, function(key, value) {
|
||||
topClientsChart.addData([value], key);
|
||||
});
|
||||
|
||||
$('#top-clients .overlay').remove();
|
||||
//$('#queries-over-time').append(timeLineChart.generateLegend());
|
||||
});
|
||||
}
|
||||
|
||||
function updateQueryTypes() {
|
||||
$.getJSON("api.php?getQueryTypes", function(data) {
|
||||
var colors = [];
|
||||
$.each($.AdminLTE.options.colors, function(key, value) { colors.push(value); });
|
||||
$.each(data, function(key , value) {
|
||||
queryTypeChart.addData({
|
||||
value: value,
|
||||
color: colors.shift(),
|
||||
label: key
|
||||
});
|
||||
});
|
||||
$('#query-types .overlay').remove();
|
||||
//$('#query-types').append(queryTypeChart.generateLegend());
|
||||
});
|
||||
}
|
||||
|
||||
function updateForwardDestinations() {
|
||||
$.getJSON("api.php?getForwardDestinations", function(data) {
|
||||
var colors = [];
|
||||
$.each($.AdminLTE.options.colors, function(key, value) { colors.push(value); });
|
||||
$.each(data, function(key , value) {
|
||||
forwardDestinationChart.addData({
|
||||
value: value,
|
||||
color: colors.shift(),
|
||||
label: key
|
||||
});
|
||||
});
|
||||
$('#forward-destinations .overlay').remove();
|
||||
//$('#forward-destinations').append(forwardDestinationChart.generateLegend());
|
||||
});
|
||||
}
|
||||
|
||||
function updateTopLists() {
|
||||
$.getJSON("api.php?summaryRaw&topItems", function(data) {
|
||||
var domaintable = $('#domain-frequency').find('tbody:last');
|
||||
var adtable = $('#ad-frequency').find('tbody:last');
|
||||
for (domain in data.top_queries) {
|
||||
domaintable.append('<tr> <td>' + domain +
|
||||
'</td> <td>' + data.top_queries[domain] + '</td> <td> <div class="progress progress-sm"> <div class="progress-bar progress-bar-green" style="width: ' +
|
||||
data.top_queries[domain] / data.dns_queries_today * 100 + '%"></div> </div> </td> </tr> ');
|
||||
}
|
||||
for (domain in data.top_ads) {
|
||||
adtable.append('<tr> <td>' + domain +
|
||||
'</td> <td>' + data.top_ads[domain] + '</td> <td> <div class="progress progress-sm"> <div class="progress-bar progress-bar-yellow" style="width: ' +
|
||||
data.top_ads[domain] / data.ads_blocked_today * 100 + '%"></div> </div> </td> </tr> ');
|
||||
}
|
||||
|
||||
$('#domain-frequency .overlay').remove();
|
||||
$('#ad-frequency .overlay').remove();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
+70
@@ -0,0 +1,70 @@
|
||||
<?php
|
||||
require "header.html";
|
||||
?>
|
||||
|
||||
<!--
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<button class="btn btn-info margin-bottom pull-right">Refresh Data</button>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="box" id="recent-queries">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Recent Queries</h3>
|
||||
</div>
|
||||
<!-- /.box-header -->
|
||||
<div class="box-body">
|
||||
<table id="all-queries" class="display table table-striped table-bordered" cellspacing="0" width="100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Time</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Client</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Time</th>
|
||||
<th>Type</th>
|
||||
<th>Domain</th>
|
||||
<th>Client</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
<!-- /.box-body -->
|
||||
</div>
|
||||
<!-- /.box -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.row -->
|
||||
|
||||
<?php
|
||||
require "footer.php";
|
||||
?>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
tableApi = $('#all-queries').DataTable( {
|
||||
"ajax": "api.php?getAllQueries",
|
||||
"autoWidth" : false,
|
||||
"order" : [[0, "desc"]],
|
||||
"columns": [
|
||||
{ "width" : "20%", "type": "date" },
|
||||
{ "width" : "10%" },
|
||||
{ "width" : "40%" },
|
||||
{ "width" : "15%" },
|
||||
]
|
||||
})
|
||||
} );
|
||||
|
||||
function refreshData() {
|
||||
tableApi.ajax.url("api.php?getAllQuerie").load();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user