Permalink
Browse files

Added the postMessage transport plugin.

Added a postMessage API as static file to the GAE upload handler (postmessage.html).
Added support for postMessage transport file uploads to the basic file upload plugin.
Fixed tests to accord for the recent "delete selected" changes.
Fixed non-multipart file uploads for the PHP upload handler.

To use postMessage transport file uploads, add the plugin to the script section of your HTML page and initialize the fileupload plugin with the postMessage option, which must point to the URL of the postmessage.html file.
postMessage file uploads are currently only supported by Google Chrome and Firefox (8.0+), while Firefox doesn't allow cross-domain postMessage transports with File, Blob or FileList objects.
  • Loading branch information...
1 parent bd18e3a commit c405ca86d8cce1647a7847f9ab712558fd3a7feb @blueimp committed Nov 20, 2011
View
@@ -1,5 +1,5 @@
/*
- * jQuery File Upload Plugin JS Example 5.1.4
+ * jQuery File Upload Plugin JS Example 5.1.5
* https://github.com/blueimp/jQuery-File-Upload
*
* Copyright 2010, Sebastian Tschan
@@ -10,7 +10,7 @@
*/
/*jslint nomen: true, unparam: true, regexp: true */
-/*global $, window */
+/*global $, window, document */
$(function () {
'use strict';
@@ -68,7 +68,7 @@ $(function () {
e.preventDefault();
$('<iframe style="display:none;"></iframe>')
.prop('src', this.href)
- .appendTo('body');
+ .appendTo(document.body);
}
);
View
@@ -8,5 +8,9 @@ builtins:
- deferred: on
handlers:
+- url: /(favicon\.ico|robots\.txt|postmessage\.html)
+ static_files: static/\1
+ upload: static/(.*)
+ expiration: '1d'
- url: /.*
script: main.app
View
Binary file not shown.
@@ -0,0 +1,64 @@
+<!DOCTYPE HTML>
+<!--
+/*
+ * jQuery File Upload Plugin postMessage API 1.0
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2010, Sebastian Tschan
+ * https://blueimp.net
+ *
+ * Licensed under the MIT license:
+ * http://creativecommons.org/licenses/MIT/
+ */
+-->
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<title>jQuery File Upload Plugin postMessage API</title>
+<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
+</head>
+<body>
+<script>
+$(window).on('message', function (e) {
+ e = e.originalEvent;
+ var s = e.data,
+ xhr = $.ajaxSettings.xhr(),
+ f;
+ $(xhr.upload).on('progress', function (ev) {
+ ev = ev.originalEvent;
+ e.source.postMessage({
+ id: s.id,
+ type: ev.type,
+ timeStamp: ev.timeStamp,
+ lengthComputable: ev.lengthComputable,
+ loaded: ev.loaded,
+ total: ev.total
+ }, e.origin);
+ });
+ s.xhr = function () {
+ return xhr;
+ };
+ if (!(s.data instanceof Blob)) {
+ f = new FormData();
+ $.each(s.data, function (i, v) {
+ f.append(v.name, v.value);
+ });
+ s.data = f;
+ }
+ $.ajax(s).always(function (result, statusText, jqXHR) {
+ if (!jqXHR.done) {
+ jqXHR = result;
+ result = null;
+ }
+ e.source.postMessage({
+ id: s.id,
+ status: jqXHR.status,
+ statusText: statusText,
+ result: result,
+ headers: jqXHR.getAllResponseHeaders()
+ }, e.origin);
+ });
+});
+</script>
+</body>
+</html>
View
@@ -0,0 +1,2 @@
+User-agent: *
+Disallow:
View
@@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<!--
/*
- * jQuery File Upload Plugin Demo 5.3.1
+ * jQuery File Upload Plugin Demo 5.3.2
* https://github.com/blueimp/jQuery-File-Upload
*
* Copyright 2010, Sebastian Tschan
@@ -73,7 +73,7 @@
<button type="submit" class="start">Start upload</button>
<button type="reset" class="cancel">Cancel upload</button>
<button type="button" class="delete">Delete selected</button>
- <input type="checkbox" class="toggle" name="delete" value="1">
+ <input type="checkbox" class="toggle">
</div>
</form>
<div class="fileupload-content">
View
@@ -1,5 +1,5 @@
/*
- * jQuery File Upload Plugin 5.4.4
+ * jQuery File Upload Plugin 5.5
* https://github.com/blueimp/jQuery-File-Upload
*
* Copyright 2010, Sebastian Tschan
@@ -62,6 +62,9 @@
limitConcurrentUploads: undefined,
// Set the following option to true to force iframe transport uploads:
forceIframeTransport: false,
+ // Set the following option to the location of a postMessage window,
+ // to enable postMessage transport uploads:
+ postMessage: undefined,
// By default, XHR file uploads are sent as multipart/form-data.
// The iframe transport is always using multipart/form-data.
// Set to false to enable non-multipart XHR uploads:
@@ -243,32 +246,53 @@
}
}
if (options.multipart && typeof FormData !== 'undefined') {
- if (options.formData instanceof FormData) {
- formData = options.formData;
- } else {
- formData = new FormData();
- $.each(this._getFormData(options), function (index, field) {
- formData.append(field.name, field.value);
- });
- }
- if (options.blob) {
- formData.append(options.paramName, options.blob);
- } else {
- $.each(options.files, function (index, file) {
- // File objects are also Blob instances.
- // This check allows the tests to run with
- // dummy objects:
- if (file instanceof Blob) {
- formData.append(options.paramName, file);
- }
- });
+ if (options.postMessage) {
+ // window.postMessage does not allow sending FormData
+ // objects, so we just add the File/Blob objects to
+ // the formData array and let the postMessage window
+ // create the FormData object out of this array:
+ formData = this._getFormData(options);
+ if (options.blob) {
+ formData.push({
+ name: options.paramName,
+ value: options.blob
+ });
+ } else {
+ $.each(options.files, function (index, file) {
+ formData.push({
+ name: options.paramName,
+ value: file
+ });
+ });
+ }
+ } else {
+ if (options.formData instanceof FormData) {
+ formData = options.formData;
+ } else {
+ formData = new FormData();
+ $.each(this._getFormData(options), function (index, field) {
+ formData.append(field.name, field.value);
+ });
+ }
+ if (options.blob) {
+ formData.append(options.paramName, options.blob);
+ } else {
+ $.each(options.files, function (index, file) {
+ // File objects are also Blob instances.
+ // This check allows the tests to run with
+ // dummy objects:
+ if (file instanceof Blob) {
+ formData.append(options.paramName, file);
+ }
+ });
+ }
}
options.data = formData;
}
// Blob reference is not needed anymore, free memory:
options.blob = null;
},
-
+
_initIframeSettings: function (options) {
// Setting the dataType to iframe enables the iframe transport:
options.dataType = 'iframe ' + (options.dataType || '');
@@ -284,8 +308,13 @@
}
this._initProgressListener(options);
}
+ if (options.postMessage) {
+ // Setting the dataType to postmessage enables the
+ // postMessage transport:
+ options.dataType = 'postmessage ' + (options.dataType || '');
+ }
} else {
- this._initIframeSettings(options);
+ this._initIframeSettings(options, 'iframe');
}
},
View
@@ -1,5 +1,5 @@
/*
- * jQuery Iframe Transport Plugin 1.2.3
+ * jQuery Iframe Transport Plugin 1.2.4
* https://github.com/blueimp/jQuery-File-Upload
*
* Copyright 2011, Sebastian Tschan
@@ -9,8 +9,8 @@
* http://creativecommons.org/licenses/MIT/
*/
-/*jslint unparam: true */
-/*global jQuery */
+/*jslint unparam: true, nomen: true */
+/*global jQuery, document */
(function ($) {
'use strict';
@@ -24,13 +24,13 @@
// overrides the name property of the file input field(s)
// options.formData: an array of objects with name and value properties,
// equivalent to the return data of .serializeArray(), e.g.:
- // [{name: a, value: 1}, {name: b, value: 2}]
- $.ajaxTransport('iframe', function (options, originalOptions, jqXHR) {
- if (options.type === 'POST' || options.type === 'GET') {
+ // [{name: 'a', value: 1}, {name: 'b', value: 2}]
+ $.ajaxTransport('iframe', function (options) {
+ if (options.async && (options.type === 'POST' || options.type === 'GET')) {
var form,
iframe;
return {
- send: function (headers, completeCallback) {
+ send: function (_, completeCallback) {
form = $('<form style="display:none;"></form>');
// javascript:false as initial iframe src
// prevents warning popups on HTTPS in IE6.
@@ -115,7 +115,7 @@
});
}
});
- form.append(iframe).appendTo('body');
+ form.append(iframe).appendTo(document.body);
},
abort: function () {
if (iframe) {
@@ -0,0 +1,108 @@
+/*
+ * jQuery postMessage Transport Plugin 1.0
+ * https://github.com/blueimp/jQuery-File-Upload
+ *
+ * Copyright 2011, Sebastian Tschan
+ * https://blueimp.net
+ *
+ * Licensed under the MIT license:
+ * http://creativecommons.org/licenses/MIT/
+ */
+
+/*jslint unparam: true, nomen: true */
+/*global jQuery, window, document */
+
+(function ($) {
+ 'use strict';
+
+ var counter = 0,
+ names = [
+ 'accepts',
+ 'cache',
+ 'contents',
+ 'contentType',
+ 'crossDomain',
+ 'data',
+ 'dataType',
+ 'headers',
+ 'ifModified',
+ 'mimeType',
+ 'password',
+ 'processData',
+ 'timeout',
+ 'traditional',
+ 'type',
+ 'url',
+ 'username'
+ ],
+ convert = function (p) {
+ return p;
+ };
+
+ $.ajaxSetup({
+ converters: {
+ 'postmessage text': convert,
+ 'postmessage json': convert,
+ 'postmessage html': convert
+ }
+ });
+
+ $.ajaxTransport('postmessage', function (options) {
+ if (options.postMessage && window.postMessage) {
+ var iframe,
+ loc = $('<a>').prop('href', options.postMessage)[0],
+ target = loc.protocol + '//' + loc.host,
+ xhrUpload = options.xhr().upload;
+ return {
+ send: function (_, completeCallback) {
+ var message = {
+ id: 'postmessage-transport-' + (counter += 1)
+ },
+ eventName = 'message.' + message.id;
+ iframe = $(
+ '<iframe style="display:none;" src="' +
+ options.postMessage + '" name="' +
+ message.id + '"></iframe>'
+ ).bind('load', function () {
+ $.each(names, function (i, name) {
+ message[name] = options[name];
+ });
+ message.dataType = message.dataType.replace('postmessage ', '');
+ $(window).bind(eventName, function (e) {
+ e = e.originalEvent;
+ var data = e.data,
+ ev;
+ if (e.origin === target && data.id === message.id) {
+ if (data.type === 'progress') {
+ ev = document.createEvent('Event');
+ ev.initEvent(data.type, false, true);
+ $.extend(ev, data);
+ xhrUpload.dispatchEvent(ev);
+ } else {
+ completeCallback(
+ data.status,
+ data.statusText,
+ {postmessage: data.result},
+ data.headers
+ );
+ iframe.remove();
+ $(window).unbind(eventName);
+ }
+ }
+ });
+ iframe[0].contentWindow.postMessage(
+ message,
+ target
+ );
+ }).appendTo(document.body);
+ },
+ abort: function () {
+ if (iframe) {
+ iframe.remove();
+ }
+ }
+ };
+ }
+ });
+
+}(jQuery));
Oops, something went wrong.

0 comments on commit c405ca8

Please sign in to comment.