soaked and soaped

I’m following the Firebug development since I’m a heavy user of it. And since I switched to Firefox 3, I have to use the latest development version.

With beta8 (should be available in a few days) a long standing bug will fixed: $0 and $1 variables (containing the most recently inspected objects) now work again. Finally!
I think this was one of the most annoying issues I had since I switched to FF3 and FB1.2.

Also, I hope development gets a boost with John Resig spending half of his time at Mozilla with working on Firebug.

I’m really looking forward to one of the best web development tools being improved upon even more.

Firebug Links:

• Download
• Homepage
• Development
• Firebug 1.2 Release Notes

That’s really neat: http://goosh.org/

<pre style="font-size:10px; font-family:"Monaco, Courier, monospace";> Goosh goosh.org 0.4.4-beta #1 Tue, 03 Jun 08 22:59:00 UTC Google/Ajax

guest@goosh.org:/web> help


I think this is one of most interesting and coolest new features for developers in Firefox 3: Access to file input fields via Javascript.

You can access the contents of a file input via the files attribute and it’s items. Each of the items have the following attributes and methods:

Attributes: fileSize and fileName

Methods: getAsDataURL, getAsBinary and getAsText

Then all that’s left is to throw the data into the parameters of an ajax request and send it to your server — no hacks with iframes anymore.

The following demo shows you these amazing new capabilities.
Go crazy.

Demo: Access the contents of a text file

Demo: Display an image

Code

 1 
 2 function writeText() {
 3   var data = $('text').files.item(0).getAsBinary();
 4   $('result').update(data);
 5   $('textsize').update($('text').files.item(0).fileSize);
 6 }
 7 
 8 function writeImage() {
 9   var data = $('image').files.item(0).getAsDataURL();
10   $('imageresult').src = 'data:' + data;
11   $('imagesize').update($('image').files.item(0).fileSize);
12 }

Resources

• Bugzilla #371432
• W3C Working Draft
• http://www.squarefree.com/burningedge/releases/trunk-for-firefox-3.html
• http://developer.mozilla.org/en/docs/nsIDOMFile