Archive for the ‘Programming’ Category

JavaScript Debugger and Developer Tool

Thursday, June 26th, 2008

 Life as a modern web developer would not be bearable without a decent debugger tool such as Firebug for Firefox. It allows you to debug your JavaScript, inspect XMLHttpRequests, the DOM, CSS, and edit them.

While I love Firefox and Firebug, there are other browsers out there that I also have to develop for, the dearth of decent debugging tools these has often left me grumbling and lamenting.

But on one of those procrasting whims, I started googling. And much to my suprise I discovered that the latest version of Opera, 9.5, comes with a built in debugger called Dragonfly.

Dragonfly is only in beta, but what it offers so far is very promising indeed. It may not have all of the features that Firebug currently has, but it is certainly a very useful tool as it is. With the addition of this feature to Opera, the browser is now a serious contender as a developer tool. One thing that was a little annoying, was that Opera's Dragonfly web page doesn't clearly state that, you only need to be using the latest browser, and can activate it under the menu option Tools / Advanced / Developer tools.

My curiosity then led me on to look at Safari next. And yes, there appears to be a similar tool also, but after server attempts at following the instructions from multiple websites I can't activate it. The steps one has to go through to enable it are counter intuitive. With both Firefox and Dragonfly, they are easily accessible via a menu of icon. So I've given up on Safari's development tool until they make it easier to access.

Now there is one browser yet to mention, and I hear the collective groan, Internet Explorer. Once the darling, it is now the millstone around the necks of developers across the world. For years they have had a developer tool in beta, that just has never progressed anywhere. It doesn't even offer an integrated JavaScript debugger.

The future of browsers is becoming very competitive again, with those clearly moving in the right direction, the others that need to pick up their game or be left out of it.

 

Unofuscate Javascript

Sunday, February 24th, 2008

I have always learnt how to code by example. I find some one else's code open it up have a look around, and start hacking. But every once in a while I'll come across some code that has been obfuscated. It has never stopped me in the past, and usually I've taken a long and laborious way to make it readable again.

Well today, I was feeling particularly impatient with the JavaScript I wanted to open up. I looked through my Firefox plugins and found nothing, so I then googled for a solution. To my surprise I found something extremely simple and elegant.

alert(function showMeTheCode() { yourJSgoesHere });

The "yourJSgoesHere" is of course replaced with the code you want to unobfuscate. Firefox will then print you an alert with neatly formatted JavaScript. Enjoy! 8)

HTML Canvas and Javascript

Tuesday, January 15th, 2008

Firefox Rendering Bug Fixed in Record Time - by Kevin Yank

http://www.sitepoint.com/blogs/2007/12/03/firefox-rendering-bug-fixed-in-record-time

When Mozilla released Firefox 2.0.0.10 last Monday, the release notes
made it out to be a relatively minor update correcting, as usual, a
small number of security issues. As it turned out, however, the release
contained a nasty surprise for developers whose sites relied on Canvas.drawImage, a JavaScript feature of recent browsers that lets developers display images with effects like rotation and drop shadows.

Firefox 2.0.0.10 completely broke this feature, causing images to
disappear from sites that relied upon it. JavaScript effects libraries
like instant.js
suddenly stopped working, and developers had no way to fix the problem,
because, as far as Firefox was concerned, everything was working
perfectly.

http://minijoe.com/samples/tutorial/3_1_canvas_drawimage.html

http://developer.apple.com/documentation/AppleApplications/Reference/SafariJSRef/Classes/Canvas.html

http://canvaspaint.org/

http://simile.mit.edu/timeplot/

http://www.abrahamjoffe.com.au/ben/canvascape/

http://www.abrahamjoffe.com.au/ben/canvascape/textures.htm

http://www.whatwg.org/specs/web-apps/current-work/#the-canvas

WordPress Admin

Wednesday, March 28th, 2007

I'm a fan of WordPress. It produces clean extensible markup. It also has huge user base, and consequently a developer base also.

However, I've always found the admin rather ugly, and its navigation menu rather annoying, as I miss having the easy access to sub-pages via a drop down menu system. So after doing a little googling, I finally located two plugins which give me a look and feel that I've been craving. Tiger Style Administration by Steve Smith provided the slicker look, and Admin Drop Menus by Andy Staines provided the drop down menus

On first activation of both WordPress plugins, they don't appear compatible. After closer inspection, the solution to their happy co-existence lay in making modifications to the Tiger Style Administration CSS.

After activating the two plugins, and implimenting this modification, my client feedback was overwhelmingly positive, making WordPress far more intuitive to navigate.

 I'll post the CSS solution soon.