Split the grid javascript code
This commit is contained in:
parent
2eb8ebfeca
commit
f854a01925
@ -1,53 +1,3 @@
|
||||
// Sort button
|
||||
class BrickGridSortButton {
|
||||
constructor(button, grid) {
|
||||
this.button = button;
|
||||
this.grid = grid;
|
||||
this.data = this.button.dataset;
|
||||
|
||||
// Setup
|
||||
button.addEventListener("click", ((grid, button) => (e) => {
|
||||
grid.sort(button);
|
||||
})(grid, this));
|
||||
}
|
||||
|
||||
// Active
|
||||
active() {
|
||||
this.button.classList.remove("btn-outline-primary");
|
||||
this.button.classList.add("btn-primary");
|
||||
}
|
||||
|
||||
// Inactive
|
||||
inactive() {
|
||||
delete this.button.dataset.sortOrder;
|
||||
this.button.classList.remove("btn-primary");
|
||||
this.button.classList.add("btn-outline-primary");
|
||||
}
|
||||
|
||||
// Toggle sorting
|
||||
toggle(order) {
|
||||
// Cleanup
|
||||
delete this.button.dataset.sortOrder;
|
||||
|
||||
let icon = this.button.querySelector("i.ri");
|
||||
if (icon) {
|
||||
this.button.removeChild(icon);
|
||||
}
|
||||
|
||||
// Set order
|
||||
if (order) {
|
||||
this.active();
|
||||
|
||||
this.button.dataset.sortOrder = order;
|
||||
|
||||
icon = document.createElement("i");
|
||||
icon.classList.add("ri", "ms-1", `ri-sort-${order}`);
|
||||
|
||||
this.button.append(icon);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Grid class
|
||||
class BrickGrid {
|
||||
constructor(grid, target = "div#grid>div") {
|
49
static/scripts/grid/sort.js
Normal file
49
static/scripts/grid/sort.js
Normal file
@ -0,0 +1,49 @@
|
||||
// Sort button
|
||||
class BrickGridSortButton {
|
||||
constructor(button, grid) {
|
||||
this.button = button;
|
||||
this.grid = grid;
|
||||
this.data = this.button.dataset;
|
||||
|
||||
// Setup
|
||||
button.addEventListener("click", ((grid, button) => (e) => {
|
||||
grid.sort(button);
|
||||
})(grid, this));
|
||||
}
|
||||
|
||||
// Active
|
||||
active() {
|
||||
this.button.classList.remove("btn-outline-primary");
|
||||
this.button.classList.add("btn-primary");
|
||||
}
|
||||
|
||||
// Inactive
|
||||
inactive() {
|
||||
delete this.button.dataset.sortOrder;
|
||||
this.button.classList.remove("btn-primary");
|
||||
this.button.classList.add("btn-outline-primary");
|
||||
}
|
||||
|
||||
// Toggle sorting
|
||||
toggle(order) {
|
||||
// Cleanup
|
||||
delete this.button.dataset.sortOrder;
|
||||
|
||||
let icon = this.button.querySelector("i.ri");
|
||||
if (icon) {
|
||||
this.button.removeChild(icon);
|
||||
}
|
||||
|
||||
// Set order
|
||||
if (order) {
|
||||
this.active();
|
||||
|
||||
this.button.dataset.sortOrder = order;
|
||||
|
||||
icon = document.createElement("i");
|
||||
icon.classList.add("ri", "ms-1", `ri-sort-${order}`);
|
||||
|
||||
this.button.append(icon);
|
||||
}
|
||||
}
|
||||
}
|
@ -80,7 +80,8 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/simple-datatables@9.2.1/dist/umd/simple-datatables.min.js"></script>
|
||||
<!-- BrickTracker scripts -->
|
||||
<script src="{{ url_for('static', filename='scripts/changer.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/grid.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/grid/grid.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/grid/sort.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/set.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/socket/socket.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='scripts/socket/instructions.js') }}"></script>
|
||||
|
Loading…
Reference in New Issue
Block a user