Merge pull request galaxyproject#17002 from esg-epfl-apc/fix-visualiz…

…ation-plugin Fix for fits_image_viewer visualization plugin
bgruening · Nov 27, 2023 · 8c48e46 · 8c48e46
2 parents c050dcb + 2992ee8
commit 8c48e46
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 11 deletions.
diff --git a/config/plugins/visualizations/fits_image_viewer/package.json b/config/plugins/visualizations/fits_image_viewer/package.json
@@ -8,9 +8,10 @@
     "license": "AFL-3.0",
     "dependencies": {
         "aladin-lite-galaxy": "^1.0.0",
-        "parcel-bundler": "^1.4.1"
+        "parcel-bundler": "^1.4.1",
+        "cpy-cli": "^5.0.0"
     },
     "scripts": {
-        "build": "cp -r node_modules/aladin-lite-galaxy static/dist && parcel build src/script.js -d static"
+        "build": "cpy --flat node_modules/aladin-lite-galaxy static/dist/aladin-lite-galaxy && parcel build src/script.js -d static"
     }
 }
diff --git a/config/plugins/visualizations/fits_image_viewer/src/script.js b/config/plugins/visualizations/fits_image_viewer/src/script.js
@@ -1,7 +1,31 @@
-let aladin;
+var aladin;
 
-A.init.then(() => {
-    aladin = A.aladin('#aladin-lite-div', {showCooGridControl: true});
-    aladin.displayFITS(file_url)
-    aladin.showCooGrid(true);
-});
+function initializeAladinLite() {
+    A.init.then(() => {
+        aladin = A.aladin('#aladin-lite-div', {showCooGridControl: true});
+        aladin.displayFITS(fileUrl)
+        aladin.showCooGrid(true);
+    });
+}
+
+function localScriptLoadingError() {
+    addScriptToHead(appRoot+aladinLiteScriptAlternativeLocation);
+}
+
+function cdnLoadingError() {
+    addScriptToHead(appRoot+aladinLiteScriptLocation, localScriptLoadingError);
+}
+
+function addScriptToHead(url, onerrorFunction) {
+    const scriptToAdd = document.createElement("script");
+    scriptToAdd.onload = initializeAladinLite;
+
+    if(onerrorFunction) {
+        scriptToAdd.onerror = onerrorFunction
+    }
+
+    document.head.appendChild(scriptToAdd);
+    scriptToAdd.src = url;
+}
+
+addScriptToHead(aladinLiteCDNUrl, cdnLoadingError);
diff --git a/config/plugins/visualizations/fits_image_viewer/templates/fits_image_viewer.mako b/config/plugins/visualizations/fits_image_viewer/templates/fits_image_viewer.mako
@@ -13,15 +13,19 @@
 <html>
     <head>
         ${h.stylesheet_link( app_root + 'style.css' )}
-        ${h.javascript_link( app_root + 'dist/aladin-lite-galaxy/aladin.js' )}
     </head>
     <body>
         <div id="div_title"><span id="span_plugin_name">FITS aladin viewer</span> : <span id="span_file_name">${hda.name | h}</span></div>
         <div id="aladin-lite-div"></div>
 
         <script>
-            let file_url = '${file_url}';
+            const fileUrl = '${file_url}';
+            const appRoot = '${app_root}'
+            const aladinLiteCDNUrl = "https://aladin.cds.unistra.fr/AladinLite/api/v3/latest/aladin.js"
+            const aladinLiteScriptLocation = "dist/aladin-lite-galaxy/aladin.js"
+            const aladinLiteScriptAlternativeLocation = "dist/aladin.js"
         </script>
+
         ${h.javascript_link( app_root + 'script.js' )}
     </body>
-</html>
+</html>