feat: added processors to available web

closes: #573
Change-Id: I7b284be7c28f82318a8268ccd04246eacb09699f

Author: grafuls

conf/quads.yml

@@ -7,8 +7,6 @@
 spare_pool_name: cloud01
 spare_pool_description: "Spare Pool"
 spare_pool_owner: quads
-# Define the name of the QUADS environment
-lab_name: "Lab"
 # display name for QUADS email notifications
 mail_display_name: "QUADS Scheduler"
 # set header for User-Agent:
@@ -45,11 +43,6 @@ ircbot_channel: #yourchannel
 webhook_notify: false
 webhook_url: https://chat.example.com/v1/spaces/AAABBBCCC
 
-# (optional ticket system URL) in this case we're using JIRA
-ticket_url: https://issues.example.com/browse
-# (optional ticket queue name) this is typically the ticket queue
-# name or abbreviation in the case of JIRA
-ticket_queue: SCALELAB
 # Jira Specific Variables
 jira_url: https://issues.example.com/rest/api/2
 
@@ -103,14 +96,9 @@ exclude_hosts: cyclades|s4810|z9000|5548|foreman|c08-h30-r630|c08-h05-r930|b08-|
 # e.g. c01-h23-r620 is an r620 type host in rack c01 at u-location 23
 racks: b09 b10 c01 c02 c03 c04 c05 c06 c07 c08 c09 c10
 
-# visual web dir is where the visual HTML representation of the lab usage goes
-visual_web_dir: /opt/quads/web/visual
 # this is where we place the generated instackenv.json files
 # directory needs to be readable by the nginx user
 json_web_path: /opt/quads/web/instack
-# path to the user specific web content for quads-web
-web_content_path: /opt/quads/web
-web_exclude_dirs: .git static instack visual
 # number of days of retaining old .json files
 json_retention_days: 0
 

conf/quadsweb.yml

@@ -0,0 +1,18 @@
+# path to the user specific web content for quads-web
+web_content_path: /opt/quads/web
+web_exclude_dirs: .git static instack visual
+
+# visual web dir is where the visual HTML representation of the lab usage goes
+visual_web_dir: /opt/quads/web/visual
+
+# (optional ticket system URL) in this case we're using JIRA
+ticket_url: https://issues.example.com/browse
+# (optional ticket queue name) this is typically the ticket queue
+# name or abbreviation in the case of JIRA
+ticket_queue: SCALELAB
+
+# Define the name of the QUADS environment
+lab_name: "Lab"
+
+# Flag to show GPU information in the web interface
+show_gpu: true

rpm/quads.spec

@@ -141,6 +141,7 @@ rm -rf %{buildroot}
 /opt/quads/conf/quads.cron.example
 /usr/bin/quads
 %config(noreplace) /opt/quads/conf/quads.yml
+%config(noreplace) /opt/quads/conf/quadsweb.yml
 %config(noreplace) /opt/quads/conf/selfservice.yml
 %config(noreplace) /opt/quads/conf/vlans.yml
 %config(noreplace) /opt/quads/conf/hosts_metadata.yml

src/quads/config.py

@@ -7,13 +7,15 @@
 logger = logging.getLogger(__name__)
 
 DEFAULT_CONF_PATH = "/opt/quads/conf/quads.yml"
+WEB_CONF_PATH = "/opt/quads/conf/quadsweb.yml"
 SS_CONF_PATH = "/opt/quads/conf/selfservice.yml"
 
 
 class _ConfigBase:
     def __init__(self):
         self.loaded = False
         self.load_from_yaml(DEFAULT_CONF_PATH)
+        self.load_from_yaml(WEB_CONF_PATH)
         self.load_from_yaml(SS_CONF_PATH)
 
     def load_from_yaml(self, filepath: str = DEFAULT_CONF_PATH):
@@ -132,4 +134,5 @@ def API_URL(self):
 if __name__ == "__main__":
     if not Config.loaded:
         Config.load_from_yaml(DEFAULT_CONF_PATH)
