From d94d3b97ae905ed5985b77577c7d8cd948f93565 Mon Sep 17 00:00:00 2001
From: dcore94 <m.lettere@gmail.com>
Date: Tue, 28 Mar 2023 11:27:45 +0200
Subject: [PATCH] simplified infrastructures widget

---
 ccp/js/infrastructurelistcontroller.js | 56 +++++++++++++-------------
 1 file changed, 28 insertions(+), 28 deletions(-)

diff --git a/ccp/js/infrastructurelistcontroller.js b/ccp/js/infrastructurelistcontroller.js
index f26e65b..18298c0 100644
--- a/ccp/js/infrastructurelistcontroller.js
+++ b/ccp/js/infrastructurelistcontroller.js
@@ -71,7 +71,7 @@ class CCPInfrastructureList extends HTMLElement{
   }
 
   fetchInfrastructures(){
-    const prom1 = this.#boot.secureFetch(this.#serviceurl + "/infrastructures/cache").
+    const prom1 = this.#boot.secureFetch(this.#serviceurl + "/infrastructures").
       then(resp=>{
         if(resp.status !== 200) throw "Unable to fetch infrastructure cache";
         return resp.json()
@@ -98,7 +98,7 @@ class CCPInfrastructureList extends HTMLElement{
   }
   
   refreshInfrastructures(){
-    this.#boot.secureFetch(this.#serviceurl + "/infrastructures/cache", { method : "HEAD"})
+    this.#boot.secureFetch(this.#serviceurl + "/infrastructures", { method : "HEAD"})
   }
   
   showList(){
@@ -108,11 +108,26 @@ class CCPInfrastructureList extends HTMLElement{
     }
     this.#rootdoc.innerHTML = `
       <div class="ccp_infrastructure_controller">
-        ${this.#style}
-        ${this.toolbar()}
-        <ul class="ccp_infrastructure_list">
-          ${this.showInfrastructures()}
-        </ul>
+        <link href="https://cdn.dev.d4science.org/ccp/css/common.css" rel="stylesheet">
+        <div class="card">
+          <div class="card-header" style="padding:0.5rem">
+            <div class="ccp-toolbar-header">
+              <div>
+                <span name="header" class="mr-2">Infrastructures</span>
+              </div>
+              <div class="ccp-toolbar-right">
+                <button name="refresh" class="btn btn-primary ccp_toolbar_button" title="Refresh">
+                  <svg viewBox="0 0 48 48"><path d="M24 40q-6.65 0-11.325-4.675Q8 30.65 8 24q0-6.65 4.675-11.325Q17.35 8 24 8q4.25 0 7.45 1.725T37 14.45V8h3v12.7H27.3v-3h8.4q-1.9-3-4.85-4.85Q27.9 11 24 11q-5.45 0-9.225 3.775Q11 18.55 11 24q0 5.45 3.775 9.225Q18.55 37 24 37q4.15 0 7.6-2.375 3.45-2.375 4.8-6.275h3.1q-1.45 5.25-5.75 8.45Q29.45 40 24 40Z"></path></svg>
+                </button>
+              </div>
+            </div>
+          </div>
+          <div class="card-body">
+            <ul class="ccp_infrastructure_list">
+              ${this.showInfrastructures()}
+            </ul>
+          </div>
+        </div>
       </div>      
     `
     this.#rootdoc.querySelector(".ccp_infrastructure_toolbar").addEventListener("click", ev=>{
@@ -124,7 +139,7 @@ class CCPInfrastructureList extends HTMLElement{
       }
     })
     
-    const forms = Array.prototype.slice.call(this.#rootdoc.querySelectorAll(".ccp_runtime_builder"))
+    /*const forms = Array.prototype.slice.call(this.#rootdoc.querySelectorAll(".ccp_runtime_builder"))
     forms.forEach(f=>{
       f.addEventListener("submit", ev=>{
         ev.stopPropagation()
@@ -134,15 +149,7 @@ class CCPInfrastructureList extends HTMLElement{
         this.#boot.secureFetch(url, { method : ev.target.method})
         return false
       })
-    })
-  }
-  
-  toolbar(){
-    return `
-      <div class="ccp_infrastructure_toolbar">
-        <button name="refresh" class="btn btn-primary ccp_toolbar_button" title="Refresh">&#8634;</button>
-      </div>
-    `
+    })*/
   }
   
   showInfrastructures(){
@@ -155,17 +162,13 @@ class CCPInfrastructureList extends HTMLElement{
               ${this.showAge(i)}
               ${this.showType(i)}
             </summary>
-            ${this.showDeployableRuntimes(i)}
-            <ul class="ccp_runtime_list">
-              ${this.showRuntimes(i)}
-            </ul>
           </details>
         </li>
       `
     }).join("\n")
   }
   
-  showDeployableRuntimes(infra){
+ /* showDeployableRuntimes(infra){
     const alreadydeployed = infra.runtimes.map(r=>r["descriptor-id"])
     infra.available_runtimes = infra.available_runtimes ? infra.available_runtimes : []
     const options = infra.available_runtimes.filter(r=>{
@@ -191,9 +194,6 @@ class CCPInfrastructureList extends HTMLElement{
         <li class="ccp_runtime_item" title="${r.name}">
           <details>
             <summary>${r.name}</summary>
-            <ul class="ccp_instance_list">
-              ${this.showInstances(r)}
-            </ul>
           </details>
         </li>
       `
@@ -206,7 +206,7 @@ class CCPInfrastructureList extends HTMLElement{
         <li class="ccp_instance_item">${i.name}</li>
       `
     }).join("\n")
-  }
+  }*/
   
   showAge(infra){
     const age = Math.floor(((new Date()) - (new Date(infra.date))) / 3600000)
@@ -242,7 +242,7 @@ class CCPInfrastructureList extends HTMLElement{
     }, 30000) 
   }
   
-  getCompatibleRuntimes(rts){
+  /*getCompatibleRuntimes(rts){
     const available = Object.keys(this.#infrastructures).reduce((acc, i) => {
       const compatiblerts = this.#infrastructures[i].runtimes.
         filter(r=>rts.indexOf(r["descriptor-id"]) >= 0).
@@ -250,7 +250,7 @@ class CCPInfrastructureList extends HTMLElement{
       return acc.concat(compatiblerts)
     }, [])
     return available
-  }
+  }*/
 }
 
 window.customElements.define('d4s-ccp-infrastructurelist', CCPInfrastructureList);