ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2025-02-14 21:10:27 +01:00
Code Issues Releases Wiki Activity

add user interface feedback

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-07-24 15:13:20 +02:00
parent 494ab209ca
commit 38751ae612
3 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
js/components/ascribe_uploader/file_drag_and_drop.js
View File

@ -1,6 +1,7 @@
'use strict'; 'use strict';
import React from 'react'; import React from 'react';
import ProgressBar from 'react-progressbar';
import FileDragAndDropDialog from './file_drag_and_drop_dialog'; import FileDragAndDropDialog from './file_drag_and_drop_dialog';
import FileDragAndDropPreviewIterator from './file_drag_and_drop_preview_iterator'; import FileDragAndDropPreviewIterator from './file_drag_and_drop_preview_iterator';
@ -151,11 +152,8 @@ let FileDragAndDrop = React.createClass({
return ( return (
<div className={className}> <div className={className}>
<p>{getLangText('Computing hashes... This may take a few minutes.')}</p> <p>{getLangText('Computing hashes... This may take a few minutes.')}</p>
<p>{this.props.hashingProgress}</p> <p>{Math.ceil(this.props.hashingProgress)}%</p>
<img <ProgressBar completed={this.props.hashingProgress} color="#48DACB"/>
height={35}
className="action-file"
src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
</div> </div>
); );
} else { } else {

11
js/components/ascribe_uploader/react_s3_fine_uploader.js
View File

@ -151,7 +151,7 @@ var ReactS3FineUploader = React.createClass({
} }
return name; return name;
}, },
multiple: true, multiple: false,
defaultErrorMessage: getLangText('Unexpected error. Please contact us if this happens repeatedly.') defaultErrorMessage: getLangText('Unexpected error. Please contact us if this happens repeatedly.')
}; };
}, },
@ -528,7 +528,8 @@ var ReactS3FineUploader = React.createClass({
// update file's progress // update file's progress
files[index].progress = value; files[index].progress = value;
// calculate overall progress // calculate weighted average for overall progress of all
// currently hashing files
let overallHashingProgress = 0; let overallHashingProgress = 0;
for(let i = 0; i < files.length; i++) { for(let i = 0; i < files.length; i++) {
let filesSliceOfOverall = files[i].size / overallFileSize; let filesSliceOfOverall = files[i].size / overallFileSize;
@ -536,11 +537,15 @@ var ReactS3FineUploader = React.createClass({
overallHashingProgress += filesSliceOfOverall * files[i].progress; overallHashingProgress += filesSliceOfOverall * files[i].progress;
} }
this.setState({ hashingProgress: overallHashingProgress }); // Multiply by 100, since react-progressbar expects decimal numbers
this.setState({ hashingProgress: overallHashingProgress * 100});
}) })
.then((convertedFiles) => { .then((convertedFiles) => {
// clear hashing progress, since its done
this.setState({ hashingProgress: -1});
// actually replacing all files with their txt-hash representative // actually replacing all files with their txt-hash representative
files = convertedFiles; files = convertedFiles;

2
sass/ascribe_uploader.scss
View File

@ -10,7 +10,7 @@
cursor: default !important; cursor: default !important;
padding: 1.5em 1.5em 1.5em 0; padding: 1.5em 0 1.5em 0;
} }
.inactive-dropzone { .inactive-dropzone {