pc1 and pc2 fields added; some shit about true/false doesn't work

src/matrix/dataset_util.js

@@ -862,7 +862,6 @@ morpheus.DatasetUtil.getMetadataArray = function (dataset) {
 morpheus.DatasetUtil.toProtoMessage = function (dataset) {
 	var array = morpheus.DatasetUtil.getContentArray(dataset);
 	var meta = morpheus.DatasetUtil.getMetadataArray(dataset);
-	console.log(meta);
 	var messageJSON = {
 		rclass : "LIST",
 		rexpValue : [{

src/tools/pcaplot_tool.js

@@ -8,6 +8,7 @@ morpheus.PcaPlotTool = function (chartOptions) {
         + '<div class="row">'
         + '<div data-name="configPane" class="col-xs-2"></div>'
         + '<div class="col-xs-10"><div style="position:relative;" data-name="chartDiv"></div></div>'
+        + '<div class=""'
         + '</div></div>');
 
     var formBuilder = new morpheus.FormBuilder({
@@ -20,32 +21,42 @@ morpheus.PcaPlotTool = function (chartOptions) {
     var numericColumnOptions = [];
     var options = [];
     var numericOptions = [];
+    var pcaOptions = [];
     var updateOptions = function () {
         var dataset = project.getFullDataset();
         rowOptions = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
         columnOptions = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
         numericRowOptions = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
         numericColumnOptions = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
         options = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
         numericOptions = [{
             name: '(None)',
-            value: ''
+            value: ""
         }];
+        pcaOptions = [];
+
+        for (var i = 1; i <= _this.project.getSelectedDataset().getColumnCount(); i++) {
+            pcaOptions.push({
+                name :  "PC" + String(i),
+                value : i
+            });
+        }
+
 
         morpheus.MetadataUtil.getMetadataNames(dataset.getRowMetadata())
             .forEach(
@@ -85,6 +96,7 @@ morpheus.PcaPlotTool = function (chartOptions) {
                     });
                 });
 
+
         options = options.concat(rowOptions.slice(1));
         options = options.concat(columnOptions.slice(1));
 
@@ -94,67 +106,65 @@ morpheus.PcaPlotTool = function (chartOptions) {
 
     updateOptions();
 
+
     formBuilder.append({
-        name: 'group_columns_by',
+        name: 'size',
         type: 'bootstrap-select',
-        options: options
+        options: numericOptions
     });
     formBuilder.append({
-        name: 'group_rows_by',
+        name: 'color',
         type: 'bootstrap-select',
-        options: options
+        options: numericOptions
     });
-
     formBuilder.append({
-        name: 'size',
+        name: 'x-axis',
         type: 'bootstrap-select',
-        options: numericOptions
+        options: pcaOptions
     });
     formBuilder.append({
-        name: 'color',
+        name: 'y-axis',
         type: 'bootstrap-select',
-        options: numericOptions
+        options: pcaOptions
     });
 
+    formBuilder.append({
+        name: 'draw',
+        type: 'button'
+    });
+
+
+
 
     function setVisibility() {
         formBuilder.setOptions('color', options, true);
         formBuilder.setOptions('size', numericOptions, true);
+        formBuilder.setEnabled('draw', true);
     }
 
     this.tooltip = [];
     formBuilder.$form.find('select').on('change', function (e) {
-        if ($(this).attr('name') === 'tooltip') {
-            var tooltipVal = _this.formBuilder.getValue('tooltip');
-            _this.tooltip = [];
-            if (tooltipVal != null) {
-                tooltipVal.forEach(function (tip) {
-                    _this.tooltip.push(morpheus.ChartTool.getVectorInfo(tip));
-                });
-            }
-        } else {
         setVisibility();
-            _this.draw();
-        }
 
     });
-    formBuilder.$form.find('input').on('click', function () {
+    /*formBuilder.$form.find('input').on('click', function () {
         _this.draw();
-    });
+    });*/
     setVisibility();
 
-    var draw = function () {
+    /*var draw = function () {
         _.debounce(_this.draw(), 100);
-    };
+    };*/
     var trackChanged = function () {
+        console.log("track changed");
         updateOptions();
         setVisibility();
-        formBuilder.setOptions('group_columns_by', options, true);
-        formBuilder.setOptions('group_rows_by', options, true);
+        formBuilder.setOptions('x-axis', pcaOptions, true);
+        formBuilder.setOptions('y-axis', pcaOptions, true);
     };
 
-    project.getColumnSelectionModel().on('selectionChanged.chart', draw);
-    project.getRowSelectionModel().on('selectionChanged.chart', draw);
+    project.getColumnSelectionModel().on('selectionChanged.chart', trackChanged);
+    project.getRowSelectionModel().on('selectionChanged.chart', trackChanged);
     project.on('trackChanged.chart', trackChanged);
     this.$chart = this.$el.find('[data-name=chartDiv]');
     var $dialog = $('<div style="background:white;" title="Chart"></div>');
@@ -164,9 +174,8 @@ morpheus.PcaPlotTool = function (chartOptions) {
     $dialog.dialog({
         close: function (event, ui) {
             project.off('trackChanged.chart', trackChanged);
-            project.getRowSelectionModel().off('selectionChanged.chart', draw);
-            project.getColumnSelectionModel().off('selectionChanged.chart',
-                draw);
+            project.getRowSelectionModel().off('selectionChanged.chart', trackChanged);
+            project.getColumnSelectionModel().off('selectionChanged.chart', trackChanged);
             _this.$el.empty();
         },
 
@@ -175,10 +184,8 @@ morpheus.PcaPlotTool = function (chartOptions) {
         width: 900
     });
     this.$dialog = $dialog;
-    this.draw();
-
-
 
+    this.draw();
 };
 
 morpheus.PcaPlotTool.getVectorInfo = function (value) {
@@ -277,53 +284,60 @@ morpheus.PcaPlotTool.prototype = {
     },
     draw: function () {
         var _this = this;
-        this.$chart.empty();
         var plotlyDefaults = morpheus.ChartTool.getPlotlyDefaults();
         var layout = plotlyDefaults.layout;
         var config = plotlyDefaults.config;
         var chartWidth = 400;
         var chartHeight = 400;
-        var showPoints = this.formBuilder.getValue('show_points');
 
-        var groupColumnsBy = this.formBuilder.getValue('group_columns_by');
-        var axisLabel = this.formBuilder.getValue('axis_label');
-        var colorBy = this.formBuilder.getValue('color');
-        var sizeBy = this.formBuilder.getValue('size');
-        var groupRowsBy = this.formBuilder.getValue('group_rows_by');
 
-        var dataset = this.project.getSelectedDataset({
+        var project = this.project;
+
+        var dataset = _this.project.getSelectedDataset({
             emptyToAll: false
         });
-        this.dataset = dataset;
-        if (dataset.getRowCount() * dataset.getColumnCount() === 0 || dataset.getRowCount() != 2) {
-            $('<h4>Please select 2 rows and any number of columns in the heat map.</h4>')
-                .appendTo(this.$chart);
+        _this.dataset = dataset;
+        if (dataset.getRowCount() * dataset.getColumnCount() === 0) {
+            $('<h4>Please select any number of rows and any number of columns in the heat map.</h4>')
+                .appendTo(_this.$chart);
             return;
         }
-        if ((dataset.getRowCount() * dataset.getColumnCount()) > 100000) {
-            showPoints = false;
-        }
 
-        var project = this.project;
+        this.formBuilder.$form.find('[name="draw"]').on('click', function () {
+
+            var colorBy = _this.formBuilder.getValue('color');
+            var sizeBy = _this.formBuilder.getValue('size');
+            var pc1 = _this.formBuilder.getValue('x-axis');
+            var pc2 = _this.formBuilder.getValue('y-axis');
+
+            console.log('draw plot button clicked');
+            dataset = _this.project.getSelectedDataset({
+                emptyToAll : false
+            });
+            _this.dataset = dataset;
 
             var expressionSet = project.getFullDataset().getESSession();
+
             var columnIndices = dataset.columnIndices;
-        var rowIndices = dataset.rowIndices;
 
+            console.log(colorBy, sizeBy, pc1, pc2);
             var req = ocpu.call("pcaPlot", {
                 es : expressionSet,
                 columns : columnIndices,
-            c1 : rowIndices[0],
-            c2 : rowIndices[1],
+                c1 : pc1,
+                c2 : pc2,
                 colour : colorBy,
                 size : sizeBy
             }, function (session) {
                 var img = $('<img />', {src : session.getLoc() + 'graphics/1/png'});
-            _this.$chart.append(img);
+                _this.$chart.prepend(img);
             });
             req.fail(function () {
                 alert("failed to create pcaPlot");
-        })
+            });
+        });
+
+
     }
 };