title: File uploads: Percentage completed progress bar
body: <p>I'm trying to add a 'percentage completed so far' progress bar to avatar uploads in <a href="https://github.com/buddypress/BuddyPress" rel="noreferrer">BuddyPress</a>. The aim is to stop users navigating away from the page before the upload is completed.</p>
  
  <p>The upload process is handled in BuddyPress by <code>bp_core_avatar_handle_upload()</code> in file bp-core/bp-core-avatars.php.  The function starts off by checking that the file has been uploaded properly using <code>bp_core_check_avatar_upload()</code>. It then checks that the file size is within limits, and that it has an accepted file extension (jpg, gif, png). If everything checks out, the user is allowed to crop the image (uses <a href="http://deepliquid.com/content/Jcrop.html" rel="noreferrer">Jcrop</a>) and then the image is moved to its real location.</p>
  
  <p>The actual upload is handled by the WordPress function <a href="http://codex.wordpress.org/Function_Reference/wp_handle_upload" rel="noreferrer">wp_handle_upload</a>.</p>
  
  <p>How can I create a 'percentage completed' progress bar and display it when the file is uploading?</p>