4

Several resources I have found claim, that GMail File Upload incorporates Flash to display progress bar or to allow multiple file uploads.

For example:

My question is, it true, that GMail uses Flash to generate upload Progress Bar? If not, how does GMail achieve Progress Bars in IE9, which does not support FileAPI? I did several tests, and I was not able to confirm presence of Flash during GMail File Upload process:

  • I installed FlashBlocker which was blocking Flash content effectively. However, GMail File Upload progress Bar was not blocked.
  • I right clicked on the Progress Bar to see if it is Flash applet, but no it is not.
  • I checked source code, but I did not find any reference to .swf code.

So how does the GMail imlement its File Upload, which is displayed in all the browsers including IE9?

Any idea, please, if another developers can achieve the same results, or if the File Upload Progress Bar is Google specific?

I know there are many plugins available for Google Upload, but I wish to have clean JavaScript, HTML5, PHP, CSS3 and compatibility with IE9. I am therefore willing to code all the code on my own, if I understand the subject.

I use the following tools:

  • Javascript
  • HTML5
  • PHP
  • MySQL
  • CSS3

Thank you.

Update:

It really looks that GMail uses Flash to calculate Progress percentage when uploading a file. It than uses CSS to generate progress bar, therefore no Flash applet is used to display the Progress Bar.

I discovered this by disabling Flash in IE9. In contrast to Chrome, Flash can be easily disabled in IE 9.

Please, if you have anything to add to this topic, I will gladly discuss. For example, it would be interesting to know, how Flash applet can generate file upload progress percentage, and how it than can communicate that information with JavaScript or CSS.

Bunkai.Satori
  • 4,698
  • 13
  • 49
  • 77

2 Answers2

3

I have further explored, and I have to confirm, YES, still today, GMail must use several Flash objects that support file/attachment upload.

It is difficult to disable Flash in Chrome. However, it can be disabled in IE. After disabling flash in IE, GMail has switched to another, less interactive upload system without progress bars.

This is a clear proof of that GMail still uses Flash to support its upload routines.

Bunkai.Satori
  • 4,698
  • 13
  • 49
  • 77
2

Google switched to HTML5 multi-file uploads about 2 years ago. I think they use fallback flash uploaders. http://www.webmonkey.com/2010/04/google-turns-to-html5-for-gmails-new-drag-and-drop-attachments/

This Library (jQuery File-Upload - Demo here: http://blueimp.github.com/jQuery-File-Upload/) claims that it can use the File Progress of Internet Explorer (at least some way ;-)):

All versions of Internet Explorer will also update the global progress bar after each iframe based upload. However since IE does not report the file size, the global progress bar will measure each uploaded file the same without regard to the size of the uploaded file. https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support

Gregor
  • 4,306
  • 1
  • 22
  • 37
  • Hi and thank you for your response. Well, I know, that Drag and Drop is normally supported by JavaScript FileApi library. It is therefore logical, that it does not work in IE9. However, my question was more about Progress Bar. GMail Upload Progress Bar works well in IE9. How then does GMail achieve Progress Bar in IE9, if Flash is not used? – Bunkai.Satori Sep 15 '12 at 13:38
  • I edited my answer to correspond to the progress bar issue in Internet Explorer. – Gregor Sep 15 '12 at 13:45
  • Thank you for your response and modification. I see, it is worth of studying JQuery. I did already check for JQuery on IE9 GMail webpage, but I did not find any references to it. I understand, that JQuery in your answer might be just an example, but do you really think, that Google is using JQuery in its GMail? – Bunkai.Satori Sep 15 '12 at 13:56
  • 1
    I meant of an example. I don't think that Google uses jQuery inside Gmail, but the functionalty of parts of the jQuery library will be inside Google's libraries in the Gmail source. – Gregor Sep 15 '12 at 13:59
  • +1 I understand your point, and thank you for your great ideas. I will keep this question open for some while to see, if I can find anybody, who has maybe more information on how Google Mail is implemented in IE9. – Bunkai.Satori Sep 15 '12 at 14:04
  • Btw, I just tested jQuery file upload on both: IE9 and Chrome. Chrome has correct progress bar showing real progress. However, IE9 has only a kind of animated placeholder showing that there is something happening, but it does not shows the progress. This is in contrast with what can be seen on GMail on IE9. There must be something more in it. – Bunkai.Satori Sep 15 '12 at 14:10
  • 1
    For all those who are interested in this topic, maybe PHP Upload Progress bar could be a solution. It requires APC to be installed on PHP server, but then progress bar works on both: IE9 and Chrome. Feel free to test: http://www.johnboy.com/php-upload-progress-bar/ – Bunkai.Satori Sep 15 '12 at 15:01