annotate js/crossSamplePlots.js @ 2:a64ece32a01a draft default tip

"planemo upload for repository https://github.com/ImmPortDB/immport-galaxy-tools/tree/master/flowtools/cs_overview commit a46097db0b6056e1125237393eb6974cfd51eb41"

1 // Copyright (c) 2016 Northrop Grumman.
2 // All rights reserved.
3 var updateCSplots = function(plotconfig){
4   plotconfig.selectedPopulations = [];
5   $(plotconfig.popSelectj).each(function() {
6     if (this.checked) {
7       plotconfig.selectedPopulations.push(parseInt(this.value));
8     }
9   });
10   if (plotconfig.hasOwnProperty("mtable")) {
11     // Update selected markers?
12     plotconfig.selectedMarkers = [];
13     $(plotconfig.mrkrSelectj).each(function() {
14       if (this.checked) {
15         plotconfig.selectedMarkers.push(parseInt(this.value));
16       }
17     });
18     // update plot
19     updateBoxplot(plotconfig);
20   } else {
21     updatePlot(plotconfig);
22   }
23 };
24 
25 var displayPopulationLegend = function(plotconfig) {
26   $(plotconfig.table).empty();
27   plotconfig.allPopulations.map(function(value,index) {
28     $(plotconfig.table).append('<tr><td align="center">'
29         + '<input type="checkbox" checked class=' + plotconfig.popSelect
30         + ' value=' + value + '/></td><td title="' + newPopNames[value] + '">'
31         + newPopNames[value] + '</td><td><span style="background-color:'
32         + color_palette[0][value][0] + '">&nbsp;&nbsp;&nbsp;</span></td></tr>');
33   });
34 
35   $(plotconfig.popSelectAll).click(function() {
36     var checkAll = $(plotconfig.popSelectAll).prop('checked');
37     if (checkAll) {
38       $(plotconfig.popSelectj).prop("checked", true);
39     } else {
40       $(plotconfig.popSelectj).prop("checked", false);
41     }
42     updateCSplots(plotconfig);
43   });
44 
45   $(plotconfig.popSelectj).click(function() {
46     if ($(plotconfig.popSelectj).length == $(plotconfig.popSelectCheck).length) {
47       $(plotconfig.popSelectAll).prop("checked",true);
48     } else {
49       $(plotconfig.popSelectAll).prop("checked",false);
50     }
51     updateCSplots(plotconfig);
52   });
53 
54   $(plotconfig.popSelectj).each(function() {
55     var selectedpopn = parseInt(this.value);
56     if ($.inArray(selectedpopn,plotconfig.selectedPopulations) > -1) {
57       this.checked = true;
58     } else {
59       this.checked = false;
60     }
61   });
62 };
63 
64 var displayToolbar = function(plotconfig){
65   $(plotconfig.displaybutton).on("click",function() {
66     $(plotconfig.popSelectj).prop("checked", true);
67     $(plotconfig.popSelectAll).prop("checked", true);
68     if (plotconfig.hasOwnProperty("mtable")){
69       $(plotconfig.displayMFI).prop("checked", false);
70       $(plotconfig.displayvalues).prop("checked", false);
71       $(plotconfig.mrkrSelectj).prop("checked", true);
72       $(plotconfig.mrkrSelectAll).prop("checked",true);
73     }
74     updateCSplots(plotconfig);
75   });
76 
77   if (plotconfig.hasOwnProperty("mtable")){
78     $(plotconfig.displayMFI).on("click", function(){
79       updateCSplots(plotconfig);
80     });
81     $(plotconfig.displayvalues).on("click", function(){
82       updateCSplots(plotconfig);
83     });
84   }
85   $(plotconfig.toggledisplayj).on("click",function() {
86     plotconfig.selectedPopulations = [];
87     $(plotconfig.popSelectj).each(function() {
88       if (this.checked) {
89         plotconfig.selectedPopulations.push(parseInt(this.value));
90       }
91     })
92     if (plotconfig.hasOwnProperty("mtable")){
93       plotconfig.selectedMarkers = [];
94       $(plotconfig.mrkrSelectj).each(function() {
95         if (this.checked) {
96           plotconfig.selectedMarkers.push(parseInt(this.value));
97         }
98       });
99       var text = document.getElementById(plotconfig.toggledisplay).firstChild;
00       text.data = text.data == "View per marker" ? "View per population" : "View per marker";
01       plotconfig.view = plotconfig.view == "p" ? "m" : "p";
02       updateBoxplot(plotconfig);
03     } else {
04       var imgSrc = document.getElementById(plotconfig.toggledisplay);
05       imgSrc.src = imgSrc.src.endsWith("stackedsm.png") ? "/static/images/flowtools/barssm.png" : "/static/images/flowtools/stackedsm.png";
06       plotconfig.type = plotconfig.type == "barplot" ? "areaplot" : "barplot";
07       updatePlot(plotconfig);
08     }
09   });
10   displayPlot(plotconfig);
11 };
12 
13 var displayPlot = function(plotconfig) {
14   var h = $(window).height() - 200;
15   $(plotconfig.plotdivj).empty();
16   $(plotconfig.plotdivj).height(h);
17 
18   if (plotconfig.hasOwnProperty("mtable")) {
19     var nbPop = Object.keys(plotconfig.csdata.mfi[plotconfig.mrkrNames[0]]).length + 2;
20     // Get Markers too
21     for (var i = 0, nbMarkers = plotconfig.mrkrNames.length; i < nbMarkers; i++) {
22       plotconfig.allMarkers.push(i);
23       plotconfig.selectedMarkers.push(i);
24     }
25   } else {
26     var nbPop = plotconfig.csdata[0].length;
27   }
28 
29   for (var i = 2; i < nbPop; i++) {
30     plotconfig.allPopulations.push(i - 1);
31     plotconfig.selectedPopulations.push(i - 1);
32   }
33 
34   $(window).on('resize',function() {
35     waitForFinalEvent(function() {
36       if (plotconfig.hasOwnProperty("mtable")){
37           updateBoxplot(plotconfig);
38       } else {
39           updatePlot(plotconfig);
40       }
41     }, 500, "resizePlot");
42   });
43 
44   displayPopulationLegend(plotconfig);
45   if (plotconfig.hasOwnProperty("mtable")){
46     displayMarkerTable(plotconfig);
47     updateBoxplot(plotconfig);
48   } else {
49     updatePlot(plotconfig);
50   }
51 };
52 
53 var updatePlot = function(plotconfig) {
54   var h = $(window).height() - 200,
55       traces = [],
56       tmptraces = [],
57       x_values = [],
58       totals = [];
59       layout = {};
60 
61   $(plotconfig.plotdivj).empty();
62   $(plotconfig.plotdivj).height(h);
63   for (var i = 1, j = plotconfig.csdata.length; i < j; i++) {
64     x_values.push(newSmpNames[plotconfig.csdata[i][1]]);
65   }
66 
67   for (var k = 1, i = plotconfig.csdata.length; k < i; k++){
68     totals[k] = 0;
69     for (var m = 2, o = plotconfig.csdata[0].length; m < o; m++){
70       for (var n = 0, p = plotconfig.selectedPopulations.length; n < p; n++){
71         if (plotconfig.csdata[0][m] === plotconfig.selectedPopulations[n]) {
72           totals[k] += plotconfig.csdata[k][m];
73         }
74       }
75     }
76   }
77 
78   for (var i = 0, ii = plotconfig.selectedPopulations.length; i < ii; i++) {
79     pop = plotconfig.selectedPopulations[i];
80     var popName = "Pop " + pop;
81     var y_values = [];
82     var obj;
83 
84     for (var j = 1, jj = plotconfig.csdata.length; j < jj; j++) {
85       var newvalue = (plotconfig.csdata[j][pop + 1] / totals[j]) * 100;
86       y_values.push(newvalue);
87     }
88     if (plotconfig.type === "areaplot") {
89       obj = {
90           x: x_values,
91           y: y_values,
92           hoverinfo: "x",
93           name: popName,
94           type: 'area',
95           fill: 'tonexty',
96           marker: {color: color_palette[0][pop][0]}
97       };
98     }
99     if (plotconfig.type === "barplot") {
00       obj = {
01           x: x_values,
02           y: y_values,
03           hoverinfo: "x",
04           name: popName,
05           type: 'bar',
06           marker: {color: color_palette[0][pop][0]}
07       };
08     }
09     tmptraces.push(obj)
10   }
11 
12   if (plotconfig.type === "barplot") {
13     layout = {
14         hovermode:'closest',
15         title: '',
16         barmode: 'stack',
17         showlegend: false,
18         yaxis: {
19             mirror: 'all',
20             tickmode: 'array',
21             ticktext: ["","20%", "40%", "60%", "80%", "100%"],
22             tickvals: [0,20,40,60,80,100],
23             title: 'Populations proportions in selected set',
24             titlefont: {
25                 size: 16,
26                 color: 'grey'
27             }
28         }
29     };
30     traces = tmptraces;
31   }
32   if (plotconfig.type === "areaplot") {
33     function stacked(trcs) {
34       for(var i=1; i<trcs.length; i++) {
35         for(var j=0; j<(Math.min(trcs[i]['y'].length, trcs[i-1]['y'].length)); j++) {
36           trcs[i]['y'][j] += trcs[i-1]['y'][j];
37         }
38       }
39       return trcs;
40     }
41     layout = {
42         title: '',
43         showlegend: false,
44         yaxis: {
45             mirror: 'all',
46             tickmode: 'array',
47             ticktext: ["","20%", "40%", "60%", "80%", "100%"],
48             tickvals: [0,20,40,60,80,100],
49             title: 'Populations proportions in selected set',
50             titlefont: {
51                 size: 16,
52                 color: 'grey'
53             }
54         },
55         xaxis: {
56             autorange: false,
57             range: [-0.2, x_values.length - 0.8]
58         }
59     };
60     traces = stacked(tmptraces);
61   }
62   Plotly.newPlot(plotconfig.plotdiv,traces,layout);
63 };