fix rgba (less clear but works in more platforms now)

extras_explorerjs.js

@@ -216,6 +216,9 @@ function graphResetColor(){
       let n = TW.partialGraph.graph.nodes(TW.nodeIds[j])
       n.color = n.customAttrs["true_color"];
 
+      n.customAttrs.alt_color = false
+      n.customAttrs.altgrey_color = false
+
       n.label = TW.Nodes[n.id].label
     }
 

tinawebJS/globalUtils.js

@@ -152,16 +152,19 @@ function getByID(elem) {
 }
 
 
-
-function hex2rga(sent_hex) {
+// hex can be RGB (3 or 6 chars after #) or RGBA (4 or 8 chars)
+function hex2rgba(sent_hex) {
+    if (!sent_hex) {
+      return [0,0,0,1]
+    }
     result = []
     hex = ( sent_hex.charAt(0) === "#" ? sent_hex.substr(1) : sent_hex );
     // check if 6 letters are provided
-    if (hex.length === 6) {
+    if (hex.length == 6 || hex.length == 8) {
         result = calculateFull(hex);
         return result;
     }
-    else if (hex.length === 3) {
+    else if (hex.length == 3 || hex.length == 3) {
         result = calculatePartial(hex);
         return result;
     }
@@ -171,7 +174,12 @@ function calculateFull(hex) {
     var r = parseInt(hex.substring(0, 2), 16);
     var g = parseInt(hex.substring(2, 4), 16);
     var b = parseInt(hex.substring(4, 6), 16);
-    return [r,g,b];
+
+    var a = 0
+    if (hex.substring(6, 8)) {
+      a = parseInt(hex.substring(6, 8), 16) / 255;
+    }
+    return [r,g,b, a];
 }
 
 
@@ -180,7 +188,12 @@ function calculatePartial(hex) {
     var r = parseInt(hex.substring(0, 1) + hex.substring(0, 1), 16);
     var g = parseInt(hex.substring(1, 2) + hex.substring(1, 2), 16);
     var b = parseInt(hex.substring(2, 3) + hex.substring(2, 3), 16);
-    return [r,g,b];
+    var a = 0
+    if (hex.substring(3, 4)) {
+      a = parseInt(hex.substring(3, 4), 16) / 255;
+    }
+
+    return [r,g,b, a];
 }
 
 function componentToHex(c) {

tinawebJS/methods.js

@@ -599,8 +599,9 @@ function greyEverything(){
       n.customAttrs.highlight = false;
 
       // special case after a coloredBy or clustersBy
+      // (now handled in renderer)
       // if (TW.handpickedcolor) {
-      //   n.color = "rgba("+hex2rga(n.color)+",0.5)"
+      //   n.color = "rgba("+hex2rgba(n.color+"55").join(','))"
       // }
     }
   }
@@ -662,7 +663,7 @@ function prepareNodesRenderingProperties(nodesDict) {
       grey: false,
       highlight: false,
       true_color : n.color,
-      defgrey_color : "rgba("+hex2rga(n.color)+",.4)"
+      defgrey_color : "rgba("+hex2rgba(n.color)+",.4)"
     }
 
     // POSS n.type: distinguish rendtype and twtype
@@ -809,8 +810,10 @@ function saveGEXF(nodes,edges,atts){
         gexf += ' <viz:position x="'+nodes[n].x+'"    y="'+nodes[n].y+'"  z="0" />\n';
         if(atts["color"]) gexf += ' <viz:size value="'+nodes[n].size+'" />\n';
         if(atts["color"]) {
-            col = hex2rga(nodes[n].color);
-            gexf += ' <viz:color r="'+col[0]+'" g="'+col[1]+'" b="'+col[2]+'" a="1"/>\n';
+            if (nodes[n].color && nodes[n].color.charAt(0) == '#') {
+              col = hex2rgba(nodes[n].color);
+              gexf += ' <viz:color r="'+col[0]+'" g="'+col[1]+'" b="'+col[2]+'" a='+col[3]+'/>\n';
+            }
         }
         gexf += ' <attvalues>\n';
         gexf += ' <attvalue for="0" value="'+nodes[n].type+'"/>\n';

tinawebJS/sigmaUtils.js

@@ -310,10 +310,11 @@ SigmaUtils = function () {
             else {
               // #C01O3 += alpha 55
               //                     => #C01O355
-              nodeColor = node.customAttrs.alt_color+"55"
 
-              // old way:
-              // nodeColor = "rgba("+hex2rga(node.customAttrs.alt_color)+",0.5)"
+              if (!node.customAttrs.altgrey_color) {
+                node.customAttrs.altgrey_color = "rgba("+(hex2rgba(node.customAttrs.alt_color).slice(0,3).join(','))+",0.4)"
+              }
+              nodeColor = node.customAttrs.altgrey_color
             }
             // nice looking uniform grey
             borderColor = TW.nodesGreyBorderColor
@@ -771,8 +772,8 @@ function repaintEdges() {
   //     var e_id = v_edges[e].id;
   //     var a = TW.partialGraph.graph.nodes(v_edges[e].source).color;
   //     var b = TW.partialGraph.graph.nodes(v_edges[e].target).color;
-  //     a = hex2rga(a);
-  //     b = hex2rga(b);
+  //     a = hex2rgba(a);
+  //     b = hex2rgba(b);
   //     var r = (a[0] + b[0]) >> 1;
   //     var g = (a[1] + b[1]) >> 1;
   //     var b = (a[2] + b[2]) >> 1;
@@ -987,23 +988,21 @@ function colorsBy(daclass) {
       TW.handpickedcolor = false
     }
 
-
-    // £TODO remove another duplicate of edgeRGB
     //    [ Edge-colour by source-target nodes-colours combination ]
-    var v_edges = getVisibleEdges();
-    for(var e in v_edges) {
-        var e_id = v_edges[e].id;
-        var a = v_edges[e].source.color;
-        var b = v_edges[e].target.color;
-        if (a && b) {
-            a = hex2rga(a);
-            b = hex2rga(b);
-            var r = (a[0] + b[0]) >> 1;
-            var g = (a[1] + b[1]) >> 1;
-            var b = (a[2] + b[2]) >> 1;
-            TW.partialGraph.graph.edges(e_id).color = "rgba("+[r,g,b].join(",")+",0.5)";
-        }
-    }
+    // var v_edges = getVisibleEdges();
+    // for(var e in v_edges) {
+    //     var e_id = v_edges[e].id;
+    //     var a = v_edges[e].source.color;
+    //     var b = v_edges[e].target.color;
+    //     if (a && b) {
+    //         a = hex2rgba(a);
+    //         b = hex2rgba(b);
+    //         var r = (a[0] + b[0]) >> 1;
+    //         var g = (a[1] + b[1]) >> 1;
+    //         var b = (a[2] + b[2]) >> 1;
+    //         TW.partialGraph.graph.edges(e_id).color = "rgba("+[r,g,b].join(",")+",0.5)";
+    //     }
+    // }
     //    [ / Edge-colour by source-target nodes-colours combination ]
 
     // £TODO fix ClustersLegend

tinawebJS/sigma_tools.js

@@ -117,7 +117,7 @@ sigmaTools = (function(stools) {
           a = [parseFloat( tmp[0] ) , parseFloat( tmp[1] ) , parseFloat( tmp[2] )];
       }
       else {
-        a = hex2rga(a);
+        a = hex2rgba(a);
       }
 
       if(b.charAt(0)!="#") {
@@ -125,7 +125,7 @@ sigmaTools = (function(stools) {
           b = [parseFloat( tmp[0] ) , parseFloat( tmp[1] ) , parseFloat( tmp[2] )];
       }
       else {
-        b = hex2rga(b);
+        b = hex2rgba(b);
       }
       // console.log(source+" : "+a+"\t|\t"+target+" : "+b)