[drupal-devel] [feature] JS-based file upload

[stefan nagtegaal]

Issue status update for 
http://drupal.org/node/28483
Post a follow up: 
http://drupal.org/project/comments/add/28483

 Project:      Drupal
 Version:      cvs
 Component:    upload.module
 Category:     feature requests
 Priority:     normal
 Assigned to:  Steven
 Reported by:  Steven
 Updated by:   stefan nagtegaal
 Status:       patch (code needs review)

Maybe it is me, but Steven why do you bother about the fact that this
will work on Safari? All other JS/AJAX we currently have in core
doesn't work with Safari...


Is it something special, or is t just curiocity?


Stefan




stefan nagtegaal



Previous comments:
------------------------------------------------------------------------

Tue, 09 Aug 2005 01:13:03 +0000 : Steven

Attachment: http://drupal.org/files/issues/jsupload.patch (14.71 KB)

This patch adds JavaScript-based inline uploading (screenshot [1]).


It does this by redirecting the submission of the form to a hidden
<iframe> when you click "Attach" (we cannot submit data through Ajax
directly because you cannot read file contents from JS for security
reasons).
Once the file is submitted, the upload-section of the form is updated.


Things to note:



* The feature degrades back to the current behaviour without JS.
* If there are errors with the uploaded file (disallowed type, too big,
...), they are displayed at the top of the file attachments fieldset.
* Though the hidden-iframe method sounds dirty, it's quite compact and
is 100% implemented in .js files. The drupal.js api makes it a snap to
use.
* I included some minor improvements to the Drupal JS API and code.
* I added an API drupal_call_js() to bridge the PHP/JS gap: it takes a
function name and arguments, and outputs a <script> tag. The kicker is
that it preserves the structure and type of arguments, so e.g. PHP
associative arrays end up as objects in JS.
* I also included a progressbar widget [2] that I wrote for drumm's
ongoing update.php work. It includes Ajax status updating/monitoring,
but it is only used as a pure throbber in this patch. But as the code
was already written and is going to be used in the near future, I left
that part in. It's pretty small ;). If PHP supports ad-hoc upload info
in the future like Ruby on Rails, we can implement that in 5 minutes.

[1] http://www.acko.net/dumpx/jsupload.png
[2] http://www.acko.net/yay-progress




------------------------------------------------------------------------

Tue, 09 Aug 2005 01:39:42 +0000 : Steven

Attachment: http://drupal.org/files/issues/progress.gif (1.22 KB)

This image belongs in the misc directory.




------------------------------------------------------------------------

Tue, 09 Aug 2005 15:38:19 +0000 : m3avrck

This sounds like a great and much needed feature! I'm curious as to how
extendable this feature is because I would like to very soon create a
window that can be opened from a link (maybe even through TinyMCE) to
basically include links to documents on a Drupal website within the
content itself, instead of merely "attaching" them to the end of the
document. Taking this upload feature, along with better a file manager
could create quite an awesome webbased FTP like program that I know
many would find useful. I'll have to take a look at this patch much
more closely very soon.




------------------------------------------------------------------------

Wed, 10 Aug 2005 21:44:18 +0000 : drumm

+1


Works as expected and it degrades well (at first I didn't do a hard
refresh and my browser wasn't seeing the new js or css).




------------------------------------------------------------------------

Wed, 17 Aug 2005 00:41:14 +0000 : Steven

Attachment: http://drupal.org/files/issues/jsupload_0.patch (14.6 KB)

Keeping up to date. Still needs confirmed testing on KHTML browsers like
Konqueror and Safari, please.




------------------------------------------------------------------------

Wed, 17 Aug 2005 15:58:07 +0000 : Gabriel Radic

I'd be happy to test on Safari (1.2 and 2/1.3) and other WebKit browsers
and report the results here, but I can't apply the patch on any of my
installs (too risky) and don't have the time to set up a new Drupal
installation.


Steven, any chance for you to share a web page for me to test?


Thanks.