- Patch #28483 by Steven: JavaScript enabled uploading.
Comment from Steven: 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 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.
2005-08-31 18:37:30 +00:00
|
|
|
// Global killswitch
|
|
|
|
if (isJsEnabled()) {
|
|
|
|
addLoadEvent(uploadAutoAttach);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Attaches the upload behaviour to the upload form.
|
|
|
|
*/
|
|
|
|
function uploadAutoAttach() {
|
|
|
|
var acdb = [];
|
|
|
|
var inputs = document.getElementsByTagName('input');
|
|
|
|
for (i = 0; input = inputs[i]; i++) {
|
|
|
|
if (input && hasClass(input, 'upload')) {
|
|
|
|
var uri = input.value;
|
2005-12-16 12:50:38 +00:00
|
|
|
// Extract the button ID based on a subtring of the input name: edit[foo][bar] -> foo-bar
|
|
|
|
var button = input.name.substr(5, input.name.length - 6).replace('][', '-');
|
- Patch #28483 by Steven: JavaScript enabled uploading.
Comment from Steven: 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 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.
2005-08-31 18:37:30 +00:00
|
|
|
var wrapper = button + '-wrapper';
|
|
|
|
var hide = button + '-hide';
|
|
|
|
var upload = new jsUpload(uri, button, wrapper, hide);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* JS upload object.
|
|
|
|
*/
|
|
|
|
function jsUpload(uri, button, wrapper, hide) {
|
|
|
|
var upload = this;
|
|
|
|
this.button = button;
|
|
|
|
this.wrapper = wrapper;
|
|
|
|
this.hide = hide;
|
|
|
|
redirectFormButton(uri, $(button), this);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Handler for the form redirection submission.
|
|
|
|
*/
|
|
|
|
jsUpload.prototype.onsubmit = function () {
|
|
|
|
var hide = $(this.hide);
|
|
|
|
// Insert progressbar and stretch to take the same space.
|
|
|
|
this.progress = new progressBar('uploadprogress');
|
|
|
|
this.progress.setProgress(-1, 'Uploading file...');
|
|
|
|
this.progress.element.style.width = '28em';
|
|
|
|
this.progress.element.style.height = hide.offsetHeight +'px';
|
|
|
|
hide.parentNode.insertBefore(this.progress.element, hide);
|
2005-09-07 13:49:39 +00:00
|
|
|
// Hide file form (cannot use display: none, this mysteriously aborts form
|
|
|
|
// submission in Konqueror)
|
|
|
|
hide.style.position = 'absolute';
|
|
|
|
hide.style.left = '-2000px';
|
- Patch #28483 by Steven: JavaScript enabled uploading.
Comment from Steven: 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 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.
2005-08-31 18:37:30 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Handler for the form redirection completion.
|
|
|
|
*/
|
|
|
|
jsUpload.prototype.oncomplete = function (data) {
|
|
|
|
// Remove progressbar
|
|
|
|
removeNode(this.progress);
|
|
|
|
this.progress = null;
|
|
|
|
// Replace form and re-attach behaviour
|
|
|
|
$(this.wrapper).innerHTML = data;
|
|
|
|
uploadAutoAttach();
|
2005-10-07 06:11:12 +00:00
|
|
|
}
|