mirror of https://github.com/ascribe/onion.git
156 lines
5.1 KiB
JavaScript
156 lines
5.1 KiB
JavaScript
'use strict';
|
|
|
|
import React from 'react';
|
|
|
|
import Form from '../../../../../ascribe_forms/form';
|
|
import Property from '../../../../../ascribe_forms/property';
|
|
|
|
import InputTextAreaToggable from '../../../../../ascribe_forms/input_textarea_toggable';
|
|
|
|
import FurtherDetailsFileuploader from '../../../../../ascribe_detail/further_details_fileuploader';
|
|
|
|
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
|
|
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
|
|
|
|
import ApiUrls from '../../../../../../constants/api_urls';
|
|
import AppConstants from '../../../../../../constants/application_constants';
|
|
|
|
import requests from '../../../../../../utils/requests';
|
|
|
|
import { getLangText } from '../../../../../../utils/lang_utils';
|
|
import { formSubmissionValidation } from '../../../../../ascribe_uploader/react_s3_fine_uploader_utils';
|
|
|
|
|
|
let CylandAdditionalDataForm = React.createClass({
|
|
propTypes: {
|
|
handleSuccess: React.PropTypes.func,
|
|
piece: React.PropTypes.object.isRequired,
|
|
disabled: React.PropTypes.bool,
|
|
isInline: React.PropTypes.bool
|
|
},
|
|
|
|
getDefaultProps() {
|
|
return {
|
|
isInline: false
|
|
};
|
|
},
|
|
|
|
handleSuccess() {
|
|
let notification = new GlobalNotificationModel('Further details successfully updated', 'success', 10000);
|
|
GlobalNotificationActions.appendGlobalNotification(notification);
|
|
},
|
|
|
|
getInitialState() {
|
|
return {
|
|
isUploadReady: true
|
|
};
|
|
},
|
|
|
|
getFormData() {
|
|
let extradata = {};
|
|
let formRefs = this.refs.form.refs;
|
|
|
|
// Put additional fields in extra data object
|
|
Object
|
|
.keys(formRefs)
|
|
.forEach((fieldName) => {
|
|
extradata[fieldName] = formRefs[fieldName].state.value;
|
|
});
|
|
|
|
return {
|
|
extradata: extradata,
|
|
piece_id: this.props.piece.id
|
|
};
|
|
|
|
},
|
|
|
|
uploadStarted() {
|
|
this.setState({
|
|
isUploadReady: false
|
|
});
|
|
},
|
|
|
|
setIsUploadReady(isReady) {
|
|
this.setState({
|
|
isUploadReady: isReady
|
|
});
|
|
},
|
|
|
|
render() {
|
|
let { piece, isInline, disabled, handleSuccess } = this.props;
|
|
let buttons, spinner, heading;
|
|
|
|
if(!isInline) {
|
|
buttons = (
|
|
<button
|
|
type="submit"
|
|
className="btn btn-default btn-wide"
|
|
disabled={!this.state.isUploadReady || disabled}>
|
|
{getLangText('Proceed to loan')}
|
|
</button>
|
|
);
|
|
|
|
spinner = (
|
|
<div className="modal-footer">
|
|
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
|
|
</div>
|
|
);
|
|
|
|
heading = (
|
|
<div className="ascribe-form-header">
|
|
<h3>
|
|
{getLangText('Provide supporting materials')}
|
|
</h3>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if(piece && piece.id) {
|
|
return (
|
|
<Form
|
|
disabled={disabled}
|
|
className="ascribe-form-bordered"
|
|
ref='form'
|
|
url={requests.prepareUrl(ApiUrls.piece_extradata, {piece_id: piece.id})}
|
|
handleSuccess={handleSuccess || this.handleSuccess}
|
|
getFormData={this.getFormData}
|
|
buttons={buttons}
|
|
spinner={spinner}>
|
|
{heading}
|
|
<Property
|
|
name='artist_bio'
|
|
label={getLangText('Artist Biography')}>
|
|
<InputTextAreaToggable
|
|
rows={1}
|
|
defaultValue={piece.extra_data.artist_bio}
|
|
placeholder={getLangText('Enter the artist\'s biography...')}/>
|
|
</Property>
|
|
<Property
|
|
name='conceptual_overview'
|
|
label={getLangText('Conceptual Overview')}>
|
|
<InputTextAreaToggable
|
|
rows={1}
|
|
defaultValue={piece.extra_data.conceptual_overview}
|
|
placeholder={getLangText('Enter a conceptual overview...')}/>
|
|
</Property>
|
|
<FurtherDetailsFileuploader
|
|
uploadStarted={this.uploadStarted}
|
|
submitFile={this.submitFile}
|
|
setIsUploadReady={this.setIsUploadReady}
|
|
isReadyForFormSubmission={formSubmissionValidation.fileOptional}
|
|
pieceId={piece.id}
|
|
otherData={piece.other_data}
|
|
multiple={true}/>
|
|
</Form>
|
|
);
|
|
} else {
|
|
return (
|
|
<div className="ascribe-loading-position">
|
|
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
});
|
|
|
|
export default CylandAdditionalDataForm; |