rails_highcharts 0.0.1.beta1 → 0.0.1.beta2

data/README.md

@@ -1,7 +1,7 @@
 Highcharts for Rails 3
 =========================================================================
 
-__modify from: [highcharts-rails](https://github.com/loudpixel/highcharts-rails "highcharts-rails")__
+__modify from: [lazy-high-charts](https://github.com/michelson/lazy_high_charts "lazy-high-charts"), with Highcharts v2.1.5 and Rails 3__
 
 __use: [Highcharts](http://highcharts.com/ "Highcharts")__
 
@@ -16,91 +16,53 @@ Rails3.0.8+/Ruby1.8.7+
     gem 'rails_highcharts'
 
     rails g rails_highcharts:install
-
-in footer layout
-
-    $(document).ready(function(){
-      <%= javascript_include_tag :highcharts  %>
-      <%= yield :javascript %>
-    });
-
-in our controller:
-
-    # Create a pie chart
-    browser_data = [
-      {:name => 'Safari',               :y => 3.57,     :identifier => 'applewebkit'},
-      {:name => 'Firefox',              :y => 22.32,    :identifier => 'gecko'}, 
-      {:name => 'Internet Explorer',    :y => 56.9,     :identifier => 'msie'}, 
-      {:name => 'Other',                :y => 17.21}
-    ]
  
-    user_agent = request.env['HTTP_USER_AGENT'].downcase
+Usage in Controller:
  
-    # determine the users browser and pull that piece of the pie chart
-    browser_data.each do |browser|
-      if user_agent.index(browser[:identifier].to_s)
-        browser[:sliced] = true
- 
-        # some browsers will match more than one identifier, stop looking as soon as one is found
-        break;
+     @h = HighChart.new('graph') do |f|
+        f.series(:name=>'John', :data=>[3, 20, 3, 5, 4, 10, 12 ,3, 5,6,7,7,80,9,9])
+        f.series(:name=>'Jane', :data=> [1, 3, 4, 3, 3, 5, 4,-46,7,8,8,9,9,0,0,9] )
       end
-    end
+
+Without overriding entire option , (only change a specific option index):
  
-    # format the labels that show up on the chart
-    pie_label_formatter = '
-      function() {
-        if (this.y > 15) return this.point.name;
-      }'
+     @h = HighChart.new('graph') do |f|
+      .....
+          f.options[:chart][:defaultSeriesType] = "area"
+          f.options[:chart][:inverted] = true
+          f.options[:legend][:layout] = "horizontal"
+          f.options[:x_axis][:categories] = ["uno" ,"dos" , "tres" , "cuatro"]
+     ......
+
+Overriding entire option:
  
-    # format the tooltips
-    pie_tooltip_formatter = '
-      function() {
-        return "<strong>" + this.point.name + "</strong>: " + this.y + " %";
-      }'
+     @h = HighChart.new('graph') do |f|
+       .....
+          f.x_axis(:categories => @days.reverse! , :labels=>{:rotation=>-45 , :align => 'right'})
+          f.chart({:defaultSeriesType=>"spline" , :renderTo => "myRenderArea" , :inverted => true})
+       .....
+
+Usage in layout:
+ 
+    <%= javascript_include_tag :highcharts %> 
+    <!--[if IE]> <%= javascript_include_tag :ie_high_charts %> <![endif]-->
+ 
+Usage in view:
  
-    @pie_chart = 
-        RailsHighcharts.pie({
-        :chart => {
-              :renderTo => "pie-chart-container",
-              :margin => [50, 30, 0, 30]
-            },
-            :credits => {
-              :enabled => true,
-              :href => 'http://marketshare.hitslink.com/browser-market-share.aspx?qprid=3',
-              :text => 'Data provided by NETMARKETSHARE'
-            },
-            :plotOptions => {
-              :pie => {
-                :dataLabels => {
-                  :formatter => pie_label_formatter, 
-                  :style => {
-                    :textShadow => '#000000 1px 1px 2px'
-                  }
-                }
-              }
-            },
-          :series => [
-                {
-                    :type => 'pie',
-                    :data => browser_data
-                }
-            ],
-            :subtitle => {
-              :text => 'January 2010'
-            },
-            :title => {
-              :text => 'Browser Market Share'
-            },
-            :tooltip => {
-              :formatter => pie_tooltip_formatter
-            },
-        })
+    <%= high_chart("my_id", @h) %>
+
+Passing formatting options in the view to the helper block , because all the helper options declared in the controller are converted in strict/valid json (quoted key); so we need to extend the json object with some js.
  
-in your views:
+      <% high_chart("my_id", @h) do |c| %>
+            <%= "options.tooltip.formatter = function() { return '<b>HEY!!!'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y +' units';}" %>
+            <%= "options.xAxis.labels.formatter = function() { return 'ho';}" %>
+            <%= "options.yAxis.labels.formatter = function() { return 'hey';}" %>
+       <%end %> 
+
+Option reference:
  
-    <!-- container to hold the pie chart -->
-    <div id="pie-chart-container" class="chart-container"></div>
+     http://www.highcharts.com/ref/
+
+HighCharts License:
  
-    <% content_for :javascript do %>
-        <%= @pie_chart %>
-    <% end %>
+     http://www.highcharts.com/license

data/app/helpers/rails_highcharts/rails_highcharts_helper.rb

@@ -0,0 +1,41 @@
+module RailsHighchartsHelper
+  # ActiveSupport::JSON.unquote_hash_key_identifiers = false
+  def high_chart(placeholder, object  , &block)
+    object.html_options.merge!({:id=>placeholder})
+    object.options[:chart][:renderTo] = placeholder
+    high_graph(placeholder, object, &block).concat(content_tag("div", "", object.html_options))
+  end
+
+  def high_graph(placeholder, object, &block)
+    graph =<<-EOJS
+    <script type="text/javascript">
+    jQuery(function() {
+      // 1. Define JSON options
+      var options = { chart:       #{object.options[:chart].to_json},
+                      title:       #{object.options[:title].to_json},
+                      legend:      #{object.options[:legend].to_json},
+                      xAxis:       #{object.options[:x_axis].to_json},
+                      yAxis:       #{object.options[:y_axis].to_json},
+                      tooltip:     #{object.options[:tooltip].to_json},
+                      credits:     #{object.options[:credits].to_json},
+                      plotOptions: #{object.options[:plot_options].to_json},
+                      series:      #{object.data.to_json},
+                      subtitle:    #{object.options[:subtitle].to_json}
+      };
+
+      // 2. Add callbacks (non-JSON compliant)
+      #{capture(&block) if block_given?}
+      // 3. Build the chart
+      var chart = new Highcharts.Chart(options);
+      });
+      </script>
+      EOJS
+      if defined?(raw) &&  Rails.version.to_i >= 3
+        return raw(graph) 
+      else
+        return graph unless block_given?
+        concat graph
+      end
+    end
+
+  end #RailsHighchartsHelper

data/lib/generators/rails_highcharts/install_generator.rb

@@ -13,7 +13,11 @@ module RailsHighcharts
       source_root File.expand_path('../media', __FILE__)
       desc "Copies media files to main project"
       def copy_media_files
-        copy_file "../media/javascripts/highcharts.js",  "public/javascripts/highcharts/highcharts.js"
+        js_files = %w|highcharts.js excanvas.compiled.js|
+
+        js_files.each do |js|
+          copy_file "../media/javascripts/#{js}",  "public/javascripts/highcharts/#{js}"
+        end
       end
     end
 

data/lib/generators/rails_highcharts/media/javascripts/excanvas.compiled.js

@@ -0,0 +1,35 @@
+// Copyright 2006 Google Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+document.createElement("canvas").getContext||(function(){var s=Math,j=s.round,F=s.sin,G=s.cos,V=s.abs,W=s.sqrt,k=10,v=k/2;function X(){return this.context_||(this.context_=new H(this))}var L=Array.prototype.slice;function Y(b,a){var c=L.call(arguments,2);return function(){return b.apply(a,c.concat(L.call(arguments)))}}var M={init:function(b){if(/MSIE/.test(navigator.userAgent)&&!window.opera){var a=b||document;a.createElement("canvas");a.attachEvent("onreadystatechange",Y(this.init_,this,a))}},init_:function(b){b.namespaces.g_vml_||
+b.namespaces.add("g_vml_","urn:schemas-microsoft-com:vml","#default#VML");b.namespaces.g_o_||b.namespaces.add("g_o_","urn:schemas-microsoft-com:office:office","#default#VML");if(!b.styleSheets.ex_canvas_){var a=b.createStyleSheet();a.owningElement.id="ex_canvas_";a.cssText="canvas{display:inline-block;overflow:hidden;text-align:left;width:300px;height:150px}g_vml_\\:*{behavior:url(#default#VML)}g_o_\\:*{behavior:url(#default#VML)}"}var c=b.getElementsByTagName("canvas"),d=0;for(;d<c.length;d++)this.initElement(c[d])},
+initElement:function(b){if(!b.getContext){b.getContext=X;b.innerHTML="";b.attachEvent("onpropertychange",Z);b.attachEvent("onresize",$);var a=b.attributes;if(a.width&&a.width.specified)b.style.width=a.width.nodeValue+"px";else b.width=b.clientWidth;if(a.height&&a.height.specified)b.style.height=a.height.nodeValue+"px";else b.height=b.clientHeight}return b}};function Z(b){var a=b.srcElement;switch(b.propertyName){case "width":a.style.width=a.attributes.width.nodeValue+"px";a.getContext().clearRect();
+break;case "height":a.style.height=a.attributes.height.nodeValue+"px";a.getContext().clearRect();break}}function $(b){var a=b.srcElement;if(a.firstChild){a.firstChild.style.width=a.clientWidth+"px";a.firstChild.style.height=a.clientHeight+"px"}}M.init();var N=[],B=0;for(;B<16;B++){var C=0;for(;C<16;C++)N[B*16+C]=B.toString(16)+C.toString(16)}function I(){return[[1,0,0],[0,1,0],[0,0,1]]}function y(b,a){var c=I(),d=0;for(;d<3;d++){var f=0;for(;f<3;f++){var h=0,g=0;for(;g<3;g++)h+=b[d][g]*a[g][f];c[d][f]=
+h}}return c}function O(b,a){a.fillStyle=b.fillStyle;a.lineCap=b.lineCap;a.lineJoin=b.lineJoin;a.lineWidth=b.lineWidth;a.miterLimit=b.miterLimit;a.shadowBlur=b.shadowBlur;a.shadowColor=b.shadowColor;a.shadowOffsetX=b.shadowOffsetX;a.shadowOffsetY=b.shadowOffsetY;a.strokeStyle=b.strokeStyle;a.globalAlpha=b.globalAlpha;a.arcScaleX_=b.arcScaleX_;a.arcScaleY_=b.arcScaleY_;a.lineScale_=b.lineScale_}function P(b){var a,c=1;b=String(b);if(b.substring(0,3)=="rgb"){var d=b.indexOf("(",3),f=b.indexOf(")",d+
+1),h=b.substring(d+1,f).split(",");a="#";var g=0;for(;g<3;g++)a+=N[Number(h[g])];if(h.length==4&&b.substr(3,1)=="a")c=h[3]}else a=b;return{color:a,alpha:c}}function aa(b){switch(b){case "butt":return"flat";case "round":return"round";case "square":default:return"square"}}function H(b){this.m_=I();this.mStack_=[];this.aStack_=[];this.currentPath_=[];this.fillStyle=this.strokeStyle="#000";this.lineWidth=1;this.lineJoin="miter";this.lineCap="butt";this.miterLimit=k*1;this.globalAlpha=1;this.canvas=b;
+var a=b.ownerDocument.createElement("div");a.style.width=b.clientWidth+"px";a.style.height=b.clientHeight+"px";a.style.overflow="hidden";a.style.position="absolute";b.appendChild(a);this.element_=a;this.lineScale_=this.arcScaleY_=this.arcScaleX_=1}var i=H.prototype;i.clearRect=function(){this.element_.innerHTML=""};i.beginPath=function(){this.currentPath_=[]};i.moveTo=function(b,a){var c=this.getCoords_(b,a);this.currentPath_.push({type:"moveTo",x:c.x,y:c.y});this.currentX_=c.x;this.currentY_=c.y};
+i.lineTo=function(b,a){var c=this.getCoords_(b,a);this.currentPath_.push({type:"lineTo",x:c.x,y:c.y});this.currentX_=c.x;this.currentY_=c.y};i.bezierCurveTo=function(b,a,c,d,f,h){var g=this.getCoords_(f,h),l=this.getCoords_(b,a),e=this.getCoords_(c,d);Q(this,l,e,g)};function Q(b,a,c,d){b.currentPath_.push({type:"bezierCurveTo",cp1x:a.x,cp1y:a.y,cp2x:c.x,cp2y:c.y,x:d.x,y:d.y});b.currentX_=d.x;b.currentY_=d.y}i.quadraticCurveTo=function(b,a,c,d){var f=this.getCoords_(b,a),h=this.getCoords_(c,d),g={x:this.currentX_+
+0.6666666666666666*(f.x-this.currentX_),y:this.currentY_+0.6666666666666666*(f.y-this.currentY_)};Q(this,g,{x:g.x+(h.x-this.currentX_)/3,y:g.y+(h.y-this.currentY_)/3},h)};i.arc=function(b,a,c,d,f,h){c*=k;var g=h?"at":"wa",l=b+G(d)*c-v,e=a+F(d)*c-v,m=b+G(f)*c-v,r=a+F(f)*c-v;if(l==m&&!h)l+=0.125;var n=this.getCoords_(b,a),o=this.getCoords_(l,e),q=this.getCoords_(m,r);this.currentPath_.push({type:g,x:n.x,y:n.y,radius:c,xStart:o.x,yStart:o.y,xEnd:q.x,yEnd:q.y})};i.rect=function(b,a,c,d){this.moveTo(b,
+a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath()};i.strokeRect=function(b,a,c,d){var f=this.currentPath_;this.beginPath();this.moveTo(b,a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath();this.stroke();this.currentPath_=f};i.fillRect=function(b,a,c,d){var f=this.currentPath_;this.beginPath();this.moveTo(b,a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath();this.fill();this.currentPath_=f};i.createLinearGradient=function(b,
+a,c,d){var f=new D("gradient");f.x0_=b;f.y0_=a;f.x1_=c;f.y1_=d;return f};i.createRadialGradient=function(b,a,c,d,f,h){var g=new D("gradientradial");g.x0_=b;g.y0_=a;g.r0_=c;g.x1_=d;g.y1_=f;g.r1_=h;return g};i.drawImage=function(b){var a,c,d,f,h,g,l,e,m=b.runtimeStyle.width,r=b.runtimeStyle.height;b.runtimeStyle.width="auto";b.runtimeStyle.height="auto";var n=b.width,o=b.height;b.runtimeStyle.width=m;b.runtimeStyle.height=r;if(arguments.length==3){a=arguments[1];c=arguments[2];h=g=0;l=d=n;e=f=o}else if(arguments.length==
+5){a=arguments[1];c=arguments[2];d=arguments[3];f=arguments[4];h=g=0;l=n;e=o}else if(arguments.length==9){h=arguments[1];g=arguments[2];l=arguments[3];e=arguments[4];a=arguments[5];c=arguments[6];d=arguments[7];f=arguments[8]}else throw Error("Invalid number of arguments");var q=this.getCoords_(a,c),t=[];t.push(" <g_vml_:group",' coordsize="',k*10,",",k*10,'"',' coordorigin="0,0"',' style="width:',10,"px;height:",10,"px;position:absolute;");if(this.m_[0][0]!=1||this.m_[0][1]){var E=[];E.push("M11=",
+this.m_[0][0],",","M12=",this.m_[1][0],",","M21=",this.m_[0][1],",","M22=",this.m_[1][1],",","Dx=",j(q.x/k),",","Dy=",j(q.y/k),"");var p=q,z=this.getCoords_(a+d,c),w=this.getCoords_(a,c+f),x=this.getCoords_(a+d,c+f);p.x=s.max(p.x,z.x,w.x,x.x);p.y=s.max(p.y,z.y,w.y,x.y);t.push("padding:0 ",j(p.x/k),"px ",j(p.y/k),"px 0;filter:progid:DXImageTransform.Microsoft.Matrix(",E.join(""),", sizingmethod='clip');")}else t.push("top:",j(q.y/k),"px;left:",j(q.x/k),"px;");t.push(' ">','<g_vml_:image src="',b.src,
+'"',' style="width:',k*d,"px;"," height:",k*f,'px;"',' cropleft="',h/n,'"',' croptop="',g/o,'"',' cropright="',(n-h-l)/n,'"',' cropbottom="',(o-g-e)/o,'"'," />","</g_vml_:group>");this.element_.insertAdjacentHTML("BeforeEnd",t.join(""))};i.stroke=function(b){var a=[],c=P(b?this.fillStyle:this.strokeStyle),d=c.color,f=c.alpha*this.globalAlpha;a.push("<g_vml_:shape",' filled="',!!b,'"',' style="position:absolute;width:',10,"px;height:",10,'px;"',' coordorigin="0 0" coordsize="',k*10," ",k*10,'"',' stroked="',
+!b,'"',' path="');var h={x:null,y:null},g={x:null,y:null},l=0;for(;l<this.currentPath_.length;l++){var e=this.currentPath_[l];switch(e.type){case "moveTo":a.push(" m ",j(e.x),",",j(e.y));break;case "lineTo":a.push(" l ",j(e.x),",",j(e.y));break;case "close":a.push(" x ");e=null;break;case "bezierCurveTo":a.push(" c ",j(e.cp1x),",",j(e.cp1y),",",j(e.cp2x),",",j(e.cp2y),",",j(e.x),",",j(e.y));break;case "at":case "wa":a.push(" ",e.type," ",j(e.x-this.arcScaleX_*e.radius),",",j(e.y-this.arcScaleY_*e.radius),
+" ",j(e.x+this.arcScaleX_*e.radius),",",j(e.y+this.arcScaleY_*e.radius)," ",j(e.xStart),",",j(e.yStart)," ",j(e.xEnd),",",j(e.yEnd));break}if(e){if(h.x==null||e.x<h.x)h.x=e.x;if(g.x==null||e.x>g.x)g.x=e.x;if(h.y==null||e.y<h.y)h.y=e.y;if(g.y==null||e.y>g.y)g.y=e.y}}a.push(' ">');if(b)if(typeof this.fillStyle=="object"){var m=this.fillStyle,r=0,n={x:0,y:0},o=0,q=1;if(m.type_=="gradient"){var t=m.x1_/this.arcScaleX_,E=m.y1_/this.arcScaleY_,p=this.getCoords_(m.x0_/this.arcScaleX_,m.y0_/this.arcScaleY_),
+z=this.getCoords_(t,E);r=Math.atan2(z.x-p.x,z.y-p.y)*180/Math.PI;if(r<0)r+=360;if(r<1.0E-6)r=0}else{var p=this.getCoords_(m.x0_,m.y0_),w=g.x-h.x,x=g.y-h.y;n={x:(p.x-h.x)/w,y:(p.y-h.y)/x};w/=this.arcScaleX_*k;x/=this.arcScaleY_*k;var R=s.max(w,x);o=2*m.r0_/R;q=2*m.r1_/R-o}var u=m.colors_;u.sort(function(ba,ca){return ba.offset-ca.offset});var J=u.length,da=u[0].color,ea=u[J-1].color,fa=u[0].alpha*this.globalAlpha,ga=u[J-1].alpha*this.globalAlpha,S=[],l=0;for(;l<J;l++){var T=u[l];S.push(T.offset*q+
+o+" "+T.color)}a.push('<g_vml_:fill type="',m.type_,'"',' method="none" focus="100%"',' color="',da,'"',' color2="',ea,'"',' colors="',S.join(","),'"',' opacity="',ga,'"',' g_o_:opacity2="',fa,'"',' angle="',r,'"',' focusposition="',n.x,",",n.y,'" />')}else a.push('<g_vml_:fill color="',d,'" opacity="',f,'" />');else{var K=this.lineScale_*this.lineWidth;if(K<1)f*=K;a.push("<g_vml_:stroke",' opacity="',f,'"',' joinstyle="',this.lineJoin,'"',' miterlimit="',this.miterLimit,'"',' endcap="',aa(this.lineCap),
+'"',' weight="',K,'px"',' color="',d,'" />')}a.push("</g_vml_:shape>");this.element_.insertAdjacentHTML("beforeEnd",a.join(""))};i.fill=function(){this.stroke(true)};i.closePath=function(){this.currentPath_.push({type:"close"})};i.getCoords_=function(b,a){var c=this.m_;return{x:k*(b*c[0][0]+a*c[1][0]+c[2][0])-v,y:k*(b*c[0][1]+a*c[1][1]+c[2][1])-v}};i.save=function(){var b={};O(this,b);this.aStack_.push(b);this.mStack_.push(this.m_);this.m_=y(I(),this.m_)};i.restore=function(){O(this.aStack_.pop(),
+this);this.m_=this.mStack_.pop()};function ha(b){var a=0;for(;a<3;a++){var c=0;for(;c<2;c++)if(!isFinite(b[a][c])||isNaN(b[a][c]))return false}return true}function A(b,a,c){if(!!ha(a)){b.m_=a;if(c)b.lineScale_=W(V(a[0][0]*a[1][1]-a[0][1]*a[1][0]))}}i.translate=function(b,a){A(this,y([[1,0,0],[0,1,0],[b,a,1]],this.m_),false)};i.rotate=function(b){var a=G(b),c=F(b);A(this,y([[a,c,0],[-c,a,0],[0,0,1]],this.m_),false)};i.scale=function(b,a){this.arcScaleX_*=b;this.arcScaleY_*=a;A(this,y([[b,0,0],[0,a,
+0],[0,0,1]],this.m_),true)};i.transform=function(b,a,c,d,f,h){A(this,y([[b,a,0],[c,d,0],[f,h,1]],this.m_),true)};i.setTransform=function(b,a,c,d,f,h){A(this,[[b,a,0],[c,d,0],[f,h,1]],true)};i.clip=function(){};i.arcTo=function(){};i.createPattern=function(){return new U};function D(b){this.type_=b;this.r1_=this.y1_=this.x1_=this.r0_=this.y0_=this.x0_=0;this.colors_=[]}D.prototype.addColorStop=function(b,a){a=P(a);this.colors_.push({offset:b,color:a.color,alpha:a.alpha})};function U(){}G_vmlCanvasManager=
+M;CanvasRenderingContext2D=H;CanvasGradient=D;CanvasPattern=U})();

data/lib/rails_highcharts/engine.rb

@@ -1,13 +1,19 @@
 require 'rails'
+require File.dirname(__FILE__) + "/../../app/helpers/rails_highcharts/rails_highcharts_helper"
 
 module RailsHighcharts
   class Engine < Rails::Engine
 
+    config.to_prepare do
+      ApplicationController.helper(RailsHighchartsHelper)
+    end
+
     # ========================================
     # =   javascript_include_tag :highcharts =
     # ========================================
     config.before_initialize do
-      config.action_view.javascript_expansions[:highcharts] = %w(highcharts/highcharts.js)
+      config.action_view.javascript_expansions[:highcharts]     = %w|highcharts/highcharts.js|
+      config.action_view.javascript_expansions[:ie_high_charts] = %w|highcharts/excanvas.compiled.js|
     end
 
   end

data/lib/rails_highcharts/rails_highcharts.rb

@@ -0,0 +1,83 @@
+class RailsHighcharts
+
+    CANVAS_DEFAULT_HTML_OPTIONS = {:style => "height: 300px, width:615px" }
+    SERIES_OPTIONS = %w(lines points bars shadowSize colors)
+
+    attr_accessor :data, :options, :placeholder, :html_options
+    alias  :canvas :placeholder
+    alias  :canvas= :placeholder=
+
+
+    def initialize(canvas = nil, html_opts = {})
+
+      @collection_filter = nil
+      self.tap do |high_chart|
+        high_chart.data       ||= []
+        high_chart.options    ||= {}
+        high_chart.defaults_options
+        high_chart.html_options = html_opts.reverse_merge(CANVAS_DEFAULT_HTML_OPTIONS)
+        high_chart.canvas       = canvas if canvas
+        yield high_chart if block_given?
+      end
+    end
+
+    # title: legend:  xAxis: yAxis: tooltip: credits: :plotOptions
+
+    def defaults_options
+      self.title({ :text=>"example test title from plugin"})
+      self.legend({:layout=>"vertical", :style=>{:position=>'absolute', :bottom=>'auto', :left=>'150px', :top=>'150px'}, :borderWidth=> 1, :backgroundColor=>'#FFFFFF'}) 
+      self.x_axis({:categories => ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
+                   :plotBands  => [{ :from=> 6.0,:to=> 6.5,:color=> 'rgba(68, 170, 213, .2)'}],
+                   :labels     =>{ :align=>'right',:rotation=>45 }
+      })
+      self.y_axis({:title=> {:text=> 'Fruit units'}, :labels=>{:align=>'right'} })
+      self.tooltip({ :enabled=>true })
+      self.credits({:enabled => false})
+      self.plot_options({ :areaspline => {:fillOpacity => 0.5}})
+      self.chart({:defaultSeriesType=>"areaspline" , :renderTo => nil})
+      self.subtitle({})
+    end
+
+
+    # Pass other methods through to the javascript high_chart object.
+    #
+    # For instance: <tt>high_chart.grid(:color => "#699")</tt>
+    #
+    def method_missing(meth, opts = {})
+      merge_options meth, opts
+    end
+
+    # Add a simple series to the graph:
+    # 
+    #   data = [[0,5], [1,5], [2,5]]
+    #   @high_chart.series :name=>'Updated', :data=>data
+    #   @high_chart.series :name=>'Updated', :data=>[5, 1, 6, 1, 5, 4, 9]
+    #
+    def series(opts = {})
+      @data ||= []
+      if opts.blank?
+        @data << series_options.merge(:name => label, :data => d)
+      else
+        @data << opts.merge(:name => opts[:name], :data => opts[:data])
+      end
+    end
+
+  private
+    def series_options
+      @options.reject {|k,v| SERIES_OPTIONS.include?(k.to_s) == false}
+    end
+
+    def merge_options(name, opts)
+      @options.merge!  name => opts
+    end
+
+    def arguments_to_options(args)
+      if args.blank? 
+        {:show => true}
+      elsif args.is_a? Array
+        args.first
+      else
+        args
+      end
+    end
+end #RailsHighcharts

data/lib/rails_highcharts/version.rb

@@ -1,3 +1,3 @@
 module RailsHighcharts
-  VERSION = "0.0.1.beta1"
+  VERSION = "0.0.1.beta2"
 end

data/lib/rails_highcharts.rb

@@ -2,334 +2,8 @@ require "rails"
 require "rails_highcharts/engine"
 require "rails_highcharts/version"
 require "rails_highcharts/hash_extend"
+require "rails_highcharts/rails_highcharts"
 
-class RailsHighcharts
-
-  @@types = ['area', 'areaspline', 'bar', 'column', 'line', 'pie', 'scatter', 'spline']
-  @@date_format = "<strong>%A</strong><br /> %m/%d/%Y"
-  
-	attr_accessor :chart, :colors, :credits, :labels, :lang, :legend, :plotOptions, :point,
-	              :series, :subtitle, :symbols, :title, :toolbar, :tooltip, :x_axis, :y_axis
-
-  def self.method_missing(m, options={})
-    format = options[:format] || 'jquery'
-    options.delete(:format)
-    
-    # create the chart and return it in the format requested
-    if @@types.include?(m.to_s)  
-      chart = new(options.merge!({:type => m}))
-      chart.send(format)
-    else
-      "#{m} is not a supported chart format, please use one of the following: #{supported_types}."
-    end
-  end
-
-  def initialize(options={})
-    # override highcharts defaults
-    @credits = {
-      :enabled => false
-    }
-    @legend = {
-      :layout => 'vertical', 
-      :style => {
-         :left => 'auto', 
-         :bottom => 'auto', 
-         :right => '50px', 
-         :top => '75px'
-      }
-    }
-    
-    # IE7 displays 'null' without this
-    @title = {
-      :text => ""
-    }
-    @x_axis = {
-      :title => {
-        :text => ""
-      }
-    }
-    @y_axis = {
-      :title => {
-        :text => ""
-      }
-    }
-    
-    # define defaults based on chart type
-    case options[:type].to_s
-    when 'area'
-      @chart = {
-        :defaultSeriesType => 'area',
-        :margin => [50, 200, 60, 80]
-      }
-    when 'areaspline'
-      @chart = {
-        :defaultSeriesType => 'areaspline',
-        :margin => [50, 200, 60, 80]
-      }
-    when 'bar'
-      @chart = {
-        :inverted => true, 
-        :defaultSeriesType => 'bar', 
-        :margin => [50, 50, 50, 100]
-      }
-      @plotOptions = {
-        :bar => {
-          :showInLegend => false,
-          :dataLabels => {
-            :y => -5,
-            :enabled => true, 
-            :color => '#666666'
-          }
-        }
-      }
-    when 'column'
-      @chart = {
-        :defaultSeriesType => 'column', 
-        :margin => [50, 50, 50, 100]
-      }
-      @plotOptions = {
-        :column => {
-          :showInLegend => false
-        }
-      }
-    when 'line'
-      @chart = {
-        :defaultSeriesType => 'line',
-        :margin => [50, 200, 60, 80]
-      }
-    when 'pie'
-      @chart = {
-        :margin => [10, 10, 10, 10]
-      }
-      @plotOptions = {
-        :pie => {
-          :dataLabels => {
-            :enabled => true, 
-            :color => 'white', 
-            :style => {:font => '10pt Helvetica'}
-          }
-        }
-      }
-    when 'scatter'
-      @chart = {
-        :defaultSeriesType => 'scatter',
-        :margin => [50, 200, 60, 80]
-      }
-      @plotOptions = {
-        :scatter => {
-          :marker => {
-            :radius => 5,
-            :states => {
-              :hover => {
-                :enabled => true,
-                :lineColor => '#666666'
-              }
-            }
-          }
-        }
-      }
-    when 'spline'
-      @chart = {
-        :defaultSeriesType => 'spline',
-        :margin => [50, 200, 60, 80]
-      }
-    end
-    
-    # set the options from provided hash
-    options.each do |attribute, value|
-      if value.is_a?(Hash)
-        # if provided a hash attempt to merge with defaults, otherwise just override defaults
-        send("#{attribute}=", (send(attribute) || {}).merge_recursive(value)) if self.respond_to?("#{attribute}=")
-      else
-        send("#{attribute.to_s}=", value) if self.respond_to?("#{attribute}=")
-      end
-    end  
-  end
-  
-  def self.supported_types
-    @@types.join(' ')
-  end
-  
-  def jquery
-    query_params = instance_variables.sort.map do |var|
-      case var.to_s
-        
-      when '@chart'
-        set_chart
-      when '@colors'
-        set_colors if @colors.is_a?(Array)
-      when '@credits'
-        set_credits
-      when '@labels'
-        set_labels
-      when '@lang'
-        set_lang
-      when '@legend'
-        set_legend
-      when '@plotOptions'
-        set_plotOptions
-      when '@point'
-        set_point
-      when '@series'
-        set_series
-      when '@subtitle'
-        set_subtitle
-      when '@symbols'
-        set_symbols
-      when '@title'
-        set_title
-      when '@toolbar'
-        set_toolbar
-      when '@tooltip'
-        set_tooltip
-      when '@x_axis'
-        set_x_axis
-      when '@y_axis'
-        set_y_axis
-      end
-    end.compact
-
-    "var chart = new Highcharts.Chart({ 
-      #{query_params.join(",\n")} 
-    });"
-  end
-
-  private
-    def set_chart
-      "chart: {
-        #{concatenate_attributes(@chart)}
-      }"
-    end
-    
-    def set_colors
-      "colors: [#{@colors.join(", ")}]"
-    end
-    
-    def set_credits
-      "credits: {
-        #{concatenate_attributes(@credits)}
-      }"
-    end
-    
-    def set_labels
-      "labels: {
-        #{concatenate_attributes(@labels)}
-      }"
-    end
-    
-    def set_lang
-      "lang: {
-        #{concatenate_attributes(@lang)}
-      }"
-    end
-    
-    def set_legend
-      "legend: {
-      #{concatenate_attributes(@legend)}
-			}"
-    end
-    
-    def set_plotOptions
-      "plotOptions: {
-        #{concatenate_attributes(@plotOptions)}
-			}"
-    end
-    
-    def set_point
-      "point: {
-        #{concatenate_attributes(@point)}
-			}"
-    end
-    
-    def set_series
-        attrs = Array.new
-        @series.each do |series_hash|
-          ser = Array.new
-          series_hash.each do |key, value|
-            if key == 'data'
-              ser << "[#{concatenate_attributes(value)}]"
-            else
-              ser << "#{key}: #{typed_print(value)}"
-            end
-          end
-
-          attrs << "{#{ser.join(",\n")}}";
-        end
-      
-      "series: [
-        #{attrs.join(",\n") + "\n"}
-			]"
-    end
-    
-    def set_subtitle
-      "subtitle: {
-        #{concatenate_attributes(@subtitle)}
-			}"
-    end
-    
-    def set_symbols
-      "symbols: [#{@symbols.join(", ")}]"
-    end
-    
-    def set_title    
-      "title: {  
-        #{concatenate_attributes(@title)}
-      }"
-    end
-    
-    def set_toolbar   
-      "toolbar: {  
-        #{concatenate_attributes(@toolbar)}
-      }"
-    end
-    
-    def set_tooltip   
-      "tooltip: {  
-        #{concatenate_attributes(@tooltip)}
-      }"
-    end
-    
-    def set_x_axis   
-      "xAxis: {  
-        #{concatenate_attributes(@x_axis)}
-      }"
-    end
-    
-    def set_y_axis   
-      "yAxis: {  
-        #{concatenate_attributes(@y_axis)}
-      }"
-    end
-    
-    # generic method that accepts a hash and concatenates its key/value pairs
-    def concatenate_attributes(attr)
-      attrs = Array.new
-      attr.each do |key, value|
-        if value.is_a?(Hash)
-          attrs << "#{key}: {#{concatenate_attributes(value)}}"
-        else
-          attrs << "#{key}: #{typed_print(value)}"
-        end
-      end
-      
-      attrs.join(",\n") + "\n"
-    end
-    
-    # method determines if value needs to be surrounded in single quotes
-    def typed_print(string)
-      if string.is_a?(Hash)
-        values = Array.new
-        string.each { |key, value| values << "#{key}: #{typed_print(value)}"}
-        "{" + values.join(", ") + "}"
-      elsif string.is_a?(Array)
-        "[" + string.map { |e| typed_print(e) } .join(", ") + "]"
-      elsif string.is_a?(Date)
-        "'#{string.strftime(@@date_format)}'"
-      elsif string.is_a?(String) && string != 'null' && string.strip[0..7] != 'function'
-        "'" + string.gsub(/['"\\\x0]/,'\\\\\0') + "'"
-      else
-        string
-      end
-    end
-
+module RailsHighcharts
+  # ... ...
 end #RailsHighcharts

data/spec/rails_highcharts_helper_spec.rb

@@ -0,0 +1,51 @@
+# coding: utf-8
+require File.dirname(__FILE__) + '/spec_helper'
+require 'pp'
+
+describe RailsHighchartsHelper do  
+  include RailsHighchartsHelper
+
+  before(:each) do
+    @class       = "stylin"
+    @placeholder = "placeholder"
+    @chart        = RailsHighcharts.new(@placeholder)
+    @data        = "data"
+    @options     = "options"
+  end
+  
+  describe "high_chart_helper" do
+    it "should return a div with an id of high_chart object" do
+      hc = RailsHighcharts.new("placeholder", :class => 'stylin')
+      high_chart(hc.placeholder, hc).should have_selector('div', :id => hc.placeholder, :class => 'stylin')
+    end
+
+    it "should return a script" do
+      hc = RailsHighcharts.new("placeholder")
+      high_chart(hc.placeholder, hc).should have_selector('script')
+    end
+  end
+   
+  describe "high_chart_graph" do
+    describe "ready function" do
+      it "should be a javascript script" do
+        high_chart(@placeholder, @chart).should have_selector('script', :type => 'text/javascript')
+        high_chart(@placeholder, @chart).should match(/\}\s*\)\s*;/)
+      end
+
+      it "should generate generate ready function (no conflict with prototype)" do
+        high_chart(@placeholder, @chart).should match(/jQuery\(function\(\)\s*\{/)
+      end
+    end
+    describe "initialize HighChart" do
+      it "should set Chart data" do
+        high_chart(@placeholder, @chart).should match(/var\s+chart\s+=\s+new\s+Highcharts.Chart/)
+      end       
+
+      it "should set chart renderTo" do  
+        high_chart(@placeholder, @chart).should match(/\"renderTo\":\"placeholder\"/)
+      end
+
+    end
+  end
+  
+end

data/spec/rails_highcharts_spec.rb

@@ -0,0 +1,120 @@
+require File.dirname(__FILE__) + '/spec_helper'
+
+Record = Struct.new(:frequency, :amplitude)
+
+
+describe "HighChart" do
+  before(:each) do
+    @collection   = [Record.new(1,15), Record.new(2,30), Record.new(4,40)]
+    @data         = [          [1,15],           [2,30],           [4,40]]
+
+    @placeholder  = "placeholder"
+    @html_options = {:class => "stylin"}
+    @options      = {:bars => {:show => true}}
+
+    @flot         = RailsHighcharts.new(@placeholder, @html_options) {|chart| chart.options = @options }
+  end
+  
+  
+  
+  # this is almost all flotomatic stuff
+  describe "initialization" do
+    it "should take an optional 'placeholder' argument" do
+       RailsHighcharts.new(@placeholder).placeholder.should == @placeholder
+       RailsHighcharts.new.placeholder.should == nil
+     end
+     
+    it "should take an optional html_options argument (defaulting to 300px height)" do
+       RailsHighcharts.new(@html_options).placeholder.should == @html_options
+     end
+     
+    it "should set options by default" do
+       RailsHighcharts.new.options.should == {
+         :subtitle=>{}, 
+         :chart=>{:renderTo=>nil, :defaultSeriesType=>"areaspline"}, 
+         :plot_options=>{:areaspline=>{:fillOpacity=>0.5}}, 
+         :legend=>{
+           :borderWidth=>1, 
+           :backgroundColor=>"#FFFFFF", 
+           :layout=>"vertical", 
+           :style=>{:top=>"150px", 
+             :left=>"150px", :position=>"absolute", :bottom=>"auto"}
+             }, 
+             :tooltip=>{:enabled=>true}, 
+             :x_axis=>{
+               :categories=>["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"], 
+               :plotBands=>[{:to=>6.5, :from=>6.0, :color=>"rgba(68, 170, 213, .2)"}], 
+               :labels=>{:align=>"right", :rotation=>45}}, 
+               :y_axis=>{:title=>{:text=>"Fruit units"}, 
+               :labels=>{:align=>"right"}}, 
+               :title=>{:text=>"example test title from plugin"}, 
+               :credits=>{:enabled=>false}
+               }          
+           
+     end
+     
+    it "should set data empty by default" do
+     RailsHighcharts.new.data.should == []
+    end
+
+    it "should take a block setting attributes" do
+     chart = RailsHighcharts.new {|f| f.data = @data ; f.options = @options }
+     chart.data.should == @data
+     chart.options.should == @options
+    end
+     
+    it "should take a block setting attributes" do
+      chart = RailsHighcharts.new {|f|  f.options[:legend][:layout] = "horizontal" }
+      chart.options[:legend][:layout].should == "horizontal"
+    end
+      
+    it "should change a block data without overriding options" do
+      chart = RailsHighcharts.new('graph') do |f|
+          f.series(:name=>'John', :data=>[3, 20])
+          f.series(:name=>'Jane',:data=> [1, 3] )        
+          # without overriding 
+          f.options[:chart][:defaultSeriesType] = "area"
+          f.options[:chart][:inverted] = true
+          f.options[:legend][:layout] = "horizontal"
+          f.options[:x_axis][:categories] = ["uno" ,"dos" , "tres" , "cuatro"]
+      end
+      chart.data.should ==  [{:name=>"John", :data=>[3, 20]}, {:name=>"Jane", :data=>[1, 3]}]
+      chart.options[:legend][:layout].should == "horizontal"
+      chart.options[:x_axis][:categories].should == ["uno" ,"dos" , "tres" , "cuatro"]
+      chart.options[:chart][:defaultSeriesType].should == "area"
+      chart.options[:chart][:inverted].should == true
+    end
+    
+    it "should change a block data with overriding entire options" do
+      chart = RailsHighcharts.new('graph') do |f|
+          f.series(:name=>'John', :data=>[3, 20])
+          f.series(:name=>'Jane', :data=>[1, 3] )        
+          f.title({ :text=>"example test title from controller"})
+          # without overriding 
+          f.x_axis(:categories => ["uno" ,"dos" , "tres" , "cuatro"] , :labels=>{:rotation=>-45 , :align => 'right'})
+          f.chart({:defaultSeriesType=>"spline" , :renderTo => "myRenderArea" , :inverted => true})
+      end
+      chart.options[:x_axis][:categories].should == ["uno" ,"dos" , "tres" , "cuatro"]      
+      chart.options[:x_axis][:labels][:rotation].should == -45     
+      chart.options[:x_axis][:labels][:align].should == "right"    
+      chart.options[:chart][:defaultSeriesType].should == "spline"    
+      chart.options[:chart][:renderTo].should == "myRenderArea"    
+      chart.options[:chart][:inverted].should == true    
+    end
+    
+    it "should have subtitles" do
+       chart = RailsHighcharts.new('graph') do |f|
+            f.series(:name=>'John',:data=> [3, 20])
+            f.series(:name=>'Jane', :data=>[1, 3] )        
+            f.title({ :text=>"example test title from controller"})
+            # without overriding 
+            f.x_axis(:categories => ["uno" ,"dos" , "tres" , "cuatro"] , :labels=>{:rotation=>-45 , :align => 'right'})
+            f.chart({:defaultSeriesType=>"spline" , :renderTo => "myRenderArea" , :inverted => true})
+            f.subtitle({:text=>"Bar"})
+        end
+       chart.options[:subtitle][:text].should == "Bar"
+    end
+     
+  end
+
+end

data/spec/spec_helper.rb

@@ -0,0 +1,21 @@
+# coding: utf-8
+require 'rubygems'
+require 'rails'
+require 'active_support'
+require 'actionpack'
+require 'activerecord'
+
+
+require File.expand_path(File.join(File.dirname(__FILE__), '../lib/rails_highcharts/rails_highcharts'))
+require File.dirname(__FILE__) + "/../app/helpers/rails_highcharts/rails_highcharts_helper"
+
+require 'webrat'
+
+Rspec.configure do |config|
+  config.include ActionView::Helpers  
+  config.include Webrat::Matchers
+end
+
+module HighChartsHelper
+  include ActionView::Helpers::TagHelper
+end

metadata

@@ -1,15 +1,15 @@
 --- !ruby/object:Gem::Specification 
 name: rails_highcharts
 version: !ruby/object:Gem::Version 
-  hash: 62196393
+  hash: 62196399
   prerelease: 6
   segments: 
   - 0
   - 0
   - 1
   - beta
-  - 1
-  version: 0.0.1.beta1
+  - 2
+  version: 0.0.1.beta2
 platform: ruby
 authors: 
 - AlexZhang
@@ -36,6 +36,50 @@ dependencies:
         version: 3.0.8
   type: :runtime
   version_requirements: *id001
+- !ruby/object:Gem::Dependency 
+  name: rspec
+  prerelease: false
+  requirement: &id002 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 3
+        segments: 
+        - 2
+        - 0
+        version: "2.0"
+  type: :development
+  version_requirements: *id002
+- !ruby/object:Gem::Dependency 
+  name: rspec-rails
+  prerelease: false
+  requirement: &id003 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 3
+        segments: 
+        - 2
+        - 0
+        version: "2.0"
+  type: :development
+  version_requirements: *id003
+- !ruby/object:Gem::Dependency 
+  name: webrat
+  prerelease: false
+  requirement: &id004 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        hash: 3
+        segments: 
+        - 0
+        version: "0"
+  type: :development
+  version_requirements: *id004
 description: Highcharts for Rails 3
 email: 
 - blackanger.z@gmail.com
@@ -49,12 +93,18 @@ files:
 - Gemfile
 - Rakefile
 - README.md
+- app/helpers/rails_highcharts/rails_highcharts_helper.rb
 - lib/generators/rails_highcharts/install_generator.rb
+- lib/generators/rails_highcharts/media/javascripts/excanvas.compiled.js
 - lib/generators/rails_highcharts/media/javascripts/highcharts.js
 - lib/rails_highcharts/engine.rb
 - lib/rails_highcharts/hash_extend.rb
+- lib/rails_highcharts/rails_highcharts.rb
 - lib/rails_highcharts/version.rb
 - lib/rails_highcharts.rb
+- spec/rails_highcharts_helper_spec.rb
+- spec/rails_highcharts_spec.rb
+- spec/spec_helper.rb
 has_rdoc: true
 homepage: ""
 licenses: []
@@ -91,5 +141,7 @@ rubygems_version: 1.6.2
 signing_key: 
 specification_version: 3
 summary: Highcharts for Rails 3
-test_files: []
-
+test_files: 
+- spec/rails_highcharts_helper_spec.rb
+- spec/rails_highcharts_spec.rb
+- spec/spec_helper.rb