I am learning Ruby on Rails with RubyMine IDE

Yes. I am learning Ruby on Rails for an ongoing project. Ruby looks so nice, so easy to learn. Having a background in PHP and with some experience on PHP framework, learning Ruby and Rails has not been a difficult task to me. Infact, much of the features in Rails look adopted by different PHP frameworks.
Ruby's syntax is really easy to understand , making it easy to learn. Rails makes it easy to respond to a request in different format (JSON,HTML,XML) . Just 5 lines of code and viola!.  I have been trialing RubyMine IDE by Jet Brains and I have found it to be really well built. Since I have been using the debugger I have not explored the debugger functions in Ruby ( like print_r or var_dump are in PHP) but one of my colleague says that the support isn't that great. I really like the concept of gem which are the 1st or 3rd party libraries specific to a particular project.  I would love to hear comments on this from my reader. If you are a Ruby developer, tell me some good tips  and If you are an explorer like me, let me know if there is a particular feature that you would like to me explore in Ruby or Rails. Thats all from me for now. :)

Custom Logic in Field Sorting for ListGrid in SmartClient

Sometime data in the ListGrid needs to be sorted on a particular condition or criteria rather then traditional sorted OR you get data is a form where it would not be possible for the ListGrid to sort it on its own. For this purpose, ListGrid provides a 'sortNormalizer' function which can be implemented at grid level or at field level for data sorting. Have a look at the following example :


<pre  style="font-family:arial;font-size:12px;border:1px dashed #CCCCCC;width:99%;height:auto;overflow:auto;background:#f0f0f0;;background-image:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-s003mlEAhvwIvXAlnBoXoBbBtuXAejNQN6vWliFgZ05CghIJkoK74Z2EkX0AaOMHLIANtFZ1rDCSZS4dcOwgvPu9zsTEl_0cUVC4O3EWLwYPKK_ttSiH7fVdWEztHK7rSlPKKZLfjE8Z/s320/codebg.gif);padding:0px;color:#000000;text-align:left;line-height:20px;"><code style="color:#000000;word-wrap:normal;"> isc.ListGrid.create({ 
   ID: "countryList", 
   data: countryData, 
   fields:[ 
     {name:"countryCode", title:"Flag", width:50}, 
     {name:"countryName", title:"Country"}, 
     {name:"independence", title:"Nationhood", type:"date"}, 
     {name:"area", title:"Area (km&amp;sup2;)", type:"float", formatCellValue:"isc.Format.toUSString(value)"}, 
     {name:"gdp_percap", title:"GDP (per capita)", align:"right", 
       formatCellValue: function (value, record) { 
         var gdpPerCapita = Math.round(record.gdp*1000000000/record.population); 
         return isc.Format.toUSDollarString(gdpPerCapita); 
       }, 
       sortNormalizer: function (record) { 
         return record.gdp/record.population; 
       } 
     } 
   ], 
 }) 
</code></pre>

In the above example, notice how the sort normalizer function is used to sort values calculating ratio of a two of the fields of the record row.  Also notice that the value returned by the normalizer function is used for sorting is numeric which can easily by used for sorting. This concept can be used for sorting by any custom criteria or condition. Though it is not necessary to return a numeric value
, it is a safe bet.
Another important things about normalizer function is that it also accepts a context parameter. The full signature of the sortNormalizer function is

 ListGridField.sortNormalizer() (recordObject, fieldName, context)

where context can be any variable which needs to be passed to the function. One of the scenario in which it can be used is when the custom sorting has to be done on the result of a text search , where the text searched is passed on to the function in the context variable.

CORS - Cross Domain Resource Sharing With Ajax and JSON - Example

Recently, I was ask to build a prototype to demonstrate cross-domain resource sharing through AJAX and JSON.  For those who dont know, cross-domain AJAX request are not allowed by default until the web server handling the request allows it. This is done by sending the  "Access-Control-Allow-Origin" header. Following is an example of a client and server peforming CORS. 

Server Code:

 <?php  
 header('Access-Control-Allow-Origin: *'); 
 $Response = array(1,2,3); 
 echo json_encode($Response);      
 ?> 

