about summary refs log tree commit diff
diff options
context:
space:
mode:
authorZachary Sloan2013-11-22 22:33:22 +0000
committerZachary Sloan2013-11-22 22:33:22 +0000
commit5143738870b8872a915432225acf01508de620ee (patch)
tree451832a079bcd0baa557360753461f7bc1b4fcda
parent4cfdad02e5f8ebd4bd347f078999b063041b29d2 (diff)
downloadgenenetwork2-5143738870b8872a915432225acf01508de620ee.tar.gz
Did some work towards getting the interval mapping page working
-rw-r--r--wqflask/wqflask/interval_mapping/__init__.py0
-rwxr-xr-xwqflask/wqflask/interval_mapping/interval_mapping.py20
-rw-r--r--wqflask/wqflask/static/new/javascript/bar_chart.coffee25
-rw-r--r--wqflask/wqflask/static/new/javascript/bar_chart.js15
-rw-r--r--wqflask/wqflask/static/new/javascript/box_plot.coffee45
-rw-r--r--wqflask/wqflask/static/new/javascript/box_plot.js83
-rw-r--r--wqflask/wqflask/static/new/javascript/show_trait.coffee433
-rw-r--r--wqflask/wqflask/static/new/javascript/show_trait.js477
-rw-r--r--wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee26
-rw-r--r--wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js27
-rw-r--r--wqflask/wqflask/templates/show_trait.html1
-rw-r--r--wqflask/wqflask/templates/show_trait_mapping_tools.html9
-rw-r--r--wqflask/wqflask/user_manager.py30
-rw-r--r--wqflask/wqflask/views.py16
14 files changed, 307 insertions, 900 deletions
diff --git a/wqflask/wqflask/interval_mapping/__init__.py b/wqflask/wqflask/interval_mapping/__init__.py
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/wqflask/wqflask/interval_mapping/__init__.py
diff --git a/wqflask/wqflask/interval_mapping/interval_mapping.py b/wqflask/wqflask/interval_mapping/interval_mapping.py
index aca99cbe..f41ebd2c 100755
--- a/wqflask/wqflask/interval_mapping/interval_mapping.py
+++ b/wqflask/wqflask/interval_mapping/interval_mapping.py
@@ -37,6 +37,8 @@ class IntervalMapping(object):
 
     def __init__(self, start_vars, temp_uuid):
 
+        print("TESTING!!!")
+
         #Currently only getting trait data for one trait, but will need
         #to change this to accept multiple traits once the collection page is implemented
         helper_functions.get_species_dataset_trait(self, start_vars)
@@ -51,6 +53,8 @@ class IntervalMapping(object):
             self.samples.append(str(sample))
             self.vals.append(value)
  
+        print("start_vars:", start_vars)
+ 
         self.set_options(start_vars)
  
         self.gen_qtl_results(tempdata)
@@ -69,24 +73,24 @@ class IntervalMapping(object):
     def set_options(self, start_vars):
         """Sets various options (physical/genetic mapping, # permutations, which chromosome"""
         
-        self.plot_scale = start_vars['scale']
+        #self.plot_scale = start_vars['scale']
         #if self.plotScale == 'physic' and not fd.genotype.Mbmap:
         #    self.plotScale = 'morgan'
         self.num_permutations = start_vars['num_permutations']
-        self.do_bootstrap = start_vars['do_bootstrap']
-        self.control_locus = start_vars['control_locus']
-        self.selected_chr = start_vars['selected_chr']
-        self.weighted_regression = start_vars['weighted']
-        self.lrs_lod = start_vars['lrs_lod']
+        #self.do_bootstrap = start_vars['do_bootstrap']
+        #self.control_locus = start_vars['control_locus']
+        self.selected_chr = start_vars['chromosome']
+        #self.weighted_regression = start_vars['weighted']
+        #self.lrs_lod = start_vars['lrs_lod']
 
 
     def gen_qtl_results(self, tempdata):
         """Generates qtl results for plotting interval map"""
 
         self.dataset.group.get_markers()
-        self.dataset.read_genotype_file()
+        self.dataset.group.read_genotype_file()
 
-        samples, values, variances = self.trait.export_informative()
+        samples, values, variances = self.this_trait.export_informative()
         if self.control_locus:
             if self.weighted_regression:
                 self.qtl_results = self.dataset.genotype.regression(strains = samples,
diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.coffee b/wqflask/wqflask/static/new/javascript/bar_chart.coffee
index 749a7dc0..2c60d3ab 100644
--- a/wqflask/wqflask/static/new/javascript/bar_chart.coffee
+++ b/wqflask/wqflask/static/new/javascript/bar_chart.coffee
@@ -121,6 +121,10 @@ class Bar_Chart
                 $('.x.axis').remove()
                 @add_x_axis(x_scale)
         )
+        
+        d3.select("#color_by_trait").on("click", =>
+            @color_by_trait()
+        )
 
     get_attr_color_dict: () ->
         @attr_color_dict = {}
@@ -299,20 +303,15 @@ class Bar_Chart
                         .text((d) =>
                             return d
                         )
-
-    
+                        
     color_by_trait: () ->
-        console.log("Before load")
-        $('#collections_holder').load('/collections/list #collections_list')
-        $.colorbox(
-            inline: true
-            href: "#collections_holder"
+        $('#collections_holder').load('/collections/list #collections_list', =>
+            $.colorbox(
+                inline: true
+                href: "#collections_holder"
+            )
         )
-        console.log("After load")
-        #$.colorbox({href:"/collections/list"})
-        #$.get(
-        #    url: /collections/list
-        #    
-        #)
+
+        
     
 root.Bar_Chart = Bar_Chart
\ No newline at end of file
diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.js b/wqflask/wqflask/static/new/javascript/bar_chart.js
index 20fab15c..03902741 100644
--- a/wqflask/wqflask/static/new/javascript/bar_chart.js
+++ b/wqflask/wqflask/static/new/javascript/bar_chart.js
@@ -125,6 +125,9 @@
           return _this.add_x_axis(x_scale);
         }
       });
