WIP settings refacto + urlparams 1/2

reordered params inside settings_explorerjs with new packaging in TW.conf property and more meaningful/transparent variable names + newurl param sourcemode

doc/developer_manual.md

@@ -57,3 +57,16 @@ They are handled in Tinaweb.MultipleSelection2.
 For any node `n` the relevant flags at selection are:
   - `n.active` iff node is selected
   - `n.customAttrs.highlight` if  node is a neighbor of a selected node
+
+
+## Variae
+
+#### Facets: node attributes as colors/clusters
+
+At parsing time, every node attributes are indexed by values.
+
+This indexes are stored in TW.Clusters and provide an access to sets of nodes that have a given value or range of values.
+  - if discrete attrvalues with <= 30 classes (colorsBy, clustersBy), the storage structure is: `TW.Clusters[nodeType][clusterType].classes.[possibleValue]`
+     (the content is a list of ids with the value `possibleValue`)
+  - if continuous or many possible values (>30) (clustersBy, colorsRelByBins), the storage uses ordered ranges ("bins"):
+     `TW.Clusters[nodeType][clusterType].ranges.[interval]`

extras_explorerjs.js

@@ -336,18 +336,18 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
 //         jsonparams = jsonparams.split('&').join('__and__');
 //         //dbsPaths.push(getGlobalDBs());
 //         thisgexf=JSON.stringify(decodeURIComponent(getUrlParam.file));
-//         image='<img style="display:block; margin: 0px auto;" src="'+TW.APINAME+'img/ajax-loader.gif"></img>';
+//         image='<img style="display:block; margin: 0px auto;" src="'+TW.companionAPI+'img/ajax-loader.gif"></img>';
 //         $("#tab-container-top").show();
 //         $("#topPapers").show();
 //         $("#topPapers").html(image);
 //         $.ajax({
 //             type: 'GET',
-//             url: TW.APINAME+'info_div.php',
+//             url: TW.companionAPI+'info_div.php',
 //             data: "type="+type+"&bi="+bi+"&query="+jsonparams+"&gexf="+thisgexf+"&index="+TW.field[getUrlParam.file],
 //             //contentType: "application/json",
 //             //dataType: 'json',
 //             success : function(data){
-//                 console.log(TW.APINAME+'info_div.php?'+"type="+type+"&bi="+bi+"&query="+jsonparams+"&gexf="+thisgexf+"&index="+TW.field[getUrlParam.file]);
+//                 console.log(TW.companionAPI+'info_div.php?'+"type="+type+"&bi="+bi+"&query="+jsonparams+"&gexf="+thisgexf+"&index="+TW.field[getUrlParam.file]);
 //                 $("#topPapers").html(data);
 //             },
 //             error: function(){
