Ubacoda.com is an independant developer of mobile applications. Welcome to the ubacoda.com blog!

Fix for jQuery Ajax and json_encode problem

Wed Aug 4 02:12:58 2010

I came across something that really interested and surprised me today. There I was coding happily for one of my latest projects in which I needed to return values from a .php file via Ajax / $.get using jQuery. The aim was to build an array of filtered results from the SQL database and then pass them on to jQuery which would update the HTML on the page and display the results in real time.

I used json_encode( array ) on the PHP side and jQuery.parseJSON(data) on the jQuery side to get the array into something usable for jQuery. The problem was that the array that was jSON encoded was, as I mentioned, filtered on the PHP side. Below is the sort of thing I was doing.

$checkAgainst=array("1","2","3","4","5");
$whatsMissing = array("1","3","4","5");
$finalArray=array_diff($checkAgainst,$whatsMissing);	
echo json_encode($finalArray);

Here's what's happening. I've set up an array $checkAgainst which contains values that I want to check to see if they exist in another array I've set up called $whatsMissing. In this simple example, you can probably see that the number that is missing is '2'. So when we run the array_diff() and save the results to $finalArray we should be left with the value '2'. The last thing to do is output this array as jSon using json_encode(). Done! Great ...or so I thought.

The code below is jQuery code and is similar to what I used to parse the json encoded data.

$.get('getJson.php',
   function(data){
      var obj = jQuery.parseJSON(data);	
      alert(obj)
   }
);

This bit of code simply makes contact with the PHP file containing the PHP code above and the returned data is then parsed using jQuery.parseJSON(); and the resulting data is saved to a variable called 'obj'. Simple, right? Wrong! The only thing that was returned seemed to be an empty array. Of course it isn't empty. We know it's not. So what went wrong?

Well, if we tried to return any old array from the PHP code, it would work fine. I noticed the problem was that the jSON returned was a mess. The nodes were out of order and sometimes missing. The culprit, you guess it, array_diff()!

Solving the problem is really easy. I added sort($finalArray); to the PHP file before outputting the data which sorted the data correctly and jQuery was successfully able to parse it properly. What an nuisance!

Firebug-like Capabilities in Safari Browser

Sat Jul 24 11:31:22 2010

For a while now I have been using Firefox because.. well it's simply brilliant. However I always have found that it sometimes moves like a dog and there are just times when I can't afford to wait around. In some cases, switching over to Safari is faster but it doesn't have Firebug features... or at least so I thought.

On Mac OSX just run the following in Terminal (/Applications/Utilities/Terminal.app ),

defaults write com.apple.Safari WebKitDeveloperExtras -bool true

and restart Safari. On restart, go to any web page and right click to show a pop up menu. Selecting 'Inspect Element' will pull up something that looks very similar to Firebug.

I haven't really played around with it all that much yet but I assume that it doesn't have features such as those found in Flashbug and PHPbug, but I normally use other solutions to those anyway as I have found better results elsewhere. But for your general HTML and CSS, it looks like a good alternative.

No such file or directory - /tmp/mysql.sock

Sun Jul 11 05:02:51 2010

I've been playing around with a little Ruby on Rails recently and while trying to connect to my MAMP development databases, I came across the following error when using rake db:migrate.

No such file or directory - /tmp/mysql.sock

I have to admit that this baffled me for a while, but after reading around on the net, it suddenly hit me. 'I'd been having one of my stupid moments', I thought as I added the following line to my database.yml file

socket: /Applications/MAMP/tmp/mysql/mysql.sock

I'd been looking for a file in a place where one had no right to be. Why on earth would there be a mysql.sock when there was no sql database? All my development database reside inside MAMP, so it makes sense then that that is where I would find my mysql.sock file.

I realize that this isn't really a big problem for most, but I thought that this could be a potential blind spot for other PHP developers new to Rails and thought I'd best help out.

Smoothing Loaded Images in AS3

Wed Jun 23 06:11:51 2010

Today, there I was, sitting at my desk working hard on a project involving loading images into a ActionScript constructed gallery. I needed the images in the gallery to animate and scale, as one would expect to be able to do with rich internet content.

Herein the problem lies, because the images looked very pixelated when they did anything other than just remain still.

Now, this isn't a big problem if you know how to go about it the right way, but I would imagine that there are tons of people out there who need to do the same kind of thing in their galleries, and probably 9 times out of ten are frustrated by the quality of the images output in the flash player. After all, rich internet applications should display rich image content. Then it hit me! Why not write a little about it here and spread the message that, although the flash player can sometimes be a CPU hog, it is something special, even when dealing when dealing with images.

As you will have probably seen by now, in the top left of this post there is a .swf file playing a scaling image, which reads "I love AS3" (and I admit proudly that I do). At the bottom of the swf there is a button, which when pressed will add/remove bitmap smoothing to the image loaded. Smoothing in ActionScript 3 is surprisingly simple and can be done by setting the smoothing property of any Bitmap instance to true. Take a look at the example below.

var ldr:Loader = new Loader();
addChild(ldr);
ldr.scaleX = ldr.scaleY = 5;
ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
ldr.load(new URLRequest("myImage.jpg"));

function imageLoaded(event:Event):void{
   var contentToSmooth:Bitmap = event.target.content;
   // contentToSmooth.smoothing = true;
}

If we were to compile this code as it, assuming we've entered the correct URL to the image, we should see our image scaled by 5x and looking quite pixelated depending on how high the quality is of the image used. Now all we have to do to see the effects of smoothing is uncomment line 9 by removing the // from the beginning and recompile. This time you should notice a much less pixelated image displayed, even at 5x the size.

If you're interested in the example at the top left of this post, you can download the source code below.

Sequal Pro - Impressive!

Mon May 24 01:11:56 2010

I've been working a lot in PHP lately and almost always to connect to a mySQL database. I'm used to working in Terminal and the command line to create, read, update and delete (CRUD) my web pages and for people just starting out with mySQL, there is of course the more user-friendly phpMyAdmin. However, I've been mooching around the net and stumbled upon something I now don't know why I hadn't searched for before - Sequal Pro.

So what does it do?

Sequal Pro is a database management software and it's quite quite slick, let me tell you. There is virtually no wait time for pages of information to reload/refresh, as opposed to using phpMyAdmin, and it's more visually convenient than using the command line as it has a really easy to use GUI which allows you to view databases, tables and their contents with a few clicks of the mouse. The best thing of all is that it's free. You can check it out here on the Sequal Pro web site.

I am so impressed with this little gem that I wanted to post a recommendation here to urge everyone who uses mySQL to at least try it out.