From a80d75272093e7339e9443c75556abd6942933ac Mon Sep 17 00:00:00 2001
From: Mcat12 <newtoncat12@yahoo.com>
Date: Sat, 21 May 2016 12:10:27 -0400
Subject: [PATCH] Adjust to CSP

---
 js/pihole/list.js | 128 ++++++++++++++++++++++++++++++++++++++++++++++
 list.php          | 114 +++--------------------------------------
 2 files changed, 134 insertions(+), 108 deletions(-)
 create mode 100644 js/pihole/list.js

diff --git a/js/pihole/list.js b/js/pihole/list.js
new file mode 100644
index 00000000..ada38223
--- /dev/null
+++ b/js/pihole/list.js
@@ -0,0 +1,128 @@
+// IE likes to cache too much :P
+$.ajaxSetup({cache: false});
+
+// Handle enter button for adding domains
+$(document).keypress(function(e) {
+    if(e.which === 13 && $("#domain").is(":focus")) {
+        // Enter was pressed, and the input has focus
+        add();
+    }
+});
+
+// Handle buttons
+$("#btnAdd").on("click", function() {
+    add();
+});
+$("#btnRefresh").on("click", function() {
+    refresh(true);
+});
+
+// Handle hiding of alerts
+$(function(){
+    $("[data-hide]").on("click", function(){
+        $(this).closest("." + $(this).attr("data-hide")).hide();
+    });
+});
+
+// Get PHP info
+var token = $("#token").html();
+var list_type = $("#list-type").html();
+var fullName = list_type === "white" ? "Whitelist" : "Blacklist";
+
+window.onload = refresh(false);
+
+function refresh(fade) {
+    var list = $("#list");
+    if(fade) {
+        list.fadeOut(100);
+    }
+    $.ajax({
+        url: "php/get.php",
+        method: "get",
+        data: {"list":list_type},
+        success: function(response) {
+            list.html("");
+            var data = JSON.parse(response);
+
+            if(data.length === 0) {
+                list.html('<div class="alert alert-info" role="alert">Your ' + fullName + ' is empty!</div>');
+            }
+            else {
+                data.forEach(function (entry, index) {
+                    list.append(
+                        '<li id="' + index + '" class="list-group-item clearfix">' + entry +
+                        '<button class="btn btn-danger btn-xs pull-right" type="button">' +
+                        '<span class="glyphicon glyphicon-trash"></span></button></li>'
+                    );
+
+                    // Handle button
+                    $("#list #"+index+"").on("click", "button", function() {
+                        sub(index, entry)
+                    });
+                });
+            }
+            list.fadeIn("fast");
+        },
+        error: function(jqXHR, exception) {
+            $("#alFailure").show();
+        }
+    });
+}
+
+function add() {
+    var domain = $("#domain");
+    if(domain.val().length === 0)
+        return;
+
+    var alInfo = $("#alInfo");
+    var alSuccess = $("#alSuccess");
+    var alFailure = $("#alFailure");
+    alInfo.show();
+    alSuccess.hide();
+    alFailure.hide();
+    $.ajax({
+        url: "php/add.php",
+        method: "post",
+        data: {"domain":domain.val(), "list":list_type, "token":token},
+        success: function(response) {
+            if(response.length !== 0)
+                return;
+            alSuccess.show();
+            alSuccess.delay(1000).fadeOut(2000, function() {
+                alSuccess.hide();
+            });
+            alInfo.delay(1000).fadeOut(2000, function() {
+                alInfo.hide();
+            });
+            domain.val("");
+            refresh(true);
+        },
+        error: function(jqXHR, exception) {
+            alFailure.show();
+            alFailure.delay(1000).fadeOut(2000, function() {
+                alFailure.hide();
+            });
+            alInfo.delay(1000).fadeOut(2000, function() {
+                alInfo.hide();
+            });
+        }
+    });
+}
+
+function sub(index, entry) {
+    var domain = $("#"+index);
+    domain.hide("highlight");
+    $.ajax({
+        url: "php/sub.php",
+        method: "post",
+        data: {"domain":entry, "list":list_type, "token":token},
+        success: function(response) {
+            if(response.length !== 0)
+                return;
+            domain.remove();
+        },
+        error: function(jqXHR, exception) {
+            alert("Failed to remove the domain!");
+        }
+    });
+}
diff --git a/list.php b/list.php
index e482c604..0d3ec111 100644
--- a/list.php
+++ b/list.php
@@ -18,6 +18,9 @@ if(empty($_SESSION['token'])) {
 }
 $token = $_SESSION['token'];
 ?>
