🎨 Frontend: favicons pointing to assets repo (#5755)

Author: odeimaiz

services/static-webserver/client/source/class/osparc/Application.js

@@ -213,7 +213,9 @@ qx.Class.define("osparc.Application", {
         link.rel = "icon";
         document.getElementsByTagName("head")[0].appendChild(link);
       }
-      link.href = "/resource/osparc/favicon-"+qx.core.Environment.get("product.name")+".png";
+      link.href = "";
+      osparc.product.Utils.getFaviconUrl()
+        .then(url => link.href = url);
     },
 
     __startupChecks: function() {

services/static-webserver/client/source/class/osparc/product/Utils.js

@@ -114,6 +114,33 @@ qx.Class.define("osparc.product.Utils", {
       return resourceType;
     },
 
+    __linkExists: function(url) {
+      return new Promise((resolve, reject) => {
+        const reqSvg = new XMLHttpRequest();
+        reqSvg.open("GET", url, true);
+        reqSvg.onreadystatechange = () => {
+          if (reqSvg.readyState === 4) {
+            if (reqSvg.status === 404) {
+              reject();
+            } else {
+              resolve();
+            }
+          }
+        };
+        reqSvg.send();
+      });
+    },
+
+    getFaviconUrl: function() {
+      const pngUrl = "https://raw.githubusercontent.com/ZurichMedTech/s4l-assets/main/app/favicons/favicon-"+this.getProductName()+".png";
+      const fallbackIcon = "/resource/osparc/favicon-"+this.getProductName()+".png";
+      return new Promise(resolve => {
+        this.__linkExists(pngUrl)
+          .then(() => resolve(pngUrl))
+          .catch(() => resolve(fallbackIcon))
+      });
+    },
+
     getLogoPath: function(longLogo = true) {
       let logosPath = null;
       const colorManager = qx.theme.manager.Color.getInstance();