+      d3.select("#color_by_trait").on("click", function() {
+        return _this.color_by_trait();
+      });
     }
 
     Bar_Chart.prototype.get_attr_color_dict = function() {
@@ -318,13 +321,13 @@
     };
 
     Bar_Chart.prototype.color_by_trait = function() {
-      console.log("Before load");
-      $('#collections_holder').load('/collections/list #collections_list');
-      $.colorbox({
-        inline: true,
-        href: "#collections_holder"
+      var _this = this;
+      return $('#collections_holder').load('/collections/list #collections_list', function() {
+        return $.colorbox({
+          inline: true,
+          href: "#collections_holder"
+        });
       });
-      return console.log("After load");
     };
 
     return Bar_Chart;
diff --git a/wqflask/wqflask/static/new/javascript/box_plot.coffee b/wqflask/wqflask/static/new/javascript/box_plot.coffee
index 562bd1dc..e9035456 100644
--- a/wqflask/wqflask/static/new/javascript/box_plot.coffee
+++ b/wqflask/wqflask/static/new/javascript/box_plot.coffee
@@ -5,46 +5,53 @@ class Box_Plot
         @get_samples()

         

         @margin = {top: 10, right: 50, bottom: 20, left: 50}

-        @plot_width = 120 - @margin.left - @margin.right

+        @plot_width = 200 - @margin.left - @margin.right

         @plot_height = 500 - @margin.top - @margin.bottom

         

         @min = d3.min(@sample_vals)  

-        @max = d3.max(@sample_vals) * 1.1

+        @max = d3.max(@sample_vals)

         

         @svg = @create_svg()

-        

         @enter_data()

         

-

+        

     get_samples: () ->

-        @sample_names = (sample.name for sample in @sample_list when sample.value != null)

         @sample_vals = (sample.value for sample in @sample_list when sample.value != null)

-        @samples = _.zip(@sample_names, @sample_vals)

         

-    create_svg: () -> d3.chart.box()

-                        .whiskers(@inter_quartile_range(1.5))

-                        .width(@plot_width)

-                        .height(@plot_height)

-                        .domain([@min, @max])

-                        

+    create_svg: () ->

+        svg = d3.box()

+            .whiskers(@inter_quartile_range(1.5))

+            .width(@plot_width)

+            .height(@plot_height)

+            .domain([@min, @max])

+        return svg

+                    

     enter_data: () ->

         d3.select("#box_plot").selectAll("svg")

-            .data(@sample_vals)

+            .data([@sample_vals])

             .enter().append("svg:svg")

             .attr("class", "box")

             .attr("width", @plot_width)

             .attr("height", @plot_height)

+            .append("svg:g")

             .call(@svg)

                         

     inter_quartile_range: (k) ->

         return (d, i) =>

-            q1 = d.quartiles[0],

-            q3 = d.quartiles[2],

+            console.log("iqr d:", d)

+            q1 = d.quartiles[0]

+            q3 = d.quartiles[2]

             inter_quartile_range = (q3 - q1) * k

-            i = -1

+            console.log("iqr:", inter_quartile_range)

+            i = 0

             j = d.length

-            while (d[++i] < q1 - inter_quartile_range)

-            while (d[--j] > q3 + inter_quartile_range)

+            console.log("d[-1]:", d[1])

+            console.log("q1 - iqr:", q1 - inter_quartile_range)

+            i++ while (d[i] < q1 - inter_quartile_range)

+            j-- while (d[j] > q3 + inter_quartile_range)

+            #while (d[++i] < q1 - inter_quartile_range

+            #while d[--j] > q3 + inter_quartile_range

+            console.log("[i, j]", [i, j])

             return [i, j]

 

-   
\ No newline at end of file
+root.Box_Plot = Box_Plot
\ No newline at end of file
diff --git a/wqflask/wqflask/static/new/javascript/box_plot.js b/wqflask/wqflask/static/new/javascript/box_plot.js
new file mode 100644
index 00000000..2dd624e1
--- /dev/null
+++ b/wqflask/wqflask/static/new/javascript/box_plot.js
@@ -0,0 +1,83 @@
+// Generated by CoffeeScript 1.6.1
+(function() {
+  var Box_Plot, root;
+
+  root = typeof exports !== "undefined" && exports !== null ? exports : this;
+
+  Box_Plot = (function() {
+
+    function Box_Plot(sample_list, sample_group) {
+      this.sample_list = sample_list;
+      this.sample_group = sample_group;
+      this.get_samples();
+      this.margin = {
+        top: 10,
+        right: 50,
+        bottom: 20,
+        left: 50
+      };
+      this.plot_width = 200 - this.margin.left - this.margin.right;
+      this.plot_height = 500 - this.margin.top - this.margin.bottom;
+      this.min = d3.min(this.sample_vals);
+      this.max = d3.max(this.sample_vals);
+      this.svg = this.create_svg();
+      this.enter_data();
+    }
+
+    Box_Plot.prototype.get_samples = function() {
+      var sample;
+      return this.sample_vals = (function() {
+        var _i, _len, _ref, _results;
+        _ref = this.sample_list;
+        _results = [];
+        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+          sample = _ref[_i];
+          if (sample.value !== null) {
+            _results.push(sample.value);
+          }
+        }
+        return _results;
+      }).call(this);
+    };
+
+    Box_Plot.prototype.create_svg = function() {
+      var svg;
+      svg = d3.box().whiskers(this.inter_quartile_range(1.5)).width(this.plot_width).height(this.plot_height).domain([this.min, this.max]);
+      return svg;
+    };
+
+    Box_Plot.prototype.enter_data = function() {
+      return d3.select("#box_plot").selectAll("svg").data([this.sample_vals]).enter().append("svg:svg").attr("class", "box").attr("width", this.plot_width).attr("height", this.plot_height).append("svg:g").call(this.svg);
+    };
+
+    Box_Plot.prototype.inter_quartile_range = function(k) {
+      var _this = this;
+      return function(d, i) {
+        var inter_quartile_range, j, q1, q3;
+        console.log("iqr d:", d);
+        q1 = d.quartiles[0];
+        q3 = d.quartiles[2];
+        inter_quartile_range = (q3 - q1) * k;
+        console.log("iqr:", inter_quartile_range);
+        i = 0;
+        j = d.length;
+        console.log("d[-1]:", d[1]);
+        console.log("q1 - iqr:", q1 - inter_quartile_range);
+        while (d[i] < q1 - inter_quartile_range) {
+          i++;
+        }
+        while (d[j] > q3 + inter_quartile_range) {
+          j--;
+        }
+        console.log("[i, j]", [i, j]);
+        return [i, j];
+      };
+    };
+
+    return Box_Plot;
+
+  })();
+
+  root.Box_Plot = Box_Plot;
+
+}).call(this);
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.coffee b/wqflask/wqflask/static/new/javascript/show_trait.coffee
index 8bcca85d..7d23345f 100644
--- a/wqflask/wqflask/static/new/javascript/show_trait.coffee
+++ b/wqflask/wqflask/static/new/javascript/show_trait.coffee
@@ -59,373 +59,6 @@ Stat_Table_Rows = [
         ]
 
 $ ->
-    class Bar_Chart
-        constructor: (@sample_list, @sample_group) ->
-            @get_samples()
-            console.log("sample names:", @sample_names)
-            if @sample_attr_vals.length > 0
-                @get_distinct_attr_vals()
-                @get_attr_color_dict()
-            
-            #Used to calculate the bottom margin so sample names aren't cut off
-            longest_sample_name = d3.max(sample.length for sample in @sample_names)
-            
-            @margin = {top: 20, right: 20, bottom: longest_sample_name * 7, left: 40}
-            @plot_width = @sample_vals.length * 15 - @margin.left - @margin.right
-            @plot_height = 500 - @margin.top - @margin.bottom
-
-            @x_buffer = @plot_width/20
-            @y_buffer = @plot_height/20
-
-            @y_min = d3.min(@sample_vals)  
-            @y_max = d3.max(@sample_vals) * 1.1
-
-            @svg = @create_svg()
-
-            @plot_height -= @y_buffer
-            @create_scales()
-            @create_graph()
-            
-            d3.select("#color_attribute").on("change", =>
-                attribute = $("#color_attribute").val()
-                if $("#update_bar_chart").html() == 'Sort By Name' 
-                    @svg.selectAll(".bar")
-                        .data(@sorted_samples())
-                        .transition()
-                        .duration(1000)
-                        .style("fill", (d) =>
-                            if attribute == "None"
-                                return "steelblue"
-                            else
-                                return @attr_color_dict[attribute][d[2][attribute]]
-                        )
-                        .select("title")
-                        .text((d) =>
-                            return d[1]
-                        )
-                else
-                    @svg.selectAll(".bar")
-                        .data(@samples)
-                        .transition()
-                        .duration(1000)
-                        .style("fill", (d) =>
-                            if attribute == "None"
-                                return "steelblue"
-                            else
-                                return @attr_color_dict[attribute][d[2][attribute]]
-                        )
-                @add_legend(attribute, @distinct_attr_vals[attribute])
-            )
-        
-        
-            d3.select("#update_bar_chart").on("click", =>
-                if @attributes.length > 0
-                    attribute = $("#color_attribute").val()
-                if $("#update_bar_chart").html() == 'Sort By Value' 
-                    $("#update_bar_chart").html('Sort By Name')
-                    sortItems = (a, b) ->
-                        return a[1] - b[1]
-    
-                    @svg.selectAll(".bar")
-                        .data(@sorted_samples())
-                        .transition()
-                        .duration(1000)
-                        .attr("y", (d) =>
-                            return @y_scale(d[1])
-                        )
-                        .attr("height", (d) =>
-                            return @plot_height - @y_scale(d[1])
-                        )
-                        .style("fill", (d) =>
-                            if @attributes.length > 0
-                                return @attr_color_dict[attribute][d[2][attribute]]
-                            else
-                                return "steelblue"
-                        )
-                        .select("title")
-                        .text((d) =>
-                            return d[1]
-                        )
-                    sorted_sample_names = (sample[0] for sample in @sorted_samples())
-                    x_scale = d3.scale.ordinal()
-                        .domain(sorted_sample_names)
-                        .rangeBands([0, @plot_width], .1)
-                    $('.x.axis').remove()
-                    @add_x_axis(x_scale)
-                else
-                    $("#update_bar_chart").html('Sort By Value')
-                    @svg.selectAll(".bar")
-                        .data(@samples)
-                        .transition()
-                        .duration(1000)
-                        .attr("y", (d) =>
-                            return @y_scale(d[1])
-                        )
-                        .attr("height", (d) =>
-                            return @plot_height - @y_scale(d[1])
-                        )
-                        .style("fill", (d) =>
-                            if @attributes.length > 0
-                                return @attr_color_dict[attribute][d[2][attribute]]
-                            else
-                                return "steelblue"
-                        )
-                        .select("title")
-                        .text((d) =>
-                            return d[1]
-                        )
-                    x_scale = d3.scale.ordinal()
-                        .domain(@sample_names)
-                        .rangeBands([0, @plot_width], .1)
-                    $('.x.axis').remove()
-                    @add_x_axis(x_scale)
-            )
-            
-            d3.select("#color_by_trait").on("click", =>
-                @color_by_trait()
-            )
-
-        get_attr_color_dict: () ->
-            @attr_color_dict = {}
-            console.log("distinct_attr_vals:", @distinct_attr_vals)
-            for own key, distinct_vals of @distinct_attr_vals
-                this_color_dict = {}
-                if distinct_vals.length < 10
-                    color = d3.scale.category10()
-                    for value, i in distinct_vals
-                        this_color_dict[value] = color(i)
-                else
-                    console.log("distinct_values:", distinct_vals)
-                    if _.every(distinct_vals, (d) =>
-                        if isNaN(d)
-                            return false
-                        else
-                            return true
-                    )
-                        color_range = d3.scale.linear()
-                                        .domain([d3.min(distinct_vals),
-                                                d3.max(distinct_vals)])
-                                        .range([0,4])
-                        for value, i in distinct_vals
-                            console.log("color_range(value):", color_range(parseInt(value)))
-                            this_color_dict[value] = d3.rgb("lightblue").darker(color_range(parseInt(value)))
-                            #this_color_dict[value] = "rgb(0, 0, " + color_range(parseInt(value)) + ")"
-                @attr_color_dict[key] = this_color_dict
-
-        get_samples: () ->
-            @sample_names = (sample.name for sample in @sample_list when sample.value != null)
-            @sample_vals = (sample.value for sample in @sample_list when sample.value != null)
-            @attributes = (key for key of @sample_list[0]["extra_attributes"])
-            console.log("attributes:", @attributes)
-            @sample_attr_vals = []
-            if @attributes.length > 0
-                for sample in @sample_list
-                    attr_vals = {}
-                    for attribute in @attributes
-                        attr_vals[attribute] = sample["extra_attributes"][attribute]
-                    @sample_attr_vals.push(attr_vals)
-            @samples = _.zip(@sample_names, @sample_vals, @sample_attr_vals)
-
-        get_distinct_attr_vals: () ->
-            @distinct_attr_vals = {}
-            for sample in @sample_attr_vals
-                for attribute of sample
-                    if not @distinct_attr_vals[attribute]
-                        @distinct_attr_vals[attribute] = []
-                    if sample[attribute] not in @distinct_attr_vals[attribute]
-                        @distinct_attr_vals[attribute].push(sample[attribute])
-            #console.log("distinct_attr_vals:", @distinct_attr_vals)
-            
-        create_svg: () ->
-            svg = d3.select("#bar_chart")
-                .append("svg")
-                .attr("class", "bar_chart")
-                .attr("width", @plot_width + @margin.left + @margin.right)
-                .attr("height", @plot_height + @margin.top + @margin.bottom)
-                .append("g")
-                .attr("transform", "translate(" + @margin.left + "," + @margin.top + ")")
-                
-            return svg
-            
-        create_scales: () ->
-            @x_scale = d3.scale.ordinal()
-                .domain(@sample_names)
-                .rangeBands([0, @plot_width], .1)
-
-            @y_scale = d3.scale.linear()
-                .domain([@y_min * 0.75, @y_max])
-                .range([@plot_height, @y_buffer])
-                
-        create_graph: () ->
-            
-            #@add_border()
-            @add_x_axis(@x_scale)
-            @add_y_axis() 
-            
-            @add_bars()
-            
-        add_x_axis: (scale) ->
-            xAxis = d3.svg.axis()
-                .scale(scale)
-                .orient("bottom");
-            
-            @svg.append("g")
-                .attr("class", "x axis")
-                .attr("transform", "translate(0," + @plot_height + ")")
-                .call(xAxis)
-                .selectAll("text")  
-                    .style("text-anchor", "end")
-                    .style("font-size", "12px")
-                    .attr("dx", "-.8em")
-                    .attr("dy", "-.3em")
-                    .attr("transform", (d) =>
-                        return "rotate(-90)" 
-                    )
-
-        add_y_axis: () ->
-            yAxis = d3.svg.axis()
-                    .scale(@y_scale)
-                    .orient("left")
-                    .ticks(5)
-
-            @svg.append("g")
-                .attr("class", "y axis")
-                .call(yAxis)
-              .append("text")
-                .attr("transform", "rotate(-90)")
-                .attr("y", 6)
-                .attr("dy", ".71em")
-                .style("text-anchor", "end")
-
-        add_bars: () ->
-            @svg.selectAll(".bar")
-                .data(@samples)
-              .enter().append("rect")
-                .style("fill", "steelblue")
-                .attr("class", "bar")
-                .attr("x", (d) =>
-                    return @x_scale(d[0])
-                )
-                .attr("width", @x_scale.rangeBand())
-                .attr("y", (d) =>
-                    return @y_scale(d[1])
-                )
-                .attr("height", (d) =>
-                    return @plot_height - @y_scale(d[1])
-                )
-                .append("svg:title")
-                .text((d) =>
-                    return d[1]
-                )
-
-        sorted_samples: () ->
-            #if @sample_attr_vals.length > 0
-            sample_list = _.zip(@sample_names, @sample_vals, @sample_attr_vals)
-            #else
-            #    sample_list = _.zip(@sample_names, @sample_vals)
-            sorted = _.sortBy(sample_list, (sample) =>
-                return sample[1]
-            )
-            console.log("sorted:", sorted)
-            return sorted
-
-        add_legend: (attribute, distinct_vals) ->
-            legend = @svg.append("g")
-                .attr("class", "legend")
-                .attr("height", 100)
-                .attr("width", 100)
-                .attr('transform', 'translate(-20,50)')
-                
-            legend_rect = legend.selectAll('rect')
-                            .data(distinct_vals)
-                            .enter()
-                            .append("rect")
-                            .attr("x", @plot_width - 65)
-                            .attr("width", 10)
-                            .attr("height", 10)
-                            .attr("y", (d, i) =>
-                                return i * 20
-                            )
-                            .style("fill", (d) =>
-                                console.log("TEST:", @attr_color_dict[attribute][d])
-                                return @attr_color_dict[attribute][d]
-                            )
-            
-            legend_text = legend.selectAll('text')
-                            .data(distinct_vals)
-                            .enter()
-                            .append("text")
-                            .attr("x", @plot_width - 52)
-                            .attr("y", (d, i) =>
-                                return i*20 + 9    
-                            )
-                            .text((d) =>
-                                return d
-                            )
-                            
-        color_by_trait: () ->
-            $('#collections_holder').load('/collections/list #collections_list', =>
-                $.colorbox(
-                    inline: true
-                    href: "#collections_holder"
-                )
-            )
-    
-    class Box_Plot
-        constructor: (@sample_list, @sample_group) ->
-            @get_samples()
-            
-            @margin = {top: 10, right: 50, bottom: 20, left: 50}
-            @plot_width = 200 - @margin.left - @margin.right
-            @plot_height = 500 - @margin.top - @margin.bottom
-            
-            @min = d3.min(@sample_vals)  
-            @max = d3.max(@sample_vals)
-            
-            @svg = @create_svg()
-            @enter_data()
-            
-            
-        get_samples: () ->
-            @sample_vals = (sample.value for sample in @sample_list when sample.value != null)
-            
-        create_svg: () ->
-            svg = d3.box()
-                .whiskers(@inter_quartile_range(1.5))
-                .width(@plot_width)
-                .height(@plot_height)
-                .domain([@min, @max])
-            return svg
-                        
-        enter_data: () ->
-            d3.select("#box_plot").selectAll("svg")
-                .data([@sample_vals])
-                .enter().append("svg:svg")
-                .attr("class", "box")
-                .attr("width", @plot_width)
-                .attr("height", @plot_height)
-                .append("svg:g")
-                .call(@svg)
-                            
-        inter_quartile_range: (k) ->
-            return (d, i) =>
-                console.log("iqr d:", d)
-                q1 = d.quartiles[0]
-                q3 = d.quartiles[2]
-                inter_quartile_range = (q3 - q1) * k
-                console.log("iqr:", inter_quartile_range)
-                i = 0
-                j = d.length
-                console.log("d[-1]:", d[1])
-                console.log("q1 - iqr:", q1 - inter_quartile_range)
-                i++ while (d[i] < q1 - inter_quartile_range)
-                j-- while (d[j] > q3 + inter_quartile_range)
-                #while (d[++i] < q1 - inter_quartile_range
-                #while d[--j] > q3 + inter_quartile_range
-                console.log("[i, j]", [i, j])
-                return [i, j]
-    
-
     sample_lists = js_data.sample_lists
     sample_group_types = js_data.sample_group_types
 
@@ -504,39 +137,6 @@ $ ->
                 console.log("Calling change_stats_value")
                 change_stats_value(sample_sets, category, row.vn, row.digits)
 
-    edit_data_change = ->
-        already_seen = {}
-        sample_sets =
-            samples_primary: new Stats([])
-            samples_other: new Stats([])
-            samples_all: new Stats([])
-
-        console.log("at beginning:", sample_sets)
-
-        tables = ['samples_primary', 'samples_other']
-        for table in tables
-            rows = $("#" + table).find('tr')
-            for row in rows
-                name = $(row).find('.edit_sample_sample_name').html()
-                name = $.trim(name)
-                real_value = $(row).find('.edit_sample_value').val()
-                console.log("real_value:", real_value)
-                checkbox = $(row).find(".edit_sample_checkbox")
-                checked = $(checkbox).attr('checked')
-
-                if checked and is_number(real_value) and real_value != ""
-                    console.log("in the iffy if")
-                    real_value = parseFloat(real_value)
-
-                    sample_sets[table].add_value(real_value)
-                    console.log("checking name of:", name)
-                    if not (name of already_seen)
-                        console.log("haven't seen")
-                        sample_sets['samples_all'].add_value(real_value)
-                        already_seen[name] = true
-        console.log("towards end:", sample_sets)
-        update_stat_values(sample_sets)
-
 
     make_table = ->
         header = "<thead><tr><th>&nbsp;</th>"
@@ -585,6 +185,38 @@ $ ->
             processed += value
         return processed
 
+    edit_data_change = ->
+        already_seen = {}
+        sample_sets =
+            samples_primary: new Stats([])
+            samples_other: new Stats([])
+            samples_all: new Stats([])
+
+        console.log("at beginning:", sample_sets)
+
+        tables = ['samples_primary', 'samples_other']
+        for table in tables
+            rows = $("#" + table).find('tr')
+            for row in rows
+                name = $(row).find('.edit_sample_sample_name').html()
+                name = $.trim(name)
+                real_value = $(row).find('.edit_sample_value').val()
+                console.log("real_value:", real_value)
+                checkbox = $(row).find(".edit_sample_checkbox")
+                checked = $(checkbox).attr('checked')
+
+                if checked and is_number(real_value) and real_value != ""
+                    console.log("in the iffy if")
+                    real_value = parseFloat(real_value)
+
+                    sample_sets[table].add_value(real_value)
+                    console.log("checking name of:", name)
+                    if not (name of already_seen)
+                        console.log("haven't seen")
+                        sample_sets['samples_all'].add_value(real_value)
+                        already_seen[name] = true
+        console.log("towards end:", sample_sets)
+        update_stat_values(sample_sets)
 
     show_hide_outliers = ->
         console.log("FOOBAR in beginning of show_hide_outliers")
@@ -613,7 +245,6 @@ $ ->
 
     $('select[name=corr_method]').change(on_corr_method_change)
 
-
     ##End Calculate Correlations Code
 
     ##Populate Samples Attribute Values Code
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.js b/wqflask/wqflask/static/new/javascript/show_trait.js
index b562bfe2..718e365a 100644
--- a/wqflask/wqflask/static/new/javascript/show_trait.js
+++ b/wqflask/wqflask/static/new/javascript/show_trait.js
@@ -2,7 +2,6 @@
 (function() {
   var Stat_Table_Rows, is_number,
     __hasProp = {}.hasOwnProperty,
-    __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; },
     __slice = [].slice;
 
   console.log("start_b");
@@ -57,407 +56,7 @@
   ];
 
   $(function() {
-    var Bar_Chart, Box_Plot, block_by_attribute_value, block_by_index, block_outliers, change_stats_value, create_value_dropdown, edit_data_change, export_sample_table_data, get_sample_table_data, hide_no_value, hide_tabs, make_table, on_corr_method_change, populate_sample_attributes_values_dropdown, process_id, reset_samples_table, sample_group_types, sample_lists, show_hide_outliers, stats_mdp_change, update_stat_values;
-    Bar_Chart = (function() {
-
-      function Bar_Chart(sample_list, sample_group) {
-        var longest_sample_name, sample,
-          _this = this;
-        this.sample_list = sample_list;
-        this.sample_group = sample_group;
-        this.get_samples();
-        console.log("sample names:", this.sample_names);
-        if (this.sample_attr_vals.length > 0) {
-          this.get_distinct_attr_vals();
-          this.get_attr_color_dict();
-        }
-        longest_sample_name = d3.max((function() {
-          var _i, _len, _ref, _results;
-          _ref = this.sample_names;
-          _results = [];
-          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-            sample = _ref[_i];
-            _results.push(sample.length);
-          }
-          return _results;
-        }).call(this));
-        this.margin = {
-          top: 20,
-          right: 20,
-          bottom: longest_sample_name * 7,
-          left: 40
-        };
-        this.plot_width = this.sample_vals.length * 15 - this.margin.left - this.margin.right;
-        this.plot_height = 500 - this.margin.top - this.margin.bottom;
-        this.x_buffer = this.plot_width / 20;
-        this.y_buffer = this.plot_height / 20;
-        this.y_min = d3.min(this.sample_vals);
-        this.y_max = d3.max(this.sample_vals) * 1.1;
-        this.svg = this.create_svg();
-        this.plot_height -= this.y_buffer;
-        this.create_scales();
-        this.create_graph();
-        d3.select("#color_attribute").on("change", function() {
-          var attribute;
-          attribute = $("#color_attribute").val();
-          if ($("#update_bar_chart").html() === 'Sort By Name') {
-            _this.svg.selectAll(".bar").data(_this.sorted_samples()).transition().duration(1000).style("fill", function(d) {
-              if (attribute === "None") {
-                return "steelblue";
-              } else {
-                return _this.attr_color_dict[attribute][d[2][attribute]];
-              }
-            }).select("title").text(function(d) {
-              return d[1];
-            });
-          } else {
-            _this.svg.selectAll(".bar").data(_this.samples).transition().duration(1000).style("fill", function(d) {
-              if (attribute === "None") {
-                return "steelblue";
-              } else {
-                return _this.attr_color_dict[attribute][d[2][attribute]];
-              }
-            });
-          }
-          return _this.add_legend(attribute, _this.distinct_attr_vals[attribute]);
-        });
-        d3.select("#update_bar_chart").on("click", function() {
-          var attribute, sortItems, sorted_sample_names, x_scale;
-          if (_this.attributes.length > 0) {
-            attribute = $("#color_attribute").val();
-          }
-          if ($("#update_bar_chart").html() === 'Sort By Value') {
-            $("#update_bar_chart").html('Sort By Name');
-            sortItems = function(a, b) {
-              return a[1] - b[1];
-            };
-            _this.svg.selectAll(".bar").data(_this.sorted_samples()).transition().duration(1000).attr("y", function(d) {
-              return _this.y_scale(d[1]);
-            }).attr("height", function(d) {
-              return _this.plot_height - _this.y_scale(d[1]);
-            }).style("fill", function(d) {
-              if (_this.attributes.length > 0) {
-                return _this.attr_color_dict[attribute][d[2][attribute]];
-              } else {
-                return "steelblue";
-              }
-            }).select("title").text(function(d) {
-              return d[1];
-            });
-            sorted_sample_names = (function() {
-              var _i, _len, _ref, _results;
-              _ref = this.sorted_samples();
-              _results = [];
-              for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-                sample = _ref[_i];
-                _results.push(sample[0]);
-              }
-              return _results;
-            }).call(_this);
-            x_scale = d3.scale.ordinal().domain(sorted_sample_names).rangeBands([0, _this.plot_width], .1);
-            $('.x.axis').remove();
-            return _this.add_x_axis(x_scale);
-          } else {
-            $("#update_bar_chart").html('Sort By Value');
-            _this.svg.selectAll(".bar").data(_this.samples).transition().duration(1000).attr("y", function(d) {
-              return _this.y_scale(d[1]);
-            }).attr("height", function(d) {
-              return _this.plot_height - _this.y_scale(d[1]);
-            }).style("fill", function(d) {
-              if (_this.attributes.length > 0) {
-                return _this.attr_color_dict[attribute][d[2][attribute]];
-              } else {
-                return "steelblue";
-              }
-            }).select("title").text(function(d) {
-              return d[1];
-            });
-            x_scale = d3.scale.ordinal().domain(_this.sample_names).rangeBands([0, _this.plot_width], .1);
-            $('.x.axis').remove();
-            return _this.add_x_axis(x_scale);
-          }
-        });
-        d3.select("#color_by_trait").on("click", function() {
-          return _this.color_by_trait();
-        });
-      }
-
-      Bar_Chart.prototype.get_attr_color_dict = function() {
-        var color, color_range, distinct_vals, i, key, this_color_dict, value, _i, _j, _len, _len1, _ref, _results,
-          _this = this;
-        this.attr_color_dict = {};
-        console.log("distinct_attr_vals:", this.distinct_attr_vals);
-        _ref = this.distinct_attr_vals;
-        _results = [];
-        for (key in _ref) {
-          if (!__hasProp.call(_ref, key)) continue;
-          distinct_vals = _ref[key];
-          this_color_dict = {};
-          if (distinct_vals.length < 10) {
-            color = d3.scale.category10();
-            for (i = _i = 0, _len = distinct_vals.length; _i < _len; i = ++_i) {
-              value = distinct_vals[i];
-              this_color_dict[value] = color(i);
-            }
-          } else {
-            console.log("distinct_values:", distinct_vals);
-            if (_.every(distinct_vals, function(d) {
-              if (isNaN(d)) {
-                return false;
-              } else {
-                return true;
-              }
-            })) {
-              color_range = d3.scale.linear().domain([d3.min(distinct_vals), d3.max(distinct_vals)]).range([0, 4]);
-              for (i = _j = 0, _len1 = distinct_vals.length; _j < _len1; i = ++_j) {
-                value = distinct_vals[i];
-                console.log("color_range(value):", color_range(parseInt(value)));
-                this_color_dict[value] = d3.rgb("lightblue").darker(color_range(parseInt(value)));
-              }
-            }
-          }
-          _results.push(this.attr_color_dict[key] = this_color_dict);
-        }
-        return _results;
-      };
-
-      Bar_Chart.prototype.get_samples = function() {
-        var attr_vals, attribute, key, sample, _i, _j, _len, _len1, _ref, _ref1;
-        this.sample_names = (function() {
-          var _i, _len, _ref, _results;
-          _ref = this.sample_list;
-          _results = [];
-          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-            sample = _ref[_i];
-            if (sample.value !== null) {
-              _results.push(sample.name);
-            }
-          }
-          return _results;
-        }).call(this);
-        this.sample_vals = (function() {
-          var _i, _len, _ref, _results;
-          _ref = this.sample_list;
-          _results = [];
-          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-            sample = _ref[_i];
-            if (sample.value !== null) {
-              _results.push(sample.value);
-            }
-          }
-          return _results;
-        }).call(this);
-        this.attributes = (function() {
-          var _results;
-          _results = [];
-          for (key in this.sample_list[0]["extra_attributes"]) {
-            _results.push(key);
-          }
-          return _results;
-        }).call(this);
-        console.log("attributes:", this.attributes);
-        this.sample_attr_vals = [];
-        if (this.attributes.length > 0) {
-          _ref = this.sample_list;
-          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-            sample = _ref[_i];
-            attr_vals = {};
-            _ref1 = this.attributes;
-            for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
-              attribute = _ref1[_j];
-              attr_vals[attribute] = sample["extra_attributes"][attribute];
-            }
-            this.sample_attr_vals.push(attr_vals);
-          }
-        }
-        return this.samples = _.zip(this.sample_names, this.sample_vals, this.sample_attr_vals);
-      };
-
-      Bar_Chart.prototype.get_distinct_attr_vals = function() {
-        var attribute, sample, _i, _len, _ref, _results;
-        this.distinct_attr_vals = {};
-        _ref = this.sample_attr_vals;
-        _results = [];
-        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-          sample = _ref[_i];
-          _results.push((function() {
-            var _ref1, _results1;
-            _results1 = [];
-            for (attribute in sample) {
-              if (!this.distinct_attr_vals[attribute]) {
-                this.distinct_attr_vals[attribute] = [];
-              }
-              if (_ref1 = sample[attribute], __indexOf.call(this.distinct_attr_vals[attribute], _ref1) < 0) {
-                _results1.push(this.distinct_attr_vals[attribute].push(sample[attribute]));
-              } else {
-                _results1.push(void 0);
-              }
-            }
-            return _results1;
-          }).call(this));
-        }
-        return _results;
-      };
-
-      Bar_Chart.prototype.create_svg = function() {
-        var svg;
-        svg = d3.select("#bar_chart").append("svg").attr("class", "bar_chart").attr("width", this.plot_width + this.margin.left + this.margin.right).attr("height", this.plot_height + this.margin.top + this.margin.bottom).append("g").attr("transform", "translate(" + this.margin.left + "," + this.margin.top + ")");
-        return svg;
-      };
-
-      Bar_Chart.prototype.create_scales = function() {
-        this.x_scale = d3.scale.ordinal().domain(this.sample_names).rangeBands([0, this.plot_width], .1);
-        return this.y_scale = d3.scale.linear().domain([this.y_min * 0.75, this.y_max]).range([this.plot_height, this.y_buffer]);
-      };
-
-      Bar_Chart.prototype.create_graph = function() {
-        this.add_x_axis(this.x_scale);
-        this.add_y_axis();
-        return this.add_bars();
-      };
-
-      Bar_Chart.prototype.add_x_axis = function(scale) {
-        var xAxis,
-          _this = this;
-        xAxis = d3.svg.axis().scale(scale).orient("bottom");
-        return this.svg.append("g").attr("class", "x axis").attr("transform", "translate(0," + this.plot_height + ")").call(xAxis).selectAll("text").style("text-anchor", "end").style("font-size", "12px").attr("dx", "-.8em").attr("dy", "-.3em").attr("transform", function(d) {
-          return "rotate(-90)";
-        });
-      };
-
-      Bar_Chart.prototype.add_y_axis = function() {
-        var yAxis;
-        yAxis = d3.svg.axis().scale(this.y_scale).orient("left").ticks(5);
-        return this.svg.append("g").attr("class", "y axis").call(yAxis).append("text").attr("transform", "rotate(-90)").attr("y", 6).attr("dy", ".71em").style("text-anchor", "end");
-      };
-
-      Bar_Chart.prototype.add_bars = function() {
-        var _this = this;
-        return this.svg.selectAll(".bar").data(this.samples).enter().append("rect").style("fill", "steelblue").attr("class", "bar").attr("x", function(d) {
-          return _this.x_scale(d[0]);
-        }).attr("width", this.x_scale.rangeBand()).attr("y", function(d) {
-          return _this.y_scale(d[1]);
-        }).attr("height", function(d) {
-          return _this.plot_height - _this.y_scale(d[1]);
-        }).append("svg:title").text(function(d) {
-          return d[1];
-        });
-      };
-
-      Bar_Chart.prototype.sorted_samples = function() {
-        var sample_list, sorted,
-          _this = this;
-        sample_list = _.zip(this.sample_names, this.sample_vals, this.sample_attr_vals);
-        sorted = _.sortBy(sample_list, function(sample) {
-          return sample[1];
-        });
-        console.log("sorted:", sorted);
-        return sorted;
-      };
-
-      Bar_Chart.prototype.add_legend = function(attribute, distinct_vals) {
-        var legend, legend_rect, legend_text,
-          _this = this;
-        legend = this.svg.append("g").attr("class", "legend").attr("height", 100).attr("width", 100).attr('transform', 'translate(-20,50)');
-        legend_rect = legend.selectAll('rect').data(distinct_vals).enter().append("rect").attr("x", this.plot_width - 65).attr("width", 10).attr("height", 10).attr("y", function(d, i) {
-          return i * 20;
-        }).style("fill", function(d) {
-          console.log("TEST:", _this.attr_color_dict[attribute][d]);
-          return _this.attr_color_dict[attribute][d];
-        });
-        return legend_text = legend.selectAll('text').data(distinct_vals).enter().append("text").attr("x", this.plot_width - 52).attr("y", function(d, i) {
-          return i * 20 + 9;
-        }).text(function(d) {
-          return d;
-        });
-      };
-
-      Bar_Chart.prototype.color_by_trait = function() {
-        var _this = this;
-        return $('#collections_holder').load('/collections/list #collections_list', function() {
-          return $.colorbox({
-            inline: true,
-            href: "#collections_holder"
-          });
-        });
-      };
-
-      return Bar_Chart;
-
-    })();
-    Box_Plot = (function() {
-
-      function Box_Plot(sample_list, sample_group) {
-        this.sample_list = sample_list;
-        this.sample_group = sample_group;
-        this.get_samples();
-        this.margin = {
-          top: 10,
-          right: 50,
-          bottom: 20,
-          left: 50
-        };
-        this.plot_width = 200 - this.margin.left - this.margin.right;
-        this.plot_height = 500 - this.margin.top - this.margin.bottom;
-        this.min = d3.min(this.sample_vals);
-        this.max = d3.max(this.sample_vals);
-        this.svg = this.create_svg();
-        this.enter_data();
-      }
-
-      Box_Plot.prototype.get_samples = function() {
-        var sample;
-        return this.sample_vals = (function() {
-          var _i, _len, _ref, _results;
-          _ref = this.sample_list;
-          _results = [];
-          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-            sample = _ref[_i];
-            if (sample.value !== null) {
-              _results.push(sample.value);
-            }
-          }
-          return _results;
-        }).call(this);
-      };
-
-      Box_Plot.prototype.create_svg = function() {
-        var svg;
-        svg = d3.box().whiskers(this.inter_quartile_range(1.5)).width(this.plot_width).height(this.plot_height).domain([this.min, this.max]);
-        return svg;
-      };
-
-      Box_Plot.prototype.enter_data = function() {
-        return d3.select("#box_plot").selectAll("svg").data([this.sample_vals]).enter().append("svg:svg").attr("class", "box").attr("width", this.plot_width).attr("height", this.plot_height).append("svg:g").call(this.svg);
-      };
-
-      Box_Plot.prototype.inter_quartile_range = function(k) {
-        var _this = this;
-        return function(d, i) {
-          var inter_quartile_range, j, q1, q3;
-          console.log("iqr d:", d);
-          q1 = d.quartiles[0];
-          q3 = d.quartiles[2];
-          inter_quartile_range = (q3 - q1) * k;
-          console.log("iqr:", inter_quartile_range);
-          i = 0;
-          j = d.length;
-          console.log("d[-1]:", d[1]);
-          console.log("q1 - iqr:", q1 - inter_quartile_range);
-          while (d[i] < q1 - inter_quartile_range) {
-            i++;
-          }
-          while (d[j] > q3 + inter_quartile_range) {
-            j--;
-          }
-          console.log("[i, j]", [i, j]);
-          return [i, j];
-        };
-      };
-
-      return Box_Plot;
-
-    })();
+    var block_by_attribute_value, block_by_index, block_outliers, change_stats_value, create_value_dropdown, edit_data_change, export_sample_table_data, get_sample_table_data, hide_no_value, hide_tabs, make_table, on_corr_method_change, populate_sample_attributes_values_dropdown, process_id, reset_samples_table, sample_group_types, sample_lists, show_hide_outliers, stats_mdp_change, update_stat_values;
     sample_lists = js_data.sample_lists;
     sample_group_types = js_data.sample_group_types;
     new Bar_Chart(sample_lists[0]);
