ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-06-30 13:41:57 +02:00
Code Issues Releases Wiki Activity

add file hashing functionality to react fine uploader

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-07-23 16:47:32 +02:00
parent 80861813e9
commit 4ec8f6b718
4 changed files with 37 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
js/components/ascribe_detail/further_details.js
View File

@ -171,8 +171,7 @@ let FileUploader = React.createClass({
}
}}
areAssetsDownloadable={true}
areAssetsEditable={this.props.editable}/
localHashing={true}>
areAssetsEditable={this.props.editable}/>
</Property>
<hr />
</Form>

3
js/components/ascribe_forms/form_register_piece.js
View File

@ -172,7 +172,8 @@ let FileUploader = React.createClass({
customHeaders: {
'X-CSRFToken': getCookie(AppConstants.csrftoken)
}
}}/>
}}
localHashing={true} />
);
}
});

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

@ -516,6 +516,11 @@ var ReactS3FineUploader = React.createClass({
.then((convertedFiles) => {
// actually replacing all files with their txt-hash representative
files = convertedFiles;
// routine for adding all the files submitted to fineuploader for actual uploading them
// to the server
this.state.uploader.addFiles(files);
this.synchronizeFileLists(files);
})
.catch((err) => {
// if we're running into an error during the hash creation, we'll tell the user
@ -523,12 +528,26 @@ var ReactS3FineUploader = React.createClass({
let notification = new GlobalNotificationModel(err.message, 'danger', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
});
// if we're not hashing the files locally, we're just going to hand them over to fineuploader
// to upload them to the server
} else {
this.state.uploader.addFiles(files);
this.synchronizeFileLists(files);
}
},
// routine for adding all the files submitted to fineuploader for actual uploading them
// to the server
this.state.uploader.addFiles(files);
// ReactFineUploader is essentially just a react layer around s3 fineuploader.
// However, since we need to display the status of a file (progress, uploading) as well as
// be able to execute actions on a currently uploading file we need to exactly sync the file list
// fineuploader is keeping internally.
//
// Unfortunately though fineuploader is not keeping all of a File object's properties after
// submitting them via .addFiles (it deletes the type, key as well as the ObjectUrl (which we need for
// displaying a thumbnail)), we need to readd them manually after each file that gets submitted
// to the dropzone.
// This method is essentially taking care of all these steps.
synchronizeFileLists(files) {
let oldFiles = this.state.filesToUpload;
let oldAndNewFiles = this.state.uploader.getUploads();
// Add fineuploader specific information to new files

17
js/utils/file_utils.js
View File

@ -8,9 +8,15 @@ import SparkMD5 from 'spark-md5';
* @param {string} text regular javascript string
* @return {string} regular javascript string
*/
function makeTextFile(text) {
let data = new Blob([text], {type: 'text/plain'});
return window.URL.createObjectURL(data);
function makeTextFile(text, file) {
let textFileBlob = new Blob([text], {type: 'text/plain'});
let textFile = new File([textFileBlob], 'hash-of-' + file.name + '.txt', {
lastModifiedDate: file.lastModifiedDate,
lastModified: file.lastModified,
type: 'text/plain'
});
return textFile;
}
/**
@ -43,9 +49,8 @@ export function computeHashOfFile(file) {
fileHash,
Math.round(((new Date() - startTime) / 1000) % 60)); // Compute hash
let hashFile = makeTextFile(fileHash);
console.info('hash: ', hashFile);
resolve(hashFile);
let blobTextFile = makeTextFile(fileHash, file);
resolve(blobTextFile);
}
}.bind(this);