diff options
| author | Christopher Mueller <chrinimue@posteo.me> | 2020-03-31 13:56:59 +0300 |
|---|---|---|
| committer | Christopher Mueller <chrinimue@posteo.me> | 2020-03-31 13:56:59 +0300 |
| commit | b69d76feeedc27a5753ccb6363f666ba9ec121aa (patch) | |
| tree | 94197f194178eb9b05175956c63ab907be910a2d | |
| parent | dc9df2b7ab908539c3f793108c1c49b764e446f3 (diff) | |
Add basic progressbar to public upload page
Signed-off-by: Christopher Mueller <chrinimue@posteo.me>
| -rw-r--r-- | apps/files_sharing/css/public.scss | 4 | ||||
| -rw-r--r-- | apps/files_sharing/js/files_drop.js | 2 | ||||
| -rw-r--r-- | apps/files_sharing/js/templates/files_drop.handlebars | 3 | ||||
| -rw-r--r-- | apps/files_sharing/templates/public.php | 3 |
4 files changed, 9 insertions, 3 deletions
diff --git a/apps/files_sharing/css/public.scss b/apps/files_sharing/css/public.scss index a8207167c2c..366bc5f5e30 100644 --- a/apps/files_sharing/css/public.scss +++ b/apps/files_sharing/css/public.scss @@ -161,6 +161,10 @@ thead { margin-right: 7px; } +#drop-uploaded-files li #drop-upload-progress-bar { + margin-top: 7px; +} + .disclaimer, .note { margin: 0 auto 30px; diff --git a/apps/files_sharing/js/files_drop.js b/apps/files_sharing/js/files_drop.js index 26bb04a001a..c3af5c22062 100644 --- a/apps/files_sharing/js/files_drop.js +++ b/apps/files_sharing/js/files_drop.js @@ -120,9 +120,11 @@ if(progress === 100) { $('#drop-upload-done-indicator').removeClass('hidden'); $('#drop-upload-progress-indicator').addClass('hidden'); + $('#drop-upload-progress-bar').val(100); } else { $('#drop-upload-done-indicator').addClass('hidden'); $('#drop-upload-progress-indicator').removeClass('hidden'); + $('#drop-upload-progress-bar').val(progress); } } }); diff --git a/apps/files_sharing/js/templates/files_drop.handlebars b/apps/files_sharing/js/templates/files_drop.handlebars index b090e829793..d4cc3e85b91 100644 --- a/apps/files_sharing/js/templates/files_drop.handlebars +++ b/apps/files_sharing/js/templates/files_drop.handlebars @@ -1,6 +1,7 @@ <li data-toggle="tooltip" title="{{name}}" data-name="{{name}}"> {{#if isUploading}} - <span class="icon-loading-small"></span> {{name}} + <small>{{name}}</small><a id="status"></a> + <progress id="drop-upload-progress-bar" value="0" max="100"></progress> {{else}} <img src="{{iconSrc}}"/> {{name}} {{/if}} diff --git a/apps/files_sharing/templates/public.php b/apps/files_sharing/templates/public.php index a9cfaae9df1..e029279535e 100644 --- a/apps/files_sharing/templates/public.php +++ b/apps/files_sharing/templates/public.php @@ -98,9 +98,8 @@ $maxUploadFilesize = min($upload_max_filesize, $post_max_size); <?php } ?> <input type="file" name="files[]" class="hidden" multiple> - <a href="#" class="button icon-upload"><?php p($l->t('Select or drop files')) ?></a> - <div id="drop-upload-progress-indicator" style="padding-top: 25px;" class="hidden"><?php p($l->t('Uploading files…')) ?></div> + <div id="drop-upload-progress-indicator" style="padding-top: 25px;" class="hidden"><?php p($l->t('Uploading files')) ?></div> <div id="drop-upload-done-indicator" style="padding-top: 25px;" class="hidden"><?php p($l->t('Uploaded files:')) ?></div> <ul id="drop-uploaded-files"></ul> |