Pi-Hole/web
1
0
Fork 0
mirror of https://github.com/pi-hole/web.git synced 2025-12-20 02:38:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add UI-related antigravity changes

Browse Source 
Signed-off-by: DL6ER <dl6er@dl6er.de>
This commit is contained in:
DL6ER
2023-09-03 19:56:20 +02:00
parent 5335cf61aa
commit 2a68f56a3a
3 changed files with 42 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
groups-adlists.lp → groups-lists.lp
View File

@@ -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 -->
@@ -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 -->
@@ -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>
@@ -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 -->

35
scripts/pi-hole/js/groups-adlists.js
View File

@@ -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();
@@ -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) +
@@ -170,9 +173,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://")) {
@@ -480,17 +496,18 @@ 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;
}
@@ -498,10 +515,10 @@ function addAdlist() {
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();
@@ -511,7 +528,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
},
});

10
scripts/pi-hole/lua/sidebar.lp
View File

@@ -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>