diff --git a/static/scripts/grid.js b/static/scripts/grid/grid.js similarity index 85% rename from static/scripts/grid.js rename to static/scripts/grid/grid.js index fbd4e08..8a929e4 100644 --- a/static/scripts/grid.js +++ b/static/scripts/grid/grid.js @@ -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") { diff --git a/static/scripts/grid/sort.js b/static/scripts/grid/sort.js new file mode 100644 index 0000000..dcb23f0 --- /dev/null +++ b/static/scripts/grid/sort.js @@ -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); + } + } +} diff --git a/templates/base.html b/templates/base.html index 6d89d3d..846a861 100644 --- a/templates/base.html +++ b/templates/base.html @@ -80,7 +80,8 @@ - + +