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

Add proper validation for multiple uploaders in submission form

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-11-12 10:46:08 +01:00
parent 62f19467b7
commit e6d839f6a0
2 changed files with 31 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -421,7 +421,7 @@ let ReactS3FineUploader = React.createClass({
if(this.props.submitFile) {
this.props.submitFile(files[id]);
} else {
console.warn('You didn\'t define submitFile in as a prop in react-s3-fine-uploader');
console.warn('You didn\'t define submitFile as a prop in react-s3-fine-uploader');
}
// for explanation, check comment of if statement above
if(this.props.isReadyForFormSubmission && this.props.setIsUploadReady) {
@ -443,10 +443,10 @@ let ReactS3FineUploader = React.createClass({
/**
* We want to channel all errors in this component through one single method.
* As fineuploader's onError method cannot handle the callback parameters of
* As fineuploader's `onError` method cannot handle the callback parameters of
* a promise we define this proxy method to crunch them into the correct form.
*
* @param {error} err plain Javascript error
* @param {error} err a plain Javascript error
*/
onErrorPromiseProxy(err) {
this.onError(null, null, err.message);

40
js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js
View File

@ -36,7 +36,12 @@ const PRRegisterPieceForm = React.createClass({
getInitialState(){
return {
isUploadReady: true,
digitalWorkKeyReady: false,
thumbnailKeyReady: false,
// we set this to true, as it is not required
supportingMaterialsReady: true,
proofOfPaymentReady: false,
piece: null
};
},
@ -124,15 +129,25 @@ const PRRegisterPieceForm = React.createClass({
}
},
setIsUploadReady(isUploadReady) {
this.setState({
isUploadReady
});
/**
* This method is overloaded so that we can track the ready-state
* of each uploader in the component
* @param {string} uploaderKey Name of the uploader's key to track
*/
setIsUploadReady(uploaderKey) {
return (isUploadReady) => {
this.setState({
[uploaderKey]: isUploadReady
});
};
},
render() {
const { location } = this.props;
const { isUploadReady } = this.state;
const { digitalWorkKeyReady,
thumbnailKeyReady,
supportingMaterialsReady,
proofOfPaymentReady } = this.state;
return (
<div className="register-piece--form">
@ -203,7 +218,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader
fileInputElement={UploadButton}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady}
setIsUploadReady={this.setIsUploadReady('digitalWorkKeyReady')}
createBlobRoutine={{
url: ApiUrls.blob_digitalworks
}}
@ -233,7 +248,7 @@ const PRRegisterPieceForm = React.createClass({
url: ApiUrls.blob_thumbnails
}}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady}
setIsUploadReady={this.setIsUploadReady('thumbnailKeyReady')}
keyRoutine={{
url: AppConstants.serverUrl + 's3/key/',
fileClass: 'thumbnail'
@ -247,7 +262,8 @@ const PRRegisterPieceForm = React.createClass({
fileClassToUpload={{
singular: getLangText('Upload cover photo'),
plural: getLangText('Upload cover photos')
}}/>
}}
required/>
</Property>
<Property
name="supportingMaterials"
@ -256,7 +272,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader
fileInputElement={UploadButton}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady}
setIsUploadReady={this.setIsUploadReady('supportingMaterialsReady')}
createBlobRoutine={this.getCreateBlobRoutine()}
keyRoutine={{
url: AppConstants.serverUrl + 's3/key/',
@ -279,7 +295,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader
fileInputElement={UploadButton}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady}
setIsUploadReady={this.setIsUploadReady('proofOfPaymentReady')}
createBlobRoutine={this.getCreateBlobRoutine()}
keyRoutine={{
url: AppConstants.serverUrl + 's3/key/',
@ -314,7 +330,7 @@ const PRRegisterPieceForm = React.createClass({
<button
type="submit"
className="btn btn-default btn-wide"
disabled={!isUploadReady}
disabled={!(digitalWorkKeyReady && thumbnailKeyReady && proofOfPaymentReady && supportingMaterialsReady)}
onClick={this.submit}>
{getLangText('Submit to Portfolio Review')}
</button>