Merge pull request #291 from pi-hole/devel

NEW RELEASE BECAUSE GITHUBS TAGGING IS A BIT BROKEN

api.php

@@ -70,7 +70,16 @@
     }
     elseif (isset($_GET['disable'], $_GET['token']) && $auth) {
         check_csrf($_GET['token']);
-        exec('sudo pihole disable');
+        $disable = intval($_GET['disable']);
+        // intval returns the integer value on success, or 0 on failure
+        if($disable > 0)
+        {
+            exec("sudo pihole disable ".$disable."s");
+        }
+        else
+        {
+            exec('sudo pihole disable');
+        }
         $data = array_merge($data, Array(
             "status" => "disabled"
         ));
@@ -80,6 +89,10 @@
         $data = array_merge($data, getGravity());
     }
 
+    if (isset($_GET['tailLog'])) {
+        $data = array_merge($data, tailPiholeLog($_GET['tailLog']));
+    }
+
     function filterArray(&$inArray) {
 	    $outArray = array();
 	    foreach ($inArray as $key=>$value) {

data.php

@@ -293,6 +293,33 @@
         return $allQueries;
     }
 
+    function tailPiholeLog($param) {
+        // Not using SplFileObject here, since direct
+        // usage of f-streams will be much faster for
+        // files as large as the pihole.log
+        global $logListName;
+        $file = fopen($logListName,"r");
+        $offset = intval($param);
+        if($offset > 0)
+        {
+            // Seeks on the file pointer where we want to continue reading is known
+            fseek($file, $offset);
+            $lines = [];
+            while (!feof($file)) {
+                array_push($lines,fgets($file));
+            }
+            return ["offset" => ftell($file), "lines" => $lines];
+        }
+        else
+        {
+            // Locate the current position of the file read/write pointer
+            fseek($file, -1, SEEK_END);
+            // Add one to skip the very last "\n" in the log file
+            return ["offset" => ftell($file)+1];
+        }
+        fclose($file);
+    }
+
     /******** Private Members ********/
     function gravityCount() {
         global $gravityListName,$blackListFile;

header.php

@@ -314,55 +314,114 @@
                 </div>
             </div>
             <!-- sidebar menu: : style can be found in sidebar.less -->
+            <?php
+            $scriptname = basename($_SERVER['SCRIPT_FILENAME']);
+            if($scriptname === "list.php")
+            {
+                if($_GET["l"] === "white")
+                {
+                    $scriptname = "whitelist";
+                }
+                elseif($_GET["l"] === "black")
+                {
+                    $scriptname = "blacklist";
+                }
+            }
+            ?>
             <ul class="sidebar-menu">
                 <li class="header">MAIN NAVIGATION</li>
                 <!-- Home Page -->
-                <li>
+                <li<?php if($scriptname === "index.php"){ ?> class="active"<?php } ?>>
                     <a href="index.php">
                         <i class="fa fa-home"></i> <span>Main Page</span>
                     </a>
                 </li>
                 <?php if($auth){ ?>
                 <!-- Query Log -->
-                <li>
+                <li<?php if($scriptname === "queries.php"){ ?> class="active"<?php } ?>>
                     <a href="queries.php">
                         <i class="fa fa-file-text-o"></i> <span>Query Log</span>
                     </a>
                 </li>
                 <!-- Whitelist -->
-                <li>
+                <li<?php if($scriptname === "whitelist"){ ?> class="active"<?php } ?>>
                     <a href="list.php?l=white">
                         <i class="fa fa-pencil-square-o"></i> <span>Whitelist</span>
                     </a>
                 </li>
                 <!-- Blacklist -->
-                <li>
+                <li<?php if($scriptname === "blacklist"){ ?> class="active"<?php } ?>>
                     <a href="list.php?l=black">
                         <i class="fa fa-ban"></i> <span>Blacklist</span>
                     </a>
                 </li>
-                <!-- Run gravity.sh -->
-                <li>
-                    <a href="gravity.php">
-                        <i class="fa fa-arrow-circle-down"></i> <span>Update Lists</span>
-                    </a>
-                </li>
-                <!-- Query adlists -->
-                <li>
-                    <a href="queryads.php">
-                        <i class="fa fa-search"></i> <span>Query adlists</span>
-                    </a>
-                </li>
                 <!-- Toggle -->
-                <?php
-                if ($pistatus == "1") {
-                  echo '                <li><a href="#" id="flip-status"><i class="fa fa-stop"></i> <span>Disable</span></a></li>';
-                } else {
-                  echo '                <li><a href="#" id="flip-status"><i class="fa fa-play"></i> <span>Enable</span></a></li>';
-                }
-                ?>
+
+                <li id="pihole-disable" class="treeview"<?php if ($pistatus == "0") { ?> hidden="true"<?php } ?>>
+                  <a href="#">
+                    <i class="fa fa-stop"></i> <span>Disable</span>&nbsp;&nbsp;&nbsp;<span id="flip-status-disable"></span>
+                    <span class="pull-right-container">
+                      <i class="fa fa-angle-down pull-right" style="padding-right: 5px;"></i>
+                    </span>
+                  </a>
+                  <ul class="treeview-menu">
+                    <li>
+                        <a href="#" id="pihole-disable-permanently">
+                            <i class="fa fa-stop"></i> <span>Permanently</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#" id="pihole-disable-10s">
+                            <i class="fa fa-clock-o"></i> <span>For 10 seconds</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#" id="pihole-disable-30s">
+                            <i class="fa fa-clock-o"></i> <span>For 30 seconds</span>
+                        </a>
+                    </li>
+                    <li>
+                        <a href="#" id="pihole-disable-5m">
+                            <i class="fa fa-clock-o"></i> <span>For 5 minutes</span>
+                        </a>
+                    </li>
+                  </ul>
+                    <!-- <a href="#" id="flip-status"><i class="fa fa-stop"></i> <span>Disable</span></a> -->
+                </li>
+                <li id="pihole-enable" class="treeview"<?php if ($pistatus == "1") { ?> hidden="true"<?php } ?>>
+                    <a href="#"><i class="fa fa-play"></i> <span>Enable</span>&nbsp;&nbsp;&nbsp;<span id="flip-status-enable"></span></a>
+                </li>
+                <!-- Tools -->
+                <li class="treeview <?php if($scriptname === "gravity.php" || $scriptname === "queryads.php"){ ?>active<?php } ?>">
+                  <a href="#">
+                    <i class="fa fa-folder"></i> <span>Tools</span>
+                    <span class="pull-right-container">
+                      <i class="fa fa-angle-down pull-right" style="padding-right: 5px;"></i>
+                    </span>
+                  </a>
+                  <ul class="treeview-menu">
+                    <!-- Run gravity.sh -->
+                    <li<?php if($scriptname === "gravity.php"){ ?> class="active"<?php } ?>>
+                        <a href="gravity.php">
+                            <i class="fa fa-arrow-circle-down"></i> <span>Update Lists</span>
+                        </a>
+                    </li>
+                    <!-- Query adlists -->
+                    <li<?php if($scriptname === "queryads.php"){ ?> class="active"<?php } ?>>
+                        <a href="queryads.php">
+                            <i class="fa fa-search"></i> <span>Query adlists</span>
+                        </a>
+                    </li>
+                    <!-- Tail pihole.log -->
+                    <li<?php if($scriptname === "taillog.php"){ ?> class="active"<?php } ?>>
+                        <a href="taillog.php">
+                            <i class="fa fa-list-ul"></i> <span>Tail pihole.log</span>
+                        </a>
+                    </li>
+                  </ul>
+                </li>
                 <!-- Settings -->
-                <li>
+                <li<?php if($scriptname === "settings.php"){ ?> class="active"<?php } ?>>
                     <a href="settings.php">
                         <i class="fa fa-gears"></i> <span>Settings</span>
                     </a>
@@ -396,7 +455,7 @@
                 </li>
                 <?php if($auth){ ?>
                 <!-- Help -->
-                <li>
+                <li<?php if($scriptname === "help.php"){ ?> class="active"<?php } ?>>
                     <a href="help.php">
                         <i class="fa fa-question-circle"></i> <span>Help</span>
                     </a>

js/pihole/footer.js

@@ -8,34 +8,82 @@ $("body").on("click", function(event) {
     }
 });
 
-// Enable/Disable
-$("#flip-status").on("click", (e) => {
-    e.preventDefault();
-    const btnStatus = $("#flip-status");
+function piholeChanged(action)
+{
     const status = $("#status");
-    const text = btnStatus.text().trim();
-    const token = encodeURIComponent($("#token").html());
+    const ena = $("#pihole-enable");
+    const dis = $("#pihole-disable");
 
-    switch(text) {
-        case "Enable":
-            btnStatus.html("<i class='fa fa-spinner'></i> <span>Enabling...</span>");
-            $.getJSON("api.php?enable&token=" + token, (data) => {
-                if(data.status === "enabled") {
-                    btnStatus.html("<i class='fa fa-stop'></i> <span>Disable</span>");
-                    status.html("<i class='fa fa-circle' style='color:#7FFF00'></i> Active");
-                }
-            });
-            break;
-        case "Disable":
-            btnStatus.html("<i class='fa fa-spinner'></i> <span>Disabling...</span>");
-            $.getJSON("api.php?disable&token=" + token, (data) => {
-                if(data.status === "disabled") {
-                    btnStatus.html("<i class='fa fa-play'></i> <span>Enable</span>");
-                    status.html("<i class='fa fa-circle' style='color:#FF0000'></i> Offline");
-                }
-            });
-            break;
+    switch(action) {
+        case "enabled":
+        status.html("<i class='fa fa-circle' style='color:#7FFF00'></i> Active");
+        ena.hide();
+        dis.show();
+        dis.removeClass("active");
+        break;
+
+        case "disabled":
+        status.html("<i class='fa fa-circle' style='color:#FF0000'></i> Offline");
+        ena.show();
+        dis.hide();
+        break;
     }
+
+}
+
+function piholeChange(action, duration)
+{
+    const token = encodeURIComponent($("#token").html());
+    var btnStatus;
+
+    switch(action) {
+        case "enable":
+        btnStatus = $("#flip-status-enable");
+        btnStatus.html("<i class='fa fa-spinner'> </i>");
+        $.getJSON("api.php?enable&token=" + token, (data) => {
+            if(data.status === "enabled") {
+                btnStatus.html("");
+                piholeChanged("enabled");
+            }
+        });
+        break;
+
+        case "disable":
+        btnStatus = $("#flip-status-disable");
+        btnStatus.html("<i class='fa fa-spinner'> </i>");
+        $.getJSON("api.php?disable=" + duration + "&token=" + token, (data) => {
+            if(data.status === "disabled") {
+                btnStatus.html("");
+                piholeChanged("disabled");
+            }
+        });
+        break;
+    }
+}
+
+// Handle Enable/Disable
+$("#pihole-enable").on("click", (e) => {
+    e.preventDefault();
+    piholeChange("enable","");
+});
+$("#pihole-disable-permanently").on("click", (e) => {
+    e.preventDefault();
+    piholeChange("disable","0");
+});
+$("#pihole-disable-10s").on("click", (e) => {
+    e.preventDefault();
+    piholeChange("disable","10");
+    setTimeout(function(){piholeChanged("enabled");},10000);
+});
+$("#pihole-disable-30s").on("click", (e) => {
+    e.preventDefault();
+    piholeChange("disable","30");
+    setTimeout(function(){piholeChanged("enabled");},30000);
+});
+$("#pihole-disable-5m").on("click", (e) => {
+    e.preventDefault();
+    piholeChange("disable","300");
+    setTimeout(function(){piholeChanged("enabled");},300000);
 });
 
 var piholeVersion = $("#piholeVersion").html();

js/pihole/taillog.js

@@ -0,0 +1,40 @@
+var offset, timer, pre, scrolling = true;
+
+// Check every 200msec for fresh data
+var interval = 200;
+
+// Function that asks the API for new data
+function reloadData(){
+    clearTimeout(timer);
+    $.getJSON("api.php?tailLog="+offset, function (data)
+    {
+        offset = data["offset"];
+        pre.append(data["lines"]);
+    });
+
+    if(scrolling)
+    {
+        window.scrollTo(0,document.body.scrollHeight);
+    }
+    timer = setTimeout(reloadData, interval);
+}
+
+$(function(){
+    // Get offset at first loading of page
+    $.getJSON("api.php?tailLog", function (data)
+    {
+        offset = data["offset"];
+    });
+    pre = $("#output");
+    // Trigger function that looks for new data
+    reloadData();
+});
+
+$("#chk1").click(function() {
+    $("#chk2").prop("checked",this.checked);
+    scrolling = this.checked;
+});
+$("#chk2").click(function() {
+    $("#chk1").prop("checked",this.checked);
+    scrolling = this.checked;
+});

taillog.php

@@ -0,0 +1,18 @@
+<?php
+    require "header.php";
+?>
+<!-- Title -->
+<div class="page-header">
+    <h1>Output the last lines of the pihole.log file (live)</h1>
+</div>
+
+<div class="checkbox"><label><input type="checkbox" name="active" checked id="chk1"> Automatic scrolling on update</label></div>
+<pre id="output" style="width: 100%; height: 100%;"></pre>
+<div class="checkbox"><label><input type="checkbox" name="active" checked id="chk2"> Automatic scrolling on update</label></div>
+
+<?php
+    require "footer.php";
+?>
+
+
+<script src="js/pihole/taillog.js"></script>