some fiddling

resources/public/js/scripts.js

@@ -1,59 +1,81 @@
 document.addEventListener('DOMContentLoaded', function() {
     function label(element, value) {
-	if(element.hasAttribute('value')) {
+        if(element.hasAttribute('value')) {
-	    if(value !== undefined) {
+            if(value !== undefined) {
-		element.setAttribute('value', value)
+                element.setAttribute('value', value)
-	    } else {
+            } else {
-		return element.getAttribute('value')
+                return element.getAttribute('value')
-	    }
+            }
-	} else {
+        } else {
-	    if(value !== undefined) {
+            if(value !== undefined) {
-		element.textContent = value
+                element.textContent = value
-	    } else {
+            } else {
-		return element.textContent
+                return element.textContent
-	    }
+            }
-	}
+        }
     }
 
     function countdownDeleteButton(event) {
-	const btn = event.target
+        const btn = event.target
-	const countdown = btn.getAttribute('data-countdown')
+        const countdown = btn.getAttribute('data-countdown')
-
+
-	if(countdown != 1) {
+        if(countdown != 1) {
-	    event.preventDefault()
+            event.preventDefault()
-	    btn.classList.add('__on-countdown')
+            btn.classList.add('__on-countdown')
-
+
-	    const hasCountdown = countdown !== null
+            const hasCountdown = countdown !== null
-	    const newCountdown = hasCountdown ? countdown - 1 : 3
+            const newCountdown = hasCountdown ? countdown - 1 : 3
-
+
-	    if(!hasCountdown) {
+            if(!hasCountdown) {
-		btn.setAttribute('data-label', label(btn))
+                btn.setAttribute('data-label', label(btn))
-	    }
+            }
-
+
-	    label(btn, newCountdown)
+            label(btn, newCountdown)
-	    btn.setAttribute('data-countdown', newCountdown)
+            btn.setAttribute('data-countdown', newCountdown)
-	    setTimeout(countdownDeleteButton, 1000, event)
+            setTimeout(countdownDeleteButton, 1000, event)
-	} else {
+        } else {
-	    label(btn, btn.getAttribute('data-label'))
+            label(btn, btn.getAttribute('data-label'))
-	}
+        }
     }
 
     document.querySelectorAll('.delete-btn').forEach(function(btn) {
-	btn.addEventListener('click', countdownDeleteButton)
+        btn.addEventListener('click', countdownDeleteButton)
     })
-})
 
-$(document).ready(function() {
+    function dynamicTables() {
-    return;
+        const range = (x,y) =>
-    $('table').DataTable({
+              x > y ? [] : [x, ...range(x + 1, y)];
-	stateSave: true,
+
-	fixedHeader: true,
+        const pageSize = 50
-	lengthMenu: [[25, 50, 100, -1], [25, 50, 100, "All"]],
+        const colsFromThead = thead =>
-	stateSaveCallback: function(settings,data) {
+              [...thead.children[0].children].map(th => th.innerText)
-	    localStorage.setItem('DataTables', JSON.stringify(data))
+        const visibleRows = page =>
-	},
+              range(page * pageSize, (page + 1) * pageSize - 1)
-	stateLoadCallback: function(settings) {
+
-	    return JSON.parse(localStorage.getItem('DataTables'))
+        document.querySelectorAll('table').forEach(function(tbl) {
-	}
+            const thead = tbl.tHead
-    })
+            const tbody = tbl.tBodies[0]
+            const cols = colsFromThead(thead)
+            const rows = [...tbl.rows]
+            let page = 0
+            console.debug(visibleRows(1))
+        })
+    }
+    dynamicTables()
 })
+
+/*
+  $(document).ready(function() {
+  $('table').DataTable({
+  stateSave: true,
+  fixedHeader: true,
+  lengthMenu: [[25, 50, 100, -1], [25, 50, 100, "All"]],
+  stateSaveCallback: function(settings,data) {
+  localStorage.setItem('DataTables', JSON.stringify(data))
+  },
+  stateLoadCallback: function(settings) {
+  return JSON.parse(localStorage.getItem('DataTables'))
+  }
+  })
+  })
+*/