From a013385d35c4e24be6ff1122797bf67342e48696 Mon Sep 17 00:00:00 2001
From: Marlena Compton <marlena.compton@gmail.com>
Date: Sat, 31 Jan 2015 08:02:51 -0800
Subject: [PATCH] add bits to get the labels in the right place

---
 app/assets/javascripts/crops.js.erb              | 10 ++++++----
 app/assets/javascripts/graphs/bar_group.js       |  2 +-
 app/assets/javascripts/graphs/bar_label_group.js | 12 ++++++++++++
 spec/javascripts/graphs/bar_group_spec.js        |  2 +-
 4 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/crops.js.erb b/app/assets/javascripts/crops.js.erb
index c69d8bd85..b6e737694 100644
--- a/app/assets/javascripts/crops.js.erb
+++ b/app/assets/javascripts/crops.js.erb
@@ -53,13 +53,15 @@ function showCropMap(cropmap) {
 if ($("#sunchart")[0] !== null) {
   var HorizontalBarGraph = growstuff.HorizontalBarGraph;
   var bars = [
-    {name: 'Shade', value: 2},
-    {name: 'Half Shade', value: 5}
+    {name: 'Empty', value: 3},
+    {name: 'Sun', value: 8},
+    {name: 'Semi-shade', value: 4},
+    {name: 'Shade', value: 2}
   ];
   data = {
     bars: bars,
-    width: {size: 200, scale: 'linear'},
-    height: {size: 300, scale: 'ordinal'},
+    width: {size: 300, scale: 'linear'},
+    height: {size: 100, scale: 'ordinal'},
     //left is used to shift the bars over so that there is
     //room for the labels
     margin: {top: 0, right: 0, bottom: 0, left: 100}
diff --git a/app/assets/javascripts/graphs/bar_group.js b/app/assets/javascripts/graphs/bar_group.js
index b505af55f..0457f78d7 100644
--- a/app/assets/javascripts/graphs/bar_group.js
+++ b/app/assets/javascripts/graphs/bar_group.js
@@ -29,7 +29,7 @@ BarGroup.prototype.render = function(root){
 
     })
     .attr("height", yScale.rangeBand())
-      .attr("fill", "rebeccapurple")
+      .attr("fill", "steelblue")
       .attr("width", function(d){
         return xScale(d);
       });
diff --git a/app/assets/javascripts/graphs/bar_label_group.js b/app/assets/javascripts/graphs/bar_label_group.js
index 8dde42153..51892aaac 100644
--- a/app/assets/javascripts/graphs/bar_label_group.js
+++ b/app/assets/javascripts/graphs/bar_label_group.js
@@ -11,12 +11,24 @@
 
   BarLabelGroup.prototype.render = function(d3){
     var bars = this._data.bars;
+    //vvcopy pasta from spike vv  -- this is a good candidate for refactor
+    var barHeight = 40;
+
     return d3.append('g')
       .attr("class", "bar-label")
       .selectAll("text")
       .data(bars.map(function(bar){ return bar.name;}))
       .enter()
       .append("text")
+      .attr('x', -80)
+      .attr('y', function(d, i){
+        //shrink the margin between each label to give them an even spread with
+        //bars
+        var barLabelSpread = 2/3;
+        //move them downward to line up with bars
+        var barLabelTopEdge = 17;
+        return i * barHeight * (barLabelSpread) + barLabelTopEdge;
+      })
       .text(function(d){return d});
 
   };
diff --git a/spec/javascripts/graphs/bar_group_spec.js b/spec/javascripts/graphs/bar_group_spec.js
index b160d368a..78f8c20e8 100644
--- a/spec/javascripts/graphs/bar_group_spec.js
+++ b/spec/javascripts/graphs/bar_group_spec.js
@@ -35,7 +35,7 @@
   });
 
   it('fills the bars with color', function(){
-    expect($('g.bar rect')).toHaveAttr('fill', 'rebeccapurple');
+    expect($('g.bar rect')).toHaveAttr('fill', 'steelblue');
   });
 
   it ('gets the values of all the bars', function(){