Added PCA support. Closes #5.

PCA support is added. This means that support is now available for
showing both PCA and CA next to each other. When filtering is applied,
both PCA and CA are updated, but on the variables that were used to
initialise them. To achieve this, the DimRedPlot service is now
responsible for performing PCA and CA, such that it also knows which
analyses have been performed. The effect of this change is also that
some of the logic from plotctrl has been moved into the DimRedPlot
service, which is good since controllers shouldn't have too much logic
anyways.

R.ICoVeR/inst/www/js/controllers/dimredctrl.js

@@ -22,7 +22,7 @@
 */
 
 angular.module('contigBinningApp.controllers')
-  .controller('DimRedCtrl', function ($scope, $modal, Analytics, R, DimRedPlot, DataSet) {
+  .controller('DimRedCtrl', function ($scope, $modal, R, DimRedPlot, DataSet) {
 
     'use strict';
 
@@ -105,10 +105,15 @@ angular.module('contigBinningApp.controllers')
     $scope.selectedDimRedMethod = $scope.dimRedMethods[0];
     $scope.selectedVariables = [];
 
-    $scope.$watch('selectedDimRedMethod', function (newMethod) {
+    $scope.changeDimRedMethod = function (newMethod) {
+      // Somehow, if I do not do this, selectedDimRedMethod won't be updated until after the function has finished
+      $scope.selectedDimRedMethod = newMethod;
+
       if (newMethod === undefined) { return; }
       setVariables();
-    });
+      $scope.selectedVariables = [];
+      updateSelectedVariables([]);
+    };
 
     $scope.$on('DimRedPlot::variablesSelected', function (e, dimRedMethod) {
       /*jslint unparam: true*/
@@ -139,17 +144,6 @@ angular.module('contigBinningApp.controllers')
       updateSelectedVariables(variables);
     });
 
-    function updateCaOnTnf() {
-      $scope.selectedVariables = _.filter($scope.variables, function (variable) {
-        return variable.group === "Tetra nucleotide frequencies";
-      });
-
-      updateSelectedVariables($scope.selectedVariables);
-      if ($scope.selectedVariables.length > 2) {
-        $scope.reduceDimensionality();
-      }
-    }
-
     /*jslint unparam: true */
     $scope.$on('DataSet::schemaLoaded', function (e, schema) {
       $scope.dataAvailable = true;
@@ -158,19 +152,17 @@ angular.module('contigBinningApp.controllers')
     });
     /*jslint unparam: false */
 
-    $scope.$on('DataSet::filtered', updateCaOnTnf);
-
     /*jslint unparam: true */
-    $scope.$on('Analytics::dimRedMethodsAvailable', function (e, methods) {
+    $scope.$on('DimRedPlot::dimRedMethodsAvailable', function (e, methods) {
       // ICoVeR: For now we only suppor CA on (T|P)NF, so we filter out all
       //          other dim. red. methods.
-      $scope.dimRedMethods = _.filter(methods, function (m) { return m.name === "ca"; });
+      $scope.dimRedMethods = _.filter(methods, function (m) { return m.name === "ca" || m.name === "pca"; });
       $scope.selectedDimRedMethod = $scope.dimRedMethods[0];
       setVariables();
     });
     /*jslint unparam: false */
 
-    $scope.$on('Analytics::dimensionalityReduced', function () {
+    $scope.$on('DimRedPlot::dimensionalityReduced', function () {
       $scope.configurationInvalid =
         $scope.selectedVariables.length === 0
         || $scope.selectedDimRedMethod === undefined;
@@ -202,6 +194,6 @@ angular.module('contigBinningApp.controllers')
       DataSet.get(vars, function () { return; });
 
       $scope.configurationInvalid = true;
-      Analytics.reduce(drMethod, vars);
+      DimRedPlot.reduce(drMethod, vars);
     };
   });

R.ICoVeR/inst/www/js/controllers/dimreddisplayctrl.js

@@ -42,8 +42,8 @@ angular.module('contigBinningApp.controllers')
     }
 
     /*jslint unparam: true */
-    $scope.$on("Analytics::dimensionalityReduced", function (ev, method, session) {
-      session.getObject(updateState);
+    $scope.$on("DimRedPlot::dimensionalityReduced", function (ev, data) {
+      updateState(data);
     });
     /*jslint unparam: false */
 

R.ICoVeR/inst/www/js/controllers/plotctrl.js

@@ -48,84 +48,19 @@ angular.module('contigBinningApp.controllers')
       switchOptions();
     };
 
-    // Makes sure that the labels of points are no longer than 80px
-    function createWrappedLabels(points) {
-      var testText = d3.select("body").append("div").style("float", "left");
-
-      testText.style("font-size", "8px");
-
-      function wrap(d, i) {
-        /*jslint unparam:true*/
-        var textLength,
-          string,
-          desiredStringLength,
-          label = d.id;
-
-        if (d.label !== undefined) {
-          label = d.label;
+    $scope.$on("DimRedPlot::dimensionalityReduced", function () {
+      $scope.analyses = DimRedPlot.analyses;
+        
+      $scope.dimredplotWidth = "col-lg-" + (12 / $scope.analyses.length);
+
+      if ($scope.analyses.length > 1) {
+        if (!$scope.hideOptions) {
+          switchOptions();
         }
-
-        testText.text(label);
-        textLength = testText.node().offsetWidth;
-
-        string = label;
-        desiredStringLength = Math.ceil(80 / textLength * string.length);
-
-        string = string.slice(0, desiredStringLength);
-        testText.text(string);
-        textLength = testText.node().clientWidth;
-
-        while (textLength > 80 && string.length > 0) {
-          string = string.slice(0, -1);
-          testText.text(string);
-          textLength = testText.node().clientWidth;
-        }
-
-        d.wrappedLabel = string;
       }
-
-      points.forEach(wrap);
-
-      testText.remove();
-    }
-
-    function updatePlot(data) {
-      $scope.$apply(function () {
-        var index;
-
-        DimRedPlot.addProcessedData(data.method[0], data.processedData);
-
-        if (data.variableProjections !== undefined) {
-          createWrappedLabels(data.variableProjections);
-        }
-        if (data.individualProjections !== undefined) {
-          createWrappedLabels(data.individualProjections);
-        }
-
-        index = _.findIndex($scope.analyses, {'method': data.method});
-
-        if (index === -1) {
-          data.plotIdx = $scope.analyses.length;
-          $scope.analyses.push(data);
-        } else {
-          data.plotIdx = index;
-          $scope.analyses[index] = data;
-        }
-
-        $scope.dimredplotWidth = "col-lg-" + (12 / $scope.analyses.length);
-
-        if ($scope.analyses.length > 1) {
-          if (!$scope.hideOptions) {
-            switchOptions();
-          }
-        }
-      });
-
+      
+      $scope.$apply();
+     
       $scope.$broadcast("DimRedPlot::resize", $scope.analyses.length);
-    }
-
-    $scope.$on("Analytics::dimensionalityReduced", function (ev, method, session) {
-      /*jslint unparam: true */
-      session.getObject(updatePlot);
     });
   });

R.ICoVeR/inst/www/js/services/analytics.js

@@ -27,8 +27,7 @@ angular.module('contigBinningApp.services')
     'use strict';
 
     var d = {
-      clusterMethods: [],
-      dimRedMethods: []
+      clusterMethods: []
     };
 
     /*jslint unparam: true */
@@ -38,14 +37,6 @@ angular.module('contigBinningApp.services')
         return methods;
       }, []);
       $rootScope.$broadcast("Analytics::clusterMethodsAvailable", d.clusterMethods);
-
-      d.dimRedMethods = _.reduce(_.keys(appConfig.dimred), function (methods, method) {
-        var cfg = appConfig.dimred[method];
-        cfg.name = method;
-        methods.push(cfg);
-        return methods;
-      }, []);
-      $rootScope.$broadcast("Analytics::dimRedMethodsAvailable", d.dimRedMethods);
     });
     /*jslint unparam: false */
 
@@ -54,10 +45,6 @@ angular.module('contigBinningApp.services')
         return d.clusterMethods;
       },
 
-      dimRedMethods: function () {
-        return d.dimRedMethods;
-      },
-
       cluster: function (method, variables, args, id) {
         var fnArgs = {
           vars: variables,
@@ -73,19 +60,6 @@ angular.module('contigBinningApp.services')
         ocpu.call("cluster." + method, fnArgs, function () {
           $rootScope.$broadcast("Analytics::dataUpdated", id);
         });
-      },
-
-      reduce: function (method, variables) {
-        var fnArgs = {
-          vars: variables
-        };
-        if (DataSet.rows()) {
-          fnArgs.rows = DataSet.rows();
-        }
-
-        ocpu.call("dimred." + method, fnArgs, function (session) {
-          $rootScope.$broadcast("Analytics::dimensionalityReduced", method, session);
-        });
       }
     };
 

R.ICoVeR/inst/www/js/services/dimredplot.js

 /*jslint white: false, indent: 2, nomen: true */
-/*global angular, _, list, d3 */
+/*global angular, _, list, d3, ocpu */
 
 /*
     ICoVeR - Interactive Contig-bin Verification and Refinement
@@ -27,6 +27,8 @@ angular.module('contigBinningApp.services')
     'use strict';
 
     var d = {
+      dimRedMethods: [],
+      analyses: [],
       processedData: {},
       selections: {
         variable: {},
@@ -54,6 +56,107 @@ angular.module('contigBinningApp.services')
       }
     };
 
+    // Makes sure that the labels of points are no longer than 80px
+    function createWrappedLabels(points) {
+      var testText = d3.select("body").append("div").style("float", "left");
+
+      testText.style("font-size", "8px");
+
+      function wrap(d, i) {
+        /*jslint unparam:true*/
+        var textLength,
+            string,
+            desiredStringLength,
+            label = d.id;
+
+        if (d.label !== undefined) {
+          label = d.label;
+        }
+
+        testText.text(label);
+        textLength = testText.node().offsetWidth;
+
+        string = label;
+        desiredStringLength = Math.ceil(80 / textLength * string.length);
+
+        string = string.slice(0, desiredStringLength);
+        testText.text(string);
+        textLength = testText.node().clientWidth;
+
+        while (textLength > 80 && string.length > 0) {
+          string = string.slice(0, -1);
+          testText.text(string);
+          textLength = testText.node().clientWidth;
+        }
+
+        d.wrappedLabel = string;
+      }
+
+      points.forEach(wrap);
+
+      testText.remove();
+    }
+
+    function processDimRedResults(variables) {
+      return function (data) {  
+        var index;
+
+        d.addProcessedData(data.method[0], data.processedData);
+
+        if (data.variableProjections !== undefined) {
+          createWrappedLabels(data.variableProjections);
+        }
+        if (data.individualProjections !== undefined) {
+          createWrappedLabels(data.individualProjections);
+        }
+        
+        // Add a list of variables for automatic redoing of dim. red.
+        data.usedVariables = variables;
+        
+        index = _.findIndex(d.analyses, {'method': data.method});
+
+        if (index === -1) {
+          data.plotIdx = d.analyses.length;
+          d.analyses.push(data);
+        } else {
+          data.plotIdx = index;
+          d.analyses[index] = data;
+        }
+        
+        $rootScope.$broadcast("DimRedPlot::dimensionalityReduced", data);
+      };
+    }
+
+    $rootScope.$on("App::configurationLoaded", function (ev, appConfig) {
+      /*jslint unparam: true */
+      d.dimRedMethods = _.reduce(_.keys(appConfig.dimred), function (methods, method) {
+        var cfg = appConfig.dimred[method];
+        cfg.name = method;
+        methods.push(cfg);
+        return methods;
+      }, []);
+      $rootScope.$broadcast("DimRedPlot::dimRedMethodsAvailable", d.dimRedMethods);
+    });
+
+    d.reduce = function (method, variables) {
+      var fnArgs = {
+        vars: variables
+      };
+      if (DataSet.rows()) {
+        fnArgs.rows = DataSet.rows();
+      }
+
+      ocpu.call("dimred." + method, fnArgs, function (session) {
+        session.getObject(processDimRedResults(variables));
+      });
+    };
+
+    $rootScope.$on('DataSet::filtered', function () {
+      d.analyses.forEach(function (analysis) {
+        d.reduce(analysis.method[0], analysis.usedVariables);
+      });
+    });
+
     function resetStates() {
       d.selections.individual = {};
       d.influences.individual = {};
@@ -347,7 +450,7 @@ angular.module('contigBinningApp.services')
 
       // If this brushing is done outside of dimredplot we need to set the selection
       // type to BAR.
-      if (_.findIndex(Analytics.dimRedMethods(), "name", method) === -1) {
+      if (_.findIndex(d.dimRedMethods, "name", method) === -1) {
         _.forEach(d.selections.individual, function (val, key) {
           d.selections.individual[key] = list.selected.NONE;
         });

R.ICoVeR/inst/www/js/templates/dimredctrl.html

@@ -10,6 +10,7 @@
          class="col-sm-3 no-left-padding adjusted-right-padding">
       <select class="form-control input-sm"
               ng-model="selectedDimRedMethod"
+              ng-change="changeDimRedMethod(selectedDimRedMethod)"
               ng-options="method.name for method in dimRedMethods">
       </select>
     </div>