From 0ed9c897782653ffbb47f7268dd2715774de15ae Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Thu, 19 May 2022 11:26:02 +0200
Subject: [PATCH 1/7] Add queue status as a menu entry, remove it from
 projects, add dedicated page

---
 client/layouts/default.vue    | 31 +++++++++++++
 client/pages/projects/_id.vue | 23 ----------
 client/pages/workload.vue     | 82 +++++++++++++++++++++++++++++++++++
 3 files changed, 113 insertions(+), 23 deletions(-)
 create mode 100644 client/pages/workload.vue

diff --git a/client/layouts/default.vue b/client/layouts/default.vue
index 05ffa73..fb27c0a 100644
--- a/client/layouts/default.vue
+++ b/client/layouts/default.vue
@@ -24,6 +24,18 @@
         :key="i"
         :to="item.to" v-text="item.title">
       </v-tab>
+      <v-tab absolute left to="workload" >
+        <v-progress-linear
+          :value="this.activeTask/(this.activeTask+this.pendingTask)*100"
+          :background-color="this.activeTask==0?'#fffb':undefined"
+          :buffer-value="this.activeTask === null ? 0 : 100"
+          height="10"
+          :stream="this.activeTask === null"
+          :striped="this.activeTask !== null"
+          color="rgb(45, 150, 250)"
+          :title="'Task: '+this.activeTask +' running and ' +this.pendingTask+' pending.'"
+        ></v-progress-linear>
+      </v-tab>
     </v-tabs>
     <v-main>
       <v-container>
@@ -38,6 +50,8 @@
 export default {
   data () {
     return {
+      activeTask: null,
+      pendingTask: null,
       clipped: false,
       drawer: false,
       fixed: false,
@@ -125,6 +139,23 @@ export default {
         ],
       },
     }
+  },
+  created(){
+    this.getQueueStatus();
+  },
+  methods:{
+    async getQueueStatus(){
+      if (this.isready)
+        return;
+      await this.$axios.$get('/queue_status').then((function (resultStatus) {
+        console.log(resultStatus);
+        this.activeTask = resultStatus.active;
+        this.pendingTask = resultStatus.reserved;
+        setTimeout(this.getQueueStatus, 5000);
+      }).bind(this)).catch((function () {
+          setTimeout(this.getQueueStatus, 10000);
+      }).bind(this));
+    },
   }
 }
 </script>
diff --git a/client/pages/projects/_id.vue b/client/pages/projects/_id.vue
index d8dc4c4..7ff2474 100644
--- a/client/pages/projects/_id.vue
+++ b/client/pages/projects/_id.vue
@@ -29,13 +29,6 @@
         <strong style="color:white; text-transform:capitalize;">{{progress}} %</strong>
       </v-progress-linear>
     </v-col>
-    <v-col
-      class="text-subtitle-1 text-center"
-      cols="12"
-      v-if="(activeTask == 0) || (pendingTask != 0)"
-    >
-      Task: {{activeTask}} running and {{pendingTask}} pending.
-    </v-col>
   </v-row>
   <v-row v-show="isready" align="center">
 
