Rich uploads with progressbar

Instead of relying on user interaction to increase the value of the progressbar and therefore the completion of the specified task, we can instead rely on the system to update it; deterministic means simply that something must be able to update it accurately.

In our final progressbar example we can incorporate the brand-new HTML5 file API in order to upload a file asynchronously, and can use Firefox's propriety onprogress event to update the progressbar while the file is uploading. This example will only work in Firefox 3+ at the time of writing, although hopefully more browsers will make use of both the file API and the onprogress event in the future.

This example will also only work correctly using a full web server with PHP installed and configured. We won't be looking at the server side of the upload process in this example, we're not interested in what happens to the file once it's been uploaded, only in updating the progressbar based on feedback received...