mirror of
https://github.com/pi-hole/web.git
synced 2025-12-25 05:05:33 +00:00
aabff35bef
- Dynamically fall back to PHP API functions to ensure API does always repond even if FTL is not runnung for some reason - Update PHP API from current devel branch - Increase flexibility in getQueryTypes API call - Hide top ads list if nothing to display - Proper display of activated privacy mode - Remove spinner (would otherwise not be removed for zero results) - Update tables every 10 seconds - Update query types and forward destinations plots every 10 seconds - More verbose output in top lists (total number next to percentage in tooltip) - Implemented "recentBlocked" keyword for API - Ensure compatibility with PHP5 version < 5.4 - Adjust output format of overTimeData10mins to comply with PHP API - Further speedup of Query Log page by showing only the recent 10 minutes by default - Hide temperature if FTL is not running and show FTL status - Add information to Settings page - Adjust error message when loading of query log failed - Move processing of domainname, clientIP, clientname and time interval filters for the Query Log page to FTL for speed enhancement - Generate link if pi.hole comes up in the Top Domains list - Remove resolve DNS names option - this is now enabled by default (daemon will only do it once per day instead of PHP-API which did it on every reloading of the web interface) - Add socket timeout of 10 seconds + modification to Settings page since FTL backend supports API_EXCLUDE_CLIENTS filtering with both IP addresses and host names (also mixed) - Improved Query Log page
226 lines
6.5 KiB
PHP
226 lines
6.5 KiB
PHP
<!-- Pi-hole: A black hole for Internet advertisements
|
|
* (c) 2017 Pi-hole, LLC (https://pi-hole.net)
|
|
* Network-wide ad blocking via your own hardware.
|
|
*
|
|
* This file is copyright under the latest version of the EUPL.
|
|
* Please see LICENSE file for your rights under this license. -->
|
|
<?php
|
|
$indexpage = true;
|
|
require "scripts/pi-hole/php/header.php";
|
|
?>
|
|
<!-- Small boxes (Stat box) -->
|
|
<div class="row">
|
|
<div class="col-lg-3 col-xs-12">
|
|
<!-- small box -->
|
|
<div class="small-box bg-aqua">
|
|
<div class="inner">
|
|
<h3 class="statistic" id="ads_blocked_today">---</h3>
|
|
<p>DNS Queries Blocked Today</p>
|
|
</div>
|
|
<div class="icon">
|
|
<i class="ion ion-android-hand"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-12">
|
|
<!-- small box -->
|
|
<div class="small-box bg-green">
|
|
<div class="inner">
|
|
<h3 class="statistic" id="dns_queries_today">---</h3>
|
|
<p>DNS Queries Today</p>
|
|
</div>
|
|
<div class="icon">
|
|
<i class="ion ion-earth"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-12">
|
|
<!-- small box -->
|
|
<div class="small-box bg-yellow">
|
|
<div class="inner">
|
|
<h3 class="statistic" id="ads_percentage_today">---</h3>
|
|
<p>Of Today's Queries Were Blocked</p>
|
|
</div>
|
|
<div class="icon">
|
|
<i class="ion ion-pie-graph"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-12">
|
|
<!-- small box -->
|
|
<div class="small-box bg-red">
|
|
<div class="inner">
|
|
<h3 class="statistic" id="domains_being_blocked">---</h3>
|
|
<p>Domains Being Blocked</p>
|
|
</div>
|
|
<div class="icon">
|
|
<i class="ion ion-ios-list"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
</div>
|
|
|
|
<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" width="800" height="250"></canvas>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php
|
|
// If the user is logged in, then we show the more detailed index page.
|
|
// Even if we would include them here anyhow, there would be nothing to
|
|
// show since the API will respect the privacy of the user if he defines
|
|
// a password
|
|
if($auth){ ?>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<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" width="400" height="150"></canvas>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<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" width="400" height="150"></canvas>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php
|
|
if($boxedlayout)
|
|
{
|
|
$tablelayout = "col-md-6";
|
|
}
|
|
else
|
|
{
|
|
$tablelayout = "col-md-6 col-lg-4";
|
|
}
|
|
?>
|
|
<div class="row">
|
|
<div class="<?php echo $tablelayout; ?>">
|
|
<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">
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered">
|
|
<tbody>
|
|
<tr>
|
|
<th>Domain</th>
|
|
<th>Hits</th>
|
|
<th>Frequency</th>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
<!-- /.box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="<?php echo $tablelayout; ?>">
|
|
<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">
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered">
|
|
<tbody>
|
|
<tr>
|
|
<th>Domain</th>
|
|
<th>Hits</th>
|
|
<th>Frequency</th>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
<!-- /.box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="<?php echo $tablelayout; ?>">
|
|
<div class="box" id="client-frequency">
|
|
<div class="box-header with-border">
|
|
<h3 class="box-title">Top Clients</h3>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered">
|
|
<tbody>
|
|
<tr>
|
|
<th>Client</th>
|
|
<th>Requests</th>
|
|
<th>Frequency</th>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="overlay">
|
|
<i class="fa fa-refresh fa-spin"></i>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
</div>
|
|
<!-- /.box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
</div>
|
|
<!-- /.row -->
|
|
<?php } ?>
|
|
<?php
|
|
require "scripts/pi-hole/php/footer.php";
|
|
?>
|
|
|
|
<script src="scripts/pi-hole/js/index.js"></script>
|