Merge pull request #153 from ICRAR/liu-249

deploy button now showing target url status
ICRAR · May 17, 2022 · 1387b85 · 1387b85
2 parents 943eb33 + 4678902
commit 1387b85
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 3 deletions.
diff --git a/daliuge-translator/dlg/dropmake/web/main.js b/daliuge-translator/dlg/dropmake/web/main.js
@@ -38,10 +38,18 @@ function openSettingsModal(){
     $('#settingsModal').modal("show")
 }
 
-function initiateDeploy(method, selected, name){
+async function initiateDeploy(method, selected, name){
     if (selected === false){
         changeSelectedDeployMethod(name)
     }
+    var activeUrlReachable = await checkUrlStatus(window.localStorage.getItem("manager_url"))
+
+    if(!activeUrlReachable){
+        $("#warning-alert").fadeTo(2000, 1000).slideUp(200, function() {
+            $("#warning-alert").slideUp(200);
+        });
+        return
+    }
     if(method === "direct"){
         $("#gen_pg_button").val("Generate &amp; Deploy Physical Graph")
         $("#dlg_mgr_deploy").prop("checked", true)
@@ -83,8 +91,9 @@ function updateDeployOptionsDropdown() {
             selectedUrl=element.url
             //active option
             $("#deployDropdowns").prepend(
-                `<a href='javascript:void(0)' onclick='initiateDeploy("`+element.deployMethod+`",true,"`+element.name+`")' class='dropdown-item tooltip tooltipLeft deployMethodMenuItem' data-text='Deploy Physical Graph vi method: `+element.deployMethod+`' value='Deploy Physical Graph via `+element.deployMethod+`'>Deploy: `+element.name+`</a>`
+                `<a href='javascript:void(0)' id='activeDeployMethodButton'  onclick='initiateDeploy("`+element.deployMethod+`",true,"`+element.name+`")' class='dropdown-item tooltip tooltipLeft deployMethodMenuItem' data-text='Deploy Physical Graph vi method: `+element.deployMethod+`' value='Deploy Physical Graph via `+element.deployMethod+`'>Deploy: `+element.name+`</a>`
             )
+            checkActiveDeployMethod(selectedUrl)
         }
     })
 
@@ -118,7 +127,7 @@ async function checkUrlStatus (url) {
                 }else{
                     resolve(false) 
                 }
-        },
+            },
             timeout: 2000
         });
     })
@@ -159,6 +168,17 @@ async function manualCheckUrlStatus (clickPos) {
     }
 }
 
+async function checkActiveDeployMethod(url){
+    $("#activeDeployMethodButton").removeClass("activeDeployMethodButtonOnline")
+    $("#activeDeployMethodButton").removeClass("activeDeployMethodButtonOffline")
+    var urlStatus = await checkUrlStatus(url)
+    if(urlStatus){
+        $("#activeDeployMethodButton").addClass("activeDeployMethodButtonOnline")
+    }else{
+        $("#activeDeployMethodButton").addClass("activeDeployMethodButtonOffline")
+    }   
+}
+
 function saveSettings() {
     //need a check function to confirm settings have been filled out correctly
 

diff --git a/daliuge-translator/dlg/dropmake/web/pg_viewer.html b/daliuge-translator/dlg/dropmake/web/pg_viewer.html
@@ -181,6 +181,10 @@ <h5 class="modal-title" id="messageModalTitle">Title</h5>
         </div>
     </div>
 
+    <div class="alert alert-warning" id="warning-alert">
+        <strong>Deploy Aborted </strong> This Deploy Method's Url Is Not Reachable 
+    </div>
+
     <!-- init script includes require, this links main js and echarts -->
     <script src="/static/graph_init.js"></script>
     <script>

diff --git a/daliuge-translator/dlg/dropmake/web/src/main.css b/daliuge-translator/dlg/dropmake/web/src/main.css
@@ -642,6 +642,14 @@
   color:white;
 }
 
+#deployDropdowns .activeDeployMethodButtonOnline{
+  border-left: 6px solid green !important;
+}
+
+#deployDropdowns .activeDeployMethodButtonOffline{
+  border-left: 6px solid red !important;
+}
+
 #settingsModal .settingsInputTooltip{
   display: flex;
   padding: 0px;
@@ -789,4 +797,13 @@
   margin-left: 50%;
   transform: translateX(-50%);
   pointer-events: none;
+}
+
+#warning-alert{
+  position: absolute;
+  z-index: 100;
+  bottom: 100px;
+  left: 50%;
+  transform: translateX(-50%);
+  display: none;
 }