NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-22 20:12:00 -06:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

fix rack elevation show/hide image toggle

Browse Source
This commit is contained in:
checktheroads 2021-04-21 13:20:31 -07:00
parent 8c3229ec38
commit c3c79d3715
6 changed files with 41 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
netbox/project-static/dist/netbox.css vendored
View File

Binary file not shown.

2
netbox/project-static/dist/netbox.css.map vendored
View File

File diff suppressed because one or more lines are too long

BIN
netbox/project-static/dist/netbox.js vendored
View File

Binary file not shown.

BIN
netbox/project-static/dist/netbox.js.map vendored
View File

Binary file not shown.

68
netbox/project-static/src/buttons.ts
View File

@ -1,44 +1,44 @@
import { createToast } from './bs';
import { isTruthy, getElements, apiPatch, hasError, slugify } from './util';
/**
* Toggle the visibility of device images and update the toggle button style.
*/
function handleRackImageToggle(event: Event) {
const target = event.target as HTMLButtonElement;
const selected = target.getAttribute('selected');
if (isTruthy(selected)) {
for (const elevation of getElements<HTMLObjectElement>('.rack_elevation')) {
const images = elevation.contentDocument?.querySelectorAll('image.device-image') ?? [];
for (const image of images) {
if (image !== null && !image.classList.contains('hidden')) {
image.classList.add('hidden');
}
}
}
target.innerHTML = `<i class="mdi mdi-file-image-outline"></i>&nbsp;Show Images`;
target.setAttribute('selected', '');
} else {
for (const elevation of getElements<HTMLObjectElement>('.rack_elevation')) {
const images = elevation.contentDocument?.querySelectorAll('image.device-image') ?? [];
for (const image of images) {
if (image !== null) {
image.classList.remove('hidden');
}
}
}
target.innerHTML = `<i class="mdi mdi-file-image-outline"></i>&nbsp;Hide Images`;
target.setAttribute('selected', 'selected');
}
return;
}
/**
* Add onClick callback for toggling rack elevation images.
*/
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);
for (const button of getElements<HTMLButtonElement>('button.toggle-images')) {
button.addEventListener('click', handleRackImageToggle);
}
}

11
netbox/templates/dcim/rack.html
View File

@ -40,11 +40,6 @@
</h5>
<div class="card-body">
<table class="table table-hover attr-table">
<tr>
<td colspan="2">
<span class="badge bg-{{ object.get_status_class }}">{{ object.get_status_display }}</span>
</td>
</tr>
<tr>
<th scope="row">Site</th>
<td>
@ -96,6 +91,12 @@
<span class="text-muted">None</span>
{% endif %}
</td>
</tr>
<tr>
<th scope="row">Status</th>
<td>
<span class="badge bg-{{ object.get_status_class }}">{{ object.get_status_display }}</span>
</td>
</tr>
<tr>
<th scope="row">Role</th>