message styles table
This commit is contained in:
parent
db4dcc4175
commit
1b28600c39
@ -4,6 +4,7 @@ $(document).ready(async function() {
|
||||
// await initContentTable();
|
||||
|
||||
initSubscriptionsModule();
|
||||
initMessageStylesModule();
|
||||
|
||||
await loadServers();
|
||||
$("#subscriptionsTab").click();
|
||||
@ -13,6 +14,9 @@ $(document).on("selectedServerChange", function() {
|
||||
$("#subscriptionsTab").click();
|
||||
});
|
||||
|
||||
|
||||
// region Hex Strings
|
||||
|
||||
function genHexString(len=6) {
|
||||
let output = '';
|
||||
for (let i = 0; i < len; ++i) {
|
||||
@ -21,6 +25,14 @@ function genHexString(len=6) {
|
||||
return output;
|
||||
}
|
||||
|
||||
|
||||
// region DateTime
|
||||
|
||||
function isISODateTimeString(value) {
|
||||
const isoDatePattern = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d+([+-]\d{2}:\d{2}|Z)$/;
|
||||
return typeof value === 'string' && isoDatePattern.test(value);
|
||||
}
|
||||
|
||||
// my clone of python's datetime.strftime
|
||||
function formatStringDate(date, format) {
|
||||
const padZero = (num, len) => String(num).padStart(len, "0");
|
||||
@ -76,7 +88,8 @@ function formatStringDate(date, format) {
|
||||
return format.replace(/%[a-zA-Z%-]/g, match => formatters[match] ? formatters[match](date) : match);
|
||||
}
|
||||
|
||||
// #region Colour Controls
|
||||
|
||||
// region Colour Controls
|
||||
$(".colour-control-picker").on("change", function() {
|
||||
$(this).closest(".colour-control-group").find(".colour-control-text").val($(this).val());
|
||||
});
|
||||
@ -155,8 +168,11 @@ $(document).ready(function() {
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// region Confirm Modal
|
||||
|
||||
async function confirmationModal(title, bodyText, style, acceptFunc, declineFunc) {
|
||||
let $modal = $("#confirmationModal");
|
||||
let $modal = $("#confirmModal");
|
||||
|
||||
// Ensure valid style and apply it to the confirm button
|
||||
if (!["danger", "success", "warning", "info", "primary", "secondary"].includes(style)) {
|
||||
@ -191,6 +207,9 @@ function arrayToHtmlList(array, bold=false) {
|
||||
return $ul;
|
||||
}
|
||||
|
||||
|
||||
// region Log Error
|
||||
|
||||
function logError(error) {
|
||||
if (error instanceof Error) {
|
||||
// Logs typical error properties like message and stack
|
||||
|
@ -0,0 +1,68 @@
|
||||
const styleTableId = "#styleTable";
|
||||
|
||||
|
||||
// region Init Module
|
||||
|
||||
function initMessageStylesModule() {
|
||||
initializeDataTable(
|
||||
styleTableId,
|
||||
[
|
||||
{
|
||||
title: "Name",
|
||||
data: "name"
|
||||
},
|
||||
{
|
||||
title: "Is Embed?",
|
||||
data: "is_embed"
|
||||
},
|
||||
{
|
||||
title: "Is Hyperlinked?",
|
||||
data: "is_hyperlinked"
|
||||
},
|
||||
{
|
||||
title: "Show Author?",
|
||||
data: "show_author"
|
||||
},
|
||||
{
|
||||
title: "Show Timestamp?",
|
||||
data: "show_timestamp"
|
||||
},
|
||||
{
|
||||
title: "Show Images?",
|
||||
data: "show_images"
|
||||
},
|
||||
{
|
||||
title: "Fetch Images?",
|
||||
data: "fetch_images"
|
||||
},
|
||||
{
|
||||
title: "Title Mutator",
|
||||
data: "title_mutator"
|
||||
},
|
||||
{
|
||||
title: "Description Mutator",
|
||||
data: "description_mutator"
|
||||
}
|
||||
]
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
// region Load Data
|
||||
|
||||
$(document).on("selectedServerChange", async function() {
|
||||
await loadMessageStyleData();
|
||||
});
|
||||
|
||||
$(document).on("doDataLoad", async function() {
|
||||
await loadMessageStyleData();
|
||||
});
|
||||
|
||||
async function loadMessageStyleData() {
|
||||
if (!selectedServer) {
|
||||
return;
|
||||
}
|
||||
|
||||
setTableFilter(styleTableId, "server", selectedServer.id);
|
||||
await loadTableData(styleTableId, "/api/message-styles/", "GET");
|
||||
}
|
@ -1 +1,79 @@
|
||||
styles
|
||||
<div class="js-tableFilters row my-3 px-sm-3">
|
||||
<div class="col-md-6 col-lg-5 col-xl-4 col-xxl-3">
|
||||
<div class="input-group mb-lg-0 mb-3 rounded-1">
|
||||
<span class="input-group-text">
|
||||
<i class="bi bi-search"></i>
|
||||
</span>
|
||||
<input type="search" class="form-control search-filter" placeholder="Search">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-7 col-xl-8 col-xxl-9 text-md-end table-search-buttons">
|
||||
<div class="d-inline-block">
|
||||
<button type="button" class="table-new-btn btn btn-primary rounded-1">
|
||||
<i class="bi bi-plus-lg"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="d-inline-block">
|
||||
<div class="dropdown table-sort-dropdown">
|
||||
<button type="button" class="btn btn-secondary rounded-1" data-bs-toggle="dropdown" data-bs-auto-close="outside">
|
||||
<i class="bi bi-sort-alpha-up"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li><h6 class="dropdown-header">Sort By</h6></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-inline-block">
|
||||
<div class="dropdown table-filter-dropdown">
|
||||
<button type="button" class="btn btn-secondary rounded-1" data-bs-toggle="dropdown" data-bs-auto-close="outside">
|
||||
<i class="bi bi-funnel"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li><h6 class="dropdown-header">Filter By</h6></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-inline-block">
|
||||
<button type="button" class="table-refresh-btn btn btn-outline-secondary rounded-1">
|
||||
<i class="bi bi-arrow-clockwise"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="d-inline-block">
|
||||
<button type="button" class="table-del-btn btn btn-danger rounded-1">
|
||||
<i class="bi bi-trash3"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="js-tableBody table-responsive my-3 px-sm-3">
|
||||
<table id="styleTable" class="table table-hover align-middle"></table>
|
||||
</div>
|
||||
<div class="js-tableControls row px-sm-3 mb-4">
|
||||
<div class="col-lg-6">
|
||||
<nav class="table-pagination mb-4 mb-lg-0">
|
||||
<ul class="pagination mb-0">
|
||||
<li class="page-item">
|
||||
<button type="button" class="page-link page-prev rounded-start-1">
|
||||
<i class="bi bi-chevron-left"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="page-item">
|
||||
<button type="button" class="page-link page-next rounded-end-1">
|
||||
<i class="bi bi-chevron-right"></i>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-lg-6 d-flex align-items-center justify-content-lg-end">
|
||||
<label for="styleTablePageSizer" class="form-label align-self-center mb-0 me-2">Show</label>
|
||||
<select name="styleTablePageSizer" id="styleTablePageSizer" class="select-2 table-page-sizer">
|
||||
<option value="10" selected>10 </option>
|
||||
<option value="15">15 </option>
|
||||
<option value="20">20 </option>
|
||||
<option value="25">25 </option>
|
||||
</select>
|
||||
<span class="ms-2">of </span>
|
||||
<span class="pageinfo-total text-nowrap">10</span>
|
||||
</div>
|
||||
</div>
|
Loading…
x
Reference in New Issue
Block a user