Merge branch 'master' of github.com:genenetwork/genenetwork2

6 files changed, 159 insertions, 131 deletions

diff --git a/wqflask/wqflask/static/new/javascript/histogram.coffee b/wqflask/wqflask/static/new/javascript/histogram.coffee
index 98f89ac6..68d9b5a2 100755
--- a/wqflask/wqflask/static/new/javascript/histogram.coffee
+++ b/wqflask/wqflask/static/new/javascript/histogram.coffee
@@ -4,7 +4,6 @@ class Histogram
     constructor: (@sample_list, @sample_group) ->

         @sort_by = "name"

         @format_count = d3.format(",.0f") #a formatter for counts

-        @get_sample_vals()

         

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

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

@@ -12,21 +11,25 @@ class Histogram
 

         @x_buffer = @plot_width/20

         @y_buffer = @plot_height/20

+        @plot_height -= @y_buffer

+

+        @get_sample_vals(@sample_list)

+        @redraw(@sample_vals)

 

+    redraw: (@sample_vals) ->

         @y_min = d3.min(@sample_vals)  

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

-        

-        @plot_height -= @y_buffer

+

         @create_x_scale()

         @get_histogram_data()

         @create_y_scale()

         

+        $("#histogram").empty()

         @svg = @create_svg()

-

         @create_graph()

 

-    get_sample_vals: () ->

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

+    get_sample_vals: (sample_list) ->

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

 

     create_svg: () ->

         svg = d3.select("#histogram")

@@ -53,8 +56,9 @@ class Histogram
 

     get_histogram_data: () ->

         console.log("sample_vals:", @sample_vals)

+        n_bins = Math.sqrt(@sample_vals.length)

         @histogram_data = d3.layout.histogram()

-            .bins(@x_scale.ticks(20))(@sample_vals)

+            .bins(@x_scale.ticks(n_bins))(@sample_vals)

         console.log("histogram_data:", @histogram_data[0])

 

     create_y_scale: () ->

@@ -112,17 +116,20 @@ class Histogram
             .attr("class", "bar")

             .attr("transform", (d) =>

                 return "translate(" + @x_scale(d.x) + "," + @y_scale(d.y) + ")")

+

+        rect_width = @x_scale(@histogram_data[0].x + @histogram_data[0].dx) -

+                     @x_scale(@histogram_data[0].x)

         

         bar.append("rect")

             .attr("x", 1)

-            .attr("width", @x_scale(@histogram_data[0].x + @histogram_data[0].dx) - 1)

+            .attr("width", rect_width - 1)

             .attr("height", (d) =>

                 return @plot_height - @y_scale(d.y)

             )

         bar.append("text")

             .attr("dy", ".75em")

             .attr("y", 6)

-            .attr("x", @x_scale(@histogram_data[0].dx)/2)

+            .attr("x", rect_width / 2)

             .attr("text-anchor", "middle")

             .style("fill", "#fff")

             .text((d) =>

@@ -131,4 +138,4 @@ class Histogram
                     return @format_count(d.y)

             )

 

-root.Histogram = Histogram
\ No newline at end of file
+root.Histogram = Histogram

