Building simplicidade.org: notes, projects, and occasional rants

HTML5, Micro-formats, and the progress tag

Just now, in the uf mailing list, there was a message by Alexandre Van de Sande about a Developer Works article about HTML5.

It seems that HTML5 has a set of semantic tags with lot of potential, and some of them cross into (until now) micro-format territory.

I skimmed through the Developer Works article and one particular element caught my attention: <progress />.

From the article:

The progress element represents the state of an ongoing process, like the progress bar in a graphical user interface (GUI) application. For instance, it can show you what percentage of a file is downloaded or how far you are into a movie. This progress control says that a download is 33% complete:

 <p>Downloaded: 
    <progress value="1534602" max="4603807">33%</progress>
 </p>

The value attribute shows the current state of the operation. The max attribute shows the total amount toward which the progress is moving. Here the element indicates that 1,534,602 bytes out of a total 4,603,807 bytes have been downloaded.

You can display indefinite progress bars by omitting the max attribute.

You should use the JavaScript language to dynamically update the progress bar as the operation continues. Statically, this element isn't very interesting.

First, apart of styling-control, I don't see why dont browsers gives us a standard file upload dialog (probably modal for the tab), stating which file I'm currently uploading, the percentage, and the speed, all data that the browser has access to. Maybe there is a Firefox Plugin, maybe.

Second, this is a good tag, but the last part, about dynamically update the progress bar with Javascript, I wonder how exactly would it work: will it require the current system of server-side tracking of uploads and AJAX pooling, or will the browser itself generate Javascript events with the progress?

I've got to find time to read the about HTML5 and the WHATWG.