A couple months ago, I tried to integrate Facebook credits with a very simple Rails Facebook App.  What a mess!  The process is complicated, poorly documented, and hopelessly confusing.  Now, I’m thinking I should make a post showing what I did to get it working.  My goal here is to give people a resource they can use to integrate credits with their Facebook applications.

Prerequisites

• You have a Rails Facebook canvas app.
• Your app should be in some sort of production environment.  For this example, I did it with Heroku.  It just won’t work in development mode with a local connection.
• You have read (or at least skimmed) the documentation on Facebook credit integration at  https://developers.facebook.com/docs/credits/build/.

 

     <div id="fb-root"></div>
     <script src="http://connect.facebook.net/en_US/all.js"></script>
     <script> 
          FB.init({appId: "<YOUR_APP_ID>", status: true, cookie: true}); //insert your app_id
          function placeOrder() {
          // If using mobile, this is where you place the
          // iOS native app check for credits (see below)
          // Assign an internal ID that points to a database record
          var order_info = 'ORDER_INFO'; //write this to something you can use to identify the item to be purchased
          // calling the API ...
          var obj = {
          method: 'pay',
          order_info: order_info,
          action: 'buy_item',
          dev_purchase_params: {'oscif': false}
          };
          FB.ui(obj, callback);
          writeback("thanks");
          }
        var callback = function(data) {
        if (data['order_id']) {
             return true;
        } else {
        //handle errors here
        return false;
        }
        };
     function writeback(str) {
          window.location = str;
     }
     </script>

<p> <a onclick="placeOrder(); return false;">Click here to start the dialogue.</a></p>

class HomeController < ApplicationController
  def index
  end

 def credit_callback
   #This block is executed when order_details is present, which means the user just confirmed a payment.
   #Here, you can run any commands that you would associate with a successful payment.
   #Must return a json facebook_status_ticket at the end of it all.
   if params[:order_details] 
     order_details = ActiveSupport::JSON.decode(params[:order_details])
     order_id = order_details["order_id"].to_s
     facebook_status_ticket = {
       "content"=>{
         "status"=>"settled",
         "order_id"=>order_id
       },
       "method"=>"payments_status_update"
     }
     render(:json=>facebook_status_ticket)

   #This block is executed when order_details is not present.
   #You must render a json facebook_checkout_ticket with info about the product.
   else
     product_info = {
       "item_id"=>"MY_ITEM_ID",
       "title"=>"My Awesome Virtual Item",
       "price"=>1,
       "description"=>"Best. Virtual Item. Ever."
     }
     facebook_checkout_ticket = {
       "content"=>[product_info],
       "method"=>"payments_get_items"
     }
     render(:json=>facebook_checkout_ticket)
    end
  end
end

The credit_callback action handles two calls as the user goes through the dialogue flow.  The first call does not have the parameter, “order_details.”  When that parameter is absent from the call, we need to render a JSON facebook_checkout_item that has some information about the product to be purchased.  This info will be used to populate the credits dialogue on the client-side.  The second call has a paramater called “order_details.”  When that parameter is present, the action needs to render a JSON facebook_status_ticket that shows the transaction has been completed.  Once the facebook_status_ticket is received by the client, you’re done!  The dialogue will close.

Conclusions:  This could be better.

I speculate that once people see how the process works, their reaction will be the same as mine:  “How can it be this complicated?  How does this make sense?”  In the future, I would like to build some sort of tool to simplify things, such as a gem.  For now, however, we’re stuck with this.

In my short career as a freelance web designer/developer, I’ve always “coded” all my projects.  I avoided content management systems that could demystify the process of creating web content.  As a Rails developer, I thought that I should use Rails whenever I could.  Until now, even my own website was a Rails project, hosted on Heroku.  I figured, “I’m a Rails developer, my website should be a Rails site.”  I was wrong.

Just today, I shut down the Rails application that used to be my website, and put my entire site on WordPress.  I’m having a blast, and couldn’t be happier with the way things are working, looking, and loading.  For me, the paradigm shift is long overdue.  From now on, all my static sites are going be hosted through a content management system, whenever possible.  Plus, I can still embed my own HTML into WordPress, if I feel the urge.

As for actually having a dynamic site to show that I am, indeed, a Rails developer, my portfolio will have to speak for itself.  Plus, content management systems for my simple sites will give me more time to focus on the more complicated ones that actually require Rails.