Skip to content

Some updates for newer jQuery. (Sorry about the reformat) #9

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
220 changes: 119 additions & 101 deletions jquery.uploadProgress.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,116 +8,134 @@
*
*/
(function($) {
$.fn.uploadProgress = function(options) {
options = $.extend({
dataType: "json",
interval: 2000,
progressBar: "#progressbar",
progressUrl: "/progress",
start: function() {},
uploading: function() {},
complete: function() {},
success: function() {},
error: function() {},
preloadImages: [],
uploadProgressPath: '/javascripts/jquery.uploadProgress.js',
jqueryPath: '/javascripts/jquery.js',
timer: ""
}, options);
$.fn.uploadProgress = function(options) {
options = $.extend({
dataType: "json",
interval: 2000,
progressBar: "#progressbar",
progressUrl: "/progress",
start: function() {},
uploading: function() {},
complete: function() {},
success: function() {},
error: function() {},
preloadImages: [],
uploadProgressPath: '/javascripts/jquery.uploadProgress.js',
jqueryPath: '/javascripts/jquery.js',
timer: ""
}, options);

$(function() {
//preload images
for(var i = 0; i<options.preloadImages.length; i++)
{
options.preloadImages[i] = $("<img>").attr("src", options.preloadImages[i]);
}
/* tried to add iframe after submit (to not always load it) but it won't work.
$(function() {
//preload images
for(var i = 0; i<options.preloadImages.length; i++)
{
options.preloadImages[i] = $("<img>").attr("src", options.preloadImages[i]);
}
/* tried to add iframe after submit (to not always load it) but it won't work.
safari can't get scripts properly while submitting files */
if($.browser.safari && top.document == document) {
/* iframe to send ajax requests in safari
var webkit = navigator.userAgent.indexOf('WebKit') != -1;
if(webkit && top.document == document) {
/* iframe to send ajax requests in safari
thanks to Michele Finotto for idea */
iframe = document.createElement('iframe');
iframe.name = "progressFrame";
$(iframe).css({width: '0', height: '0', position: 'absolute', top: '-3000px'});
document.body.appendChild(iframe);
iframe = document.createElement('iframe');
iframe.name = "progressFrame";
$(iframe).css({
width: '0',
height: '0',
position: 'absolute',
top: '-3000px'
});
document.body.appendChild(iframe);

var d = iframe.contentWindow.document;
d.open();
/* weird - safari won't load scripts without this lines... */
d.write('<html><head></head><body></body></html>');
d.close();
var d = iframe.contentWindow.document;
d.open();
/* weird - safari won't load scripts without this lines... */
d.write('<html><head></head><body></body></html>');
d.close();

var b = d.body;
var s = d.createElement('script');
s.src = options.jqueryPath;
/* must be sure that jquery is loaded */
s.onload = function() {
var s1 = d.createElement('script');
s1.src = options.uploadProgressPath;
b.appendChild(s1);
}
b.appendChild(s);
}
});
var b = d.body;
var s = d.createElement('script');
s.src = options.jqueryPath;
/* must be sure that jquery is loaded */
s.onload = function() {
var s1 = d.createElement('script');
s1.src = options.uploadProgressPath;
b.appendChild(s1);
}
b.appendChild(s);
}
});

return this.each(function(){
$(this).bind('submit', function() {
var uuid = "";
for (i = 0; i < 32; i++) { uuid += Math.floor(Math.random() * 16).toString(16); }
return this.each(function(){
$(this).bind('submit', function() {
var uuid = "";
for (i = 0; i < 32; i++) {
uuid += Math.floor(Math.random() * 16).toString(16);
}

/* update uuid */
options.uuid = uuid;
/* start callback */
options.start();
/* update uuid */
options.uuid = uuid;
/* start callback */
options.start();

/* patch the form-action tag to include the progress-id if X-Progress-ID has been already added just replace it */
if(old_id = /X-Progress-ID=([^&]+)/.exec($(this).attr("action"))) {
var action = $(this).attr("action").replace(old_id[1], uuid);
$(this).attr("action", action);
} else {
var action = jQuery(this).attr("action");
var action_sep = (action.lastIndexOf("?") != -1) ? "&": "?";
$(this).attr("action", action + action_sep + "X-Progress-ID=" + uuid);
}
var uploadProgress = $.browser.safari ? progressFrame.jQuery.uploadProgress : jQuery.uploadProgress;
options.timer = window.setInterval(function() { uploadProgress(this, options) }, options.interval);
});
});
};
/* patch the form-action tag to include the progress-id if X-Progress-ID has been already added just replace it */
if(old_id = /X-Progress-ID=([^&]+)/.exec($(this).attr("action"))) {
var action = $(this).attr("action").replace(old_id[1], uuid);
$(this).attr("action", action);
} else {
var action = jQuery(this).attr("action");
var action_sep = (action.lastIndexOf("?") != -1) ? "&": "?";
$(this).attr("action", action + action_sep + "X-Progress-ID=" + uuid);
}
var webkit = navigator.userAgent.indexOf('WebKit') != -1;
var uploadProgress = webkit ? progressFrame.jQuery.uploadProgress : jQuery.uploadProgress;
options.timer = window.setInterval(function() {
uploadProgress(this, options)
}, options.interval);
});
});
};

jQuery.uploadProgress = function(e, options) {
jQuery.ajax({
type: "GET",
url: options.progressUrl + "?X-Progress-ID=" + options.uuid,
dataType: options.dataType,
success: function(upload) {
if (upload) {
switch (upload.state) {
case 'uploading':
upload.percents = Math.floor((upload.received / upload.size)*1000)/10;

var bar = $.browser.safari ? $(options.progressBar, parent.document) : $(options.progressBar);
bar.css({width: upload.percents+'%'});
options.uploading(upload);
break;

case 'done':
options.success(upload);
case 'error':
window.clearTimeout(options.timer);
options.complete(upload);
break;
}

if (upload.state == 'error') {
options.error(upload);
jQuery.uploadProgress = function(e, options) {
jQuery.ajax({
type: "GET",
url: options.progressUrl + "?X-Progress-ID=" + options.uuid,
dataType: options.dataType,
error : function(xhr, text, error) {
alert('Upload progress reporting error: '+text);
window.clearTimeout(options.timer);
},
success :function(upload) {
if (upload) {
switch (upload.state) {
case 'uploading':
upload.percents = Math.floor((upload.received / upload.size)*1000)/10;

var webkit = navigator.userAgent.indexOf('WebKit') != -1;
var bar = webkit ? $(options.progressBar, parent.document) : $(options.progressBar);
bar.css({
width: upload.percents+'%'
});
options.uploading(upload);
break;

case 'done':
options.success(upload);
case 'error':
window.clearTimeout(options.timer);
options.complete(upload);
break;
}

if (upload.state == 'error') {
options.error(upload);
}
} else {
// Null/false/empty response, assume we're out of process
options.success(upload);
}
}
}
} else {
// Null/false/empty response, assume we're out of process
options.success(upload);
}
}
});
};
)};

})(jQuery);