feat: media js bundle with checkall and closesubmenus

3 files changed, 46 insertions, 34 deletions

diff --git a/src/fn/fn.js b/src/fn/fn.js
new file mode 100644
index 0000000..bca4eaf
--- /dev/null
+++ b/src/fn/fn.js
@@ -0,0 +1,30 @@
+/**
+ * Manage input event on the checkall checkbox.
+ * Call with .bind({checkboxes: HTMLElement[]})
+ * @param {InputEvent} e the input event
+ */
+export function checkallHandler(e) {
+    if (e.target.checked) {
+        for (const checkbox of this.checkboxes) {
+            checkbox.checked = true;
+        }
+    } else {
+        for (const checkbox of this.checkboxes) {
+            checkbox.checked = false;
+        }
+    }
+}
+
+/**
+ * Close all submenus of the menubar.
+ * @param {MouseEvent} e
+ */
+export function closeSubmenus(e) {
+    let details = document.querySelectorAll('aside details');
+    let currentDetail = e.target.closest('details');
+    for (const detail of details) {
+        if (!detail.isSameNode(currentDetail)) {
+            detail.removeAttribute('open');
+        }
+    }
+}
diff --git a/src/home.js b/src/home.js
index 7562389..8906079 100644
--- a/src/home.js
+++ b/src/home.js
@@ -1,44 +1,13 @@
-/** @type {HTMLInputElement[]} */
-let checkboxes = [];
+import { checkallHandler, closeSubmenus } from './fn/fn';
 
 window.addEventListener('load', () => {
-    checkboxes = document.getElementsByName('pagesid[]');
+    let checkboxes = document.getElementsByName('pagesid[]');
     let checkall = document.getElementById('checkall');
     let checkbox = document.createElement('input');
     checkbox.type = 'checkbox';
-    checkbox.addEventListener('input', checkallHandler);
+    checkbox.addEventListener('input', checkallHandler.bind({ checkboxes }));
     checkall.innerHTML = '';
     checkall.appendChild(checkbox);
 });
 
 window.addEventListener('click', closeSubmenus);
-
-/**
- * Manage input event on the checkall checkbox.
- * @param {InputEvent} e the input event
- */
-function checkallHandler(e) {
-    if (e.target.checked) {
-        for (const checkbox of checkboxes) {
-            checkbox.checked = true;
-        }
-    } else {
-        for (const checkbox of checkboxes) {
-            checkbox.checked = false;
-        }
-    }
-}
-
-/**
- * Close all submenus of the menubar.
- * @param {MouseEvent} e
- */
-function closeSubmenus(e) {
-    let details = document.querySelectorAll('aside details');
-    let currentDetail = e.target.closest('details');
-    for (const detail of details) {
-        if (!detail.isSameNode(currentDetail)) {
-            detail.removeAttribute('open');
-        }
-    }
-}
diff --git a/src/media.js b/src/media.js
new file mode 100644
index 0000000..3ac7e3f
--- /dev/null
+++ b/src/media.js
@@ -0,0 +1,13 @@
+import { checkallHandler, closeSubmenus } from './fn/fn';
+
+window.addEventListener('load', () => {
+    let checkboxes = document.getElementsByName('id[]');
+    let checkall = document.getElementById('checkall');
+    let checkbox = document.createElement('input');
+    checkbox.type = 'checkbox';
+    checkbox.addEventListener('input', checkallHandler.bind({ checkboxes }));
+    checkall.innerHTML = '';
+    checkall.appendChild(checkbox);
+});
+
+window.addEventListener('click', closeSubmenus);