diff --git a/wqflask/wqflask/static/new/javascript/histogram.js b/wqflask/wqflask/static/new/javascript/histogram.js
index 561a3068..d872a3ba 100755
--- a/wqflask/wqflask/static/new/javascript/histogram.js
+++ b/wqflask/wqflask/static/new/javascript/histogram.js
@@ -1,124 +1,135 @@
-// Generated by CoffeeScript 1.8.0
-var Histogram, root;
-
-root = typeof exports !== "undefined" && exports !== null ? exports : this;
-
-Histogram = (function() {
-  function Histogram(sample_list, sample_group) {
-    this.sample_list = sample_list;
-    this.sample_group = sample_group;
-    this.sort_by = "name";
-    this.format_count = d3.format(",.0f");
-    this.get_sample_vals();
-    this.margin = {
-      top: 10,
-      right: 30,
-      bottom: 30,
-      left: 30
+// Generated by CoffeeScript 1.9.2
+(function() {
+  var Histogram, root;
+
+  root = typeof exports !== "undefined" && exports !== null ? exports : this;
+
+  Histogram = (function() {
+    function Histogram(sample_list1, sample_group) {
+      this.sample_list = sample_list1;
+      this.sample_group = sample_group;
+      this.sort_by = "name";
+      this.format_count = d3.format(",.0f");
+      this.margin = {
+        top: 10,
+        right: 30,
+        bottom: 30,
+        left: 30
+      };
+      this.plot_width = 960 - 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.plot_height -= this.y_buffer;
+      this.get_sample_vals(this.sample_list);
+      this.redraw(this.sample_vals);
+    }
+
+    Histogram.prototype.redraw = function(sample_vals) {
+      this.sample_vals = sample_vals;
+      this.y_min = d3.min(this.sample_vals);
+      this.y_max = d3.max(this.sample_vals) * 1.1;
+      this.create_x_scale();
+      this.get_histogram_data();
+      this.create_y_scale();
+      $("#histogram").empty();
+      this.svg = this.create_svg();
+      return this.create_graph();
     };
-    this.plot_width = 960 - 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.plot_height -= this.y_buffer;
-    this.create_x_scale();
-    this.get_histogram_data();
-    this.create_y_scale();
-    this.svg = this.create_svg();
-    this.create_graph();
-  }
-
-  Histogram.prototype.get_sample_vals = 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);
+
+    Histogram.prototype.get_sample_vals = function(sample_list) {
+      var sample;
+      return this.sample_vals = (function() {
+        var i, len, results;
+        results = [];
+        for (i = 0, len = sample_list.length; i < len; i++) {
+          sample = sample_list[i];
+          if (sample.value !== null) {
+            results.push(sample.value);
+          }
         }
-      }
-      return _results;
-    }).call(this);
-  };
-
-  Histogram.prototype.create_svg = function() {
-    var svg;
-    svg = d3.select("#histogram").append("svg").attr("class", "histogram").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;
-  };
-
-  Histogram.prototype.create_x_scale = function() {
-    var x0;
-    console.log("min/max:", d3.min(this.sample_vals) + "," + d3.max(this.sample_vals));
-    x0 = Math.max(-d3.min(this.sample_vals), d3.max(this.sample_vals));
-    return this.x_scale = d3.scale.linear().domain([d3.min(this.sample_vals), d3.max(this.sample_vals)]).range([0, this.plot_width]).nice();
-  };
-
-  Histogram.prototype.get_histogram_data = function() {
-    console.log("sample_vals:", this.sample_vals);
-    this.histogram_data = d3.layout.histogram().bins(this.x_scale.ticks(20))(this.sample_vals);
-    return console.log("histogram_data:", this.histogram_data[0]);
-  };
-
-  Histogram.prototype.create_y_scale = function() {
-    return this.y_scale = d3.scale.linear().domain([
-      0, d3.max(this.histogram_data, (function(_this) {
+        return results;
+      })();
+    };
+
+    Histogram.prototype.create_svg = function() {
+      var svg;
+      svg = d3.select("#histogram").append("svg").attr("class", "histogram").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;
+    };
+
+    Histogram.prototype.create_x_scale = function() {
+      var x0;
+      console.log("min/max:", d3.min(this.sample_vals) + "," + d3.max(this.sample_vals));
+      x0 = Math.max(-d3.min(this.sample_vals), d3.max(this.sample_vals));
+      return this.x_scale = d3.scale.linear().domain([d3.min(this.sample_vals), d3.max(this.sample_vals)]).range([0, this.plot_width]).nice();
+    };
+
+    Histogram.prototype.get_histogram_data = function() {
+      var n_bins;
+      console.log("sample_vals:", this.sample_vals);
+      n_bins = Math.sqrt(this.sample_vals.length);
+      this.histogram_data = d3.layout.histogram().bins(this.x_scale.ticks(n_bins))(this.sample_vals);
+      return console.log("histogram_data:", this.histogram_data[0]);
+    };
+
+    Histogram.prototype.create_y_scale = function() {
+      return this.y_scale = d3.scale.linear().domain([
+        0, d3.max(this.histogram_data, (function(_this) {
+          return function(d) {
+            return d.y;
+          };
+        })(this))
+      ]).range([this.plot_height, 0]);
+    };
+
+    Histogram.prototype.create_graph = function() {
+      this.add_x_axis();
+      this.add_y_axis();
+      return this.add_bars();
+    };
+
+    Histogram.prototype.add_x_axis = function() {
+      var x_axis;
+      x_axis = d3.svg.axis().scale(this.x_scale).orient("bottom");
+      return this.svg.append("g").attr("class", "x axis").attr("transform", "translate(0," + this.plot_height + ")").call(x_axis);
+    };
+
+    Histogram.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");
+    };
+
+    Histogram.prototype.add_bars = function() {
+      var bar, rect_width;
+      console.log("bar_width:", this.x_scale(this.histogram_data[0].dx));
+      bar = this.svg.selectAll(".bar").data(this.histogram_data).enter().append("g").attr("class", "bar").attr("transform", (function(_this) {
         return function(d) {
-          return d.y;
+          return "translate(" + _this.x_scale(d.x) + "," + _this.y_scale(d.y) + ")";
         };
-      })(this))
-    ]).range([this.plot_height, 0]);
-  };
-
-  Histogram.prototype.create_graph = function() {
-    this.add_x_axis();
-    this.add_y_axis();
-    return this.add_bars();
-  };
-
-  Histogram.prototype.add_x_axis = function() {
-    var x_axis;
-    x_axis = d3.svg.axis().scale(this.x_scale).orient("bottom");
-    return this.svg.append("g").attr("class", "x axis").attr("transform", "translate(0," + this.plot_height + ")").call(x_axis);
-  };
-
-  Histogram.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");
-  };
-
-  Histogram.prototype.add_bars = function() {
-    var bar;
-    console.log("bar_width:", this.x_scale(this.histogram_data[0].dx));
-    bar = this.svg.selectAll(".bar").data(this.histogram_data).enter().append("g").attr("class", "bar").attr("transform", (function(_this) {
-      return function(d) {
-        return "translate(" + _this.x_scale(d.x) + "," + _this.y_scale(d.y) + ")";
-      };
-    })(this));
-    bar.append("rect").attr("x", 1).attr("width", this.x_scale(this.histogram_data[0].x + this.histogram_data[0].dx) - 1).attr("height", (function(_this) {
-      return function(d) {
-        return _this.plot_height - _this.y_scale(d.y);
-      };
-    })(this));
-    return bar.append("text").attr("dy", ".75em").attr("y", 6).attr("x", this.x_scale(this.histogram_data[0].dx) / 2).attr("text-anchor", "middle").style("fill", "#fff").text((function(_this) {
-      return function(d) {
-        var bar_height;
-        bar_height = _this.plot_height - _this.y_scale(d.y);
-        if (bar_height > 20) {
-          return _this.format_count(d.y);
-        }
-      };
-    })(this));
-  };
+      })(this));
+      rect_width = this.x_scale(this.histogram_data[0].x + this.histogram_data[0].dx) - this.x_scale(this.histogram_data[0].x);
+      bar.append("rect").attr("x", 1).attr("width", rect_width - 1).attr("height", (function(_this) {
+        return function(d) {
+          return _this.plot_height - _this.y_scale(d.y);
+        };
+      })(this));
+      return bar.append("text").attr("dy", ".75em").attr("y", 6).attr("x", rect_width / 2).attr("text-anchor", "middle").style("fill", "#fff").text((function(_this) {
+        return function(d) {
+          var bar_height;
+          bar_height = _this.plot_height - _this.y_scale(d.y);
+          if (bar_height > 20) {
+            return _this.format_count(d.y);
+          }
+        };
+      })(this));
+    };
+
+    return Histogram;
 
