fix rack elevation show/hide image toggle

netbox/project-static/dist/netbox.js

@@ -869,7 +869,7 @@ var e;!function(t,i){"object"==typeof exports&&"object"==typeof module?module.ex
 },{"slim-select":"a5Nu","../util":"BHXf"}],"lv+U":[function(require,module,exports) {
 "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.initSelect=r;var e=require("./api"),t=require("./color"),i=require("./static");function r(){for(var r=0,c=[e.initApiSelect,t.initColorSelect,i.initStaticSelect];r<c.length;r++){(0,c[r])()}}
 },{"./api":"zEBK","./color":"sJun","./static":"KdzU"}],"EcbZ":[function(require,module,exports) {
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.initButtons=c;var e=require("./bs"),t=require("./util");function n(e,t){var n;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(n=r(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var i=0,a=function(){};return{s:a,n:function(){return i>=e.length?{done:!0}:{done:!1,value:e[i++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var l,o=!0,s=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return o=e.done,e},e:function(e){s=!0,l=e},f:function(){try{o||null==n.return||n.return()}finally{if(s)throw l}}}}function r(e,t){if(e){if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(e,t):void 0}}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function a(){var e,r=n((0,t.getElements)("button.toggle-images"));try{for(r.s();!(e=r.n()).done;){e.value.addEventListener("click",function(e){var r=e.target,i=r.getAttribute("selected");if((0,t.isTruthy)(i)){r.innerHTML='<i class="bi bi-file-image"></i> Show Images';var a,l=n((0,t.getElements)(".rack_elevation"));try{for(l.s();!(a=l.n()).done;){var o,s,c,u=n(null!==(o=null===(s=a.value.contentDocument)||void 0===s?void 0:s.querySelectorAll("image.device-image"))&&void 0!==o?o:[]);try{for(u.s();!(c=u.n()).done;){var d=c.value;d.classList.contains("hidden")||d&&d.classList.add("hidden")}}catch(L){u.e(L)}finally{u.f()}}}catch(L){l.e(L)}finally{l.f()}r.setAttribute("selected","")}else{r.innerHTML='<i class="bi bi-file-image"></i> Hide Images';var f,v=n((0,t.getElements)(".rack_elevation"));try{for(v.s();!(f=v.n()).done;){var m,g,y,b=n(null!==(m=null===(g=f.value.contentDocument)||void 0===g?void 0:g.querySelectorAll("image.device-image"))&&void 0!==m?m:[]);try{for(b.s();!(y=b.n()).done;){var h=y.value;h&&h.classList.remove("hidden")}}catch(L){b.e(L)}finally{b.f()}}}catch(L){v.e(L)}finally{v.f()}r.setAttribute("selected","selected")}})}}catch(i){r.e(i)}finally{r.f()}}function l(n){var r=n.getAttribute("data"),i=n.classList.contains("connected"),a=i?"planned":"connected";(0,t.isTruthy)(r)&&(0,t.apiPatch)("/api/dcim/cables/".concat(r,"/"),{status:a}).then(function(r){if((0,t.hasError)(r))(0,e.createToast)("danger","Error",r.error).show();else{var a,l=null===(a=n.parentElement)||void 0===a?void 0:a.parentElement,o=n.querySelector("i.mdi, span.mdi");i?(l.classList.remove("success"),l.classList.add("info"),n.classList.remove("connected","btn-warning"),n.classList.add("btn-info"),n.title="Mark Installed",o.classList.remove("mdi-lan-disconnect"),o.classList.add("mdi-lan-connect")):(l.classList.remove("info"),l.classList.add("success"),n.classList.remove("btn-success"),n.classList.add("connected","btn-warning"),n.title="Mark Installed",o.classList.remove("mdi-lan-connect"),o.classList.add("mdi-lan-disconnect"))}})}function o(){var e,r=n((0,t.getElements)("button.cable-toggle"));try{var i=function(){var t=e.value;t.addEventListener("click",function(){return l(t)})};for(r.s();!(e=r.n()).done;)i()}catch(a){r.e(a)}finally{r.f()}}function s(){var e=document.getElementById("id_slug"),n=document.getElementById("reslug");if(null!==e&&null!==n){var r=e.getAttribute("slug-source"),i=document.getElementById("id_".concat(r));if(null!==i){var a=e.getAttribute("maxlength"),l=50;a&&(l=Number(a)),i.addEventListener("blur",function(){e.value=(0,t.slugify)(i.value,l)}),n.addEventListener("click",function(){e.value=(0,t.slugify)(i.value,l)})}else console.error("Unable to find field for slug field.")}}function c(){for(var e=0,t=[a,o,s];e<t.length;e++){(0,t[e])()}}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.initButtons=u;var e=require("./bs"),t=require("./util");function n(e,t){var n;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(n=r(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var i=0,l=function(){};return{s:l,n:function(){return i>=e.length?{done:!0}:{done:!1,value:e[i++]}},e:function(e){throw e},f:l}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,o=!0,s=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return o=e.done,e},e:function(e){s=!0,a=e},f:function(){try{o||null==n.return||n.return()}finally{if(s)throw a}}}}function r(e,t){if(e){if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(e,t):void 0}}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function l(e){var r=e.target,i=r.getAttribute("selected");if((0,t.isTruthy)(i)){var l,a=n((0,t.getElements)(".rack_elevation"));try{for(a.s();!(l=a.n()).done;){var o,s,c,u=n(null!==(o=null===(s=l.value.contentDocument)||void 0===s?void 0:s.querySelectorAll("image.device-image"))&&void 0!==o?o:[]);try{for(u.s();!(c=u.n()).done;){var d=c.value;null===d||d.classList.contains("hidden")||d.classList.add("hidden")}}catch(L){u.e(L)}finally{u.f()}}}catch(L){a.e(L)}finally{a.f()}r.innerHTML='<i class="mdi mdi-file-image-outline"></i>&nbsp;Show Images',r.setAttribute("selected","")}else{var f,v=n((0,t.getElements)(".rack_elevation"));try{for(v.s();!(f=v.n()).done;){var m,g,y,b=n(null!==(m=null===(g=f.value.contentDocument)||void 0===g?void 0:g.querySelectorAll("image.device-image"))&&void 0!==m?m:[]);try{for(b.s();!(y=b.n()).done;){var h=y.value;null!==h&&h.classList.remove("hidden")}}catch(L){b.e(L)}finally{b.f()}}}catch(L){v.e(L)}finally{v.f()}r.innerHTML='<i class="mdi mdi-file-image-outline"></i>&nbsp;Hide Images',r.setAttribute("selected","selected")}}function a(){var e,r=n((0,t.getElements)("button.toggle-images"));try{for(r.s();!(e=r.n()).done;){e.value.addEventListener("click",l)}}catch(i){r.e(i)}finally{r.f()}}function o(n){var r=n.getAttribute("data"),i=n.classList.contains("connected"),l=i?"planned":"connected";(0,t.isTruthy)(r)&&(0,t.apiPatch)("/api/dcim/cables/".concat(r,"/"),{status:l}).then(function(r){if((0,t.hasError)(r))(0,e.createToast)("danger","Error",r.error).show();else{var l,a=null===(l=n.parentElement)||void 0===l?void 0:l.parentElement,o=n.querySelector("i.mdi, span.mdi");i?(a.classList.remove("success"),a.classList.add("info"),n.classList.remove("connected","btn-warning"),n.classList.add("btn-info"),n.title="Mark Installed",o.classList.remove("mdi-lan-disconnect"),o.classList.add("mdi-lan-connect")):(a.classList.remove("info"),a.classList.add("success"),n.classList.remove("btn-success"),n.classList.add("connected","btn-warning"),n.title="Mark Installed",o.classList.remove("mdi-lan-connect"),o.classList.add("mdi-lan-disconnect"))}})}function s(){var e,r=n((0,t.getElements)("button.cable-toggle"));try{var i=function(){var t=e.value;t.addEventListener("click",function(){return o(t)})};for(r.s();!(e=r.n()).done;)i()}catch(l){r.e(l)}finally{r.f()}}function c(){var e=document.getElementById("id_slug"),n=document.getElementById("reslug");if(null!==e&&null!==n){var r=e.getAttribute("slug-source"),i=document.getElementById("id_".concat(r));if(null!==i){var l=e.getAttribute("maxlength"),a=50;l&&(a=Number(l)),i.addEventListener("blur",function(){e.value=(0,t.slugify)(i.value,a)}),n.addEventListener("click",function(){e.value=(0,t.slugify)(i.value,a)})}else console.error("Unable to find field for slug field.")}}function u(){for(var e=0,t=[a,s,c];e<t.length;e++){(0,t[e])()}}
 },{"./bs":"UEe5","./util":"BHXf"}],"NEpu":[function(require,module,exports) {
 "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.initSecrets=d;var e=require("bootstrap"),t=require("./bs"),n=require("./util");function r(e,t){var n;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(n=o(e))||t&&e&&"number"==typeof e.length){n&&(e=n);var r=0,a=function(){};return{s:a,n:function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var c,i=!0,l=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return i=e.done,e},e:function(e){l=!0,c=e},f:function(){try{i||null==n.return||n.return()}finally{if(l)throw c}}}}function o(e,t){if(e){if("string"==typeof e)return a(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?a(e,t):void 0}}function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function c(){var e=document.getElementById("new_keypair_modal"),r=document.getElementById("use_new_pubkey");if(null!==e&&null!==r){var o=e.querySelector("textarea#new_pubkey"),a=e.querySelector("textarea#new_privkey");e.addEventListener("shown.bs.modal",function(){for(var e=0,r=[o,a];e<r.length;e++){var c=r[e];null!==c&&c.setAttribute("readonly","")}(0,n.apiGetBase)("/api/secrets/generate-rsa-key-pair").then(function(e){if((0,n.hasError)(e))(0,t.createToast)("danger","Error",e.error).show();else{var r=e.private_key,c=e.public_key;null!==o&&null!==a&&(o.value=c,a.value=r)}})}),r.addEventListener("click",function(){var e=document.getElementById("id_public_key");null!==o&&(e.value=o.value,e.innerText=o.value)})}}function i(e,t){var n=document.querySelector("button.unlock-secret[secret-id='".concat(e,"']")),r=document.querySelector("button.lock-secret[secret-id='".concat(e,"']")),o=document.querySelector("button.copy-secret[secret-id='".concat(e,"']"));null!==n&&("unlock"===t&&n.classList.add("d-none"),"lock"===t&&n.classList.remove("d-none")),null!==r&&("unlock"===t&&r.classList.remove("d-none"),"lock"===t&&r.classList.add("d-none")),null!==o&&("unlock"===t&&o.classList.remove("d-none"),"lock"===t&&o.classList.add("d-none"))}function l(){var o=document.getElementById("privkey_modal");if(null!==o){var a,c=new e.Modal(o),l=r((0,n.getElements)("button.unlock-secret"));try{var s=function(){var e=a.value;e.addEventListener("click",function(){return r=e.getAttribute("secret-id"),o=document.getElementById("secret_".concat(r)),void("string"==typeof r&&""!==r&&(0,n.apiGetBase)("/api/secrets/secrets/".concat(r)).then(function(e){if((0,n.hasError)(e))e.error.toLowerCase().includes("invalid session key")?c.show():(0,t.createToast)("danger","Error",e.error).show();else{var a=e.plaintext;null!==o&&null!==a?(o.innerText=a,i(r,"unlock")):c.show()}}));var r,o})};for(l.s();!(a=l.n()).done;)s()}catch(v){l.e(v)}finally{l.f()}var u,d=r((0,n.getElements)("button.lock-secret"));try{var f=function(){var e=u.value;e.addEventListener("click",function(){return function(e){if("string"==typeof e&&""!==e){var t=document.getElementById("secret_".concat(e));null!==t&&(t.innerText="********"),i(e,"lock")}}(e.getAttribute("secret-id"))})};for(d.s();!(u=d.n()).done;)f()}catch(v){d.e(v)}finally{d.f()}}}function s(e){(0,n.apiPostForm)("/api/secrets/get-session-key/",{private_key:e}).then(function(e){if((0,n.hasError)(e)){var r=e.error;(0,n.isApiError)(e)&&(r+="\n".concat(e.exception)),(0,t.createToast)("danger","Failed to Retrieve Session Key",r).show()}else{(0,t.createToast)("success","Session Key Received","You may now unlock secrets.").show()}})}function u(){var e,t=r((0,n.getElements)("#request_session_key"));try{for(t.s();!(e=t.n()).done;){e.value.addEventListener("click",function(){var e,t=r((0,n.getElements)("#user_privkey"));try{for(t.s();!(e=t.n()).done;){var o=e.value;s(o.value),o.value=""}}catch(a){t.e(a)}finally{t.f()}})}}catch(o){t.e(o)}finally{t.f()}}function d(){for(var e=0,t=[c,l,u];e<t.length;e++){(0,t[e])()}}
 },{"bootstrap":"xqrD","./bs":"UEe5","./util":"BHXf"}],"5tvs":[function(require,module,exports) {

netbox/project-static/src/buttons.ts

@@ -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')) {
+  for (const button of getElements<HTMLButtonElement>('button.toggle-images')) {
-    /**
+    button.addEventListener('click', handleRackImageToggle);
-     * 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);
   }
 }
 

netbox/templates/dcim/rack.html

@@ -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>