1
0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00

replace rack elevation logic

This commit is contained in:
checktheroads
2021-03-19 09:25:27 -07:00
parent 5f5df97e59
commit 5fdf2d3416
8 changed files with 75 additions and 56 deletions

View File

@ -0,0 +1,42 @@
import { isTruthy, getElements } from './util';
/**
* Add onClick callback for toggling rack elevation images.
*/
export function initRackElevation() {
for (const button of getElements('button.toggle-images')) {
/**
* Toggle the visibility of device images and update the toggle button style.
*/
function handleClick(event: Event) {
const target = event.target as HTMLButtonElement;
const selected = target.getAttribute('selected');
if (isTruthy(selected)) {
target.innerHTML = `<i class="bi bi-file-image"></i> Show Images`;
for (const elevation of getElements<HTMLObjectElement>('.rack_elevation')) {
const images = elevation.contentDocument?.querySelectorAll('image.device-image') ?? [];
for (const image of images) {
if (!image.classList.contains('hidden')) {
image && image.classList.add('hidden');
}
}
}
target.setAttribute('selected', '');
} else {
target.innerHTML = `<i class="bi bi-file-image"></i> Hide Images`;
for (const elevation of getElements<HTMLObjectElement>('.rack_elevation')) {
const images = elevation.contentDocument?.querySelectorAll('image.device-image') ?? [];
for (const image of images) {
image && image.classList.remove('hidden');
}
}
target.setAttribute('selected', 'selected');
}
}
button.addEventListener('click', handleClick);
}
}

View File

@ -4,6 +4,7 @@ import { initApiSelect, initStaticSelect, initColorSelect } from './select';
import { initDateSelector } from './dateSelector';
import { initMessageToasts } from './toast';
import { initSpeedSelector, initForms } from './forms';
import { initRackElevation } from './buttons';
import { initSearchBar } from './search';
import { getElements } from './util';
@ -16,6 +17,7 @@ const INITIALIZERS = [
initDateSelector,
initSpeedSelector,
initColorSelect,
initRackElevation,
] as (() => void)[];
/**

View File

@ -49,18 +49,20 @@ export async function getApiData<T extends APIObjectBase>(
}
export function getElements<K extends keyof SVGElementTagNameMap>(
key: K,
...key: K[]
): Generator<SVGElementTagNameMap[K]>;
export function getElements<K extends keyof HTMLElementTagNameMap>(
key: K,
...key: K[]
): Generator<HTMLElementTagNameMap[K]>;
export function getElements<E extends Element>(key: string): Generator<E>;
export function getElements<E extends Element>(...key: string[]): Generator<E>;
export function* getElements(
key: string | keyof HTMLElementTagNameMap | keyof SVGElementTagNameMap,
...key: (string | keyof HTMLElementTagNameMap | keyof SVGElementTagNameMap)[]
) {
for (const element of document.querySelectorAll(key)) {
if (element !== null) {
yield element;
for (const query of key) {
for (const element of document.querySelectorAll(query)) {
if (element !== null) {
yield element;
}
}
}
}