Show disable timer across all devices

api.php

@@ -71,6 +71,7 @@
     if (isset($_GET['enable'], $_GET['token']) && $auth) {
         check_csrf($_GET['token']);
         exec('sudo pihole enable');
+        unlink("../custom_disable_timer");
         $data = array_merge($data, Array(
             "status" => "enabled"
         ));
@@ -81,11 +82,14 @@
         // intval returns the integer value on success, or 0 on failure
         if($disable > 0)
         {
+            $timestamp = time();
             exec("sudo pihole disable ".$disable."s");
+            file_put_contents("../custom_disable_timer",($timestamp+$disable)*1000);
         }
         else
         {
             exec('sudo pihole disable');
+            unlink("../custom_disable_timer");
         }
         $data = array_merge($data, Array(
             "status" => "disabled"

scripts/pi-hole/js/footer.js

@@ -40,6 +40,7 @@ function piholeChanged(action)
 function piholeChange(action, duration)
 {
     var token = encodeURIComponent($("#token").html());
+    var enaT = $("#enableTimer");
     var btnStatus;
 
     switch(action) {
@@ -61,22 +62,17 @@ function piholeChange(action, duration)
                 if(data.status === "disabled") {
                     btnStatus.html("");
                     piholeChanged("disabled");
+                    enaT.html(new Date().getTime() + duration * 1000);
+                    setTimeout(countDown,100);
                 }
             });
             break;
     }
 }
 
-//The following three functions allow us to display time until pi-hole is enabled after disabling.
+//The following functions allow us to display time until pi-hole is enabled after disabling.
 //Works between all pages
 
-
-function setCountdownTarget(seconds){
-    var target = new Date();
-    target = new Date(target.getTime() + seconds * 1000);
-    localStorage.setItem("countDownTarget", target);
-}
-
 function secondsTimeSpanToHMS(s) {
     var h = Math.floor(s/3600); //Get whole hours
     s -= h*3600;
@@ -87,7 +83,8 @@ function secondsTimeSpanToHMS(s) {
 
 function countDown(){
     var ena = $("#enableLabel");
-    var target = new Date(localStorage.getItem("countDownTarget"));
+    var enaT = $("#enableTimer");
+    var target = new Date(parseInt(enaT.html()));
     var seconds = Math.round((target.getTime() - new Date().getTime()) / 1000);
 
     if(seconds > 0){
@@ -103,10 +100,12 @@ function countDown(){
 }
 
 $( document ).ready(function() {
-    var countDownTarget = localStorage.getItem("countDownTarget");
-    if (countDownTarget != null)
+    var enaT = $("#enableTimer");
+    var target = new Date(parseInt(enaT.html()));
+    var seconds = Math.round((target.getTime() - new Date().getTime()) / 1000);
+    if (seconds > 0)
     {
-        setTimeout(countDown,1000);
+        setTimeout(countDown,100);
     }
 });
 
@@ -123,28 +122,20 @@ $("#pihole-disable-permanently").on("click", function(e){
 $("#pihole-disable-10s").on("click", function(e){
     e.preventDefault();
     piholeChange("disable","10");
-    setCountdownTarget(10);
-    setTimeout(countDown,1000);
 });
 $("#pihole-disable-30s").on("click", function(e){
     e.preventDefault();
     piholeChange("disable","30");
-    setCountdownTarget(30);
-    setTimeout(countDown,1000);
 });
 $("#pihole-disable-5m").on("click", function(e){
     e.preventDefault();
     piholeChange("disable","300");
-    setCountdownTarget(300);
-    setTimeout(countDown,1000);
 });
 $("#pihole-disable-custom").on("click", function(e){
     e.preventDefault();
     var custVal = $("#customTimeout").val();
     custVal = $("#btnMins").hasClass("active") ? custVal * 60 : custVal;
     piholeChange("disable",custVal);
-    setCountdownTarget(custVal);
-    setTimeout(countDown,1000);
 });
 
 

scripts/pi-hole/php/header.php

@@ -182,6 +182,7 @@
 <script src="scripts/pi-hole/js/header.js"></script>
 <!-- Send token to JS -->
 <div id="token" hidden><?php if($auth) echo $token; ?></div>
+<div id="enableTimer" hidden><?php if(file_exists("../custom_disable_timer")){ echo file_get_contents("../custom_disable_timer"); } ?></div>
 <div class="wrapper">
     <header class="main-header">
         <!-- Logo -->