@@ -546,43 +145,6 @@
       }
       return _results;
     };
-    edit_data_change = function() {
-      var already_seen, checkbox, checked, name, real_value, row, rows, sample_sets, table, tables, _i, _j, _len, _len1;
-      already_seen = {};
-      sample_sets = {
-        samples_primary: new Stats([]),
-        samples_other: new Stats([]),
-        samples_all: new Stats([])
-      };
-      console.log("at beginning:", sample_sets);
-      tables = ['samples_primary', 'samples_other'];
-      for (_i = 0, _len = tables.length; _i < _len; _i++) {
-        table = tables[_i];
-        rows = $("#" + table).find('tr');
-        for (_j = 0, _len1 = rows.length; _j < _len1; _j++) {
-          row = rows[_j];
-          name = $(row).find('.edit_sample_sample_name').html();
-          name = $.trim(name);
-          real_value = $(row).find('.edit_sample_value').val();
-          console.log("real_value:", real_value);
-          checkbox = $(row).find(".edit_sample_checkbox");
-          checked = $(checkbox).attr('checked');
-          if (checked && is_number(real_value) && real_value !== "") {
-            console.log("in the iffy if");
-            real_value = parseFloat(real_value);
-            sample_sets[table].add_value(real_value);
-            console.log("checking name of:", name);
-            if (!(name in already_seen)) {
-              console.log("haven't seen");
-              sample_sets['samples_all'].add_value(real_value);
-              already_seen[name] = true;
-            }
-          }
-        }
-      }
-      console.log("towards end:", sample_sets);
-      return update_stat_values(sample_sets);
-    };
     make_table = function() {
       var header, key, row, row_line, table, the_id, the_rows, value, _i, _len, _ref, _ref1;
       header = "<thead><tr><th>&nbsp;</th>";
@@ -645,6 +207,43 @@
       }
       return processed;
     };