@@ -304,8 +297,6 @@ export default {
       isready: false,
       isready2: false,
       progress:0,
-      activeTask: 1,
-      pendingTask: 0,
       gencov:null,
       metadata:{"nb_phenotypes":0,"nb_snps":0},
       summary:{"JASSSignif":{"MinUnivNotSignif":0,"MinUnivSignif":0},"JASSNotSignif":{"MinUnivNotSignif":0,"MinUnivSignif":0}},
@@ -316,7 +307,6 @@ export default {
 created(){
 
   this.status = this.getStatus();
-  this.getQueueStatus();
 
 },
 
@@ -570,19 +560,6 @@ methods:{
       this.Regions=this.manhattan.data.datarows
     },
 
-    async getQueueStatus(){
-      if (this.isready)
-        return;
-      await this.$axios.$get('/queue_status').then((function (resultStatus) {
-        console.log(resultStatus);
-        this.activeTask = resultStatus.active;
-        this.pendingTask = resultStatus.reserved;
-        setTimeout(this.getQueueStatus, 5000);
-      }).bind(this)).catch((function () {
-          setTimeout(this.getQueueStatus, 10000);
-      }).bind(this));
-    },
-
     async getStatus(){
 
 
diff --git a/client/pages/workload.vue b/client/pages/workload.vue
new file mode 100644
index 0000000..5614f63
--- /dev/null
+++ b/client/pages/workload.vue
@@ -0,0 +1,82 @@
+<template>
+  <v-row>
+    <v-col cols=12 style="text-align:center">
+      <h1>Server workload</h1>
+    </v-col>
+    <v-col cols=12 >
+      <v-row>
+        <v-col cols=6 style="text-align:right">
+          <h4>Compute node:</h4>
+        </v-col>
+        <v-col cols=6 >
+          <h4>{{this.worker}}</h4>
+        </v-col>
+      </v-row>
+    </v-col>
+    <v-col cols=12 >
+      <v-row>
+        <v-col cols=6 style="text-align:right">
+          <h4>Tasks being processed:</h4>
+        </v-col>
+        <v-col cols=6 >
+          <h4>{{this.activeTask}}</h4>
+        </v-col>
+      </v-row>
+    </v-col>
+    <v-col cols=12 >
+      <v-row>
+        <v-col cols=6 style="text-align:right">
+          <h4>Pending tasks to be computed</h4>
+        </v-col>
+        <v-col cols=6 >
+          <h4>{{this.pendingTask}}</h4>
+        </v-col>
+      </v-row>
+    </v-col>
+    <v-col
+     v-if="activeTask===0"
+     style="text-align:center"
+     cols=12>
+      Your analysis will start right away.
+    </v-col>
+    <v-col
+     v-if="activeTask>0"
+     style="text-align:center"
+     cols=12>
+      Your analysis will be queued, and processed as soon as possible.
+    </v-col>
+    <v-col
+     v-else
+     cols=12>
+      &nbsp;
+    </v-col>
+  </v-row>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      activeTask: '_',
+      pendingTask: '_',
+      worker: '_',
+    }
+  },
+  created(){
+    this.getQueueStatus();
+  },
+  methods:{
+    async getQueueStatus(){
+      await this.$axios.$get('/queue_status').then((function (resultStatus) {
+        console.log(resultStatus);
+        this.activeTask = resultStatus.active;
+        this.worker = resultStatus.worker;
+        this.pendingTask = resultStatus.reserved;
+        setTimeout(this.getQueueStatus, 5000);
+      }).bind(this)).catch((function () {
+          setTimeout(this.getQueueStatus, 10000);
+      }).bind(this));
+    },
+  }
+}
+</script>
-- 
GitLab


From f2b3e6b8c0c16b613fe678a7ed6f8de3062d6542 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Fri, 20 May 2022 13:36:18 +0200
Subject: [PATCH 2/7] will->would

---
 client/pages/workload.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/pages/workload.vue b/client/pages/workload.vue
index 5614f63..4ed00fe 100644
--- a/client/pages/workload.vue
+++ b/client/pages/workload.vue
@@ -37,13 +37,13 @@
      v-if="activeTask===0"
      style="text-align:center"
      cols=12>
-      Your analysis will start right away.
+      Your analysis would start right away.
     </v-col>
     <v-col
-     v-if="activeTask>0"
+     v-else-if="activeTask>0"
      style="text-align:center"
      cols=12>
-      Your analysis will be queued, and processed as soon as possible.
+      Your analysis would be queued, and processed as soon as possible.
     </v-col>
     <v-col
      v-else
-- 
GitLab


From 902ecc6cb5d65fd1f9e1b111cc37352256878a75 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Fri, 20 May 2022 13:36:53 +0200
Subject: [PATCH 3/7] speed-dial can already be the top element, put it on top
 of its parent

---
 client/components/ShareLink.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/client/components/ShareLink.vue b/client/components/ShareLink.vue
index 55bc38a..d5b1408 100644
--- a/client/components/ShareLink.vue
+++ b/client/components/ShareLink.vue
@@ -1,6 +1,5 @@
 <template>
-     <div>
-        <v-speed-dial v-model="dialShare" absolute right bottom direction="left" open-on-hover>
+        <v-speed-dial v-model="dialShare" absolute top right direction="left" open-on-hover>
             <template v-slot:activator>
             <v-btn fab bottom small color="primary">
                 <v-icon v-if="dialShare">mdi-close</v-icon>
@@ -23,8 +22,6 @@
             <v-icon>mdi-clipboard</v-icon>
             </v-btn>
       </v-speed-dial>
-
-    </div>
 </template>
 
 <script>
-- 
GitLab


From 6de8be916f23d1a119429930a2c8b0ba770631e5 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Fri, 20 May 2022 13:37:41 +0200
Subject: [PATCH 4/7] move the menu entry to the right, hide the progress bar
 on small screen

---
 client/layouts/default.vue | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/client/layouts/default.vue b/client/layouts/default.vue
