diff --git a/apps/files/css/upload.css b/apps/files/css/upload.css index bdc258b506..1b572963ff 100644 --- a/apps/files/css/upload.css +++ b/apps/files/css/upload.css @@ -59,11 +59,44 @@ width: 200px; height: 36px; display:inline-block; + text-align: center; } +#uploadprogressbar .ui-progressbar-value.ui-widget-header.ui-corner-left { + height: 100%; + top: 0px; + left: 0px; + position: absolute; + overflow: hidden; +} +#uploadprogressbar .label { + font-weight: bold; + top: 6px; + opacity: 1; +} +#uploadprogressbar .label.inner { + color:white; + position: absolute; + display: block; + width: 200px; +} +#uploadprogressbar .label.outer { + position: relative; + color: black; +} +#uploadprogresswrapper .percents{ + margin-left: 3px; + font-size: 13px; + display:inline-block; + float: left; + width: 5em; + text-align: center; + position: relative; + top: 7px; +} + #uploadprogressbar + stop { font-size: 13px; } - .oc-dialog .fileexists table { width: 100%; } diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js index 2637d13f9b..36bdc58974 100644 --- a/apps/files/js/file-upload.js +++ b/apps/files/js/file-upload.js @@ -181,6 +181,7 @@ OC.Upload = { _hideProgressBar: function() { $('#uploadprogresswrapper input.stop').fadeOut(); + $('#uploadprogresswrapper .percents').fadeOut(); $('#uploadprogressbar').fadeOut(function() { $('#file_upload_start').trigger(new $.Event('resized')); }); @@ -454,7 +455,10 @@ OC.Upload = { fileupload.on('fileuploadstart', function(e, data) { OC.Upload.log('progress handle fileuploadstart', e, data); $('#uploadprogresswrapper input.stop').show(); + $('#uploadprogresswrapper .percents').show(); + $('#uploadprogresswrapper .label').show(); $('#uploadprogressbar').progressbar({value: 0}); + $('#uploadprogressbar .ui-progressbar-value').html('Uploading...'); OC.Upload._showProgressBar(); }); fileupload.on('fileuploadprogress', function(e, data) { @@ -464,11 +468,12 @@ OC.Upload = { fileupload.on('fileuploadprogressall', function(e, data) { OC.Upload.log('progress handle fileuploadprogressall', e, data); var progress = (data.loaded / data.total) * 100; + $('#uploadprogressbar .label').text(humanFileSize(data.loaded) + " of " + humanFileSize(data.total)); + $('#uploadprogresswrapper .percents').text(humanFileSize(data.bitrate) + '/s') $('#uploadprogressbar').progressbar('value', progress); }); fileupload.on('fileuploadstop', function(e, data) { OC.Upload.log('progress handle fileuploadstop', e, data); - OC.Upload._hideProgressBar(); }); fileupload.on('fileuploadfail', function(e, data) { diff --git a/apps/files/templates/list.php b/apps/files/templates/list.php index a0138967cd..a25172679a 100644 --- a/apps/files/templates/list.php +++ b/apps/files/templates/list.php @@ -37,9 +37,11 @@
-
- +
+ +
+ +