From 8ecd218908750ee9315696e09731dc14be684089 Mon Sep 17 00:00:00 2001
From: DL6ER <derigs@ph1.uni-koeln.de>
Date: Fri, 18 Nov 2016 21:31:30 +0100
Subject: [PATCH] Many changes that are documented in PR #197

---
 api.php            | 19 ++++++-----
 header.php         | 19 ++++++++---
 index.php          |  5 +--
 js/pihole/index.js | 85 ++++++++++++++++++++++++----------------------
 4 files changed, 72 insertions(+), 56 deletions(-)

diff --git a/api.php b/api.php
index c3db7fc4..dfdf9ac5 100644
--- a/api.php
+++ b/api.php
@@ -1,16 +1,16 @@
 <?php
     require "php/password.php";
-    if(!$auth)
-        exit();
+
     include('data.php');
     header('Content-type: application/json');
 
     $data = array();
 
-    if (isset($_GET['summaryRaw'])) {
+    if (isset($_GET['summaryRaw']) && $auth) {
         $data = array_merge($data,  getSummaryData());
     }
 
+    // Works without authorization
     if (isset($_GET['summary']) || !count($_GET)) {
         $sum = getSummaryData();
         $sum['ads_blocked_today'] = number_format( $sum['ads_blocked_today']);
@@ -20,33 +20,34 @@
         $data = array_merge($data,  $sum);
     }
 
+    // Works without authorization
     if (isset($_GET['overTimeData'])) {
         $data = array_merge($data,  getOverTimeData());
     }
 
-    if (isset($_GET['topItems'])) {
+    if (isset($_GET['topItems']) && $auth) {
         $data = array_merge($data,  getTopItems());
     }
 
-    if (isset($_GET['recentItems'])) {
+    if (isset($_GET['recentItems']) && $auth) {
         if (is_numeric($_GET['recentItems'])) {
             $data = array_merge($data,  getRecentItems($_GET['recentItems']));
         }
     }
 
-    if (isset($_GET['getQueryTypes'])) {
+    if (isset($_GET['getQueryTypes']) && $auth) {
         $data = array_merge($data, getIpvType());
     }
 
-    if (isset($_GET['getForwardDestinations'])) {
+    if (isset($_GET['getForwardDestinations']) && $auth) {
         $data = array_merge($data, getForwardDestinations());
     }
 
-    if (isset($_GET['getQuerySources'])) {
+    if (isset($_GET['getQuerySources']) && $auth) {
         $data = array_merge($data, getQuerySources());
     }
 
-    if (isset($_GET['getAllQueries'])) {
+    if (isset($_GET['getAllQueries']) && $auth) {
         $data = array_merge($data, getAllQueries());
     }
 
diff --git a/header.php b/header.php
index 091fb352..2d47040c 100644
--- a/header.php
+++ b/header.php
@@ -213,7 +213,6 @@
                 </div>
             </div>
             <!-- sidebar menu: : style can be found in sidebar.less -->
-            <?php if($auth){ ?>
             <ul class="sidebar-menu">
                 <li class="header">MAIN NAVIGATION</li>
                 <!-- Home Page -->
@@ -222,6 +221,7 @@
                         <i class="fa fa-home"></i> <span>Main Page</span>
                     </a>
                 </li>
+                <?php if($auth){ ?>
                 <!-- Query Log -->
                 <li>
                     <a href="queries.php?<?php echo $pwstring; ?>">
@@ -262,8 +262,16 @@
                     </a>
                 </li>
                 <?php } ?>
+                <?php } ?>
+                <!-- Login -->
+                <?php if(strlen($pwhash) > 0 && !$auth) { ?>
+                <li>
+                    <a href="index.php?login">
+                        <i class="fa fa-user"></i> <span>Login</span>
+                    </a>
+                </li>
+                <?php } ?>
             </ul>
-            <?php } ?>
         </section>
         <!-- /.sidebar -->
     </aside>
@@ -278,9 +286,12 @@
     // password is set at all, we keep the current
     // behavior: everything is always authorized
     // and will be displayed
-    if(!$auth){ ?>
+    //
+    // If auth is required and wrong, we show the reduced
+    // version of the summary (index) page
+    if(!$auth && (!isset($indexpage) || isset($_GET['login']))){ ?>
 <div class="page-header">
-    <h1>Not authorized!</h1>
+    <h1>Login required!</h1>
 </div>
 <form action="" method="POST">
   Password: <input type="password" name="pw">&nbsp;<input type="submit" value="Login">
diff --git a/index.php b/index.php
index 270be230..c05cf15e 100644
--- a/index.php
+++ b/index.php
@@ -1,4 +1,5 @@
 <?php
+    $indexpage = true;
     require "header.php";
 ?>
 <!-- Small boxes (Stat box) -->
@@ -75,7 +76,7 @@
       </div>
     </div>
 </div>
-
+<?php if($auth){ ?>
 <div class="row">
     <div class="col-md-6">
     <div class="box" id="query-types">
@@ -195,7 +196,7 @@
     <!-- /.col -->
 </div>
 <!-- /.row -->
-
+<?php } ?>
 <?php
     require "footer.php";
 ?>
diff --git a/js/pihole/index.js b/js/pihole/index.js
index 2851b19e..10942e93 100644
--- a/js/pihole/index.js
+++ b/js/pihole/index.js
@@ -17,7 +17,10 @@ $(document).ready(function() {
             return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Windows());
         }
     };
-    var animate = false;
+
+    // Get auth hash
+    hash = document.getElementById("hash").innerHTML;
+
     var ctx = document.getElementById("queryOverTimeChart").getContext("2d");
     timeLineChart = new Chart(ctx, {
         type: 'line',
@@ -69,57 +72,57 @@ $(document).ready(function() {
         }
     });
 
-    ctx = document.getElementById("queryTypeChart").getContext("2d");
-    queryTypeChart = new Chart(ctx, {
-        type: 'doughnut',
-        data: {
-            labels: [],
-            datasets: [{ data: [] }]
-        },
-        options: {
-            legend: {
-                display: false
+    if(!!document.getElementById("queryTypeChart"))
+    {
+        ctx = document.getElementById("queryTypeChart").getContext("2d");
+        queryTypeChart = new Chart(ctx, {
+            type: 'doughnut',
+            data: {
+                labels: [],
+                datasets: [{ data: [] }]
             },
-            animation: {
-                duration: 2000
-            },
-            cutoutPercentage: 0
-        }
-    });
+            options: {
+                legend: {
+                    display: false
+                },
+                animation: {
+                    duration: 2000
+                },
+                cutoutPercentage: 0
+            }
+        });
+        updateQueryTypes();
+    }
 
-    ctx = document.getElementById("forwardDestinationChart").getContext("2d");
-    forwardDestinationChart = new Chart(ctx, {
-        type: 'doughnut',
-        data: {
-            labels: [],
-            datasets: [{ data: [] }]
-        },
-        options: {
-            legend: {
-                display: false
+    if(!!document.getElementById("forwardDestinationChart"))
+    {
+        ctx = document.getElementById("forwardDestinationChart").getContext("2d");
+        forwardDestinationChart = new Chart(ctx, {
+            type: 'doughnut',
+            data: {
+                labels: [],
+                datasets: [{ data: [] }]
             },
-            animation: {
-                duration: 2000
-            },
-            cutoutPercentage: 0
-        }
-    });
-
-    // Get auth hash
-    hash = document.getElementById("hash").innerHTML;
-
+            options: {
+                legend: {
+                    display: false
+                },
+                animation: {
+                    duration: 2000
+                },
+                cutoutPercentage: 0
+            }
+        });
+        updateForwardDestinations();
+    }
     // Pull in data via AJAX
 
     updateSummaryData();
 
     updateQueriesOverTime();
 
-    updateQueryTypes();
-
     updateTopClientsChart();
 
-    updateForwardDestinations();
-
     updateTopLists();
 });