index fb27c0a..ac87e3a 100644
--- a/client/layouts/default.vue
+++ b/client/layouts/default.vue
@@ -24,17 +24,19 @@
         :key="i"
         :to="item.to" v-text="item.title">
       </v-tab>
-      <v-tab absolute left to="workload" >
+      <v-tab to="/workload" style="max-width:280px;margin-right: inherit;margin-left: auto;">
+        Workload
         <v-progress-linear
           :value="this.activeTask/(this.activeTask+this.pendingTask)*100"
           :background-color="this.activeTask==0?'#fffb':undefined"
           :buffer-value="this.activeTask === null ? 0 : 100"
-          height="10"
+          height="20"
           :stream="this.activeTask === null"
           :striped="this.activeTask !== null"
           color="rgb(45, 150, 250)"
           :title="'Task: '+this.activeTask +' running and ' +this.pendingTask+' pending.'"
-        ></v-progress-linear>
+          class="hidden-xs-only ml-2"
+        ><small>{{textProgressBar}}</small></v-progress-linear>
       </v-tab>
     </v-tabs>
     <v-main>
@@ -156,6 +158,19 @@ export default {
           setTimeout(this.getQueueStatus, 10000);
       }).bind(this));
     },
+  },
+  computed:{
+    textProgressBar(){
+      if (this.activeTask === null)
+        return ''
+      if (this.pendingTask === 0){
+        if (this.activeTask ===0 ){
+          return 'no load';
+        }
+        return this.activeTask + " running";
+      }
+      return  this.activeTask + " + " + this.pendingTask;
+    },
   }
 }
 </script>
-- 
GitLab


From fcd8ef0b55ab5801cea214bbac68ed674a2d17b0 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Fri, 20 May 2022 13:40:11 +0200
Subject: [PATCH 5/7] put phenotypes in the card, adjust ShareLink location

---
 client/pages/projects/_id.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/client/pages/projects/_id.vue b/client/pages/projects/_id.vue
index c37d1c3..8371fb9 100644
--- a/client/pages/projects/_id.vue
+++ b/client/pages/projects/_id.vue
@@ -35,14 +35,13 @@
 
 
     <v-col cols="12">
-      <v-card  >
-        <ShareLink  :pageUrl="sharedUrl"/>
-      </v-card>
-
+      <v-card>
+        <ShareLink  :pageUrl="sharedUrl" style="top:-1em"/>
       <div class="row" style="text-align:left;padding:12px;margin:0;">
       <h1 style="text-transform:none;">Results for :</h1>
       <PhenotypeCard v-for="pheno in phenotypesDict" :key="pheno.id" :phe="pheno"/>
       </div>
+      </v-card>
       <v-card style="margin-top:10px; margin-bottom:10px;" outlined tile no-gutter>
         <v-card-title class="text-h5">
           <v-row justify="start" no-gutters>
-- 
GitLab


From 99d75a33e2f922c1beaafa101195e6dc683c2395 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Fri, 20 May 2022 13:42:45 +0200
Subject: [PATCH 6/7] sometime nothing if running, but task are still queued

---
 client/layouts/default.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/layouts/default.vue b/client/layouts/default.vue
index ac87e3a..7b94389 100644
--- a/client/layouts/default.vue
+++ b/client/layouts/default.vue
@@ -28,7 +28,7 @@
         Workload
         <v-progress-linear
           :value="this.activeTask/(this.activeTask+this.pendingTask)*100"
-          :background-color="this.activeTask==0?'#fffb':undefined"
+          :background-color="(this.activeTask==0)&&(this.pendingTask==0)?'#fffb':undefined"
           :buffer-value="this.activeTask === null ? 0 : 100"
           height="20"
           :stream="this.activeTask === null"
-- 
GitLab


From d38387e8ce755dd351cf95c34f69f9f283ed41c7 Mon Sep 17 00:00:00 2001
From: Bryan Brancotte <bryan.brancotte@pasteur.fr>
Date: Thu, 23 Jun 2022 14:34:22 +0200
Subject: [PATCH 7/7] fix UI glitch where central menu entries were not
 centered

---
 client/layouts/default.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/client/layouts/default.vue b/client/layouts/default.vue
index 7b94389..98c8f07 100644
--- a/client/layouts/default.vue
+++ b/client/layouts/default.vue
@@ -20,6 +20,7 @@
       ></v-img>
       </v-app-bar>
     <v-tabs fixed-tabs dark>
+      <span class="hidden-xs-only" style="width:280px"></span>
       <v-tab v-for="(item, i) in items"
         :key="i"
         :to="item.to" v-text="item.title">
-- 
GitLab