diff --git a/netbox/project-static/dist/netbox.css b/netbox/project-static/dist/netbox.css index 69fe83213..95ead473e 100644 Binary files a/netbox/project-static/dist/netbox.css and b/netbox/project-static/dist/netbox.css differ diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js index afdbea0f8..0c624bde5 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 212be3659..4a9df262e 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/floatBulk.ts b/netbox/project-static/src/buttons/floatBulk.ts new file mode 100644 index 000000000..88603d8d6 --- /dev/null +++ b/netbox/project-static/src/buttons/floatBulk.ts @@ -0,0 +1,35 @@ +import { getElements, fadeIn } from '../util'; + +/** + * Conditionally add and remove a class that will float the button group + * based on whether or not items in the list are checked + */ +function toggleFloat(): void { + const checkedCheckboxes = document.querySelector('input[type="checkbox"][name="pk"]:checked'); + const buttonGroup = document.querySelector('div.form.form-horizontal div.btn-list'); + const isFloating = buttonGroup.classList.contains('btn-float-group-left'); + if (checkedCheckboxes !== null && !isFloating) { + buttonGroup.classList.add('btn-float-group-left'); + } + else if (checkedCheckboxes === null && isFloating) { + buttonGroup.classList.remove('btn-float-group-left'); + } +} + + +/** + * Initialize floating bulk buttons. + */ +export function initFloatBulk(): void { + for (const element of getElements('input[type="checkbox"][name="pk"]')) { + element.addEventListener('change', event => { + toggleFloat(); + }); + } + // Handle the select-all checkbox + for (const element of getElements('table tr th > input[type="checkbox"].toggle')) { + element.addEventListener('change', event => { + toggleFloat(); + }); + } +} diff --git a/netbox/project-static/src/buttons/index.ts b/netbox/project-static/src/buttons/index.ts index 6c1c0db0b..cb520b818 100644 --- a/netbox/project-static/src/buttons/index.ts +++ b/netbox/project-static/src/buttons/index.ts @@ -3,6 +3,7 @@ import { initDepthToggle } from './depthToggle'; import { initMoveButtons } from './moveOptions'; import { initReslug } from './reslug'; import { initSelectAll } from './selectAll'; +import { initFloatBulk } from './floatBulk'; import { initSelectMultiple } from './selectMultiple'; import { initMarkdownPreviews } from './markdownPreview'; import { initSecretToggle } from './secretToggle'; @@ -14,6 +15,7 @@ export function initButtons(): void { initReslug, initSelectAll, initSelectMultiple, + initFloatBulk, initMoveButtons, initMarkdownPreviews, initSecretToggle,