Ajax Client Code:

 <html> 

 <head> 

 <title>test</title> 

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 

 </head> 

 <body> 

 <input type="button" value="test" onclick="testajax()" /> 

 </body> 

 <script> 

 function testajax() 

 { 

  $.ajax({ 

   crossdomain : true, 

   type : "text/plain", 

   type : "GET", 

   url : "http://www.testerzone.com/test/test.php", 

   success : function (data){ 

    alert(data); 

   }, 

   error: function (xhr, ajaxOptions, thrownError) { 

     alert(xhr.status); 

     alert(thrownError); 

     } 

  }); 

 } 

 </script> 

 </html> 

PHP How To : Creating date ranges for filtering in PHP for MySQL query - Part 2

In Part 1,  I provided the code snippets and explanation for building dynamic date ranges in PHP that can be used with MySQL queries with BETWEEN keyword. The snippets were

 // For last six months, 
     $start = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days -6 month

')); 
     $end = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days')); 
 // For last month, 
           $start = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days -1

month')); 
           $end = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days ')); 
 // For last year, 
           $start = date('Y-m-d', strtotime('1 jan last year')); 
           $end = date('Y-m-d', strtotime('31 dec last year +1 day ')); 

 However,  it still has a problem. Since, we are including an extra day in order to include results for the whole day of the end date (see Part 1 for explanation), this also leads to the inclusion of results with timestamp right at the start of the extra day. Lets take the "Last Six Month" case as an example. If I execute this statement today (3rd of Feb), it will get me "2013- 02-01".  So if I use this as end date, then MySQL will return me a result set that will also include records with timestamp ="2013-02-01 00:00:00"  which is undesirable.  Therefore, in order to get rid of these undesirable records from the result set, I simply subtract a second from the end date.  So, the code snippets now become

 // For last six months, 
     $start = date('Y-m-d H:i:s', strtotime('today -' . (date('j') - 1) . ' days

-6 month')); 
     $end = date('Y-m-d H:i:s', strtotime('today -' . (date('j') - 1) . ' days

-1 second')); 
 // For last month, 
           $start = date('Y-m-d H:i:s', strtotime('today -' . (date('j') - 1) .

' days -1 month')); 
           $end = date('Y-m-d H:i:s', strtotime('today -' . (date('j') - 1) . '

days -1 second ')); 
 // For last year, 
           $start = date('Y-m-d H:i:s', strtotime('1 jan last year')); 
           $end = date('Y-m-d H:i:s', strtotime('31 dec last year +1 day -1

second')); 

PHP How To : Creating date ranges for filtering in PHP for MySQL query - Part 1

MYSQL query for querying results between a date range is not that difficult at all.  It goes like

 SELECT * FROM my_table WHERE timestamp BETWEEN '2013-01-01' AND '2013-02-01'  

However, things get a bit interesting when the date range becomes dynamic. For example, in one of the projects that I have worked on , I was required to provide the feature of filtering results for last month, last 6 months and so on. You can see the problem clearly here. The date ranges need to be made only the fly.  
In order to filter data by date ranges, for example, for Last Six Months, Last Month or Last Year, PHP's date() and strtotime() function can be used in combination with each other.  Let me provide snippets for them.

 // For last six months,  
     $start = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days -6 month '));  
     $end = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days'));  
 // For last month,  
           $start = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days -1 month'));  
           $end = date('Y-m-d', strtotime('-' . (date('j') - 1) . ' days '));  
 // For last year,  
           $start = date('Y-m-d', strtotime('1 jan last year'));  
           $end = date('Y-m-d', strtotime('31 dec last year +1 day '));  

Here, the code for getting date range covering whole of the last year is easier to understand.  The range starts  from 1 Jan of last year and ends on 1 Jan of this year. But why 1st Jan of this year?? After all, we only want to get records till 31st of Dec of last year. The reason for this is that if you just provide a date in the SQL statement mentioned above , MySQL takes it as start of that date.  Therefore, if we were just to write  '31 dec last year', then the results would not include those records with timestamp greater than "2012-12-31 00:00:00" and we will miss results for a whole day.  Adding "+ 1 day " allows us to include those results as well.

The snippets for last month and last 6 months are a bit difficult to understand at first , however, they are quite easy once you know what happening in them. Let me explain one of them.  For the last six months case, the start date is computed by first  getting the start of the current month ( the (date('j') - 1) part). Then it further subtracts 6 months to get the start of the six month period. For end date, it just compute the start of the current month.  The case for the last month is identical to this one except that only 1 month is subtracted instead of 6 in computing the start date. 
So there you have it.............. but we are not done yet. There is a slight problem with date range , which may result in unwanted records being included in the result.  I have explained this in part 2 and tweaked the code to fix it.

Isomorphic SmartClient How To : Handling ComboBox picker selection

If you are working with ComboBox Item in SmartClient, you might be required to perform some action ( setting a flag, or modifying the selected data ) when a picker selection is made. Though this task can be easily done by using the example code provided by Isomorphic when you are working with static data , it gets trickier when the field names you are going to work with are only available at runtime. The documentation and examples are not very obvious about how to do this. Well, the key to this lies in the fact that the ComboBox Item in SmartClient JavaScript framework is actually a ListGrid. You can do whatever you can you with a ListGrid by accessing it through the "pickListProperties" attribute of the combo box. Since, we want to handle ComboBox picker selection event, we can do it by implemeting the 'rowClick' event inside 'PickListProperties' attribute.
Here is the code

 { 
         name: "symbol", 
         editorType: "comboBox", 
        
         pickListProperties: { 
           rowClick: function(record, recordNum, fieldNum){ 
              doSomethingWith(record[fieldName]); 
             return true; 
           } 
         }, 
       } 

Isomorphic SmartClient version 8.3 - My review

I have been working with LGPL version Isomorphic SmartClient framework currently. For those who don’t know it, SmartClient is primarily a JavaScript framework which allows you to build "Enterprise Grade" web applications. And it is quite true as well.    In the following lines, I would like to present it pros and cons which may prove useful for some of my reader. Let me start with Pros.

Pros.

Controls Library with Extensive Functionalities

SmartClient makes developer's life a lot easier (if he/she knows her way around...let me come back to it) when building web applications that require components with extensive functionalities for information display, such as Grids, Charts , Forms that support context menus, sorting , filter , validation, highlighting etc. (such as a dashboard).  For example, the grid itself is feature packed. You can sort, filter and highlight rows as well as create custom cell contain buttons and images.  You can freeze columns, use data source to change grid data on the fly without much effort and use context menu to allow users to perform actions on data in the grid. Form controls are great too. For example, you can restrict user to numeric input, display a extensive set of data as grid in the dropdown of a combo box and control positioning on form quite well. 

Quicker Development

SmartClient client supports a very simple object based design to build UI.  There are controls and there are controls that contain them. For example, in order to build a form, you just create a form object, and objects of each control that you want on that form and just add them to the form.   This is not only easier to understand when you are learning it for the first time (compared to ExtJS where you also need to know about MVC and have to deal with complex naming conventions).  The extensive feature set of each control allows you to write less code and get more done.

Cons.

Documentation

I can easily describe how I feel about its documentation... It’s pretty weak.  Though the documentation is not only available with SDK as well as online, it is sparse if you take into consideration the feature rich controls.  There is no description of how each control has been built; you just have to figure it out yourself.  The documentation just lists the attributes and methods of each control along with brief descriptions for each of them.  For example, if you want to fill a combo box with text from a cell of its dropdown list, the documentation gives you no clear indication on how to go about doing that. You will just have to connect dots by experimenting with the control and significantly digging through documentation.  It is important to mention here that SmartClient has different version. The LGPL version just contains JavaScript, while versions above it allow these controls to be rendered through JAVA (GWT).  So, in my case, I was only utilizing a portion of documentation, and I clearly felt that the JavaScript portion of the documentation should have been as big as the documentation itself.  Also, the examples were a bit misleading for me, as most of them either used static data, or fetched data from the server through a URL. This gave me a false sense that data binding was not a big issue, however, in reality, when using dynamic data built on client's browser; I had to figure it out.  However, the good thing is that examples render themselves for modification and you can build a prototype of what you want to build before making any kind of commitments.

Loading

Because of its extensive nature, SmartClient takes noticeable time to render.  The controls, when they load are not as snappy as some of the lightweight UI controls are, but given their utility it was acceptable for me.  In other cases of course, this compromise depends upon the requirements and preferences. 

UI and its customization

I don’t know, it may be because of ease of UI control, but SmartClient is not div based. It extensively uses tables for building UI structure.  Also, there is a particular and extensive procedure to customizing its CSS. Doing CSS customization the normal way, may result in some unexpected and previously unseen results, and although it is very much doable, it would just take more time.