irie 0.0.58__py3-none-any.whl → 0.0.60__py3-none-any.whl

irie/apps/templates/prediction/veux/navigator.js

@@ -4,185 +4,253 @@
 //
 //===----------------------------------------------------------------------===//
 //
+// class AnalysisNavigator {
+//     constructor(baseUrl, analysisTypes) {
+//         this.#url = baseUrl;
+//         this.#analysisTypes = analysisTypes;
+//     }
+// }
+
 class VeuxNavigator {
-    #initializedTabs;
-    #table;
-    #url;
-    #tabLinkContainer;
-    #tabContentContainer;
-
-    constructor(baseUrl, tabLinkContainer, tabContentContainer) {
-      this.#url = baseUrl;
-      this.#initializedTabs = [];
-      this.#tabLinkContainer = tabLinkContainer;
-      this.#tabContentContainer = tabContentContainer;
-    }
+  #initializedTabs;
+  #table;
+  #url;
+  #tabLinkContainer;
+  #tabContentContainer;
+  #propContainer;
+
+  constructor(baseUrl, tabLinkContainer, tabContentContainer, propContainer) {
+    this.#url = baseUrl;
+    this.#initializedTabs = [];
+    this.#tabLinkContainer = tabLinkContainer;
+    this.#tabContentContainer = tabContentContainer;
+    this.#propContainer = propContainer;
+  }
 
-    initTabs(tab1, tabselector) {
-        this.#initializedTabs.push(tab1);
+  initTabs(tab1, tabselector) {
+    this.#initializedTabs.push(tab1);
 
-        const tabs = this.#tabLinkContainer.querySelectorAll(tabselector);
+    const tabs = this.#tabLinkContainer.querySelectorAll(tabselector);
 
-        tabs.forEach(tab => {
-            tab.addEventListener('click', (e) => {
-                e.preventDefault();
-                this.clickTab(tab);
-            });
+    tabs.forEach(tab => {
+        tab.addEventListener('click', (e) => {
+          e.preventDefault();
+          this.clickTab(tab);
         });
-    }
+    });
+  }
 
-    select(elem) {
-        const sname =  `${elem.id}`; //dataset.name;
-        // const hash  = elem.dataset.hash;
+  //
+  //
+  //
+  select(elem) {
+    const sname =  `${elem.id}`; //dataset.name;
 
-        if (this.#initializedTabs.includes(sname)) {
-            const tabLink = this.#tabLinkContainer.querySelector(`#${sname}-tab`);
-            this.clickTab(tabLink);
-            return;
-        }
+    elem.parentElement.querySelectorAll('.table-active').forEach((el) => {
+        el.classList.remove("table-active");
+    });
+    elem.classList.add("table-active");
+    
+    // elem.parentElement.querySelectorAll("tr").forEach((el) => {
+    //     el.style.display = "none";
+    // });
+    // elem.style.display = "table-row";
 
-        this.addTab(elem);
+    if (this.#initializedTabs.includes(sname)) {
+        const tabLink = this.#tabLinkContainer.querySelector(`#${sname}-tab`);
+        this.clickTab(tabLink);
+        return;
     }
 
-    addTab(elem) {
-        const tab = `${elem.id}`;
-    
-        //
-        //
-        //
-        const tabLink = document.createElement('a');
-        tabLink.id = `${tab}-tab`;
-        tabLink.classList.add("tab-link", "nav-link", "active");
-        tabLink.href = "#";
-        tabLink.setAttribute('data-tab', tab);
-        tabLink.setAttribute('data-query', elem.dataset.query);
-        tabLink.setAttribute('data-bs-toggle', 'tab');
-        tabLink.setAttribute('role', 'tab');
-        tabLink.innerHTML = `${elem.dataset.name} <button class="btn-close" type="button" aria-label="Close"></button>`;
-        const closeButton = tabLink.querySelector('.btn-close');
-        closeButton.addEventListener('click', (e) => {
-            this.delTab(tabLink);
-        });
-        tabLink.addEventListener('click', (e) => {
-            e.preventDefault(); 
-            this.clickTab(tabLink);
-        });
-    
-        const tabItem = document.createElement('li');
-        tabItem.role = 'presentation';
-        tabItem.classList.add('nav-item');
-        tabItem.appendChild(tabLink);
-        // Add to list of tabs
-        this.#tabLinkContainer.appendChild(tabItem);
-    
-        //
-        //
-        //
-        const tabContent = document.createElement('div');
-        tabContent.classList.add('tab-content', 'mt-3', 'card-body', 'p-2');
-        tabContent.id = `${tab}-content`;
-        tabContent.style.display = 'block';
-        this.#tabContentContainer.appendChild(tabContent);
-    
-        
-        this.#initializedTabs.push(tab);
+    this.addTab(elem);
+  }
+
+  addTab(elem) {
+    const tab = `${elem.id}`;
+
+    //
+    //
+    //
+    const tabLink = document.createElement('a');
+    tabLink.id = `${tab}-tab`;
+    tabLink.classList.add("tab-link", "nav-link", "active");
+    tabLink.href = "#";
+    tabLink.setAttribute('data-tab', tab);
+    tabLink.setAttribute('data-render', elem.dataset.render);
+    tabLink.setAttribute('data-bs-toggle', 'tab');
+    tabLink.setAttribute('role', 'tab');
+    tabLink.innerHTML = `${elem.dataset.name} <button class="btn-close" type="button" aria-label="Close"></button>`;
+    const closeButton = tabLink.querySelector('.btn-close');
+    closeButton.addEventListener('click', (e) => {
+        this.delTab(tabLink);
+    });
+    tabLink.addEventListener('click', (e) => {
+        e.preventDefault(); 
         this.clickTab(tabLink);
-        this.fetchAndUpdateTab(tab, elem.dataset.query);
-        return tabLink;
-    }
+    });
+
+    const tabItem = document.createElement('li');
+    tabItem.role = 'presentation';
+    tabItem.classList.add('nav-item');
+    tabItem.appendChild(tabLink);
+    // Add to list of tabs
+    this.#tabLinkContainer.appendChild(tabItem);
+
+    //
+    //
+    //
+    const tabContent = document.createElement('div');
+    tabContent.classList.add('tab-content', 'mt-3', 'card-body', 'p-2');
+    tabContent.id = `${tab}-content`;
+    tabContent.style.display = 'block';
+    this.#tabContentContainer.appendChild(tabContent);
 
-    clickTab(tabLink) {
-    
-        const tabs = this.#tabLinkContainer.querySelectorAll('.tab-link');
-    
-        // Remove 'active' class from all tabs
-        tabs.forEach(t => {
-            t.classList.remove('active');
-        });
-    
-        // Add 'active' class to the clicked tab
-        tabLink.classList.add('active');
-    
-        const tab = tabLink.getAttribute('data-tab');
-        const contentDiv = this.#tabContentContainer.querySelector(`#${tab}-content`);
     
-        contentDiv.style.display = 'block';
-        this.#tabContentContainer.querySelectorAll(".tab-content").forEach((el) => {
-            if (el.id != `${tab}-content`) {
-                el.style.display = 'none';
-            }
-        });
-    }
+    this.#initializedTabs.push(tab);
+    this.clickTab(tabLink);
+    this.fetchAndUpdateTab(tab, elem.dataset.render);
+    return tabLink;
+  }
 
-    delTab(tabLink) {
-        const tab = tabLink.getAttribute('data-tab');
-        const corr = tabLink.getAttribute('data-corridor');
-        const tabContent = this.#tabContentContainer.querySelector(`#${tab}-content`);
-        tabContent.remove();
+  clickTab(tabLink) {
+    const tabs = this.#tabLinkContainer.querySelectorAll('.tab-link');
 
-        const tabItem = tabLink.parentElement;
-        tabItem.remove();
+    // Remove 'active' class from all tabs
+    tabs.forEach(t => {
+        t.classList.remove('active');
+    });
 
-        const idx = this.#initializedTabs.indexOf(tab);
-        if (idx > -1) {
-            this.#initializedTabs.splice(idx, 1);
+    // Add 'active' class to the clicked tab
+    tabLink.classList.add('active');
+
+    const tab = tabLink.getAttribute('data-tab');
+    const contentDiv = this.#tabContentContainer.querySelector(`#${tab}-content`);
+
+    contentDiv.style.display = 'block';
+    this.#tabContentContainer.querySelectorAll(".tab-content").forEach((el) => {
+        if (el.id != `${tab}-content`) {
+            el.style.display = 'none';
         }
-        this.clickTab(document.getElementById('tab1-tab'));
+    });
+  }
+
+  delTab(tabLink) {
+    const tab = tabLink.getAttribute('data-tab');
+    const corr = tabLink.getAttribute('data-corridor');
+    const tabContent = this.#tabContentContainer.querySelector(`#${tab}-content`);
+    tabContent.remove();
+
+    const tabItem = tabLink.parentElement;
+    tabItem.remove();
+
+    const idx = this.#initializedTabs.indexOf(tab);
+    if (idx > -1) {
+        this.#initializedTabs.splice(idx, 1);
     }
+    this.clickTab(document.getElementById('tab1-tab'));
+  }
 
-    fetchAndUpdateTab(tab, query) {
-        const contentDiv = this.#tabContentContainer.querySelector(`#${tab}-content`);
+  fetchAndUpdateTab(tab, query) {
+    const contentDiv = this.#tabContentContainer.querySelector(`#${tab}-content`);
 
-        // Show loading message while content is being fetched
-        contentDiv.innerHTML = `
-        <div class="text-center">
-            <div class="spinner-border" role="status">
-                <span class="visually-hidden">Loading...</span>
-            </div>
+    // Show loading message while content is being fetched
+    contentDiv.innerHTML = `
+    <div class="text-center">
+        <div class="spinner-border" role="status">
+          <span class="visually-hidden">Loading...</span>
         </div>
-        `;
+    </div>
+    `;
 
-        let apiUrl = `${this.#url}${query}`;
-        console.log(`Fetching content from: ${apiUrl}`);
+    let apiUrl = `${this.#url}/render/?${query}`;
+    console.log(`Fetching content from: ${apiUrl}`);
 
-        if (true) {
-            contentDiv.innerHTML = "";
-            const mv = document.createElement('model-viewer');
+    if (true) {
+      contentDiv.innerHTML = "";
+      const mv = document.createElement('model-viewer');
 
-            mv.setAttribute('camera-controls', '');
-            mv.setAttribute('autoplay', '');
-            mv.setAttribute('interaction-prompt', 'none');
-            mv.style.width  = '100%';
-            mv.style.height = '400px';
+      mv.setAttribute('camera-controls', '');
+      mv.setAttribute('autoplay', '');
+      mv.setAttribute('interaction-prompt', 'none');
+      mv.style.width  = '100%';
+      mv.style.height = '400px';
 
-            mv.src = apiUrl;
-            contentDiv.appendChild(mv);
-            return;
-        }
+      mv.src = `${this.#url}/render/?${query}`;
+      contentDiv.appendChild(mv);
+    }
+
+      //
+      //
+    if (this.#propContainer) {
+      fetch(`${this.#url}/properties/?${query}`)
+        .then(response => response.json())
+        .then(data => {
+            let accordion = document.createElement('div');
+            accordion.classList.add('accordion');
+            accordion.classList.add('accordion-flush');
 
-        //
-        //
-        fetch(apiUrl)
-            .then(response => response.json())
-            .then(data => {
-                // Replace the loading message with the fetched content
-                // when we get it
-                contentDiv.innerHTML = "";
-                const mv = document.createElement('model-viewer');
-
-                mv.setAttribute('camera-controls', '');
-                mv.setAttribute('autoplay', '');
-                mv.setAttribute('interaction-prompt', 'none');
-                mv.style.width  = '100%';
-                mv.style.height = '400px';
-
-                // set the data-URI source
-                mv.src = `data:model/gltf-binary;base64,${data.rendering}`;
-                contentDiv.appendChild(mv);
-            })
-            .catch(error => {
-                console.error('Error fetching content:', error);
-                document.getElementById('tab-content').innerHTML = '<p>Error loading content.</p>';
-            });
+            for (const prop_table of data) {
+              const table = document.createElement('table');
+              table.classList.add('table', 'table-striped', 'table-bordered');
+              const thead = document.createElement('thead');
+              const tbody = document.createElement('tbody');
+              thead.innerHTML = `
+                    <tr>
+                        <th>Property</th>
+                        <th>Value</th>
+                    </tr>
+              `;
+              prop_table.data.forEach(prop => {
+                const row = document.createElement('tr');
+                row.innerHTML = `
+                        <td>${prop.name}</td>
+                        <td>${prop.value.toFixed(2)}</td>
+                    `;
+                tbody.appendChild(row);
+              });
+              table.appendChild(thead);
+              table.appendChild(tbody);
+              
+              const item = document.createElement('div');
+              item.classList.add('accordion-item');
+              {
+                  // Accordion item header
+                  const header = document.createElement('span');
+                  header.classList.add('accordion-header');
+                  header.id = `heading-${prop_table.name}`;
+                  const button = document.createElement('button');
+                  button.classList.add('accordion-button');
+                  button.setAttribute('type', 'button');
+                  button.setAttribute('data-bs-toggle', 'collapse');
+                  button.setAttribute('data-bs-target', `#collapse-${prop_table.name}`);
+                  button.setAttribute('aria-expanded', 'true');
+                  button.setAttribute('aria-controls', `collapse-${prop_table.name}`);
+                  button.innerText = prop_table.name;
+                  header.appendChild(button);
+                  item.appendChild(header);
+              }
+              const collapse = document.createElement('div');
+              collapse.classList.add('accordion-collapse', 'collapse');
+              collapse.id = `collapse-${prop_table.name}`;
+              collapse.setAttribute('aria-labelledby', `heading-${prop_table.name}`);
+              collapse.setAttribute('data-bs-parent', `#accordion-${prop_table.name}`);
+              {
+                  // Body
+                  const body = document.createElement('div');
+                  body.classList.add('accordion-body');
+                  body.appendChild(table);
+                  collapse.appendChild(body);
+              }
+              item.appendChild(collapse);
+              accordion.appendChild(item);
+              }
+              this.#propContainer.innerHTML = ''; // Clear previous content
+              this.#propContainer.appendChild(accordion);
+          })
+          .catch(error => {
+            console.error('Error analysis:', error);
+            this.#propContainer.innerHTML = '<p>Error loading content.</p>';
+          });
     }
+  }
 }

irie/apps/templates/prediction/xara-profile.html

@@ -44,9 +44,10 @@
 <script>
 {% include "prediction/veux/navigator.js" %}
 
-const VIEWER = new VeuxNavigator(`/inventory/{{asset.calid}}/predictors/{{predictor.id}}/render/?section=`,
+const VIEWER = new VeuxNavigator(`/inventory/{{asset.calid}}/predictors/{{predictor.id}}`,
                               document.querySelector('#tab-link-container'),
-                              document.getElementById('tab-content-container'));
+                              document.getElementById('tab-content-container'),
+                              document.getElementById('property-viewer'));
 
 function handleMemberSelection(elem) {
     VIEWER.select(elem);
@@ -78,7 +79,8 @@ document.addEventListener('DOMContentLoaded', function () {
   document.addEventListener('DOMContentLoaded', () => {
       const container = document.getElementById("main-viewer");
 
-      const modelPath = "{{ predictor.render_file.url|safe }}";
+      // const modelPath = "{# predictor.render_file.url|safe #}";
+      const modelPath = "/inventory/{{asset.calid}}/predictors/{{predictor.id}}/render/";
 
       const scene = createSensorRenderer(container, modelPath);
   
@@ -118,4 +120,6 @@ document.addEventListener('DOMContentLoaded', function () {
       
   });
   </script>
+{% if predictor.render_file %}
+{% endif %}
 {% endblock javascripts %}

irie/core/settings.py

@@ -65,6 +65,7 @@ INSTALLED_APPS = [
     "irie.apps.documents", # TODO
     "crispy_forms",
     "crispy_bootstrap5",
+    "formtools"
 
 #   "django_extensions", # For generating graphs, remove for deployment
 ]

{irie-0.0.58.dist-info → irie-0.0.60.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: irie
-Version: 0.0.58
+Version: 0.0.60
 Summary: An infrastructure resilience engine
 Author-email: "Claudio M. Perez" <50180406+claudioperez@users.noreply.github.com>
 Project-URL: Repository, https://github.com/STAIRLab
@@ -26,15 +26,15 @@ Classifier: Operating System :: POSIX
 Classifier: Operating System :: Unix
 Classifier: Operating System :: MacOS
 Description-Content-Type: text/markdown
-Requires-Dist: tqdm
 Requires-Dist: opensees>=0.1.0
 Requires-Dist: quakeio
+Requires-Dist: veux>=0.0.40
+Requires-Dist: xara>=0.0.8
+Requires-Dist: xcsi>=0.0.3
 Requires-Dist: mdof
-Requires-Dist: veux>=0.0.35
-Requires-Dist: xara
-Requires-Dist: xcsi
-Requires-Dist: xsection>=0.0.19
+Requires-Dist: xsection>=0.0.20
 Requires-Dist: openbim
+Requires-Dist: tqdm
 Requires-Dist: folium
 Requires-Dist: pandas
 Requires-Dist: numpy
@@ -56,6 +56,7 @@ Requires-Dist: django-environ==0.11.2
 Requires-Dist: djangorestframework==3.15.2
 Requires-Dist: djangorestframework-simplejwt==5.3.1
 Requires-Dist: dj-database-url==2.1.0
+Requires-Dist: django-formtools
 
 <div align="center">
 <h4><code>irie</code></h4>