-  return Histogram;
+  })();
 
-})();
+  root.Histogram = Histogram;
 
-root.Histogram = Histogram;
+}).call(this);
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.coffee b/wqflask/wqflask/static/new/javascript/show_trait.coffee
index ee57831f..1d3123ba 100755
--- a/wqflask/wqflask/static/new/javascript/show_trait.coffee
+++ b/wqflask/wqflask/static/new/javascript/show_trait.coffee
@@ -238,6 +238,7 @@ $ ->
                         sample_sets['samples_all'].add_value(real_value)
                         already_seen[name] = true
         console.log("towards end:", sample_sets)
+        root.histogram.redraw(sample_sets['samples_primary'].the_values)
         update_stat_values(sample_sets)
 
     show_hide_outliers = ->
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.js b/wqflask/wqflask/static/new/javascript/show_trait.js
index c2dc07ee..9323862a 100755
--- a/wqflask/wqflask/static/new/javascript/show_trait.js
+++ b/wqflask/wqflask/static/new/javascript/show_trait.js
@@ -265,6 +265,7 @@
         }
       }
       console.log("towards end:", sample_sets);
+      root.histogram.redraw(sample_sets['samples_primary'].the_values);
       return update_stat_values(sample_sets);
     };
     show_hide_outliers = function() {
diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html
index a1723ef8..d6f22f41 100755
--- a/wqflask/wqflask/templates/show_trait.html
+++ b/wqflask/wqflask/templates/show_trait.html
@@ -13,8 +13,12 @@
 {% endblock %}
 {% block content %} <!-- Start of body -->
 
-    {{ header("{}".format(this_trait.symbol),
-        '{}: {}'.format(this_trait.name, this_trait.description_fmt)) }}
+    {% if this_trait.dataset.type != 'Geno' %}
+	{{ header("{}".format(this_trait.name_header_fmt),
+	    '{}: {}'.format(this_trait.name, this_trait.description_fmt)) }}
+    {% else %}
+	{{ header("{}".format(this_trait.name_header_fmt)) }}
+    {% endif %}
 
 
     <form method="post" action="/corr_compute" name="trait_page" id="trait_data_form"
@@ -31,7 +35,7 @@
             <div class="page-header">
                 <h1>{{ dataset.group.species.capitalize() }} -
                     {{ dataset.group.name }} -
-                    {{ this_trait.symbol }}
+                    {{ this_trait.name_header_fmt }}
                 </h1>
             </div>
             
diff --git a/wqflask/wqflask/templates/show_trait_details.html b/wqflask/wqflask/templates/show_trait_details.html
index 0afac1f7..e1780e42 100755
--- a/wqflask/wqflask/templates/show_trait_details.html
+++ b/wqflask/wqflask/templates/show_trait_details.html
@@ -1,9 +1,13 @@
 <dl class="dl-horizontal">
+    {% if this_trait.dataset.type == 'ProbeSet' %}
     <dt>Aliases</dt>
     <dd>{{ this_trait.alias_fmt }}</dd>
+    {% endif %}
 
+    {% if this_trait.dataset.type != 'Publish' %}
     <dt>Location</dt>
     <dd>{{ this_trait.location_fmt }}</dd>
+    {% endif %}
 
     <dt>Database</dt>
     <dd>
@@ -16,7 +20,7 @@
     <dt>
         <a href="/blatInfo.html" target="_blank"
            title="Values higher than 2 for the specificity are good">
-            BLAT Specifity
+            BLAT Specificity
         </a>
     </dt>
     <dd>{{ "%0.3f" | format(this_trait.probe_set_specificity|float) }}</dd>