corbz/PYRSS-Website
corbz/PYRSS-Website
1
0
Fork 0
Code Issues 21 Pull Requests Actions Releases 1 Wiki Activity

Tracked content front end

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-06-11 13:52:40 +01:00
parent 44cde0daf4
commit 5a3ac38798
6 changed files with 173 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
apps/static/js/api.js
View File

@ -121,3 +121,19 @@ async function deleteFilter(id) {
async function editFilter(id, formData) {
return await ajaxRequest(`/api/filter/${id}/`, "PUT", formData);
}
// Tracked Content
async function getTrackedContent(guildId, subscriptionId=null, page=1, pageSize=10) {
var url = `/api/tracked-content/?subscription__guild_id=${guildId}&page=${page}&page_size=${pageSize}`;
if (subscriptionId)
url += `&subscription=${subscriptionId}`;
return await ajaxRequest(url, "GET");
}
async function deleteTrackedContent(guid) {
const encodedGuid = encodeURIComponent(guid);
return await ajaxRequest(`/api/tracked-content/${encodedGuid}/`, "DELETE");
}

0
apps/static/js/home/blocked.js Normal file
View File

119
apps/static/js/home/content.js
View File

@ -31,17 +31,122 @@ function initContentTable() {
},
{ title: "GUID", data: "guid", visible: false },
{
title: "Name",
data: "title",
render: function(data, type, row) {
return `<a href="#" onclick="showEditFilterModal(${row.id})" class="text-decoration-none">${data}</a>`
}
title: "Name", data: "title"
},
{
title: "Created", data: "creation_datetime"
title: "Subscription",
data: "subscription.name",
},
{
title: "Created",
data: "creation_datetime",
render: function(data, type) {
return new Date(data).toISOString().split("T")[0];
}
},
]
});
}
async function loadContent(guildId) {}
$("#deleteSelectedContentBtn").on("click", async function() {
var rows = contentTable.rows(".selected").data();
$.each(rows, async function() {
await deleteTrackedContent(this.guid);
showToast("danger", "Deleted Tracked Content", "It can now appear be sent again. Content GUID: " + this.guid);
});
setTimeout(async () => {
await loadContent(getCurrentlyActiveServer().guild_id);
}, 600)
});
function clearExistingContentRows() {
$("#contentTable thead .table-select-all").prop("checked", false).prop("indeterminate", false);
contentTable.clear().draw(false);
}
async function loadContent(guildId, page=1, pageSize=null) {
if (!guildId)
return;
if (!pageSize)
pageSize = $("#contentTablePageSize").val();
$("#deleteSelectedContentBtn").prop("disabled", true);
clearExistingContentRows();
try {
const content = await getTrackedContent(guildId, null, page, pageSize);
contentTable.rows.add(content.results).draw(false);
handleContentPagination(page, pageSize, content.count, content.next, content.previous);
$("#contentTable thead .table-select-all").prop("disabled", content.results.length === 0);
}
catch (err) {
console.error(JSON.stringify(err, null, 4));
showToast("danger", `Error loading Tracked Content: HTTP ${err.status}`, err.responseJSON.message, 15000);
}
}
$(document).on("selectedServerChange", async function() {
const activeServer = getCurrentlyActiveServer();
await loadContent(activeServer.guild_id);
});
$("#contentTablePageSize").on("change", async function() {
const page = 1; // reset to page 1 to ensure the page exists.
const pageSize = $(this).val();
loadContent(getCurrentlyActiveServer().guild_id, page, pageSize);
});
function handleContentPagination(currentPage, pageSize, totalItems, nextExists, prevExists) {
$("#contentPagination").attr("data-page", currentPage);
// Remove existing page-specific buttons
$("#contentPagination .page-pick").remove();
// Determine states of 'previous page' and 'next page' buttons
$("#contentPagination .page-prev").toggleClass("disabled", !prevExists).attr("tabindex", prevExists ? "" : "-1");
$("#contentPagination .page-next").toggleClass("disabled", !nextExists).attr("tabindex", nextExists ? "" : "-1");
// Calculate amount of pages to account for
const pages = Math.max(Math.ceil(totalItems / pageSize), 1);
// Create a button for each page
for (let i = 1; i < pages + 1; i++) {
let pageItem = $("<li>").addClass("page-item");
let pageLink = $("<button>")
.attr("type", "button")
.attr("data-page", i)
.addClass("page-link page-pick")
.text(i)
pageItem.append(pageLink);
// Insert the new page button before the 'next page' button
$("#contentPagination .pagination .page-next").parent().before(pageItem);
}
// Disable the button for the current page
$(`#contentPagination .pagination .page-pick[data-page="${currentPage}"]`).addClass("disabled").attr("tabindex", -1);
}
$("#contentPagination .pagination").on("click", ".page-link", async function() {
let wantedPage;
let currentPage = parseInt($("#contentPagination").attr("data-page"));
if ($(this).hasClass("page-prev"))
wantedPage = currentPage - 1
else if ($(this).hasClass("page-next"))
wantedPage = currentPage + 1;
else
wantedPage = $(this).attr("data-page");
console.debug("moving to page: " + wantedPage);
await loadContent(getCurrentlyActiveServer().guild_id, wantedPage)
});

