Browse Source

Update some JS Libraries and fix small issues

- Updated JS Libraries
- Downgraded bootstrap.css to v5.0.2 which works with Bootstrap-Native.
- Fixed issue with settings being able to open/collapse on some systems.
- Added .js and .css to the exclude list for the end-of-file-fixer pre-commit
BlackDex 1 month ago
parent
commit
b0a411b733
  1. 1
      .pre-commit-config.yaml
  2. 101
      src/static/scripts/bootstrap-native.js
  3. 882
      src/static/scripts/bootstrap.css
  4. 110
      src/static/scripts/datatables.css
  5. 810
      src/static/scripts/datatables.js
  6. 15
      src/static/templates/admin/settings.hbs

1
.pre-commit-config.yaml

@ -7,6 +7,7 @@ repos:
- id: check-json
- id: check-toml
- id: end-of-file-fixer
exclude: "(.*js$|.*css$)"
- id: check-case-conflict
- id: check-merge-conflict
- id: detect-private-key

101
src/static/scripts/bootstrap-native.js

@ -1,5 +1,5 @@
/*!
* Native JavaScript for Bootstrap v4.0.4 (https://thednp.github.io/bootstrap.native/)
* Native JavaScript for Bootstrap v4.0.6 (https://thednp.github.io/bootstrap.native/)
* Copyright 2015-2021 © dnp_theme
* Licensed under MIT (https://github.com/thednp/bootstrap.native/blob/master/LICENSE)
*/
@ -1467,19 +1467,26 @@
}
}
const modalOpenClass = 'modal-open';
const modalBackdropClass = 'modal-backdrop';
const offcanvasBackdropClass = 'offcanvas-backdrop';
const modalActiveSelector = `.modal.${showClass}`;
const offcanvasActiveSelector = `.offcanvas.${showClass}`;
const overlay = document.createElement('div');
overlay.setAttribute('class', `${modalBackdropClass}`);
function getCurrentOpen() {
return queryElement(`${modalActiveSelector},${offcanvasActiveSelector}`);
}
function appendOverlay(hasFade) {
function toggleOverlayType(isModal) {
const targetClass = isModal ? modalBackdropClass : offcanvasBackdropClass;
[modalBackdropClass, offcanvasBackdropClass].forEach((c) => {
removeClass(overlay, c);
});
addClass(overlay, targetClass);
}
function appendOverlay(hasFade, isModal) {
toggleOverlayType(isModal);
document.body.appendChild(overlay);
if (hasFade) addClass(overlay, fadeClass);
}
@ -1499,7 +1506,6 @@
if (!currentOpen) {
removeClass(overlay, fadeClass);
removeClass(bd, modalOpenClass);
bd.removeChild(overlay);
resetScrollbar();
}
@ -1518,7 +1524,6 @@
const modalString = 'modal';
const modalComponent = 'Modal';
const modalSelector = `.${modalString}`;
// const modalActiveSelector = `.${modalString}.${showClass}`;
const modalToggleSelector = `[${dataBsToggle}="${modalString}"]`;
const modalDismissSelector = `[${dataBsDismiss}="${modalString}"]`;
const modalStaticClass = `${modalString}-static`;
@ -1567,8 +1572,11 @@
}
function afterModalHide(self) {
const { triggers } = self;
removeOverlay();
const { triggers, options } = self;
if (!getCurrentOpen()) {
if (options.backdrop) removeOverlay();
resetScrollbar();
}
self.element.style.paddingRight = '';
self.isAnimating = false;
@ -1594,9 +1602,8 @@
element.style.display = 'block';
setModalScrollbar(self);
if (!queryElement(modalActiveSelector)) {
if (!getCurrentOpen()) {
document.body.style.overflow = 'hidden';
addClass(document.body, modalOpenClass);
}
addClass(element, showClass);
@ -1609,16 +1616,15 @@
function beforeModalHide(self, force) {
const {
element, relatedTarget, hasFade,
element, options, relatedTarget, hasFade,
} = self;
const currentOpen = getCurrentOpen();
element.style.display = '';
// force can also be the transitionEvent object, we wanna make sure it's not
// call is not forced and overlay is visible
if (!force && hasFade && hasClass(overlay, showClass)
&& !currentOpen) { // AND no modal is visible
if (options.backdrop && !force && hasFade && hasClass(overlay, showClass)
&& !getCurrentOpen()) { // AND no modal is visible
hideOverlay();
emulateTransitionEnd(overlay, () => afterModalHide(self));
} else {
@ -1666,7 +1672,8 @@
if (self.isAnimating) return;
const { isStatic, modalDialog } = self;
const { options, isStatic, modalDialog } = self;
const { backdrop } = options;
const { target } = e;
const selectedText = document.getSelection().toString().length;
const targetInsideDialog = modalDialog.contains(target);
@ -1676,7 +1683,7 @@
addClass(element, modalStaticClass);
self.isAnimating = true;
emulateTransitionEnd(modalDialog, () => staticTransitionEnd(self));
} else if (dismiss || (!selectedText && !isStatic && !targetInsideDialog)) {
} else if (dismiss || (!selectedText && !isStatic && !targetInsideDialog && backdrop)) {
self.relatedTarget = dismiss || null;
self.hide();
e.preventDefault();
@ -1734,8 +1741,9 @@
show() {
const self = this;
const {
element, isAnimating, hasFade, relatedTarget,
element, options, isAnimating, hasFade, relatedTarget,
} = self;
const { backdrop } = options;
let overlayDelay = 0;
if (hasClass(element, showClass) && !isAnimating) return;
@ -1744,8 +1752,6 @@
element.dispatchEvent(showModalEvent);
if (showModalEvent.defaultPrevented) return;
self.isAnimating = true;
// we elegantly hide any opened modal/offcanvas
const currentOpen = getCurrentOpen();
if (currentOpen && currentOpen !== element) {
@ -1755,18 +1761,24 @@
that.hide();
}
if (!queryElement(`.${modalBackdropClass}`)) {
appendOverlay(hasFade);
}
overlayDelay = getElementTransitionDuration(overlay);
self.isAnimating = true;
if (!hasClass(overlay, showClass)) {
showOverlay();
}
if (backdrop) {
if (!currentOpen && !hasClass(overlay, showClass)) {
appendOverlay(hasFade, 1);
} else {
toggleOverlayType(1);
}
overlayDelay = getElementTransitionDuration(overlay);
if (!currentOpen) {
if (!hasClass(overlay, showClass)) showOverlay();
setTimeout(() => beforeModalShow(self), overlayDelay);
} else beforeModalShow(self);
} else {
beforeModalShow(self);
if (currentOpen && hasClass(overlay, showClass)) {
hideOverlay();
}
}
}
hide(force) {
@ -1863,7 +1875,6 @@
const { element, options } = self;
if (!options.scroll) {
addClass(document.body, modalOpenClass);
document.body.style.overflow = 'hidden';
setOffCanvasScrollbar(self);
}
@ -1909,15 +1920,15 @@
const self = element[offcanvasComponent];
if (!self) return;
const { options, open, triggers } = self;
const { options, triggers } = self;
const { target } = e;
const trigger = target.closest(offcanvasToggleSelector);
if (trigger && trigger.tagName === 'A') e.preventDefault();
if (open && ((!element.contains(target) && options.backdrop
if ((!element.contains(target) && options.backdrop
&& (!trigger || (trigger && !triggers.includes(trigger))))
|| offCanvasDismiss.contains(target))) {
|| offCanvasDismiss.contains(target)) {
self.relatedTarget = target === offCanvasDismiss ? offCanvasDismiss : null;
self.hide();
}
@ -1965,7 +1976,6 @@
element.removeAttribute(ariaModal);
element.removeAttribute('role');
element.style.visibility = '';
self.open = false;
self.isAnimating = false;
if (triggers.length) {
@ -1979,7 +1989,6 @@
if (options.backdrop) removeOverlay();
if (!options.scroll) {
resetScrollbar();
removeClass(document.body, modalOpenClass);
}
}
@ -2005,7 +2014,6 @@
.filter((btn) => getTargetElement(btn) === element);
// additional instance property
self.open = false;
self.isAnimating = false;
self.scrollbarWidth = measureScrollbar();
@ -2017,7 +2025,8 @@
// ========================
toggle() {
const self = this;
return self.open ? self.hide() : self.show();
if (hasClass(self.element, showClass)) self.hide();
else self.show();
}
show() {
@ -2027,7 +2036,7 @@
} = self;
let overlayDelay = 0;
if (self.open || isAnimating) return;
if (hasClass(element, showClass) || isAnimating) return;
showOffcanvasEvent.relatedTarget = relatedTarget || null;
element.dispatchEvent(showOffcanvasEvent);
@ -2043,12 +2052,13 @@
that.hide();
}
self.open = true;
self.isAnimating = true;
if (options.backdrop) {
if (!queryElement(`.${modalBackdropClass}`)) {
if (!currentOpen) {
appendOverlay(1);
} else {
toggleOverlayType();
}
overlayDelay = getElementTransitionDuration(overlay);
@ -2056,14 +2066,19 @@
if (!hasClass(overlay, showClass)) showOverlay();
setTimeout(() => beforeOffcanvasShow(self), overlayDelay);
} else beforeOffcanvasShow(self);
} else {
beforeOffcanvasShow(self);
if (currentOpen && hasClass(overlay, showClass)) {
hideOverlay();
}
}
}
hide(force) {
const self = this;
const { element, isAnimating, relatedTarget } = self;
if (!self.open || isAnimating) return;
if (!hasClass(element, showClass) || isAnimating) return;
hideOffcanvasEvent.relatedTarget = relatedTarget || null;
element.dispatchEvent(hideOffcanvasEvent);
@ -3483,7 +3498,7 @@
constructor: Tooltip,
};
var version = "4.0.4";
var version = "4.0.6";
// import { alertInit } from '../components/alert-native.js';
// import { buttonInit } from '../components/button-native.js';

882
src/static/scripts/bootstrap.css
File diff suppressed because it is too large
View File

110
src/static/scripts/datatables.css

@ -4,13 +4,94 @@
*
* To rebuild or modify this file with the latest versions of the included
* software please visit:
* https://datatables.net/download/#bs5/dt-1.10.25
* https://datatables.net/download/#bs5/dt-1.11.2
*
* Included libraries:
* DataTables 1.10.25
* DataTables 1.11.2
*/
@charset "UTF-8";
td.dt-control {
background: url("https://www.datatables.net/examples/resources/details_open.png") no-repeat center center;
cursor: pointer;
}
tr.dt-hasChild td.dt-control {
background: url("https://www.datatables.net/examples/resources/details_close.png") no-repeat center center;
}
table.dataTable th.dt-left,
table.dataTable td.dt-left {
text-align: left;
}
table.dataTable th.dt-center,
table.dataTable td.dt-center,
table.dataTable td.dataTables_empty {
text-align: center;
}
table.dataTable th.dt-right,
table.dataTable td.dt-right {
text-align: right;
}
table.dataTable th.dt-justify,
table.dataTable td.dt-justify {
text-align: justify;
}
table.dataTable th.dt-nowrap,
table.dataTable td.dt-nowrap {
white-space: nowrap;
}
table.dataTable thead th.dt-head-left,
table.dataTable thead td.dt-head-left,
table.dataTable tfoot th.dt-head-left,
table.dataTable tfoot td.dt-head-left {
text-align: left;
}
table.dataTable thead th.dt-head-center,
table.dataTable thead td.dt-head-center,
table.dataTable tfoot th.dt-head-center,
table.dataTable tfoot td.dt-head-center {
text-align: center;
}
table.dataTable thead th.dt-head-right,
table.dataTable thead td.dt-head-right,
table.dataTable tfoot th.dt-head-right,
table.dataTable tfoot td.dt-head-right {
text-align: right;
}
table.dataTable thead th.dt-head-justify,
table.dataTable thead td.dt-head-justify,
table.dataTable tfoot th.dt-head-justify,
table.dataTable tfoot td.dt-head-justify {
text-align: justify;
}
table.dataTable thead th.dt-head-nowrap,
table.dataTable thead td.dt-head-nowrap,
table.dataTable tfoot th.dt-head-nowrap,
table.dataTable tfoot td.dt-head-nowrap {
white-space: nowrap;
}
table.dataTable tbody th.dt-body-left,
table.dataTable tbody td.dt-body-left {
text-align: left;
}
table.dataTable tbody th.dt-body-center,
table.dataTable tbody td.dt-body-center {
text-align: center;
}
table.dataTable tbody th.dt-body-right,
table.dataTable tbody td.dt-body-right {
text-align: right;
}
table.dataTable tbody th.dt-body-justify,
table.dataTable tbody td.dt-body-justify {
text-align: justify;
}
table.dataTable tbody th.dt-body-nowrap,
table.dataTable tbody td.dt-body-nowrap {
white-space: nowrap;
}
/*! Bootstrap 5 integration for DataTables
*
* ©2020 SpryMedia Ltd, all rights reserved.
@ -143,21 +224,21 @@ div.dataTables_scrollHead table.dataTable {
margin-bottom: 0 !important;
}
div.dataTables_scrollBody table {
div.dataTables_scrollBody > table {
border-top: none;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
div.dataTables_scrollBody table thead .sorting:before,
div.dataTables_scrollBody table thead .sorting_asc:before,
div.dataTables_scrollBody table thead .sorting_desc:before,
div.dataTables_scrollBody table thead .sorting:after,
div.dataTables_scrollBody table thead .sorting_asc:after,
div.dataTables_scrollBody table thead .sorting_desc:after {
div.dataTables_scrollBody > table > thead .sorting:before,
div.dataTables_scrollBody > table > thead .sorting_asc:before,
div.dataTables_scrollBody > table > thead .sorting_desc:before,
div.dataTables_scrollBody > table > thead .sorting:after,
div.dataTables_scrollBody > table > thead .sorting_asc:after,
div.dataTables_scrollBody > table > thead .sorting_desc:after {
display: none;
}
div.dataTables_scrollBody table tbody tr:first-child th,
div.dataTables_scrollBody table tbody tr:first-child td {
div.dataTables_scrollBody > table > tbody tr:first-child th,
div.dataTables_scrollBody > table > tbody tr:first-child td {
border-top: none;
}
@ -235,4 +316,11 @@ div.table-responsive > div.dataTables_wrapper > div.row > div[class^=col-]:last-
padding-right: 0;
}
table.dataTable.table-striped > tbody > tr:nth-of-type(2n+1) {
--bs-table-accent-bg: transparent;
}
table.dataTable.table-striped > tbody > tr.odd {
--bs-table-accent-bg: var(--bs-table-striped-bg);
}

810
src/static/scripts/datatables.js
File diff suppressed because it is too large
View File

15
src/static/templates/admin/settings.hbs

@ -12,9 +12,7 @@
{{#each config}}
{{#if groupdoc}}
<div class="card bg-light mb-3">
<div class="card-header" role="button" data-bs-toggle="collapse" data-bs-target="#g_{{group}}">
<button type="button" class="btn btn-link text-decoration-none collapsed" data-bs-toggle="collapse" data-bs-target="#g_{{group}}">{{groupdoc}}</button>
</div>
<button id="b_{{group}}" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_{{group}}" data-bs-toggle="collapse" data-bs-target="#g_{{group}}">{{groupdoc}}</button>
<div id="g_{{group}}" class="card-body collapse">
{{#each elements}}
{{#if editable}}
@ -61,10 +59,8 @@
{{/each}}
<div class="card bg-light mb-3">
<div class="card-header" role="button" data-bs-toggle="collapse" data-bs-target="#g_readonly">
<button type="button" class="btn btn-link text-decoration-none collapsed" data-bs-toggle="collapse" data-bs-target="#g_readonly">Read-Only Config</button>
</div>
<button id="b_readonly" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_readonly"
data-bs-toggle="collapse" data-bs-target="#g_readonly">Read-Only Config</button>
<div id="g_readonly" class="card-body collapse">
<div class="small mb-3">
NOTE: These options can't be modified in the editor because they would require the server
@ -109,9 +105,8 @@
{{#if can_backup}}
<div class="card bg-light mb-3">
<div class="card-header" role="button" data-bs-toggle="collapse" data-bs-target="#g_database">
<button type="button" class="btn btn-link text-decoration-none collapsed" data-bs-toggle="collapse" data-bs-target="#g_database">Backup Database</button>
</div>
<button id="b_database" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_database"
data-bs-toggle="collapse" data-bs-target="#g_database">Backup Database</button>
<div id="g_database" class="card-body collapse">
<div class="small mb-3">
WARNING: This function only creates a backup copy of the SQLite database.

Loading…
Cancel
Save