If you already know Firebug inside and out, feel free to move along. You already know how awesome it is.
OK, now that the know-it-alls are gone... I have to tell you that the other week I had another one of those "giant step ahead" moments in my development career. I used a step-through debugger for the first time (Firebug). I wouldn't admit this in public if it weren't for the fact that I think admitting it will help other people to take that step too.
I was having a hell-of-a time with a particular page. There was a lot of JavaScript going on on this page including validation and chained AJAX calls. Anyway, the page was, in some circumstances, throwing a JS slow-running script error across browsers. I actually tried for some time to put in alerts, comment out portions, etc. like I normally do. This was not working.
So, I said, "I think now is the time to check out the Firebug break-point thing". I went over to http://www.getfirebug.com and scanned the portion about the debugger. I set a break-point in a method above where I knew the slowness was occurring. Firebug, having paused the JS execution at that point, also showed me what data was being passed into the method. With the ability to see the data and step through line-by-line, it wasn't long until I found what was wrong. (Some records in our db have a guid for their email. And the regex for our email validation choked on them).
Here' my point: It is so much easier to debug JS with the proper tool that I am looking forward to the next tricky JS error!
Firebug is an amazing tool! I've been using it for a while for testing and debugging AJAX calls. I also use it to help figure out CSS issues quickly. If you don't know that you can edit your html and CSS, debug JS, monitor network activity and much more with Firebug, then you owe it to yourself to go read about it. I know now that not having done this earlier was penny-wise and dollar foolish on my part.
You can come back and thank me for the kick in the pants later. :-)
If you are using my BlogCFC JS Twitter Pod or you visit my blog, you may have noticed that the Twitter time-stamp started reading "About 365 days ago" when the year rolled over. I finally sat down and looked into this today. Turns out, it's all my fault. I had to do some string manipulation on the date that Twitter sends to get it to work in IE and FF. Apparently I hard-coded '2007' in there to get it working. Maybe, I thought the world would end last year... Well, it didn't. So that code has been updated with #year(now())#.
The Twitter Pod download is still available here. And I'd still love to hear if anyone uses it on their blog.
In march I created a BlogCFC pod to show Twitter messages using the JS Twitter badge script. Recently, Twitter changed the location of the script.
So, my script
http://www.twitter.com/t/status/user_timeline/3026521?callback=twitterCallback&count=10
changed to
http://www.twitter.com/statuses/user_timeline/3026521.json?callback=twitterCallback&count=10
Also, Twitter's server seems to have load issues at times. This can pause pages to render slowly while they wait for the script file. So, if you move the script include to the bottom of tags/layout.cfm, then it won't interfere with the page rendering.
The download is still available here. And I'd still love to hear if anyone uses it on their blog.
I saw this story about Google Gears on Ryan's blog earlier. It is such cool news that I wanted to make sure it got spread. Having a consistent cross-browser, cross-platform way to implement an "occasionally connected" work-flow for web-applications seems like huge news to me. Plus, Google + Adobe + Mozilla = Happy if you ask me.
I've already installed Gears and tried it with Google Reader under both WinXP and PCLinuxOS 2007.
Please go and check out the JavaScript syntax for executing SQL against a local SQLite database.
" What Google Gears means for Rich Internet Applications and Apollo by ZDNet's Ryan Stewart -- Some big news today that Google is announcing an open source project called "Google Gears" which is an open source collaboration between Google, Adobe, Mozilla, and Opera that enables offline web applications in the browser. It seems very similar to the announcement that Mozilla made about the offline features in Firefox 3 and will be [...]"
For some reason I clicked the print button on my blog the other day. It opened up a PDF in the tab I was in. Well, I just didn't like that (sorry Ray).
I recently built a print feature for an AJAX heavy project at work. Since this project uses Spry, the detail you see doesn't exist until javascript renders it in the browser. So, I came up with a solution of opening another window and then pushing the rendered contents into it. The new window even has a print.css. So, although it's the same mark-up, it looks different.
If you want to see the code I wrote for work you can check it out here. Just drill all the way into a vehicle and click the print button on the right.
Anyway, I used the same idea to change the print functionality on my blog. I've posted the resulting code and instructions for download here.
If anyone uses it I would love to hear about it.
April 3, 2007 5:14 PM
| Chris P.
Categories :
JavaScript
This is a little late...
But, Adobe snuck out a preview of Spry 1.5 on March 15th.
You can go get it here.
If you haven't heard, Spry is an AJAX and DHTML JavaScript library.
I've been using it on a project at work. It's pretty slick. It reminds me of Flex the way you bind DataSets to "controls" and use curly brackets to reference variables.
The 1.5 preview seems to have fixed a couple of small issues that I had with it. It also promoted JSON DataSets to first-class citizenship. And I think that rocks!
So, if you haven't already, go check it out.