Skip to content

Commit

Permalink
Add UI-related antigravity changes (#2700)
Browse files Browse the repository at this point in the history
  • Loading branch information
@PromoFaux
PromoFaux authored Sep 29, 2023
2 parents ab0fa4e + 7daf750 commit 7121404
Show file tree
Hide file tree
Showing 4 changed files with 55 additions and 27 deletions.
15 changes: 11 additions & 4 deletions groups-adlists.lp → groups-lists.lp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')

<!-- Title -->
<div class="page-header">
<h1>Adlist group management</h1>
<h1>Subscribed lists group management</h1>
</div>

<!-- Domain Input -->
Expand All @@ -22,7 +22,7 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
<!-- /.box-header -->
<div class="box-header with-border">
<h3 class="box-title">
Add a new adlist
Add a new subscribed list
</h3>
</div>
<!-- /.box-header -->
Expand All @@ -45,7 +45,14 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
<li>Multiple adlists can be added by separating each <i>unique</i> URL with a space</li>
<li>Click on the icon in the first column to get additional information about your lists. The icons correspond to the health of the list.</li>
</ol>
<button type="button" id="btnAdd" class="btn btn-primary pull-right">Add</button>
<div class="btn-toolbar pull-right" role="toolbar" aria-label="Toolbar with buttons">
<div class="btn-group" role="group">
<button type="button" id="btnAddBlock" class="btn btn-danger pull-right">Add blocklist</button>
</div>
<div class="btn-group" role="group">
<button type="button" id="btnAddAllow" class="btn btn-success pull-right">Add allowlist</button>
</div>
</div>
</div>
</div>
</div>
Expand All @@ -55,7 +62,7 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
<div class="box" id="adlists-list">
<div class="box-header with-border">
<h3 class="box-title">
List of adlists
List of subscribed lists
</h3>
</div>
<!-- /.box-header -->
Expand Down
38 changes: 29 additions & 9 deletions scripts/pi-hole/js/groups-adlists.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@ var GETDict = {};
$(function () {
GETDict = utils.parseQueryString();

$("#btnAdd").on("click", addAdlist);
$("#btnAddAllow").on("click", { type: "allow" }, addAdlist);
$("#btnAddBlock").on("click", { type: "block" }, addAdlist);

utils.setBsSelectDefaults();
initTable();
Expand Down Expand Up @@ -59,7 +60,9 @@ function format(data) {
// Compile extra info for displaying
return (
"<table>" +
'<tr class="dataTables-child"><td>Health status of this list:</td><td>' +
'<tr class="dataTables-child"><td>Type of this list:</td><td>' +
data.type +
'list</td><tr class="dataTables-child"><td>Health status of this list:</td><td>' +
statusText +
'</td></tr><tr class="dataTables-child"><td>This list was added to Pi-hole&nbsp;&nbsp;</td><td>' +
utils.datetimeRelative(data.date_added) +
Expand Down Expand Up @@ -143,6 +146,7 @@ function initTable() {
rowCallback: function (row, data) {
var dataId = utils.hexEncode(data.address);
$(row).attr("data-id", dataId);
$(row).attr("data-type", data.type);

var statusCode = 0,
statusIcon;
Expand Down Expand Up @@ -170,9 +174,22 @@ function initTable() {
break;
}

// Add red minus sign icon if data["type"] is "block"
// Add green plus sign icon if data["type"] is "allow"
let status =
"<i class='fa fa-fw fa-question-circle text-orange' title='This list is of unknown type'></i>";
if (data.type === "block") {
status = "<i class='fa fa-fw fa-minus text-red' title='This is a blocklist'></i>";
} else if (data.type === "allow") {
status = "<i class='fa fa-fw fa-plus text-green' title='This is an allowlist'></i>";
}

$("td:eq(1)", row).addClass("list-status-" + statusCode);
$("td:eq(1)", row).html(
"<i class='fa " + statusIcon + "' title='Click for details about this list'></i>"
"<i class='fa fa-fw " +
statusIcon +
"' title='Click for details about this list'></i>" +
status
);

if (data.address.startsWith("file://")) {
Expand Down Expand Up @@ -480,28 +497,29 @@ function delItems(ids) {
});
}

function addAdlist() {
function addAdlist(event) {
const type = event.data.type;
const address = utils.escapeHtml($("#new_address").val());
const comment = utils.escapeHtml($("#new_comment").val());

utils.disableAll();
utils.showAlert("info", "", "Adding adlist...", address);
utils.showAlert("info", "", "Adding subscribed " + type + "list...", address);

if (address.length === 0) {
// enable the ui elements again
utils.enableAll();
utils.showAlert("warning", "", "Warning", "Please specify an adlist address");
utils.showAlert("warning", "", "Warning", "Please specify " + type + "list address");
return;
}

$.ajax({
url: "/api/lists",
method: "post",
dataType: "json",
data: JSON.stringify({ address: address, comment: comment }),
data: JSON.stringify({ address: address, comment: comment, type: type }),
success: function () {
utils.enableAll();
utils.showAlert("success", "fas fa-plus", "Successfully added list", address);
utils.showAlert("success", "fas fa-plus", "Successfully added " + type + "list", address);
table.ajax.reload(null, false);
table.rows().deselect();

Expand All @@ -511,7 +529,7 @@ function addAdlist() {
error: function (data, exception) {
apiFailure(data);
utils.enableAll();
utils.showAlert("error", "", "Error while adding new list", data.responseText);
utils.showAlert("error", "", "Error while adding new " + type + "list", data.responseText);
console.log(exception); // eslint-disable-line no-console
},
});
Expand All @@ -520,6 +538,7 @@ function addAdlist() {
function editAdlist() {
const elem = $(this).attr("id");
const tr = $(this).closest("tr");
const type = tr.attr("data-type");
const address = tr.attr("data-id");
const status = tr.find("#enabled_" + address).is(":checked");
const comment = utils.escapeHtml(tr.find("#comment_" + address).val());
Expand Down Expand Up @@ -567,6 +586,7 @@ function editAdlist() {
groups: groups,
comment: comment,
enabled: enabled,
type: type,
}),
success: function () {
utils.enableAll();
Expand Down
19 changes: 10 additions & 9 deletions scripts/pi-hole/js/queries.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,8 +83,7 @@ function parseQueryStatus(data) {
buttontext,
icon = null,
colorClass = false,
isCNAME = false,
regexLink = false;
isCNAME = false;
switch (data.status) {
case "GRAVITY":
colorClass = "text-red";
Expand All @@ -111,7 +110,6 @@ function parseQueryStatus(data) {
colorClass = "text-red";
icon = "fa-solid fa-ban";
fieldtext = "Blocked (regex)";
regexLink = data.regex_id > 0;
buttontext =
'<button type="button" class="btn btn-default btn-sm text-green btn-whitelist"><i class="fas fa-check"></i> Allow</button>';
break;
Expand Down Expand Up @@ -152,15 +150,14 @@ function parseQueryStatus(data) {
colorClass = "text-red";
icon = "fa-solid fa-ban";
fieldtext = "Blocked (regex denied, CNAME)";
regexLink = data.regex_id > 0;
buttontext =
'<button type="button" class="btn btn-default btn-sm text-green btn-whitelist"><i class="fas fa-check"></i> Allow</button>';
isCNAME = true;
break;
case "DENYLIST_CNAME":
colorClass = "text-red";
icon = "fa-solid fa-ban";
fieldtext = "Blocked (exact diened, CNAME)";
fieldtext = "Blocked (exact denied, CNAME)";
buttontext =
'<button type="button" class="btn btn-default btn-sm text-green btn-whitelist"><i class="fas fa-check"></i> Allow</button>';
isCNAME = true;
Expand Down Expand Up @@ -198,13 +195,16 @@ function parseQueryStatus(data) {
buttontext = "";
}

var matchText =
colorClass === "text-green" ? "allowed" : colorClass === "text-red" ? "blocked" : "matched";

return {
fieldtext: fieldtext,
buttontext: buttontext,
colorClass: colorClass,
icon: icon,
isCNAME: isCNAME,
regexLink: regexLink,
matchText: matchText,
};
}

Expand Down Expand Up @@ -248,14 +248,15 @@ function formatInfo(data) {

var regexInfo = "",
cnameInfo = "";
if (queryStatus.regexLink) {
if (data.regex_id !== null && data.regex_id > -1) {
var regexLink =
'<a href="groups/domains?domainid=' +
data.regex_id +
'" target="_blank">Regex ID ' +
'" target="_blank">regex ID ' +
data.regex_id +
"</a>";
regexInfo = divStart + "Query was blocked by: </td><td>" + regexLink + "</div>";
regexInfo =
divStart + "Query was " + queryStatus.matchText + " by </td><td>" + regexLink + "</div>";
}

if (queryStatus.isCNAME) {
Expand Down
10 changes: 5 additions & 5 deletions scripts/pi-hole/lua/sidebar.lp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,12 @@
</span>
</a>
</li>
<li class="menu-group<? if scriptname == 'groups/adlists' then ?> active<? end ?>">
<a href="<?=webhome?>groups/adlists">
<i class="fa fa-fw menu-icon fa-shield-alt"></i> <span>Adlists
<li class="menu-group<? if scriptname == 'groups/lists' then ?> active<? end ?>">
<a href="<?=webhome?>groups/lists">
<i class="fa fa-fw menu-icon fa-shield-alt"></i> <span>Lists
<span class="pull-right-container">
<span class="label bg-blue pull-right" id="num_lists" title="Number of defined adlists"></span>
<span class="label bg-yellow pull-right" id="num_gravity" title="Total number of domains blocked by your Pi-hole"></span>
<span class="label bg-blue pull-right" id="num_lists" title="Number of subscribed lists"></span>
<span class="label bg-yellow pull-right" id="num_gravity" title="Total number of domains subscribed by your Pi-hole"></span>
</span>
</a>
</li>
Expand Down

0 comments on commit 7121404

Please sign in to comment.