+    edit_data_change = function() {
+      var already_seen, checkbox, checked, name, real_value, row, rows, sample_sets, table, tables, _i, _j, _len, _len1;
+      already_seen = {};
+      sample_sets = {
+        samples_primary: new Stats([]),
+        samples_other: new Stats([]),
+        samples_all: new Stats([])
+      };
+      console.log("at beginning:", sample_sets);
+      tables = ['samples_primary', 'samples_other'];
+      for (_i = 0, _len = tables.length; _i < _len; _i++) {
+        table = tables[_i];
+        rows = $("#" + table).find('tr');
+        for (_j = 0, _len1 = rows.length; _j < _len1; _j++) {
+          row = rows[_j];
+          name = $(row).find('.edit_sample_sample_name').html();
+          name = $.trim(name);
+          real_value = $(row).find('.edit_sample_value').val();
+          console.log("real_value:", real_value);
+          checkbox = $(row).find(".edit_sample_checkbox");
+          checked = $(checkbox).attr('checked');
+          if (checked && is_number(real_value) && real_value !== "") {
+            console.log("in the iffy if");
+            real_value = parseFloat(real_value);
+            sample_sets[table].add_value(real_value);
+            console.log("checking name of:", name);
+            if (!(name in already_seen)) {
+              console.log("haven't seen");
+              sample_sets['samples_all'].add_value(real_value);
+              already_seen[name] = true;
+            }
+          }
+        }
+      }
+      console.log("towards end:", sample_sets);
+      return update_stat_values(sample_sets);
+    };
     show_hide_outliers = function() {
       var label;
       console.log("FOOBAR in beginning of show_hide_outliers");
diff --git a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee
index 3c995441..8571753e 100644
--- a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee
+++ b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee
@@ -52,6 +52,32 @@ $ ->
         )
         return false
 