@@ -370,7 +370,7 @@ function getTopPapers(type){
         //
         $.ajax({
             type: 'GET',
-            url: TW.APINAME,
+            url: TW.companionAPI,
             data: {'query': joined_q},
             contentType: "application/json",
             success : function(data){
@@ -506,7 +506,7 @@ function RenderTweet( tweet) {
 //FOR UNI-PARTITE
 // function selectionUni(currentNode){
 //     console.log("\tin selectionUni:"+currentNode.id);
-//     if(checkBox==false && cursor_size==0) {
+//     if(checkBox==false && TW.circleSize==0) {
 //         highlightSelectedNodes(false);
 //         opossites = [];
 //         selections = [];
@@ -683,7 +683,7 @@ function circleTrackMouse(e) {
       //   }
       // }
 
-  ctx.arc(x, y, cursor_size, 0, Math.PI * 2, true);
+  ctx.arc(x, y, TW.circleSize, 0, Math.PI * 2, true);
   ctx.closePath();
   ctx.fill();
   ctx.stroke();
@@ -694,7 +694,7 @@ function circleTrackMouse(e) {
 // exact subset of nodes under circle
 function circleGetAreaNodes(camX0, camY0) {
 
-  var cursor_ray = cursor_size * TW.cam.ratio // cursor_size to cam units
+  var cursor_ray = TW.circleSize * TW.cam.ratio // converting TW.circleSize to cam units
 
   // prepare an approximate neighborhood
   var slightlyLargerNodeset = circleLocalSubset(
@@ -799,8 +799,8 @@ function flashNodesArray (nodesArray) {
 //   - the dirname of the submodule's files (with a mandatory init.js)
 //   - the css class of all html elements added by the submodule
 function ProcessDivsFlags() {
-    for(var key in TW.DivsFlags) {
-        if(TW.DivsFlags[key]===false) {
+    for(var key in TW.conf.DivsFlags) {
+        if(TW.conf.DivsFlags[key]===false) {
             $("."+key).remove() ; // hide elements of module's class
         }
         else {

tinawebJS/enviroment.js

@@ -907,7 +907,7 @@ function showDisabledSlider(someDivId) {
 
 //============================= < SEARCH > =============================//
 function updateSearchLabels(id,name,type){
-    labels.push({
+    TW.labels.push({
         'id' : id,
         'label' : name,
         'desc': type

tinawebJS/methods.js

@@ -3,7 +3,7 @@
 
 // settings: {norender: Bool}
 function cancelSelection (fromTagCloud, settings) {
-    if (TW.debugFlags.selections) { console.log("\t***in cancelSelection"); }
+    if (TW.conf.debug.selections) { console.log("\t***in cancelSelection"); }
     if (!settings) settings = {}
 
     highlightSelectedNodes(false); //Unselect the selected ones :D
@@ -14,8 +14,9 @@ function cancelSelection (fromTagCloud, settings) {
 
     TW.partialGraph.states.slice(-1)[0].selections=[]
 
-    //Nodes colors go back to normal
-    overNodes=false;
+    // global flag
+    TW.selectionActive = false
+
 
     //Edges colors go back to normal
     if (TW.partialGraph.settings('drawEdges')) {
@@ -77,9 +78,6 @@ function cancelSelection (fromTagCloud, settings) {
     if(TW.partialGraph.states.slice(-1)[0].level)
         LevelButtonDisable(true);
 
-    // global flag
-    TW.selectionActive = false
-
     if (!settings.norender) {
       // finally redraw
       TW.partialGraph.render();
@@ -115,7 +113,7 @@ function getActivetypesKey() {
 
 
 function highlightSelectedNodes(flag){
-    if (TW.debugFlags.logSelections)
+    if (TW.conf.debug.logSelections)
       console.log("\t***methods.js:highlightSelectedNodes(flag)"+flag+" selEmpty:"+is_empty(selections))
     if(!is_empty(selections)){
         for(var i in selections) {
@@ -126,11 +124,11 @@ function highlightSelectedNodes(flag){
 
 function alertCheckBox(eventCheck){
     // NB: we use 2 booleans to adapt to SHIFT checking
-    //      - var checkBox  ---------> has the real box state
-    //      - var manuallyChecked  --> remembers if it was changed here
+    //      - var TW.checkBox  ---------> has the real box state
+    //      - var TW.manuallyChecked  --> remembers if it was changed here
     if(!isUndef(eventCheck.checked)) {
-        checkBox=eventCheck.checked;
-        manuallyChecked = eventCheck.checked
+        TW.checkBox=eventCheck.checked;
+        TW.manuallyChecked = eventCheck.checked
     }
 }
 
@@ -174,7 +172,7 @@ function RefreshState(newNOW){
     	// N : number of nodes
     	// k : number of ( selected nodes + their neighbors )
     	// s : number of selections
-        var N=( Object.keys(TW.Nodes).filter(function(n){return TW.Nodes[n].type==TW.catSoc}) ).length
+        var N=( Object.keys(TW.Nodes).filter(function(n){return TW.Nodes[n].type==TW.conf.catSoc}) ).length
         var k=Object.keys(getNeighs(Object.keys(selections),nodes1)).length
         var s=Object.keys(selections).length
         console.log("in social N: "+N+" - k: "+k+" - s: "+s)
@@ -195,7 +193,7 @@ function RefreshState(newNOW){
 
     }
     if(NOW=="B" || NOW=="b") {
-        var N=( Object.keys(TW.Nodes).filter(function(n){return TW.Nodes[n].type==TW.catSem}) ).length
+        var N=( Object.keys(TW.Nodes).filter(function(n){return TW.Nodes[n].type==TW.conf.catSem}) ).length
         var k=Object.keys(getNeighs(Object.keys(selections),nodes2)).length
         var s=Object.keys(selections).length
         console.log("in semantic N: "+N+" - k: "+k+" - s: "+s)
@@ -357,7 +355,7 @@ function htmlfied_nodesatts(elems){
             }
             socnodes.push(information);
         } else {
-            if(node.type==TW.catSoc){
+            if(node.type==TW.conf.catSoc){
                 information += '<li><b>' + node.label + '</b></li>';
                 if(node.htmlCont==""){
                     if (!isUndef(node.level)) {
@@ -369,7 +367,7 @@ function htmlfied_nodesatts(elems){
                 socnodes.push(information)
             }
 
-            if(node.type==TW.catSem){
+            if(node.type==TW.conf.catSem){
                 information += '<li><b>' + node.label + '</b></li>';
                 google='<a href=http://www.google.com/#hl=en&source=hp&q=%20'+node.label.replace(" ","+")+'%20><img src="'+'img/google.png"></img></a>';
                 wiki = '<a href=http://en.wikipedia.org/wiki/'+node.label.replace(" ","_")+'><img src="'+'img/wikipedia.png"></img></a>';
@@ -606,7 +604,7 @@ function graphTagCloudElem(nodes) {
     TW.partialGraph.camera.goTo({x:0, y:0, ratio:0.9, angle: 0})
     TW.partialGraph.refresh({skipIndexation:true});
 
-    sigma_utils.smartForceAtlas(TW.fa2milliseconds/2)
+    sigma_utils.smartForceAtlas(TW.conf.fa2Milliseconds/2)
 
     //
     // ChangeGraphAppearanceByAtt(true)
@@ -681,9 +679,11 @@ function prepareNodesRenderingProperties(nodesDict) {
   for (var nid in nodesDict) {
     var n = nodesDict[nid]
 
+    let sizeFactor = TW.conf.sizeMult[TW.catDict[n.type]] || 1
+
     // 3 decimals is way more tractable
     // and quite enough in precision !!
-    n.size = Math.round(n.size*1000)/1000
+    n.size = Math.round(n.size*sizeFactor*1000)/1000
 
     // new initial setup of properties
     n.active = false
@@ -722,8 +722,8 @@ function prepareNodesRenderingProperties(nodesDict) {
       n.color = `rgb(${rgbStr})`
     }
     else {
-      n.color = TW.defaultNodeColor
-      rgbStr = TW.defaultNodeColor.split(',').splice(0, 3).join(',');
+      n.color = TW.conf.defaultNodeColor
+      rgbStr = TW.conf.defaultNodeColor.split(',').splice(0, 3).join(',');
     }
 
     n.customAttrs = {
@@ -757,7 +757,7 @@ function prepareEdgesRenderingProperties(edgesDict, nodesDict) {
 
     var rgbStr = sigmaTools.edgeRGB(nodesDict[e.source].color, nodesDict[e.target].color)
 
-    e.color = "rgba("+rgbStr+","+TW.edgeDefaultOpacity+")"
+    e.color = "rgba("+rgbStr+","+TW.conf.edgeDefaultOpacity+")"
     e.customAttrs = {
       grey: false,
       activeEdge : false,

tinawebJS/sigma.parseCustom.js

@@ -213,7 +213,7 @@ function scanGexf(gexfContent) {
 // sorting observed node types into Sem/Soc (factorized 11/05/2017)
 // --------------------
 // FIXME this factorizes what we had twice (json & gexf scanFile workflows),
-//       and we just added missing TW.catSoc/Sem comparisons
+//       and we just added missing TW.conf.catSoc/Sem comparisons
 //       *but it doesn't fix the underlying logic*
 //       (current expected structure in 'categories' can only accomodate 2 types
 //        and the way it and catDict are used is not entirely coherent throughout
@@ -239,7 +239,7 @@ function sortNodeTypes(observedTypesDict) {
       // but in practice it's more often terms. anyways doesn't affect much
       catDict[observedTypes[0]] = 0;
 
-      if (TW.debugFlags.logParsers)
+      if (TW.conf.debug.logParsers)
         console.log(`cat unique (${observedTypes[0]}) =>0`)
   }
   if(nTypes>1) {
@@ -248,7 +248,7 @@ function sortNodeTypes(observedTypesDict) {
       // POSSible: allow more than 2 cats
       for(var i in observedTypes) {
           let c = observedTypes[i]
-          if(c == TW.catSoc || (c != TW.catSem && c.indexOf("term")==-1)) {// NOT a term-category
+          if(c == TW.conf.catSoc || (c != TW.catSem && c.indexOf("term")==-1)) {// NOT a term-category
               newcats[0] = c;
               catDict[c] = 0;
           }
@@ -281,14 +281,14 @@ function facetsBinning (valuesIdx, Atts_2_Exclude) {
 
   let facetIdx = {}
 
-  if (TW.debugFlags.logFacets) {
+  if (TW.conf.debug.logFacets) {
     console.log('dictfyGexf: begin TW.Clusters')
     var classvalues_deb = performance.now()
   }
 
   // var gotClusters = false
   // for (var nodecat in valuesIdx) {
-  //   gotClusters = gotClusters || (valuesIdx[nodecat]['cluster_index'] || valuesIdx[nodecat][TW.nodeClusAtt])
+  //   gotClusters = gotClusters || (valuesIdx[nodecat]['cluster_index'] || valuesIdx[nodecat][TW.conf.nodeClusAtt])
   // }
 
   // all scanned attributes get an inverted index
@@ -332,11 +332,11 @@ function facetsBinning (valuesIdx, Atts_2_Exclude) {
 
         // how many bins for this attribute ?
         var nBins = 3
-        if (TW.customLegendsBins && TW.customLegendsBins[at]) {
-          nBins = TW.customLegendsBins[at]
+        if (TW.conf.customLegendsBins && TW.conf.customLegendsBins[at]) {
+          nBins = TW.conf.customLegendsBins[at]
         }
-        else if (TW.legendsBins) {
-          nBins = TW.legendsBins
+        else if (TW.conf.legendsBins) {
+          nBins = TW.conf.legendsBins
         }
 
         // create tick thresholds
@@ -345,7 +345,7 @@ function facetsBinning (valuesIdx, Atts_2_Exclude) {
           legendRefTicks.push(valuesIdx[cat][at].vals[nthVal])
         }
 
-        if (TW.debugFlags.logFacets)    console.debug("intervals for", at, legendRefTicks)
+        if (TW.conf.debug.logFacets)    console.debug("intervals for", at, legendRefTicks)
 
         var nTicks = legendRefTicks.length
         var sortedDistinctVals = Object.keys(valuesIdx[cat][at].map).sort(function(a,b){return Number(a)-Number(b)})
@@ -413,16 +413,16 @@ function facetsBinning (valuesIdx, Atts_2_Exclude) {
     }
 
     // 'clust_default' is an alias to the user-defined default clustering
-    if (TW.nodeClusAtt != undefined
-        && facetIdx[cat][TW.nodeClusAtt]   // <= if found in data
+    if (TW.conf.nodeClusAtt != undefined
+        && facetIdx[cat][TW.conf.nodeClusAtt]   // <= if found in data
         && !facetIdx[cat]['clust_default'] // <= and if an attr named 'clust_default' was not already in data
       ) {
-      facetIdx[cat]['clust_default'] = facetIdx[cat][TW.nodeClusAtt]
+      facetIdx[cat]['clust_default'] = facetIdx[cat][TW.conf.nodeClusAtt]
     }
 
   }
 
-  if (TW.debugFlags.logFacets) {
+  if (TW.conf.debug.logFacets) {
     var classvalues_fin = performance.now()
     console.log('end TW.Clusters, own time:', classvalues_fin-classvalues_deb)
   }
@@ -435,7 +435,7 @@ function facetsBinning (valuesIdx, Atts_2_Exclude) {
 // for {1,2}partite graphs
 function dictfyGexf( gexf , categories ){
 
-  if (TW.debugFlags.logParsers)
+  if (TW.conf.debug.logParsers)
     console.log("ParseCustom gexf 2nd loop, main data extraction, with categories", categories)
 
 
@@ -455,11 +455,9 @@ function dictfyGexf( gexf , categories ){
     // var edgesAttributes = declaredAtts.eAttrs
 
     var elsNodes = gexf.getElementsByTagName('nodes') // The list of xml nodes 'nodes' (plural)
-    labels = [];
-    minNodeSize=999.00;
-    maxNodeSize=0.001;
-    numberOfDocs=0;
-    numberOfNGrams=0;
+    TW.labels = [];
+    minNodeSize=10000000;
+    maxNodeSize=0;
 
     // debug: for local stats
     // let allSizes = []
@@ -579,8 +577,8 @@ function dictfyGexf( gexf , categories ){
             if(!node.size) console.log("node without size: "+node.id+" : "+node.label);
 
             // user-indicated default => copy for old default accessors
-            if (node.attributes[TW.nodeClusAtt]) {
-              node.attributes['clust_default'] = node.attributes[TW.nodeClusAtt]
+            if (node.attributes[TW.conf.nodeClusAtt]) {
+              node.attributes['clust_default'] = node.attributes[TW.conf.nodeClusAtt]
             }
 
             // save record
@@ -636,7 +634,7 @@ function dictfyGexf( gexf , categories ){
         var edgesNode = edgesNodes[i];
         var edgeNodes = edgesNode.getElementsByTagName('edge');
 
-        if (TW.debugFlags.logParsers)
+        if (TW.conf.debug.logParsers)
           console.log("edgeNodes.length", edgeNodes.length)
 
         for(j=0; j<edgeNodes.length; j++) {
@@ -651,7 +649,7 @@ function dictfyGexf( gexf , categories ){
                 id: indice,
                 source: source,
                 target: target,
-                type : (type) ? type : sigmaJsDrawingProperties['defaultEdgeType'],
+                type : (type) ? type : TW.conf.sigmaJsDrawingProperties['defaultEdgeType'],
                 label: "",
                 categ: "",
                 attributes: []
@@ -895,7 +893,7 @@ function scanJSON( data ) {
 // Level-00
 // for {1,2}partite graphs
 function dictfyJSON( data , categories ) {
-    if (TW.debugFlags.logParsers)
+    if (TW.conf.debug.logParsers)
       console.log("ParseCustom json 2nd loop, main data extraction, with categories", categories)
 
     var catDict = {}
@@ -952,11 +950,11 @@ function dictfyJSON( data , categories ) {
 
     TW.Clusters = facetsBinning (tmpVals, Atts_2_Exclude)
 
-    colorList.sort(function(){ return Math.random()-0.5; });
+    TW.colorList.sort(function(){ return Math.random()-0.5; });
     for (var i in nodes ){
         if (nodes[i].color=="#FFFFFF") {
             var attval = ( isUndef(nodes[i].attributes) || isUndef(nodes[i].attributes["clust_default"]) )? 0 : nodes[i].attributes["clust_default"] ;
-            nodes[i].color = colorList[ attval ]
+            nodes[i].color = TW.colorList[ attval ]
         }
     }
 

tinawebJS/sigmaUtils.js

@@ -14,7 +14,7 @@ SigmaUtils = function () {
             var n = nodes[i];
             // console.debug('tr >>> fgr node', n)
 
-            if(initialActivetypes[catDict[n.type]] || TW.debugFlags.initialShowAll) {
+            if(initialActivetypes[catDict[n.type]] || TW.conf.debug.initialShowAll) {
                 // var node = {
                 //     id : n.id,
                 //     label : n.label,
@@ -111,7 +111,7 @@ SigmaUtils = function () {
 
         context.beginPath();
 
-        if (TW.selectedColor == "node")
+        if (TW.conf.nodesGreyBorderColor == "node")
           context.fillStyle = TW.handpickedcolor? node.customAttrs.alt_color : node.color; // node's
         else
           context.fillStyle = "#F7E521"; // yellow
@@ -204,11 +204,11 @@ SigmaUtils = function () {
         // console.debug(`t=${tstamp()} curve render activeedge: ${edgeInfos(edge)})`)
       }
       else if (edge.customAttrs.grey) {
-        color = TW.edgeGreyColor
+        color = TW.conf.edgeGreyColor
         size = 1
       }
       else {
-        color = "rgba( "+baseRGB+" , "+TW.edgeDefaultOpacity+")";
+        color = "rgba( "+baseRGB+" , "+TW.conf.edgeDefaultOpacity+")";
         size = defSize
       }
 
@@ -256,11 +256,11 @@ SigmaUtils = function () {
         color = 'rgba('+rgb.join()+',.7)'
       }
       else if (edge.customAttrs.grey) {
-        color = TW.edgeGreyColor
+        color = TW.conf.edgeGreyColor
         size = 1
       }
       else {
-        // color = "rgba( "+rgb.join()+" , "+TW.edgeDefaultOpacity+")";
+        // color = "rgba( "+rgb.join()+" , "+TW.conf.edgeDefaultOpacity+")";
         color = edge.customAttrs.true_color
         size = defSize
       }
@@ -294,7 +294,7 @@ SigmaUtils = function () {
 
         // mode variants
         if (TW.selectionActive) {
-          // passive nodes should blend in the grey of TW.edgeGreyColor
+          // passive nodes should blend in the grey of TW.conf.edgeGreyColor
           // cf settings_explorerjs, defgrey_color and greyEverything()
           if (node.customAttrs.grey) {
             if (! TW.handpickedcolor) {
@@ -310,7 +310,7 @@ SigmaUtils = function () {
               nodeColor = node.customAttrs.altgrey_color
             }
             // nice looking uniform grey
-            borderColor = TW.nodesGreyBorderColor
+            borderColor = TW.conf.nodesGreyBorderColor
           }
           // neighbor nodes <=> (highlight flag AND selectionActive)
           else if(node.customAttrs.highlight) {
@@ -501,10 +501,9 @@ SigmaUtils = function () {
       //  - conditions on graph size (£TODO use these to slowDown small graphs)
       //  - edges management (turns them off and restores them after finished)
       this.smartForceAtlas = function (fa2duration) {
-
-        if (TW.fa2Available) {
+        if (TW.conf.fa2Available) {
           if (!fa2duration) {
-            fa2duration = parseInt(TW.fa2milliseconds) || 4000
+            fa2duration = parseInt(TW.conf.fa2Milliseconds) || 4000
           }
 
           // togglability case
@@ -514,7 +513,7 @@ SigmaUtils = function () {
           }
           // normal case
           else {
-              if ( TW.fa2enabled && TW.partialGraph.graph.nNodes() >= TW.minNodesForAutoFA2) {
+              if ( TW.conf.fa2Enabled && TW.partialGraph.graph.nNodes() >= TW.conf.minNodesForAutoFA2) {
                 // hide edges during work for smaller cpu load
                 if (TW.partialGraph.settings('drawEdges')) {
                   this.toggleEdges(false)
@@ -547,7 +546,7 @@ SigmaUtils = function () {
 function createWaitIcon(idname, width) {
   let icon = document.createElement('img')
 
-  icon.src = TW.libspath + '/img2/loader.gif'
+  icon.src = TW.conf.libspath + '/img2/loader.gif'
 
   icon.style.position = 'absolute'
   icon.style.left = '0'
@@ -886,7 +885,7 @@ function repaintEdges() {
 // rewrite of clustersBy with binning and for attributes that can have negative float values
 
 // NB - binning is done at parseCustom
-//    - number of bins can be specified by attribute name in TW.customLegendsBins
+//    - number of bins can be specified by attribute name in TW.conf.customLegendsBins
 function colorsRelByBins(daclass) {
   var binColors
   var doModifyLabel = false
@@ -1202,7 +1201,7 @@ function colorsBy(daclass) {
     }
     else {
       // shuffle on entire array is better than random sorting function on each element
-      var randomColorList = shuffle(colorList)
+      var randomColorList = shuffle(TW.colorList)
 
       for(var j in TW.nodeIds) {
           var the_node = TW.Nodes[ TW.nodeIds[j] ]

tinawebJS/sigma_tools.js

@@ -45,7 +45,7 @@ sigmaTools = (function(stools) {
         var rawEdge = rawGexfEdges[i]
 
         var rgbStr = sigmaTools.edgeRGB(newNodes[rawEdge.source].color, newNodes[rawEdge.target].color)
-        var leColor = "rgba("+rgbStr+","+TW.edgeDefaultOpacity+")"
+        var leColor = "rgba("+rgbStr+","+TW.conf.edgeDefaultOpacity+")"
 
         var newEid = rawEdge.source+";"+rawEdge.target;
         var newEdge = {