{"id":53106,"date":"2009-04-30T16:33:00","date_gmt":"2009-04-30T16:33:00","guid":{"rendered":"\/2009\/04\/30\/open-flash-chart-ii-fully-automated"},"modified":"2009-08-30T04:34:43","modified_gmt":"2009-08-30T04:34:43","slug":"open-flash-chart-ii-fully-automated","status":"publish","type":"post","link":"http:\/\/pullmonkey.com\/2009\/04\/30\/open-flash-chart-ii-fully-automated\/","title":{"rendered":"Open Flash Chart II &#8211; fully automated"},"content":{"rendered":"<p>Just as an attention grabber - we are going after this example in this article:<br \/>\n<script type=\"text\/javascript\" src=\"\/projects\/javascripts\/swfobject.js\"><\/script><\/p>\n<div id=\"flash_content_blog_01\"><\/div>\n<p><script type=\"text\/javascript\">\n  swfobject.embedSWF(\"\/projects\/open-flash-chart-ichor.swf\", \"flash_content_blog_01\", \"600\", \"300\", \"9.0.0\", \"expressInstall.swf\",{\"data-file\":\"\/projects\/open_flash_chart22\/area_hollow\"}, {\"wmode\":\"transparent\"});\n<\/script><\/p>\n<h2>Keeping up<\/h2>\n<p>Ok, seeing that the <a href=\"http:\/\/teethgrinder.co.uk\/open-flash-chart-2\/\">php versions of open flash chart<\/a> and open flash chart swf files continually change along with with the API (not saying this is a bad thing), I wanted to come up with an even more abstract solution.   The goal is to not have to worry when the swf file is released with the latest set of graphs or changes its API.  I simply don't want to worry about this method or that method, or this class or that class. <\/p>\n<h2>Feedback<\/h2>\n<p>This article will sort of act as a tutorial for those interested in metaprogramming and as a set of instructions for those looking to experiment with the <a href=\"http:\/\/github.com\/pullmonkey\/open_flash_chart\/tree\/test\">latest version of the OFC II Rails Plugin that I am currently toying with<\/a>.  I would like to hear feedback, but just remember that phase 1 of this release will be very basic, meaning none of the ajaxy stuff.  It will come, just not yet.<\/p>\n<h2>Let's see what we can get away with<\/h2>\n<p>I am already using method_missing() for pretty much everything in the <a href=\"http:\/\/github.com\/pullmonkey\/open_flash_chart\/tree\/master\">OFC II Rails Plugin that is being used now<\/a>.  But every time new classes are added, I have to sit down and basically convert the php class to ruby - just plain tedious, not really what I had planned when I started all this.  Ok, so method_missing() was great, but let me introduce (or possibly reintroduce) you to const_missing(), basically method_missing() but instead of methods, we can create classes or modules or other objects on the fly.  This will definitely help when the php version gets a new class.  Instead of getting hounded to update the rails version to be 100% like the php version, everything will just work, no updates to code required.  Well, we hope !   So check this out:<\/p>\n<p>Here is what we did with method_missing():<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt>8<tt>\r\n<\/tt>9<tt>\r\n<\/tt><strong>10<\/strong><tt>\r\n<\/tt>11<tt>\r\n<\/tt>12<tt>\r\n<\/tt>13<tt>\r\n<\/tt>14<tt>\r\n<\/tt><strong>15<\/strong><tt>\r\n<\/tt>16<tt>\r\n<\/tt>17<tt>\r\n<\/tt>18<tt>\r\n<\/tt>19<tt>\r\n<\/tt><strong>20<\/strong><tt>\r\n<\/tt>21<tt>\r\n<\/tt>22<tt>\r\n<\/tt>23<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt><span class=\"r\">module<\/span> <span class=\"cl\">OFC<\/span><tt>\r\n<\/tt>  <span class=\"r\">class<\/span> <span class=\"cl\">Base<\/span><tt>\r\n<\/tt>    <span class=\"r\">def<\/span> <span class=\"fu\">method_missing<\/span>(method_name, *args, &amp;blk)<tt>\r\n<\/tt>      <span class=\"r\">case<\/span> method_name.to_s<tt>\r\n<\/tt>      <span class=\"r\">when<\/span> <span class=\"rx\"><span class=\"dl\">\/<\/span><span class=\"k\">(.*)=<\/span><span class=\"dl\">\/<\/span><\/span>   <span class=\"c\"># i.e., if it is something x_legend=<\/span><tt>\r\n<\/tt>        <span class=\"c\"># if the user wants to set an instance variable then let them<\/span><tt>\r\n<\/tt>        <span class=\"c\"># the other args (args[0]) are ignored since it is a set method<\/span><tt>\r\n<\/tt>        <span class=\"pc\">self<\/span>.instance_variable_set(<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">@<\/span><span class=\"il\"><span class=\"dl\">#{<\/span><span class=\"gv\">$1<\/span><span class=\"dl\">}<\/span><\/span><span class=\"dl\">&quot;<\/span><\/span>, args[<span class=\"i\">0<\/span>])<tt>\r\n<\/tt>      <span class=\"r\">when<\/span> <span class=\"rx\"><span class=\"dl\">\/<\/span><span class=\"k\">^set_(.*)<\/span><span class=\"dl\">\/<\/span><\/span><tt>\r\n<\/tt>        <span class=\"c\"># backwards compatible ... the user can still use the same set_y_legend methods if they want<\/span><tt>\r\n<\/tt>        <span class=\"pc\">self<\/span>.instance_variable_set(<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">@<\/span><span class=\"il\"><span class=\"dl\">#{<\/span><span class=\"gv\">$1<\/span><span class=\"dl\">}<\/span><\/span><span class=\"dl\">&quot;<\/span><\/span>, args[<span class=\"i\">0<\/span>])<tt>\r\n<\/tt>      <span class=\"r\">else<\/span><tt>\r\n<\/tt>          <span class=\"r\">if<\/span> inst = <span class=\"pc\">self<\/span>.instance_variable_get(<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">@<\/span><span class=\"il\"><span class=\"dl\">#{<\/span>method_name<span class=\"dl\">}<\/span><\/span><span class=\"dl\">&quot;<\/span><\/span>)<tt>\r\n<\/tt>            inst<tt>\r\n<\/tt>          <span class=\"r\">else<\/span><tt>\r\n<\/tt>            <span class=\"c\"># if the method\/attribute is missing and it is not a set method then hmmmm better let the user know<\/span><tt>\r\n<\/tt>            <span class=\"r\">super<\/span><tt>\r\n<\/tt>          <span class=\"r\">end<\/span><tt>\r\n<\/tt>      <span class=\"r\">end<\/span><tt>\r\n<\/tt>    <span class=\"r\">end<\/span><tt>\r\n<\/tt>  <span class=\"r\">end<\/span><tt>\r\n<\/tt><span class=\"r\">end<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<p>This just basically allows me to do this:<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt>8<tt>\r\n<\/tt>9<tt>\r\n<\/tt><strong>10<\/strong><tt>\r\n<\/tt>11<tt>\r\n<\/tt>12<tt>\r\n<\/tt>13<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>  <span class=\"r\">class<\/span> <span class=\"cl\">Foo<\/span> &lt; <span class=\"co\">OFC<\/span>::<span class=\"co\">Base<\/span><tt>\r\n<\/tt>  <span class=\"r\">end<\/span><tt>\r\n<\/tt><tt>\r\n<\/tt>  foo = <span class=\"co\">Foo<\/span>.new<tt>\r\n<\/tt><tt>\r\n<\/tt>  foo.some_random_attribute = <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">Hello<\/span><span class=\"dl\">&quot;<\/span><\/span>  <span class=\"c\">#=&gt; &quot;Hello&quot;<\/span><tt>\r\n<\/tt>  foo.some_random_attribute  <span class=\"c\">#=&gt; &quot;Hello&quot;<\/span><tt>\r\n<\/tt>  foo.some_random_undefined_attribute  <span class=\"c\">#=&gt; Method Missing error (calls super)<\/span><tt>\r\n<\/tt><tt>\r\n<\/tt>  <span class=\"c\"># too be like php, for easier conversion<\/span><tt>\r\n<\/tt>  foo.set_some_random_attribute(<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">Good Bye<\/span><span class=\"dl\">&quot;<\/span><\/span>)  <span class=\"c\">#=&gt; &quot;Good Bye&quot;<\/span><tt>\r\n<\/tt>  foo.some_random_attribute  <span class=\"c\">#=&gt; &quot;Good Bye&quot;<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<p>Along the same lines, I have created an initialize method that takes any argument hash of variable\/value pairs and calls variable=() which is handled by method missing as we saw above:<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt>8<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>  <span class=\"r\">class<\/span> <span class=\"cl\">Foo<\/span> &lt; <span class=\"co\">OFC<\/span>::<span class=\"co\">Base<\/span><tt>\r\n<\/tt>  <span class=\"r\">end<\/span><tt>\r\n<\/tt><tt>\r\n<\/tt>  foo = <span class=\"co\">Foo<\/span>.new(<span class=\"sy\">:x_axis<\/span> =&gt; <span class=\"i\">5<\/span>, <span class=\"sy\">:min<\/span> =&gt; <span class=\"i\">10<\/span>, <span class=\"sy\">:max<\/span> =&gt; <span class=\"i\">90<\/span>, <span class=\"sy\">:steps<\/span> =&gt; <span class=\"i\">5<\/span>, <span class=\"sy\">:elements<\/span> =&gt; [<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">one<\/span><span class=\"dl\">&quot;<\/span><\/span>, <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">two<\/span><span class=\"dl\">&quot;<\/span><\/span>])<tt>\r\n<\/tt>  <tt>\r\n<\/tt>  foo.x_axis <span class=\"c\">#=&gt; 5<\/span><tt>\r\n<\/tt>  foo.min <span class=\"c\">#=&gt; 10<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<p>Ok, so on to const_missing() and what we can do with that:<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>  <span class=\"r\">def<\/span> <span class=\"co\">OFC<\/span>.const_missing(const)<tt>\r\n<\/tt>    klass = <span class=\"co\">Class<\/span>.new <span class=\"co\">OFC<\/span>::<span class=\"co\">Base<\/span><tt>\r\n<\/tt>    <span class=\"co\">Object<\/span>.const_set const, klass<tt>\r\n<\/tt>    <span class=\"r\">return<\/span> klass<tt>\r\n<\/tt>  <span class=\"r\">end<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<p>This says that any undefined (missing) constant of OFC should be defined as a new class that inherits from OFC::Base.<\/p>\n<p>So when we say OFC::Foo, that has not been defined, so we will get back class OFC::Foo < OFC::Base;end; which will give us the initialize() method and method_missing() method from above.  Let's see how this works:<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt>8<tt>\r\n<\/tt>9<tt>\r\n<\/tt><strong>10<\/strong><tt>\r\n<\/tt>11<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>  line = <span class=\"co\">OFC<\/span>::<span class=\"co\">Line<\/span>.new(<span class=\"sy\">:values<\/span> =&gt; [<span class=\"i\">1<\/span>,<span class=\"i\">2<\/span>,<span class=\"i\">3<\/span>,<span class=\"pc\">nil<\/span>,<span class=\"pc\">nil<\/span>,<span class=\"i\">5<\/span>,<span class=\"i\">6<\/span>,<span class=\"i\">7<\/span>])<tt>\r\n<\/tt>  line.values <span class=\"c\">#=&gt; [1,2,3,nil,nil,5,6,7]<\/span><tt>\r\n<\/tt>  line.some_random_variable = <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">Hello<\/span><span class=\"dl\">&quot;<\/span><\/span> <span class=\"c\">#=&gt; &quot;Hello&quot;<\/span><tt>\r\n<\/tt>  line.some_random_variable <span class=\"c\">#=&gt; &quot;Hello&quot;<\/span><tt>\r\n<\/tt><tt>\r\n<\/tt>  stacked_bar_chart = <span class=\"co\">OFC<\/span>::<span class=\"co\">BarStack<\/span>.new<tt>\r\n<\/tt>  stacked_bar_chart.values = []<tt>\r\n<\/tt>  stacked_bar_chart.values &lt;&lt; [<span class=\"i\">2<\/span>,<span class=\"i\">3<\/span>,<span class=\"i\">4<\/span>]<tt>\r\n<\/tt>  stacked_bar_chart.values &lt;&lt; [<span class=\"i\">5<\/span>, {<span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">val<\/span><span class=\"dl\">&quot;<\/span><\/span> =&gt; <span class=\"i\">5<\/span>, <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">colour<\/span><span class=\"dl\">&quot;<\/span><\/span> =&gt; <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">#ff0000<\/span><span class=\"dl\">&quot;<\/span><\/span>}]<tt>\r\n<\/tt>  stacked_bar_chart.keys = [{ <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">colour<\/span><span class=\"dl\">&quot;<\/span><\/span> =&gt; <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">#C4D318<\/span><span class=\"dl\">&quot;<\/span><\/span>, <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">text<\/span><span class=\"dl\">&quot;<\/span><\/span> =&gt; <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">Kiting<\/span><span class=\"dl\">&quot;<\/span><\/span>, <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">font-size<\/span><span class=\"dl\">&quot;<\/span><\/span> =&gt; <span class=\"i\">13<\/span> } ...]<tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<p>So it all sort of came together right there.  I've shown you all the code that comes with the Rails Open Flash Chart plugin now.   No more definining idividual classes, no more trying to keep up with the never ending php version, and no more late nights converting php to ruby (!).  About dang time.<\/p>\n<p>Ok, but this is just the beginning, nothing has been set in stone, so like I said, give me your feedback, what works for you and what does not.  And, hopefully, I will have solutions for you or you for me.<\/p>\n<p><\/p>\n<h2>Example with new version (test version)<\/h2>\n<p>I am using rails 2.3.2, but I don't think it will matter what version you are using.<\/p>\n<h3>Create your new rails project<\/h3>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt><span class=\"c\"># create a new rails project <\/span><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> rails testing_it<tt>\r\n<\/tt><span class=\"c\">#&lt;Bunch of stuff is created ....&gt;<\/span><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> cd testing_it\/<tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Install the plugin from the test branch<\/h3>\n<p>Note the -r test in this next step.  The new version (test version) I am playing with is under the test branch and -r says what branch to pull from.<\/p>\n<p>Also, you can use git:\/\/ instead of http:\/\/ below, but depending on your firewall restrictions http:\/\/ will probably work out best for you.<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> .\/script\/plugin install http<span class=\"sy\">:\/<\/span>\/github.com\/pullmonkey\/open_flash_chart.git -r test<tt>\r\n<\/tt><span class=\"c\"># &lt;Bunch more stuff ...&gt;<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Create a controller to play in<\/h3>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> .\/script\/generate controller test_it<tt>\r\n<\/tt><span class=\"c\"># &lt;And more stuff &gt;<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Get our assets<\/h3>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt><span class=\"c\"># first we will get swfobject.js<\/span><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> cp vendor\/plugins\/open_flash_chart\/assets\/javascripts\/swfobject.js public\/javascripts\/<tt>\r\n<\/tt><span class=\"c\"># next the open flash chart swf (GET whatever is the latest version), right now that is here: http:\/\/teethgrinder.co.uk\/open-flash-chart-2\/open-flash-chart.swf<\/span><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> cd public\/<tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> wget http<span class=\"sy\">:\/<\/span>\/teethgrinder.co.uk\/open-flash-chart<span class=\"i\">-2<\/span>\/open-flash-chart.swf<tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> cd ..<tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Edit our controller<\/h3>\n<p>Notice here that I just include one of the many examples from the <a href=\"http:\/\/github.com\/pullmonkey\/open_flash_chart\/tree\/7ca9f9dbea795431aafdcc3a20dd4b73900f6fba\/lib\/ofc\/examples\">plugin's examples directory<\/a>.  Definitely more to follow.<\/p>\n<p>One thing you will notice about the examples, is that the php code is in the comments, so you can see how I would convert from the php examples to ruby.  Please feel free to add your own examples, just fork the project.<\/p>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt>6<tt>\r\n<\/tt>7<tt>\r\n<\/tt>8<tt>\r\n<\/tt>9<tt>\r\n<\/tt><strong>10<\/strong><tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> vi app\/controllers\/test_it_controller.rb<tt>\r\n<\/tt><span class=\"c\"># mine looks like this:<\/span><tt>\r\n<\/tt><span class=\"r\">class<\/span> <span class=\"cl\">TestItController<\/span> &lt; <span class=\"co\">ApplicationController<\/span><tt>\r\n<\/tt>  include <span class=\"co\">OFC<\/span>::<span class=\"co\">Examples<\/span>::<span class=\"co\">AreaHollow<\/span><tt>\r\n<\/tt><tt>\r\n<\/tt>  <span class=\"r\">def<\/span> <span class=\"fu\">index<\/span><tt>\r\n<\/tt>    <span class=\"iv\">@graph<\/span> = open_flash_chart_object(<span class=\"i\">600<\/span>,<span class=\"i\">300<\/span>, <span class=\"s\"><span class=\"dl\">&quot;<\/span><span class=\"k\">\/test_it\/area_hollow<\/span><span class=\"dl\">&quot;<\/span><\/span>)<tt>\r\n<\/tt>  <span class=\"r\">end<\/span><tt>\r\n<\/tt><span class=\"r\">end<\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Edit our view<\/h3>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> vi app\/views\/test_it\/index.html.erb<tt>\r\n<\/tt><span class=\"c\"># mine looks like this:<\/span><tt>\r\n<\/tt>&lt;%= javascript_include_tag <span class=\"s\"><span class=\"dl\">'<\/span><span class=\"k\">swfobject<\/span><span class=\"dl\">'<\/span><\/span> <span class=\"s\"><span class=\"dl\">%&gt;<\/span><span class=\"k\"><tt>\r\n<\/tt>&lt;%= @graph %<\/span><span class=\"dl\">&gt;<\/span><\/span><tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h3>Start 'er up<\/h3>\n<table class=\"CodeRay\">\n<tr>\n<td class=\"line_numbers\" title=\"click to toggle\" onclick=\"with (this.firstChild.style) { display = (display == '') ? 'none' : '' }\">\n<pre>1<tt>\r\n<\/tt>2<tt>\r\n<\/tt>3<tt>\r\n<\/tt>4<tt>\r\n<\/tt><strong>5<\/strong><tt>\r\n<\/tt><\/pre>\n<\/td>\n<td class=\"code\">\n<pre ondblclick=\"with (this.style) { overflow = (overflow == 'auto' || overflow == '') ? 'visible' : 'auto' }\"><tt>\r\n<\/tt>&gt; pullmonkey<span class=\"er\">$<\/span> .\/script\/server<tt>\r\n<\/tt><tt>\r\n<\/tt><span class=\"c\"># browse to the test_it index<\/span><tt>\r\n<\/tt>http<span class=\"sy\">:\/<\/span>\/localhost:<span class=\"i\">3000<\/span>\/test_it<tt>\r\n<\/tt><\/pre>\n<\/td>\n<\/tr>\n<\/table>\n<h2>Our example<\/h2>\n<div id=\"flash_content_blog_1\"><\/div>\n<p><script type=\"text\/javascript\">\n  swfobject.embedSWF(\"\/projects\/open-flash-chart-ichor.swf\", \"flash_content_blog_1\", \"600\", \"300\", \"9.0.0\", \"expressInstall.swf\",{\"data-file\":\"\/projects\/open_flash_chart22\/area_hollow\"}, {\"wmode\":\"transparent\"});\n<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Just as an attention grabber &#8211; we are going after this example in this article: Keeping up Ok, seeing that the php versions of open flash chart and open flash chart swf files continually change along with with the API (not saying this is a bad thing), I wanted to come up with an even [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[6,3,26,14,5,9,30],"tags":[42,41,52,40,210,211,43],"_links":{"self":[{"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/posts\/53106"}],"collection":[{"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/comments?post=53106"}],"version-history":[{"count":4,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/posts\/53106\/revisions"}],"predecessor-version":[{"id":57338,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/posts\/53106\/revisions\/57338"}],"wp:attachment":[{"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/media?parent=53106"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/categories?post=53106"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/pullmonkey.com\/wp-json\/wp\/v2\/tags?post=53106"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}