From 5b1457835be6c00a7d108537ecc88d3d85d48d51 Mon Sep 17 00:00:00 2001 From: n-peugnet Date: Tue, 28 Apr 2020 18:08:35 +0200 Subject: feat: select all for code inputs This enable the "select all" feature for `input.select-all` element. input elements are used because these are the only one with the `select()` method. To obtain the same rendering as before the readonly attribute and the class `code` have been added to these elements. @vincent-peugnet: make sure to use this element for future select-all Closes #107 --- src/fn/fn.js | 21 +++++++++++++++++++++ src/home.js | 4 +++- src/media.js | 4 +++- 3 files changed, 27 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/fn/fn.js b/src/fn/fn.js index bca4eaf..a5aa538 100644 --- a/src/fn/fn.js +++ b/src/fn/fn.js @@ -28,3 +28,24 @@ export function closeSubmenus(e) { } } } + +/** + * Select the whole content of the clicked item. + * @param {MouseEvent} e + */ +function selectAll(e) { + if (e.target instanceof HTMLInputElement) { + e.target.select(); + e.target.focus(); + } +} + +/** + * Activate "select all" feature for `input.select-all` elements. + */ +export function activateSelectAll() { + let selectAllInputs = document.querySelectorAll('input.select-all'); + for (const selectAllInput of selectAllInputs) { + selectAllInput.addEventListener('click', selectAll); + } +} diff --git a/src/home.js b/src/home.js index 3dc79ef..0778edb 100644 --- a/src/home.js +++ b/src/home.js @@ -1,4 +1,4 @@ -import { checkallHandler, closeSubmenus } from './fn/fn'; +import { checkallHandler, closeSubmenus, activateSelectAll } from './fn/fn'; window.addEventListener('load', () => { let checkboxes = document.getElementsByName('pagesid[]'); @@ -11,6 +11,8 @@ window.addEventListener('load', () => { checkbox.addEventListener('input', checkallHandler.bind({ checkboxes })); checkall.innerHTML = ''; checkall.appendChild(checkbox); + + activateSelectAll(); }); window.addEventListener('click', closeSubmenus); diff --git a/src/media.js b/src/media.js index 3ac7e3f..356c7c9 100644 --- a/src/media.js +++ b/src/media.js @@ -1,4 +1,4 @@ -import { checkallHandler, closeSubmenus } from './fn/fn'; +import { checkallHandler, closeSubmenus, activateSelectAll } from './fn/fn'; window.addEventListener('load', () => { let checkboxes = document.getElementsByName('id[]'); @@ -8,6 +8,8 @@ window.addEventListener('load', () => { checkbox.addEventListener('input', checkallHandler.bind({ checkboxes })); checkall.innerHTML = ''; checkall.appendChild(checkbox); + + activateSelectAll(); }); window.addEventListener('click', closeSubmenus); -- cgit v1.2.3