+<!-- Send PHP info to JS -->
+<div id="token" hidden><?php echo $token ?></div>
+<div id="list-type" hidden><?php echo $list ?></div>
 
 <!-- Title -->
 <div class="page-header">
@@ -28,8 +31,8 @@ $token = $_SESSION['token'];
 <div class="form-group input-group">
     <input id="domain" type="text" class="form-control" placeholder="Add a domain (example.com or sub.example.com)">
     <span class="input-group-btn">
-        <button class="btn btn-default" type="button" onclick="add()">Add</button>
-        <button class="btn btn-default" type="button" onclick="refresh(true)">Refresh</button>
+        <button id="btnAdd" class="btn btn-default" type="button">Add</button>
+        <button id="btnRefresh" class="btn btn-default" type="button">Refresh</button>
     </span>
 </div>
 
@@ -54,109 +57,4 @@ $token = $_SESSION['token'];
 require "footer.php";
 ?>
 
-<script>
-    window.onload = refresh(false);
-    $.ajaxSetup({cache: false});
-    $(document).keypress(function(e) {
-        if(e.which === 13 && $("#domain").is(":focus")) {
-            // Enter was pressed, and the input has focus
-            add();
-        }
-    });
-    $(function(){
-        $("[data-hide]").on("click", function(){
-            $(this).closest("." + $(this).attr("data-hide")).hide();
-        });
-    });
-    
-    function refresh(fade) {
-        var list = $("#list");
-        if(fade) {
-            list.fadeOut(100);
-        }
-        $.ajax({
-            url: "php/get.php",
-            method: "get",
-            data: {"list":"<?php echo $list ?>"},
-            success: function(response) {
-                list.html("");
-                var data = JSON.parse(response);
-                
-                if(data.length === 0) {
-                    list.html('<div class="alert alert-info" role="alert">Your <?php getFullName(); ?> is empty!</div>');
-                }
-                else {
-                    data.forEach(function (entry, index) {
-                        list.append(
-                            '<li id="' + index + '" class="list-group-item clearfix">' + entry +
-                            '<button class="btn btn-danger btn-xs pull-right" type="button" onclick="sub(\'' + index + '\', \'' + entry + '\')">' +
-                            '<span class="glyphicon glyphicon-trash"></span></button></li>'
-                        );
-                    });
-                }
-                list.fadeIn("fast");
-            },
-            error: function(jqXHR, exception) {
-                $("#alFailure").show();
-            }
-        });
-    }
-    
-    function add() {
-        var domain = $("#domain");
-        if(domain.val().length === 0)
-            return;
-        
-        var alInfo = $("#alInfo");
-        var alSuccess = $("#alSuccess");
-        var alFailure = $("#alFailure");
-        alInfo.show();
-        alSuccess.hide();
-        alFailure.hide();
-        $.ajax({
-            url: "php/add.php",
-            method: "post",
-            data: {"domain":domain.val(), "list":"<?php echo $list ?>", "token":"<?php echo $token ?>"},
-            success: function(response) {
-                if(response.length !== 0)
-                    return;
-                alSuccess.show();
-                alSuccess.delay(1000).fadeOut(2000, function() {
-                    alSuccess.hide();
-                });
-                alInfo.delay(1000).fadeOut(2000, function() {
-                    alInfo.hide();
-                });
-                domain.val("");
-                refresh(true);
-            },
-            error: function(jqXHR, exception) {
-                alFailure.show();
-                alFailure.delay(1000).fadeOut(2000, function() {
-                    alFailure.hide();
-                });
-                alInfo.delay(1000).fadeOut(2000, function() {
-                    alInfo.hide();
-                });
-            }
-        });
-    }
-    
-    function sub(index, entry) {
-        var domain = $("#"+index);
-        domain.hide("highlight");
-        $.ajax({
-            url: "php/sub.php",
-            method: "post",
-            data: {"domain":entry, "list":"<?php echo $list ?>", "token":"<?php echo $token ?>"},
-            success: function(response) {
-                if(response.length !== 0)
-                    return;
-                domain.remove();
-            },
-            error: function(jqXHR, exception) {
-                alert("Failed to remove the domain!");
-            }
-        });
-    }
-</script>
+<script src="js/pihole/list.js"></script>