pandora/static/js/chunkupload.js

265 lines
8.3 KiB
JavaScript
Raw Normal View History

2013-02-19 16:39:50 +00:00
// vi:si:et:sw=4:sts=4:ts=4
// GPL2+/MIT 2012
'use strict';
/*
Usage:
pandora.chunkupload({
file: file,
url: '/add',
data: {'name': file.name}
}).bindEvent({
progress: function(data) {
console.log(data.progress);
},
done: function(result) {
2013-07-14 17:44:30 +00:00
if (result.progress == 1) {
2013-02-19 16:39:50 +00:00
var response = JSON.parse(result.responseText);
2013-07-14 17:44:30 +00:00
if (response.resultUrl) {
2013-02-19 16:39:50 +00:00
document.location.href = response.resultUrl;
} else {
alert(response.status;
}
} else {
alert('!!!');
}
}
});
*/
pandora.chunkupload = function(options) {
var aborted = false,
chunkSize = options.size || 1024 * 1024,
2013-03-24 09:40:29 +00:00
chunkURL,
2013-02-19 16:39:50 +00:00
file = options.file,
maxRetry = -1,
nextChunkId,
paused = false,
2013-02-19 16:39:50 +00:00
retries = 0,
request,
that = Ox.Element();
options.data = options.data || {};
2013-02-19 16:39:50 +00:00
initUpload();
function done() {
var response;
try {
response = JSON.parse(that.responseText);
} catch(e) {}
2013-02-19 16:39:50 +00:00
that.triggerEvent('done', {
status: that.status,
progress: that.progress,
response: response,
2013-02-19 16:39:50 +00:00
responseText: that.responseText
});
}
function initUpload() {
2013-03-24 09:40:29 +00:00
// request upload slot from server
2013-02-19 16:39:50 +00:00
that.status = 'requesting chunk upload';
that.progress = 0;
request = new XMLHttpRequest();
request.addEventListener('load', function (evt) {
var response = {};
that.responseText = evt.target.responseText;
try {
response = JSON.parse(evt.target.responseText);
} catch(e) {
response = {};
that.status = 'failed to parse response';
that.progress = -1;
done();
}
if (response.maxRetry) {
maxRetry = response.maxRetry;
}
2013-03-24 09:40:29 +00:00
chunkURL = response.uploadUrl;
if (chunkURL) {
// only take local part of url
var url = Ox.parseURL(chunkURL);
chunkURL = url.pathname + url.search;
2013-02-19 16:39:50 +00:00
that.status = 'uploading';
that.progress = 0.0;
2013-03-24 09:40:29 +00:00
// start upload
2013-02-19 16:39:50 +00:00
uploadChunk(0);
} else {
that.status = 'upload failed, no upload url provided';
that.progress = -1;
done();
}
}, false);
request.addEventListener('error', function (evt) {
2016-06-28 14:59:16 +00:00
that.status = 'upload failed';
2013-02-19 16:39:50 +00:00
that.progress = -1;
that.responseText = evt.target.responseText;
done();
}, false);
request.addEventListener('abort', function (evt) {
that.status = 'aborted';
that.progress = -1;
done();
}, false);
var formData = new FormData();
2016-06-28 14:59:16 +00:00
2013-02-19 16:39:50 +00:00
Object.keys(options.data).forEach(function(key) {
formData.append(key, options.data[key]);
});
request.open('POST', options.url);
request.send(formData);
}
function progress(p) {
that.progress = p;
that.triggerEvent('progress', {
progress: that.progress,
status: that.status
});
}
function uploadChunk(chunkId) {
var bytesAvailable = file.size,
chunk,
chunkOffset = chunkId * chunkSize;
if (aborted) {
return;
}
2013-03-24 09:40:29 +00:00
if (file.mozSlice) {
2013-02-19 16:39:50 +00:00
chunk = file.mozSlice(chunkOffset, chunkOffset+chunkSize, file.type);
2013-07-14 17:44:30 +00:00
} else if (file.webkitSlice) {
2013-02-19 16:39:50 +00:00
chunk = file.webkitSlice(chunkOffset, chunkOffset+chunkSize, file.type);
2013-07-14 17:44:30 +00:00
} else if (file.slice) {
2013-02-19 16:39:50 +00:00
chunk = file.slice(chunkOffset, chunkOffset+chunkSize, file.type);
} else {
2013-05-09 10:13:58 +00:00
that.status = Ox._('Sorry, your browser is currently not supported.');
2013-03-24 09:40:29 +00:00
done();
2013-02-19 16:39:50 +00:00
}
progress(Math.min(parseFloat(chunkOffset)/bytesAvailable), 1);
2013-02-19 16:39:50 +00:00
request = new XMLHttpRequest();
request.addEventListener('load', function (evt) {
var response;
that.responseText = evt.target.responseText;
try {
response = JSON.parse(evt.target.responseText);
} catch(e) {
response = {};
}
if (response.done == 1) {
//upload finished
that.resultUrl = response.resultUrl;
// set progress to -1 if overall upload failed
that.progress = response.result;
2013-02-19 16:39:50 +00:00
that.status = 'done';
done();
} else if (response.result == 1) {
2013-03-24 09:40:29 +00:00
// reset retry counter
2013-02-19 16:39:50 +00:00
retries = 0;
2013-03-24 09:40:29 +00:00
// start uploading next chunk
if (paused) {
nextChunkId = chunkId + 1;
that.triggerEvent('paused', {next: nextChunkId});
} else {
if (Ox.isUndefined(response.offset) ||
response.offset == (chunkId +1) * chunkSize) {
uploadChunk(chunkId + 1);
} else {
// continue at chunk closest to offset from server
console.log('server offset', response.offset,
2014-04-25 01:25:25 +00:00
'next chunk', Math.floor(response.offset / chunkSize));
uploadChunk(Math.floor(response.offset / chunkSize));
}
}
2013-02-19 16:39:50 +00:00
} else {
2013-03-24 09:40:29 +00:00
// failed to upload, try again in 5 second
2013-02-19 16:39:50 +00:00
retries++;
if (maxRetry > 0 && retries > maxRetry) {
2016-06-28 14:59:16 +00:00
that.status = 'upload failed';
2013-02-19 16:39:50 +00:00
that.progress = -1;
done();
} else {
setTimeout(function() {
if (paused) {
nextChunkId = chunkId;
that.triggerEvent('paused', {next: nextChunkId});
} else {
uploadChunk(chunkId);
}
2013-02-19 16:39:50 +00:00
}, 5000);
}
}
}, false);
request.addEventListener('error', function (evt) {
2013-03-24 09:40:29 +00:00
// failed to upload, try again in 3 second
2013-02-19 16:39:50 +00:00
retries++;
if (maxRetry > 0 && retries > maxRetry) {
2016-06-28 14:59:16 +00:00
that.status = 'upload failed';
2013-02-19 16:39:50 +00:00
that.progress = -1;
done();
} else {
setTimeout(function() {
if (paused) {
nextChunkId = chunkId;
that.triggerEvent('paused', {next: nextChunkId});
} else {
uploadChunk(chunkId);
}
2013-02-19 16:39:50 +00:00
}, 3000);
}
}, false);
request.upload.addEventListener('progress', function (evt) {
if (evt.lengthComputable) {
progress(parseFloat(chunkOffset + evt.loaded) / bytesAvailable);
}
}, false);
request.addEventListener('abort', function (evt) {
that.status = 'aborted';
that.progress = -1;
done();
}, false);
var formData = new FormData();
Object.keys(options.data).forEach(function(key) {
formData.append(key, options.data[key]);
});
formData.append('offset', chunkOffset);
2013-02-19 16:39:50 +00:00
if (bytesAvailable <= chunkOffset + chunkSize) {
formData.append('done', 1);
}
formData.append('chunk', chunk);
2013-03-24 09:40:29 +00:00
request.open('POST', chunkURL, true);
2013-02-19 16:39:50 +00:00
request.send(formData);
}
that.abort = function() {
aborted = true;
2013-02-19 16:39:50 +00:00
if (request) {
request.abort();
request = null;
} else {
that.progress = -1;
done();
2013-02-19 16:39:50 +00:00
}
return that;
};
that.pause = function() {
paused = true;
return that;
};
that.resume = function() {
if (paused) {
paused = false;
if (nextChunkId) {
uploadChunk(nextChunkId);
nextChunkId = null;
}
}
return that;
2013-02-19 16:39:50 +00:00
};
2013-03-24 09:40:29 +00:00
2013-02-19 16:39:50 +00:00
return that;
2013-03-24 09:40:29 +00:00
2013-02-19 16:39:50 +00:00
};