+        Config.load_from_yaml(WEB_CONF_PATH)
         Config.load_from_yaml(SS_CONF_PATH)

src/quads/web/blueprints/wiki.py

@@ -85,11 +85,12 @@ async def broken():
 
 @wiki_bp.route("/available", methods=["GET", "POST"])
 async def available():
+    show_gpu = Config.get("show_gpu")
     search = ModelSearchForm(request.form)
     if request.method == "POST":
         return await search_results(search)
 
-    return render_template("wiki/available.html", form=search, available_hosts=[])
+    return render_template("wiki/available.html", form=search, available_hosts=[], show_gpu=show_gpu)
 
 
 @wiki_bp.route("/results")

src/quads/web/templates/wiki/available.html

@@ -56,6 +56,9 @@ <h2>QUADS Available Hosts</h2>
                             <th scope="col">Hostname</th>
                             <th scope="col">Cloud</th>
                             <th scope="col">Model</th>
+                            {% if show_gpu %}
+                            <th scope="col">GPU</th>
+                            {% endif %}
                             <th scope="col">Disks</th>
                         </tr>
                     </thead>
@@ -70,6 +73,14 @@ <h2>QUADS Available Hosts</h2>
                             <td>{{ host["name"] }}</td>
                             <td>{{ host["cloud"] }}</td>
                             <td>{{ host["model"] }}</td>
+                            {% if show_gpu %}
+                                {% if host.processors and host.processors|selectattr("processor_type", "equalto", "GPU")|list %}
+                                    <td data-bs-toggle="modal"
+                                        data-bs-target="#baseModal" onclick="updateProcessors({{ host.processors }})">&#129504;</td>
+                                {% else %}
+                                    <td>&#10060;</td>
+                                {% endif %}
+                            {% endif %}
                             {% if host.disks %}
                                 <td data-bs-toggle="modal"
                                     data-bs-target="#baseModal" onclick="updateDisks({{ host.disks }})">&#128190;</td>
@@ -93,15 +104,32 @@ <h2>QUADS Available Hosts</h2>
     <script>
         const updateDisks = (disks) => {
             document.getElementsByClassName('modal-title')[0].innerHTML = 'Disks'
+            let th_data = "<tr><th>Type</th><th>Size</th><th>Count</th></tr>"
             let td_data = ""
             disks.forEach(disk => {
-                td_data += `<tr><td>${disk["disk_type"]}</td>`
+                td_data += `<tr>`
+                td_data += `<td>${disk["disk_type"]}</td>`
                 td_data += `<td>${disk["disk_size"]}</td>`
-                td_data += `<td>${disk["disk_count"]}</td></tr>`
+                td_data += `<td>${disk["disk_count"]}</td>`
+                td_data += `</tr>`
             })
-            let th_data = "<tr><th>DiskType</th><th>DiskSize</th><th>DiskCount</th></tr>"
             document.getElementsByClassName('modal-body')[0].innerHTML = `<table class="table">${th_data}${td_data}</table>`;
             };
+        const updateProcessors = (processors) => {
+            document.getElementsByClassName('modal-title')[0].innerHTML = 'GPUs';
+            let th_data = "<tr><th>Type</th><th>Vendor</th><th>Product</th></tr>";
+            let td_data = "";
+            processors.forEach(processor => {
+                if (processor["processor_type"] === "GPU") {
+                    td_data += `<tr>`
+                    td_data += `<td>${processor["processor_type"]}</td>`
+                    td_data += `<td>${processor["vendor"]}</td>`
+                    td_data += `<td>${processor["product"]}</td>`
+                    td_data += `</tr>`
+                }
+            });
+            document.getElementsByClassName('modal-body')[0].innerHTML = `<table class="table">${th_data}${td_data}</table>`;
+        };
         $(document).ready( function () {
             const table = $('#results').DataTable({
                 dom: 'Blfrtip',