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

Wed Aug 17 21:31:58 UTC 2005

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)

Okay, I found out how to debug with Safari..

When I goto: '?q=node/add/$type', I get these errors:
- SyntaxError - Parse error (line 37)
  drupal.js
- TypeError - Object (result of expression isJsEnabled) does not allow
calls (line 3)
  collapse.js
- TypeError - Object (result of expression isJsEnabled) does not allow
calls (line 4)
  autocomplete.js

Maybe you know what's wrong or what todo about it?

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.

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

Wed, 17 Aug 2005 16:09:43 +0000 : stefan nagtegaal

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

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

Wed, 17 Aug 2005 16:35:43 +0000 : Steven

Mostly because I can't test it, and Javascript is a fidgety business.
But I have to admit I was surprised when I found out (recently!) that
Drupal JS doesn't work in Safari. The features we check for are all
basic W3C DOM stuff, I assumed Safari would support them.

Do we know why Safari doesn't work?

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

Wed, 17 Aug 2005 19:44:23 +0000 : Crell

I'm not sure about Drupal in particular, but Safari is missing a LOT Of
W3C DOM "stuff".  Many functions are there, but stubbed out and do
nothing.  Others are badly implemented.  It's closer to the standard
than IE is, but with the missing functionality I'm not sure which is
really easier to code for.  I don't know if Konqueror is crippled in
the same way, but I would suspect it is.  (I've not gotten any decent
Ajax to work in Konqueror myself, although I freely admit to not being
an expert on the subject.)