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

Clean up components using the uploader in preparation for move to ascribe/react-components

This commit is contained in:
Brett Sun 2016-02-15 15:48:49 +01:00
parent 4a860364d3
commit 8650b0497c
11 changed files with 57 additions and 55 deletions

View File

@ -1,8 +1,8 @@
. .
server.js
gulpfile.js gulpfile.js
node_modules node_modules/*
js/**/__tests__ js/**/__tests__
server.js
js/components/ascribe_uploader/vendor js/components/ascribe_uploader/vendor

View File

@ -45,13 +45,13 @@ let FurtherDetails = React.createClass({
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
}, },
submitFile(file) { onSubmitFile(file) {
this.setState({ this.setState({
otherDataKey: file.key otherDataKey: file.key
}); });
}, },
setIsUploadReady(isReady) { setIsUploaderValidated(isReady) {
this.setState({ this.setState({
isUploadReady: isReady isUploadReady: isReady
}); });
@ -87,8 +87,8 @@ let FurtherDetails = React.createClass({
pieceId={pieceId} /> pieceId={pieceId} />
<Form> <Form>
<FurtherDetailsFileuploader <FurtherDetailsFileuploader
submitFile={this.submitFile} onSubmitFile={this.onSubmitFile}
setIsUploadReady={this.setIsUploadReady} setIsUploaderValidated={this.setIsUploaderValidated}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
editable={editable} editable={editable}
overrideForm={true} overrideForm={true}

View File

@ -27,10 +27,10 @@ let FurtherDetailsFileuploader = React.createClass({
// Props for ReactS3FineUploader // Props for ReactS3FineUploader
areAssetsDownloadable: bool, areAssetsDownloadable: bool,
isReadyForFormSubmission: func, isReadyForFormSubmission: func,
submitFile: func, // TODO: rename to onSubmitFile onSubmitFile: func,
onValidationFailed: func, onValidationFailed: func,
multiple: bool, multiple: bool,
setIsUploadReady: func, //TODO: rename to setIsUploaderValidated setIsUploaderValidated: func,
showErrorPrompt: bool, showErrorPrompt: bool,
validation: ReactS3FineUploader.propTypes.validation validation: ReactS3FineUploader.propTypes.validation
}, },
@ -51,9 +51,9 @@ let FurtherDetailsFileuploader = React.createClass({
onValidationFailed, onValidationFailed,
otherData, otherData,
pieceId, pieceId,
setIsUploadReady, setIsUploaderValidated,
showErrorPrompt, showErrorPrompt,
submitFile, onSubmitFile,
validation } = this.props; validation } = this.props;
// Essentially there a three cases important to the fileuploader // Essentially there a three cases important to the fileuploader
@ -94,7 +94,7 @@ let FurtherDetailsFileuploader = React.createClass({
}} }}
multiple={multiple} multiple={multiple}
onValidationFailed={onValidationFailed} onValidationFailed={onValidationFailed}
setIsUploadReady={setIsUploadReady} setIsUploaderValidated={setIsUploaderValidated}
session={{ session={{
endpoint: AppConstants.serverUrl + 'api/blob/otherdatas/fineuploader_session/', endpoint: AppConstants.serverUrl + 'api/blob/otherdatas/fineuploader_session/',
customHeaders: { customHeaders: {
@ -114,7 +114,7 @@ let FurtherDetailsFileuploader = React.createClass({
'X-CSRFToken': getCookie(AppConstants.csrftoken) 'X-CSRFToken': getCookie(AppConstants.csrftoken)
} }
}} }}
submitFile={submitFile} onSubmitFile={onSubmitFile}
showErrorPrompt={showErrorPrompt} showErrorPrompt={showErrorPrompt}
validation={validation} /> validation={validation} />
</Property> </Property>

View File

@ -39,7 +39,7 @@ let CreateContractForm = React.createClass({
}; };
}, },
setIsUploadReady(isReady) { setIsUploaderValidated(isReady) {
this.setState({ this.setState({
isUploadReady: isReady isUploadReady: isReady
}); });
@ -52,7 +52,7 @@ let CreateContractForm = React.createClass({
this.refs.form.reset(); this.refs.form.reset();
}, },
submitFile({ originalName }) { onSubmitFile({ originalName }) {
this.setState({ this.setState({
contractName: originalName contractName: originalName
}); });
@ -70,7 +70,7 @@ let CreateContractForm = React.createClass({
name="blob" name="blob"
label={getLangText('Contract file (*.pdf only, max. 50MB per contract)')}> label={getLangText('Contract file (*.pdf only, max. 50MB per contract)')}>
<InputFineUploader <InputFineUploader
submitFile={this.submitFile} onSubmitFile={this.onSubmitFile}
keyRoutine={{ keyRoutine={{
url: AppConstants.serverUrl + 's3/key/', url: AppConstants.serverUrl + 's3/key/',
fileClass: 'contract' fileClass: 'contract'
@ -85,7 +85,7 @@ let CreateContractForm = React.createClass({
}} }}
areAssetsDownloadable={true} areAssetsDownloadable={true}
areAssetsEditable={true} areAssetsEditable={true}
setIsUploadReady={this.setIsUploadReady} setIsUploaderValidated={this.setIsUploaderValidated}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
fileClassToUpload={this.props.fileClassToUpload} /> fileClassToUpload={this.props.fileClassToUpload} />
</Property> </Property>

View File

@ -63,7 +63,7 @@ let RegisterPieceForm = React.createClass({
* of each uploader in the component * of each uploader in the component
* @param {string} uploaderKey Name of the uploader's key to track * @param {string} uploaderKey Name of the uploader's key to track
*/ */
setIsUploadReady(uploaderKey) { setIsUploaderValidated(uploaderKey) {
return (isUploadReady) => { return (isUploadReady) => {
// See documentation of `FormSubmitButton` for more detailed information // See documentation of `FormSubmitButton` for more detailed information
// on this. // on this.
@ -78,7 +78,7 @@ let RegisterPieceForm = React.createClass({
// Manually we need to set the ready state for `thumbnailKeyReady` back // Manually we need to set the ready state for `thumbnailKeyReady` back
// to `true` as `ReactS3Fineuploader`'s `reset` method triggers // to `true` as `ReactS3Fineuploader`'s `reset` method triggers
// `setIsUploadReady` with `false` // `setIsUploaderValidated` with `false`
this.refs.submitButton.setReadyStateForKey('thumbnailKeyReady', true); this.refs.submitButton.setReadyStateForKey('thumbnailKeyReady', true);
this.setState({ digitalWorkFile: null }); this.setState({ digitalWorkFile: null });
} else { } else {
@ -97,9 +97,11 @@ let RegisterPieceForm = React.createClass({
); );
}, },
handleThumbnailValidationFailed(thumbnailFile) { handleThumbnailValidationFailed(thumbnailFile, error) {
// If the validation fails, set the thumbnail as submittable since its optional if (error.type !== ValidationErrors.EXTRA_FILES) {
this.refs.submitButton.setReadyStateForKey('thumbnailKeyReady', true); // If the validation fails, set the thumbnail as submittable since its optional
this.refs.submitButton.setReadyStateForKey('thumbnailKeyReady', true);
}
}, },
isThumbnailDialogExpanded() { isThumbnailDialogExpanded() {
@ -169,13 +171,13 @@ let RegisterPieceForm = React.createClass({
url: ApiUrls.blob_digitalworks url: ApiUrls.blob_digitalworks
}} }}
validation={validationTypes.registerWork} validation={validationTypes.registerWork}
setIsUploadReady={this.setIsUploadReady('digitalWorkKeyReady')} setIsUploaderValidated={this.setIsUploaderValidated('digitalWorkKeyReady')}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
isFineUploaderActive={isFineUploaderActive} isFineUploaderActive={isFineUploaderActive}
disabled={!isFineUploaderEditable} disabled={!isFineUploaderEditable}
enableLocalHashing={hashLocally} enableLocalHashing={hashLocally}
uploadMethod={location.query.method} uploadMethod={location.query.method}
handleChangedFile={this.handleChangedDigitalWork} onStatusChange={this.handleChangedDigitalWork}
showErrorPrompt /> showErrorPrompt />
</Property> </Property>
<Property <Property
@ -187,7 +189,7 @@ let RegisterPieceForm = React.createClass({
createBlobRoutine={{ createBlobRoutine={{
url: ApiUrls.blob_thumbnails url: ApiUrls.blob_thumbnails
}} }}
handleChangedFile={this.handleChangedThumbnail} onStatusChange={this.handleChangedThumbnail}
onValidationFailed={this.handleThumbnailValidationFailed} onValidationFailed={this.handleThumbnailValidationFailed}
isReadyForFormSubmission={formSubmissionValidation.fileOptional} isReadyForFormSubmission={formSubmissionValidation.fileOptional}
keyRoutine={{ keyRoutine={{
@ -199,7 +201,7 @@ let RegisterPieceForm = React.createClass({
sizeLimit: validationTypes.workThumbnail.sizeLimit, sizeLimit: validationTypes.workThumbnail.sizeLimit,
allowedExtensions: validationParts.allowedExtensions.images allowedExtensions: validationParts.allowedExtensions.images
}} }}
setIsUploadReady={this.setIsUploadReady('thumbnailKeyReady')} setIsUploaderValidated={this.setIsUploaderValidated('thumbnailKeyReady')}
fileClassToUpload={{ fileClassToUpload={{
singular: getLangText('Select representative image'), singular: getLangText('Select representative image'),
plural: getLangText('Select representative images') plural: getLangText('Select representative images')

View File

@ -31,10 +31,10 @@ const InputFineUploader = React.createClass({
fileInputElement: ReactS3FineUploader.propTypes.fileInputElement, fileInputElement: ReactS3FineUploader.propTypes.fileInputElement,
isReadyForFormSubmission: func, isReadyForFormSubmission: func,
keyRoutine: ReactS3FineUploader.propTypes.keyRoutine, keyRoutine: ReactS3FineUploader.propTypes.keyRoutine,
handleChangedFile: func, // TODO: rename to onChangedFile onStatusChange: func,
submitFile: func, // TODO: rename to onSubmitFile onSubmitFile: func,
onValidationFailed: func, onValidationFailed: func,
setIsUploadReady: func, //TODO: rename to setIsUploaderValidated setIsUploaderValidated: func,
setWarning: func, setWarning: func,
showErrorPrompt: bool, showErrorPrompt: bool,
uploadMethod: oneOf(['hash', 'upload']), uploadMethod: oneOf(['hash', 'upload']),
@ -54,7 +54,7 @@ const InputFineUploader = React.createClass({
}; };
}, },
submitFile(file) { onSubmitFile(file) {
this.setState({ this.setState({
file, file,
value: file.key value: file.key
@ -64,8 +64,8 @@ const InputFineUploader = React.createClass({
this.props.onChange({ target: { value: this.state.value } }); this.props.onChange({ target: { value: this.state.value } });
} }
if (typeof this.props.submitFile === 'function') { if (typeof this.props.onSubmitFile === 'function') {
this.props.submitFile(file); this.props.onSubmitFile(file);
} }
}, },
@ -87,12 +87,12 @@ const InputFineUploader = React.createClass({
disabled, disabled,
fileClassToUpload, fileClassToUpload,
fileInputElement, fileInputElement,
handleChangedFile, onStatusChange,
isFineUploaderActive, isFineUploaderActive,
isReadyForFormSubmission, isReadyForFormSubmission,
keyRoutine, keyRoutine,
onValidationFailed, onValidationFailed,
setIsUploadReady, setIsUploaderValidated,
setWarning, setWarning,
showErrorPrompt, showErrorPrompt,
uploadMethod, uploadMethod,
@ -112,9 +112,9 @@ const InputFineUploader = React.createClass({
keyRoutine={keyRoutine} keyRoutine={keyRoutine}
createBlobRoutine={createBlobRoutine} createBlobRoutine={createBlobRoutine}
validation={validation} validation={validation}
submitFile={this.submitFile} onSubmitFile={this.onSubmitFile}
onValidationFailed={onValidationFailed} onValidationFailed={onValidationFailed}
setIsUploadReady={setIsUploadReady} setIsUploaderValidated={setIsUploaderValidated}
isReadyForFormSubmission={isReadyForFormSubmission} isReadyForFormSubmission={isReadyForFormSubmission}
areAssetsDownloadable={areAssetsDownloadable} areAssetsDownloadable={areAssetsDownloadable}
areAssetsEditable={editable} areAssetsEditable={editable}
@ -137,7 +137,7 @@ const InputFineUploader = React.createClass({
enableLocalHashing={enableLocalHashing} enableLocalHashing={enableLocalHashing}
uploadMethod={uploadMethod} uploadMethod={uploadMethod}
fileClassToUpload={fileClassToUpload} fileClassToUpload={fileClassToUpload}
handleChangedFile={handleChangedFile} /> onStatusChange={onStatusChange} />
); );
} }
}); });

View File

@ -24,7 +24,7 @@ let ContractSettingsUpdateButton = React.createClass({
contract: React.PropTypes.object contract: React.PropTypes.object
}, },
submitFile(file) { onSubmitFile(file) {
// override the blob with the key's value // override the blob with the key's value
const contract = Object.assign(this.props.contract, { blob: file.key }); const contract = Object.assign(this.props.contract, { blob: file.key });
@ -45,13 +45,13 @@ let ContractSettingsUpdateButton = React.createClass({
const notification = new GlobalNotificationModel(getLangText('Latest contract failed to load'), 'danger', 5000); const notification = new GlobalNotificationModel(getLangText('Latest contract failed to load'), 'danger', 5000);
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
return Promise.reject(err); throw err;
}); });
}, (err) => { }, (err) => {
const notification = new GlobalNotificationModel(getLangText('Contract could not be updated'), 'danger', 5000); const notification = new GlobalNotificationModel(getLangText('Contract could not be updated'), 'danger', 5000);
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
return Promise.reject(err); throw err;
}) })
.catch(console.logGlobal); .catch(console.logGlobal);
}, },
@ -73,7 +73,7 @@ let ContractSettingsUpdateButton = React.createClass({
sizeLimit: validationTypes.additionalData.sizeLimit, sizeLimit: validationTypes.additionalData.sizeLimit,
allowedExtensions: ['pdf'] allowedExtensions: ['pdf']
}} }}
setIsUploadReady={() =>{/* So that ReactS3FineUploader is not complaining */}} setIsUploaderValidated={() =>{/* So that ReactS3FineUploader is not complaining */}}
signature={{ signature={{
endpoint: AppConstants.serverUrl + 's3/signature/', endpoint: AppConstants.serverUrl + 's3/signature/',
customHeaders: { customHeaders: {
@ -93,7 +93,7 @@ let ContractSettingsUpdateButton = React.createClass({
plural: getLangText('UPDATE') plural: getLangText('UPDATE')
}} }}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
submitFile={this.submitFile} /> onSubmitFile={this.onSubmitFile} />
); );
} }
}); });

View File

@ -150,7 +150,7 @@ const PRRegisterPieceForm = React.createClass({
* of each uploader in the component * of each uploader in the component
* @param {string} uploaderKey Name of the uploader's key to track * @param {string} uploaderKey Name of the uploader's key to track
*/ */
setIsUploadReady(uploaderKey) { setIsUploaderValidated(uploaderKey) {
return (isUploadReady) => { return (isUploadReady) => {
this.setState({ this.setState({
[uploaderKey]: isUploadReady [uploaderKey]: isUploadReady
@ -297,7 +297,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader <InputFineuploader
fileInputElement={UploadButton()} fileInputElement={UploadButton()}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('digitalWorkKeyReady')} setIsUploaderValidated={this.setIsUploaderValidated('digitalWorkKeyReady')}
createBlobRoutine={{ createBlobRoutine={{
url: ApiUrls.blob_digitalworks url: ApiUrls.blob_digitalworks
}} }}
@ -326,7 +326,7 @@ const PRRegisterPieceForm = React.createClass({
url: ApiUrls.blob_thumbnails url: ApiUrls.blob_thumbnails
}} }}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('thumbnailKeyReady')} setIsUploaderValidated={this.setIsUploaderValidated('thumbnailKeyReady')}
keyRoutine={{ keyRoutine={{
url: AppConstants.serverUrl + 's3/key/', url: AppConstants.serverUrl + 's3/key/',
fileClass: 'thumbnail' fileClass: 'thumbnail'
@ -349,7 +349,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader <InputFineuploader
fileInputElement={UploadButton()} fileInputElement={UploadButton()}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('supportingMaterialsReady')} setIsUploaderValidated={this.setIsUploaderValidated('supportingMaterialsReady')}
onValidationFailed={this.handleOptionalFileValidationFailed('supportingMaterialsReady')} onValidationFailed={this.handleOptionalFileValidationFailed('supportingMaterialsReady')}
createBlobRoutine={this.getCreateBlobRoutine()} createBlobRoutine={this.getCreateBlobRoutine()}
keyRoutine={{ keyRoutine={{
@ -372,7 +372,7 @@ const PRRegisterPieceForm = React.createClass({
<InputFineuploader <InputFineuploader
fileInputElement={UploadButton()} fileInputElement={UploadButton()}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile} isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('proofOfPaymentReady')} setIsUploaderValidated={this.setIsUploaderValidated('proofOfPaymentReady')}
createBlobRoutine={this.getCreateBlobRoutine()} createBlobRoutine={this.getCreateBlobRoutine()}
keyRoutine={{ keyRoutine={{
url: AppConstants.serverUrl + 's3/key/', url: AppConstants.serverUrl + 's3/key/',

View File

@ -475,8 +475,8 @@ let PrizePieceDetails = React.createClass({
}) })
} }
<FurtherDetailsFileuploader <FurtherDetailsFileuploader
submitFile={() => {}} onSubmitFile={() => {}}
setIsUploadReady={() => {}} setIsUploaderValidated={() => {}}
isReadyForFormSubmission={() => {}} isReadyForFormSubmission={() => {}}
editable={false} editable={false}
overrideForm={true} overrideForm={true}

View File

@ -65,7 +65,7 @@ let CylandAdditionalDataForm = React.createClass({
}, },
setIsUploadReady(isReady) { setIsUploaderValidated(isReady) {
this.setState({ this.setState({
isUploadReady: isReady isUploadReady: isReady
}); });
@ -185,8 +185,8 @@ let CylandAdditionalDataForm = React.createClass({
</Property> </Property>
<FurtherDetailsFileuploader <FurtherDetailsFileuploader
label={getLangText('Additional files (e.g. still images, pdf)')} label={getLangText('Additional files (e.g. still images, pdf)')}
submitFile={function () {}} onSubmitFile={function () {}}
setIsUploadReady={this.setIsUploadReady} setIsUploaderValidated={this.setIsUploaderValidated}
isReadyForFormSubmission={formSubmissionValidation.fileOptional} isReadyForFormSubmission={formSubmissionValidation.fileOptional}
pieceId={piece.id} pieceId={piece.id}
otherData={piece.other_data} otherData={piece.other_data}

View File

@ -100,7 +100,7 @@ let MarketAdditionalDataForm = React.createClass({
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
}, },
setIsUploadReady(isReady) { setIsUploaderValidated(isReady) {
this.setState({ this.setState({
isUploadReady: isReady isUploadReady: isReady
}); });
@ -168,8 +168,8 @@ let MarketAdditionalDataForm = React.createClass({
label={getLangText('Marketplace Thumbnail Image')} label={getLangText('Marketplace Thumbnail Image')}
otherData={otherData} otherData={otherData}
pieceId={pieceId} pieceId={pieceId}
setIsUploadReady={this.setIsUploadReady} setIsUploaderValidated={this.setIsUploaderValidated}
submitFile={function () {}} onSubmitFile={function () {}}
validation={{ validation={{
itemLimit: validationTypes.workThumbnail.itemLimit, itemLimit: validationTypes.workThumbnail.itemLimit,
sizeLimit: validationTypes.workThumbnail.sizeLimit, sizeLimit: validationTypes.workThumbnail.sizeLimit,