diff options
| -rw-r--r-- | app/view/templates/media.php | 5 | ||||
| -rw-r--r-- | src/fn/fn.js | 30 | ||||
| -rw-r--r-- | src/home.js | 37 | ||||
| -rw-r--r-- | src/media.js | 13 | ||||
| -rw-r--r-- | webpack.config.js | 1 |
5 files changed, 51 insertions, 35 deletions
diff --git a/app/view/templates/media.php b/app/view/templates/media.php index ba385cb..f3d87fc 100644 --- a/app/view/templates/media.php +++ b/app/view/templates/media.php @@ -76,7 +76,7 @@ $this->layout('layout', ['title' => 'media', 'css' => $css . 'home.css']) ?> <table id="medialist"> <tr> - <th>x</th> + <th id="checkall">x</th> <th><a href="<?= $mediaopt->getsortbyadress('id') ?>">id</a></th> <th>ext</th> <th><a href="<?= $mediaopt->getsortbyadress('type') ?>">type</a></th> @@ -113,6 +113,9 @@ $this->layout('layout', ['title' => 'media', 'css' => $css . 'home.css']) ?> </section> </main> + +<script src="<?= Wcms\Model::jspath() ?>media.bundle.js"></script> + </body> <?php $this->stop('page') ?>
\ No newline at end of file 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); diff --git a/webpack.config.js b/webpack.config.js index c256ad2..1c38b9b 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -16,6 +16,7 @@ module.exports = (env) => { entry: { edit: './src/edit.js', home: './src/home.js', + media: './src/media.js', sentry: './src/sentry.js', }, output: { |