function viewModel(){
    var self = this;
    self.sec = ko.observable('design');  // Active section
    self.opt = ko.observable('exp');     // Active option
    self.fun = ko.observable('exp_old'); // Active function

    self.experiments = ko.observableArray(['AAA', 'BBB']);
    self.layouts = ko.observableArray(['AAA', 'BBB']);
    self.exp_vars = ko.observableArray([new ExpVar()]);
    self.var_types = ['Category', 'Integer', 'Decimal'];

	// Add a new variable
    self.addVar = function() { self.exp_vars.push(new ExpVar()) };
    // Remove a variable
    self.removeVar = function(variable) { self.exp_vars.remove(variable) };
}

var ExpVar = function() {
    var self = this;
    self.name = ko.observable();
    self.type = ko.observable();
};
ko.applyBindings(new viewModel());

@@ -217,140 +217,466 @@
 ion%0A
-%0A    self.experiments = ko.observableArray(%5B'AAA', 'BBB'%5D);%0A    self.layouts = ko.observableArray(%5B'AAA', 'BBB'%5D);%0A    self.exp_vars
+    %0A    self.exp_name = ko.observable();%0A    self.exp_people = ko.observable();%0A    self.exp_date = ko.observable();%0A%0A    self.plate_types = %5B96, 384%5D;%0A    self.plate_type = ko.observable();%0A%0A    self.experiments = ko.observableArray(%5B'AAA', 'BBB'%5D);%0A    self.layouts = ko.observableArray(%5B'AAA', 'BBB'%5D);%0A%0A    // Factor (independent variables)%0A    self.exp_fact = ko.observableArray(%5Bnew ExpVar()%5D);%0A%0A    // Channels (dependent variables)%0A    self.exp_chnl
  = k
@@ -706,24 +706,25 @@
 ExpVar()%5D);%0A
+%0A
     self.var
@@ -783,24 +783,25 @@
 d a new 
-variable
+dependent
 %0A    sel
@@ -805,19 +805,20 @@
 self.add
-Var
+Chnl
  = funct
@@ -834,20 +834,20 @@
 elf.exp_
-vars
+chnl
 .push(ne
@@ -861,16 +861,17 @@
 r()) %7D;%0A
+%0A
     // R
@@ -878,24 +878,23 @@
 emove a 
-variable
+channel
 %0A    sel
@@ -899,37 +899,216 @@
 elf.
-removeVar = function(variable
+delChnl = function(chnl) %7B self.exp_chnl.remove(chnl) %7D;%0A%0A%09// Add a new independent%0A    self.addFact = function() %7B self.exp_fact.push(new ExpVar()) %7D;%0A%0A    // Remove a factor%0A    self.delFact = function(fact
 ) %7B 
@@ -1120,20 +1120,20 @@
 exp_
-vars
+fact
 .remove(
 vari
@@ -1128,24 +1128,20 @@
 .remove(
-variable
+fact
 ) %7D;%0A%7D%0A%0A
@@ -1291,8 +1291,574 @@
 del());%0A
+%0A// TODO oop setting, make it dynamic for all types of tables%0Avar setting = %7B%0A    startCols:24,%0A    minCols:24,%0A    maxCols:24,%0A    startRows:16,%0A    minRows:16,%0A    maxRows:16,%0A    colWidths:42,%0A    manualColumnResize:true,%0A    manualRowResize:true,%0A    rowHeaders:function (i) %7B return String.fromCharCode(65 + i); %7D,%0A    colHeaders:function (i) %7B return i+1; %7D,%0A    contextMenu: true,%0A%7D;%0A%0Avar container1 = document.getElementById(%22well%22); %0Avar hot = new Handsontable(container1, setting);%0A$(document).ready(function () %7B%0A    // Assign table to .tab-pane divs%0A%7D);%0A

Rename variables, add handsontable