Commit bbc804de by Dányi Bence

one: ajax file upload improved

parent f395990f
...@@ -74,8 +74,18 @@ $(function() { ...@@ -74,8 +74,18 @@ $(function() {
return false; return false;
}) })
function convert(n, skip) {
skip = skip | 0;
var suffix = 'B KB MB GB'.split(' ');
for(var i = skip; n > 1024; i++) {
n /= 1024;
}
return n.toFixed(2) + ' ' + suffix[i];
}
function Model() { function Model() {
var self = this; var self = this;
var uploadURLRequestInProgress=false;
self.files = ko.observableArray(); self.files = ko.observableArray();
self.allFiles = []; self.allFiles = [];
self.notInRoot = ko.observable(false); self.notInRoot = ko.observable(false);
...@@ -138,13 +148,6 @@ $(function() { ...@@ -138,13 +148,6 @@ $(function() {
} }
function addFile(d) { function addFile(d) {
function convert(n){
var suffix = 'B KB MB GB'.split(' ');
for(var i=0;n>1024;i++){
n/=1024;
}
return n.toFixed(2)+' '+suffix[i];
}
var viewData; var viewData;
if(d.TYPE === 'D') { if(d.TYPE === 'D') {
viewData = { viewData = {
...@@ -213,10 +216,10 @@ $(function() { ...@@ -213,10 +216,10 @@ $(function() {
var newName = $(e.target).parent().parent().parent().find('.name input[type=text]').val(); var newName = $(e.target).parent().parent().parent().find('.name input[type=text]').val();
$.ajax({ $.ajax({
type: 'POST', type: 'POST',
data: 'path='+self.currentPath()+item.originalName+'&new='+newName, data: 'path=' + self.currentPath() + item.originalName + '&new=' + newName,
url: '/ajax/store/rename', url: '/ajax/store/rename',
dataType: 'json', dataType: 'json',
success: function(data){ success: function(data) {
console.log(data); console.log(data);
loadFolder(self.currentPath()); loadFolder(self.currentPath());
} }
...@@ -225,6 +228,7 @@ $(function() { ...@@ -225,6 +228,7 @@ $(function() {
} }
self.uploadURL = ko.observable('/'); self.uploadURL = ko.observable('/');
self.getUploadURL = function() { self.getUploadURL = function() {
uploadURLRequestInProgress=true;
$.ajax({ $.ajax({
type: 'POST', type: 'POST',
data: 'ul=' + self.currentPath() + '&next=' + encodeURI(window.location.href), data: 'ul=' + self.currentPath() + '&next=' + encodeURI(window.location.href),
...@@ -232,6 +236,7 @@ $(function() { ...@@ -232,6 +236,7 @@ $(function() {
dataType: 'json', dataType: 'json',
success: function(data) { success: function(data) {
self.uploadURL(data.url); self.uploadURL(data.url);
uploadURLRequestInProgress=false;
} }
}) })
} }
...@@ -264,6 +269,7 @@ $(function() { ...@@ -264,6 +269,7 @@ $(function() {
// now post a new XHR request // now post a new XHR request
if(tests.formdata) { if(tests.formdata) {
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
var start = new Date().getTime();
xhr.open('POST', self.uploadURL()); xhr.open('POST', self.uploadURL());
xhr.onload = xhr.onerror = function() { xhr.onload = xhr.onerror = function() {
$('.file-upload').removeClass('opened'); $('.file-upload').removeClass('opened');
...@@ -277,10 +283,10 @@ $(function() { ...@@ -277,10 +283,10 @@ $(function() {
if(tests.progress) { if(tests.progress) {
$('#upload-zone').hide(); $('#upload-zone').hide();
$('#upload-progress-text').show(); $('#upload-progress-text').show();
var originalUsedQuota=self.quota.rawUsed(); var originalUsedQuota = self.quota.rawUsed();
xhr.upload.onprogress = function(event) { xhr.upload.onprogress = function(event) {
if(event.lengthComputable) { if(event.lengthComputable) {
self.quota.rawUsed(originalUsedQuota+parseInt(event.loaded/1024)); self.quota.rawUsed(originalUsedQuota + parseInt(event.loaded / 1024));
var complete = (event.loaded / event.total * 100 | 0); var complete = (event.loaded / event.total * 100 | 0);
//progress.value = progress.innerHTML = complete; //progress.value = progress.innerHTML = complete;
self.uploadProgress(complete.toFixed(1) + '%'); self.uploadProgress(complete.toFixed(1) + '%');
...@@ -295,10 +301,11 @@ $(function() { ...@@ -295,10 +301,11 @@ $(function() {
t /= 1024; t /= 1024;
} }
t = t.toFixed(1) + ' ' + suffix[i]; t = t.toFixed(1) + ' ' + suffix[i];
var diff = new Date().getTime() - start;
if(complete < 100) { if(complete < 100) {
$('#upload-progress-text').html('Feltöltés: ' + l + '/' + t + ' (' + (event.loaded / event.total * 100).toFixed(2) + '%)'); $('#upload-progress-text').html('Feltöltés: ' + convert(event.loaded / diff * 1000) + '/s (' + (event.loaded / event.total * 100).toFixed(2) + '%)');
} else { } else {
$('#upload-progress-text').html('Feltöltés: Mindjárt kész...'); $('#upload-progress-text').html('Feltöltés: Kész, feldolgozás...');
} }
} }
} }
...@@ -313,34 +320,27 @@ $(function() { ...@@ -313,34 +320,27 @@ $(function() {
readfiles(e.dataTransfer.files); readfiles(e.dataTransfer.files);
return false; return false;
}); });
document.addEventListener('dragover', function(e) {
if(!uploadURLRequestInProgress && self.uploadURL() == '/'){
$('.file-upload .summary').click();
}
e.stopPropagation();
e.preventDefault();
return false;
});
self.quota = { self.quota = {
rawUsed: ko.observable(0), rawUsed: ko.observable(0),
rawSoft: ko.observable(0), rawSoft: ko.observable(0),
rawHard: ko.observable(0) rawHard: ko.observable(0)
}; };
self.quota.used=ko.computed(function(){ self.quota.used = ko.computed(function() {
var suffix = 'KB MB GB'.split(' '); return convert(self.quota.rawUsed(),1);
var l=self.quota.rawUsed();
for(var i = 0; l > 1024; i++) {
l /= 1024;
}
return l.toFixed(1)+' '+suffix[i];
}); });
self.quota.hard=ko.computed(function(){ self.quota.hard = ko.computed(function() {
var suffix = 'KB MB GB'.split(' '); return convert(self.quota.rawHard(),1);
var l=self.quota.rawHard();
for(var i = 0; l > 1024; i++) {
l /= 1024;
}
return l.toFixed(1)+' '+suffix[i];
}); });
self.quota.soft=ko.computed(function(){ self.quota.soft = ko.computed(function() {
var suffix = 'KB MB GB'.split(' '); return convert(self.quota.rawSoft(),1);
var l=self.quota.rawSoft();
for(var i = 0; l > 1024; i++) {
l /= 1024;
}
return l.toFixed(1)+' '+suffix[i];
}); });
self.quota.usedBar = ko.computed(function() { self.quota.usedBar = ko.computed(function() {
return(self.quota.rawUsed() / self.quota.rawHard() * 100).toFixed(0) + '%'; return(self.quota.rawUsed() / self.quota.rawHard() * 100).toFixed(0) + '%';
...@@ -367,14 +367,18 @@ $(function() { ...@@ -367,14 +367,18 @@ $(function() {
var model = new Model(); var model = new Model();
ko.applyBindings(model); ko.applyBindings(model);
document.addEventListener('dragenter', function(e) { document.addEventListener('dragenter', function(e) {
console.log('enter');
//$('.file-upload .summary').click();
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
return false; return false;
}); });
document.addEventListener('dragover', function(e) {
document.addEventListener('drag', function(e) {
console.log('drag');
//$('.file-upload .summary').click();
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
return false; return false;
}); });
}) })
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment