diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js index b7095fa78..ce2e0efd2 100644 Binary files a/netbox/project-static/dist/netbox.js and b/netbox/project-static/dist/netbox.js differ diff --git a/netbox/project-static/dist/netbox.js.map b/netbox/project-static/dist/netbox.js.map index 61469e070..981430407 100644 Binary files a/netbox/project-static/dist/netbox.js.map and b/netbox/project-static/dist/netbox.js.map differ diff --git a/netbox/project-static/src/buttons/selectMultiple.ts b/netbox/project-static/src/buttons/selectMultiple.ts index dc33e4fc5..0ec19672c 100644 --- a/netbox/project-static/src/buttons/selectMultiple.ts +++ b/netbox/project-static/src/buttons/selectMultiple.ts @@ -4,29 +4,21 @@ import { previousPkCheckState } from '../stores'; type PreviousPkCheckState = { element: Nullable }; -function preventTextHighlight(): void { - return +function removeTextSelection(): void{ + window.getSelection()?.removeAllRanges(); } function updatePreviousPkCheckState(eventTargetElement: HTMLInputElement, state: StateManager): void { state.set('element', eventTargetElement); } -function handlePkCheck(event: _MouseEvent, state: StateManager): void { - const eventTargetElement = event.target as HTMLInputElement; - const previousStateElement = state.get('element'); - updatePreviousPkCheckState(eventTargetElement, state); - //Stop if user is not holding shift key - if(event.shiftKey === false){ - return - } - //If no previous state, store event target element as previous state and return - if (previousStateElement === null) { - return updatePreviousPkCheckState(eventTargetElement, state); - } - const checkboxList = getElements('input[type="checkbox"][name="pk"]'); - let changePkCheckboxState = false; - for(const element of checkboxList){ +function toggleCheckboxRange(eventTargetElement: HTMLInputElement, previousStateElement: HTMLInputElement, elementList: Generator): void{ + let changePkCheckboxState = false + for(let element of elementList){ + //Change loop's current checkbox state to eventTargetElement checkbox state + if(changePkCheckboxState === true){ + element.checked = eventTargetElement.checked; + } //The previously clicked checkbox was above the shift clicked checkbox if(element === previousStateElement){ if(changePkCheckboxState === true){ @@ -34,9 +26,6 @@ function handlePkCheck(event: _MouseEvent, state: StateManager): void { + const eventTargetElement = event.target as HTMLInputElement; + const previousStateElement = state.get('element'); + updatePreviousPkCheckState(eventTargetElement, state); + //Stop if user is not holding shift key + if(!event.shiftKey){ + return + } + removeTextSelection(); + //If no previous state, store event target element as previous state and return + if (previousStateElement === null) { + return updatePreviousPkCheckState(eventTargetElement, state); + } + const checkboxList = getElements('input[type="checkbox"][name="pk"]'); + toggleCheckboxRange(eventTargetElement, previousStateElement, checkboxList) +} + export function initSelectMultiple(): void { const checkboxElements = getElements('input[type="checkbox"][name="pk"]'); for (const element of checkboxElements) { element.addEventListener('click', (event) => { - //Prevents shift+click from selecting table text - document.addEventListener('selectstart', preventTextHighlight) + removeTextSelection() //Stop propogation to avoid event firing multiple times event.stopPropagation(); - //Main logic for multi select handlePkCheck(event, previousPkCheckState); - //Re-enables user's ability to select table text - document.removeEventListener('selectstart', preventTextHighlight) }); } }