Spam

Must be my lucky day?

It must be a sign. I am scared!

Joining an Open Source Project

So I have decided to dedicate part of my free time working on an open source project.

Right. No problems coming up with that, but what should I look for and where should I start?

After doing my reading I decided on two main selling points for me to join a project: Fun and Something-I-Would-Use

The first part was easy. Of course it should be fun! It is something I am going to be spending my free time on.

The big contributor to the fun part is doing something that is interesting to me. Although coding itself is already enjoyable, working on something compelling will get me going. How many times have I not gotten too excited explaining how I solved a problem or fixed a bug, when a person expected a simple answer by asking how my day was.

Ted Leung was talking about people who joins open source projects in the Herding Code podcast:

In general the whole thing with open source is you let people work in what they are interested in. They will probably gravitate towards what they are interested in and what they are good at. That means their quality of work will be a lot higher.

I agree. If working with something that interests me will generate quality output, and I get some fun out of it; I am happy with that!

Now the Something-I-Would-Use part. I came to that conclusion reading a post on Steve Yegge’s blog which was not on joining open source projects, but I believe is still applicable to this situation:

So when translated into project selection, Buffett’s and Lynch’s advice becomes: only build what you know. The longer, more accurate of the version of the investing rule — only invest in what you know and are excited about using yourself right now — has a simpler formulation for products and businesses.

Steve was talking about how software requirements are unimportant (not exactly the word he used). Specially if you are working on something that you use, because you know what the requirements are.

Again, I totally agree. People should join a project of a product they use in their own time. It will benefit from the current knowledge and experience of how the product should behave.

So now I am off to Google Code, Sourceforge, and Freshmeat to find a project that is fun and it is something-I-would-use.

A Simple AJAX Example: Searching Australian Postcodes (with JQuery)

Lately I have been writing dashlets for the SugarCRM open source CRM solution. It uses JQuery as part of its JavaScript libraries.

I have really been enjoying writing JavaScript with JQuery; it has saved me time writing concise code which also helps me debug and maintain it. So I thought it would be a good idea to rewrite my Ajax example with JQuery to compare its usefulness.

In my previous code I had to first create the XMLHttpRequest object:

var xmlHttpReq;   

// Determining which browser we are dealing with 
if (window.XMLHttpRequest)
{
   xmlHttpReq = new XMLHttpRequest();
   xmlHttpReq.overrideMimeType('text/plain');
}
else if (window.ActiveXObject)
{
   // this is required if the browser is IE
   xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}

Then I had to prepare the query string and post to the script that would get the me the details:

// generate the query string to post to the script
var queryStr = 'PostCode=' + escape(postcode);

var strURL = 'postcode_lookup.php';

xmlHttpReq.open('GET', strURL, true);
xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttpReq.onreadystatechange = displayPostcode;

// post to script
xmlHttpReq.send(queryStr);

That is too much work! With JQuery things are much easier:

$.get("postcode_lookup.php",
      { PostCode: jQuery('input[@name=PostCode]')[0].value },
      function(data)
      {
         /* Logic to parse data and determine output goes here */

         // Writing output into div
         $("#outputDiv").html(output);
      }
);

That’s it! All it takes is one function to make the Ajax call and then parse the data from the script.

The jQuery.get( url, [data], [callback], [type] ) function takes four parameters. But we are only using three as the last one is optional:
1. The script: postcode_lookup.php.
2. The parameters for the script contained in an array. In this case the value of the text field:
{ PostCode: jQuery(‘input[@name=PostCode]‘)[0].value }
3. The callback function to handle the data returned from the script.

I am quite happy for the amount of work that it has saved me. However I cannot emphasize enough how important it is to understand how the XMLHttpRequest works.

You can find the working example here.

Finding the closest Melbourne CBD train station with GDirections

This application came from my dependence on public transport and possible need to move houses; I wanted to know how close I would be in relation to train stations. There are quite a number of stations in Melbourne, and I don’t have the time to map all of their coordinates, so at the time being it only has train stations from the City Loop.

The application uses GDirections. It lets us load way points and retrieve the route details; such as distance, driving directions, and even an HTML summary of the travel.

I used GDirections in two instances of the application:
1. To determine the distance between my pivot position and the train stations.
2. To plot the route of my pivot point to the closest train station

Adding Markers on Google Maps (with more functionalities)

I modified my previous markers example to show off further functionalities:

• To pop up an info window with marker description.
• To handle clicks and create new markers.
• To use markers with custom images.

Adding Markers on Google Maps

I created an example of a Google Map application where you can plot markers on the map by specifying coordinates.

Creating markers is fairly simple:

1. Create a new instance of GLatLng object. The GLatLng holds the coordinates of your marker.

// create new location object
var location = new GLatLng(latitude, longitude);

2. Create a new instance of GMarker with the GLatLng object.

// place new marker
var marker = new GMarker(location);

3. Use the addOverlay method to create a new overlay in the map.

map.addOverlay(marker);

Just like we add an overlay to create a marker, we clear a marker by removing an overlay.

map.removeOverlay(markersArray[idx]);

The markersArray[idx] is the GMarker we would like to remove. If you are not using an array to keep your markers, you can pass in an instance of GMarker directly.

A Simple AJAX Example: Searching Australian Postcodes

I have been trying out AJAX tools such as the YUI to make web applications more responsive. Reminding myself that AJAX stands for Asynchronous JavaScript and XML, I thought I’d try to understand better then asynchronous side of it.

The xmlHttpReq object is responsible for the responsiveness of an AJAX application. It allows the JavaScript to make asynchronous HTTP request (POST or GET) to a script. The same xmlHttpReq object handles the output of the script through a callback function.

The example that I wrote is an Australian postcode lookup. Basically, the user enters a postcode which is then posted by the xmlHttpReq object to a PHP script. The script returns comma delimited details of the postcode, which is processed by the callback function, and displayed nicely to the user.

Click here to see working example.