1
apps/static/js/home/index.js
View File

@ -7,6 +7,7 @@ $(document).ready(async function() {
bindTableCheckboxes("#subTable", subTable, "#deleteSelectedSubscriptionsBtn");
bindTableCheckboxes("#filtersTable", filtersTable, "#deleteSelectedFiltersBtn");
bindTableCheckboxes("#contentTable", contentTable, "#deleteSelectedContentBtn")
await loadSavedGuilds();
await loadServerOptions();

10
apps/static/js/home/subscriptions.js
View File

@ -46,6 +46,13 @@ function initSubscriptionTable() {
}
},
{ title: "Channels", data: "channels_count" },
// {
// title: "Content",
// data: "channels_count",
// render: function(data, type) {
// }
// },
{
title: "Created",
data: "creation_datetime",
@ -255,9 +262,6 @@ async function loadSubscriptions(guildId, page=1, pageSize=null) {
if (!pageSize)
pageSize = $("#subTablePageSize").val();
// const pageInfo = subTable.page();
// console.debug(JSON.stringify(pageInfo, null, 4));
$("#deleteSelectedSubscriptionsBtn").prop("disabled", true);
clearExistingSubRows();

45
apps/templates/home/index.html
View File

@ -59,7 +59,10 @@
<button id="filtersTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#filtersTabPane" type="button" aria-controls="filtersTabPane" aria-selected="false">Content Filters</button>
</li>
<li class="nav-item" role="presentation">
<button id="contentTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false">Content</button>
<button id="contentTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#contentTabPane" type="button" aria-controls="contentTabPane" aria-selected="false">Tracked Content</button>
</li>
<li class="nav-item" role="presentation">
<button id="blockedTab" class="nav-link rounded-1" data-bs-toggle="tab" data-bs-target="#blockedTabPane" type="button" aria-controls="blockedTabPane" aria-selected="false">Blocked Content</button>
</li>
</ul>
<div class="tab-pane-buttons">
@ -79,6 +82,11 @@
<i class="bi bi-trash3"></i>
</button>
</div>
<div class="tab-pane-buttons-item" data-tab="contentTab">
<button type="button" id="deleteSelectedContentBtn" class="btn btn-danger rounded-1 ms-0">
<i class="bi bi-trash3"></i>
</button>
</div>
</div>
</div>
</div>
@ -108,14 +116,8 @@
<option value="50">50&emsp;</option>
<option value="100">100&emsp;</option>
</select>
<!-- <div class="mb-4">
<label for="subChannels" class="form-label">Channels</label>
<select name="subChannels" id="subChannels" class="select-2" multiple data-dropdownparent="#subFormModal"></select>
<div class="form-text">Subscription content will be sent to these channels.</div>
</div> -->
</div>
</div>
</div>
<div id="filtersTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="filtersTab" tabindex="0">
<div class="table-responsive mt-3">
@ -123,9 +125,35 @@
</div>
</div>
<div id="contentTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="contentTab" tabindex="0">
<div class="table-responsive mt-3">
<div class="table-responsive my-3">
<table id="contentTable" class="table table-hover align-middle"></table>
</div>
<div class="table-controls d-flex mb-3">
<nav id="contentPagination">
<ul class="pagination mb-0">
<li class="page-item">
<button type="button" class="page-link page-prev rounded-start-1">Previous</button>
</li>
<li class="page-item">
<button type="button" class="page-link page-next rounded-end-1">Next</button>
</li>
</ul>
</nav>
<div class="d-flex ms-auto">
<label for="contentTablePageSize" class="form-label align-self-center mb-0 me-2">Per Page</label>
<select name="contentTablePageSize" id="contentTablePageSize" class="select-2">
<option value="10" selected>10&emsp;</option>
<option value="25">25&emsp;</option>
<option value="50">50&emsp;</option>
<option value="100">100&emsp;</option>
</select>
</div>
</div>
</div>
<div id="blockedTabPane" class="tab-pane fade" role="tabpanel" aria-labelledby="blockedTab" tabindex="0">
<div class="table-responsive mt-3">
<table id="blockedTable" class="table table-hover align-middle"></table>
</div>
</div>
</div>
</div>
@ -152,4 +180,5 @@
<script src="{% static 'js/home/subscriptions.js' %}"></script>
<script src="{% static 'js/home/filters.js' %}"></script>
<script src="{% static 'js/home/content.js' %}"></script>
<script src="{% static 'js/home/blocked.js' %}"></script>
{% endblock javascript %}