+    $("#interval_mapping_compute").click(() =>
+        $("#progress_bar_container").modal()
+        url = "/interval_mapping"
+        form_data = $('#trait_data_form').serialize()
+        console.log("form_data is:", form_data)
+        $.ajax(
+            type: "POST"
+            url: url
+            data: form_data
+            error: (xhr, ajaxOptions, thrownError) =>
+                alert("Sorry, an error occurred")
+                console.log(xhr)
+                clearInterval(this.my_timer)
+                $('#progress_bar_container').modal('hide')
+                $("body").html("We got an error.")        
+            success: (data) =>
+                clearInterval(this.my_timer)
+                $('#progress_bar_container').modal('hide')
+                $("body").html(data)
+        )
+        console.log("settingInterval")
+
+        this.my_timer = setInterval(get_progress, 1000)
+        return false
+    )
+
     $('#suggestive').hide()
 
     $('input[name=display_all]').change(() =>
diff --git a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js
index b309b167..1153b8ef 100644
--- a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js
+++ b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js
@@ -62,6 +62,33 @@
       });
       return false;
     };
+    $("#interval_mapping_compute").click(function() {
+      var form_data, url;
+      $("#progress_bar_container").modal();
+      url = "/interval_mapping";
+      form_data = $('#trait_data_form').serialize();
+      console.log("form_data is:", form_data);
+      $.ajax({
+        type: "POST",
+        url: url,
+        data: form_data,
+        error: function(xhr, ajaxOptions, thrownError) {
+          alert("Sorry, an error occurred");
+          console.log(xhr);
+          clearInterval(_this.my_timer);
+          $('#progress_bar_container').modal('hide');
+          return $("body").html("We got an error.");
+        },
+        success: function(data) {
+          clearInterval(_this.my_timer);
+          $('#progress_bar_container').modal('hide');
+          return $("body").html(data);
+        }
+      });
+      console.log("settingInterval");
+      _this.my_timer = setInterval(get_progress, 1000);
+      return false;
+    });
     $('#suggestive').hide();
     $('input[name=display_all]').change(function() {
       console.log("check");
diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html
index 8a19e07b..91e6df42 100644
--- a/wqflask/wqflask/templates/show_trait.html
+++ b/wqflask/wqflask/templates/show_trait.html
@@ -56,6 +56,7 @@
     <script type="text/javascript" src="/static/new/javascript/stats.js"></script>
     <script type="text/javascript" src="/static/new/javascript/box.js"></script>
     <script type="text/javascript" src="/static/new/javascript/bar_chart.js"></script>
+    <script type="text/javascript" src="/static/new/javascript/box_plot.js"></script>
     <script type="text/javascript" src="/static/new/javascript/show_trait.js"></script>
     <script type="text/javascript" src="/static/new/javascript/show_trait_mapping_tools.js"></script>
     <script type="text/javascript" src="/static/new/javascript/validation.js"></script>
diff --git a/wqflask/wqflask/templates/show_trait_mapping_tools.html b/wqflask/wqflask/templates/show_trait_mapping_tools.html
index c2d5211f..00301d39 100644
--- a/wqflask/wqflask/templates/show_trait_mapping_tools.html
+++ b/wqflask/wqflask/templates/show_trait_mapping_tools.html
@@ -30,7 +30,7 @@
                     <div class="control-group">
                         <label for="mapping_permutations" class="control-label">Permutations (n)</label>
                         <div class="controls">
-                            <input name="num_perm1" value="2000" type="text" />
+                            <input name="num_permutations" value="2000" type="text" />
                         </div>
                     </div>
     
@@ -85,7 +85,8 @@
 
                     <div class="control-group">
                         <div class="controls">
-                            <button class="btn btn-inverse submit_special"
+                            <button id="interval_mapping_compute"
+                                    class="btn btn-inverse submit_special"
                                     data-url="/interval_mapping"
                                     title="Compute Interval Mapping">
                                 <i class="icon-ok-circle icon-white"></i> Compute
@@ -116,12 +117,12 @@
                         </div>
                     </div>
                     
-                    <div class="control-group">
+<!--                    <div class="control-group">
                         <label for="marker_reg_permutations" class="control-label">Permutations (n)</label>
                         <div class="controls">
                             <input name="num_perm" value="2000" type="text" />
                         </div>
-                    </div>                    
+                    </div>           -->         
                     
                     <div class="control-group">
                         <div class="controls">
diff --git a/wqflask/wqflask/user_manager.py b/wqflask/wqflask/user_manager.py
index 768415b5..1d0d9846 100644
--- a/wqflask/wqflask/user_manager.py
+++ b/wqflask/wqflask/user_manager.py
@@ -49,7 +49,8 @@ from utility import Bunch, Struct
 
 from base.data_set import create_datasets_list
 
-
+THREE_DAYS = 60 * 60 * 24 * 3
+#THREE_DAYS = 45
 
 def timestamp():
     return datetime.datetime.utcnow().isoformat()
@@ -74,6 +75,27 @@ class UserSession(object):
             print("self.redis_key is:", self.redis_key)
             self.session_id = session_id
             self.record = Redis.hgetall(self.redis_key)
+
+
+            if not self.record:
+                # This will occur, for example, when the browser has been left open over a long
+                # weekend and the site hasn't been visited by the user
+                self.logged_in = False
+                
+                ########### Grrr...this won't work because of the way flask handles cookies
+                # Delete the cookie
+                #response = make_response(redirect(url_for('login')))
+                #response.set_cookie(self.cookie_name, '', expires=0)
+                #flash(
+                #   "Due to inactivity your session has expired. If you'd like please login again.")
+                #return response
+                return 
+                
+            if Redis.ttl(self.redis_key) < THREE_DAYS:
+                # (Almost) everytime the user does something we extend the session_id in Redis...
+                print("Extending ttl...")
+                Redis.expire(self.redis_key, THREE_DAYS)
+            
             print("record is:", self.record)
             self.logged_in = True
 
@@ -225,8 +247,8 @@ class VerificationEmail(object):
                           )
 
         Redis.set(key, data)
-        two_days = 60 * 60 * 24 * 2
-        Redis.expire(key, two_days)
+        #two_days = 60 * 60 * 24 * 2
+        Redis.expire(key, THREE_DAYS)
         to = user.email_address
         subject = self.subject
         body = render_template(self.template_name,
@@ -415,7 +437,7 @@ class LoginUser(object):
         if self.remember_me:
             expire_time = self.remember_time
         else:
-            expire_time = 60 * 60 * 24 * 2 # two days
+            expire_time = THREE_DAYS
         Redis.expire(key, expire_time)
         db_session.add(login_rec)
         db_session.commit()
diff --git a/wqflask/wqflask/views.py b/wqflask/wqflask/views.py
index b2f08ca0..50161d41 100644
--- a/wqflask/wqflask/views.py
+++ b/wqflask/wqflask/views.py
@@ -32,7 +32,7 @@ from base.data_set import create_datasets_list
 from wqflask.show_trait import show_trait
 from wqflask.show_trait import export_trait_data
 from wqflask.marker_regression import marker_regression
-#from wqflask.interval_mapping import interval_mapping
+from wqflask.interval_mapping import interval_mapping
 from wqflask.correlation import show_corr_results
 from wqflask.correlation import corr_scatter_plot
 from utility import temp_data
@@ -256,7 +256,11 @@ def interval_mapping_page():
     wanted = (
         'trait_id',
         'dataset',
-        'suggestive'
+        'chromosome',
+        'num_permutations',
+        'do_bootstraps',
+        'default_control_locus',
+        'control_locus'
     )
 
     start_vars = {}
@@ -308,10 +312,10 @@ def corr_scatter_plot_page():
                                        indent="   ")
     return render_template("corr_scatter_plot.html", **template_vars.__dict__)
 
-@app.route("/int_mapping", methods=('POST',))
-def interval_mapping_page():
-    template_vars = interval_mapping.IntervalMapping(request.args)
-    return render_template("interval_mapping.html", **template_vars.__dict__)
+#@app.route("/int_mapping", methods=('POST',))
+#def interval_mapping_page():
+#    template_vars = interval_mapping.IntervalMapping(request.args)
+#    return render_template("interval_mapping.html", **template_vars.__dict__)
 
 # Todo: Can we simplify this? -Sam
 def sharing_info_page():