mirror of
https://github.com/ascribe/onion.git
synced 2024-12-22 17:33:14 +01:00
refactor input textarea to use disabled instead of editable
This commit is contained in:
parent
a8976ca54a
commit
c00e003aeb
@ -44,14 +44,13 @@ let Note = React.createClass({
|
||||
<Form
|
||||
url={this.props.url}
|
||||
getFormData={this.props.id}
|
||||
handleSuccess={this.showNotification}>
|
||||
handleSuccess={this.showNotification}
|
||||
disabled={!this.props.editable}>
|
||||
<Property
|
||||
name='note'
|
||||
label={this.props.label}
|
||||
editable={this.props.editable}>
|
||||
label={this.props.label}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={this.props.editable}
|
||||
defaultValue={this.props.defaultValue}
|
||||
placeholder={this.props.placeholder}/>
|
||||
</Property>
|
||||
@ -63,4 +62,4 @@ let Note = React.createClass({
|
||||
}
|
||||
});
|
||||
|
||||
export default Note
|
||||
export default Note;
|
@ -56,10 +56,10 @@ let ConsignForm = React.createClass({
|
||||
<Property
|
||||
name='consign_message'
|
||||
label={getLangText('Personal Message')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required="required"/>
|
||||
|
@ -129,9 +129,11 @@ let ContractAgreementForm = React.createClass({
|
||||
name='appendix'
|
||||
checkboxLabel={getLangText('Add appendix to the contract')}>
|
||||
<span>{getLangText('Appendix')}</span>
|
||||
{/* We're using disabled on a form here as PropertyCollapsible currently
|
||||
does not support the disabled + overrideForm functionality */}
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
disabled={false}
|
||||
placeholder={getLangText('This will be appended to the contract selected above')}/>
|
||||
</PropertyCollapsible>
|
||||
</Form>
|
||||
|
@ -256,10 +256,10 @@ let LoanForm = React.createClass({
|
||||
name='loan_message'
|
||||
label={getLangText('Personal Message')}
|
||||
editable={true}
|
||||
overrideForm={true}
|
||||
hidden={!this.props.showPersonalMessage}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required={this.props.showPersonalMessage ? 'required' : ''}/>
|
||||
|
@ -41,14 +41,13 @@ let PieceExtraDataForm = React.createClass({
|
||||
ref='form'
|
||||
url={url}
|
||||
handleSuccess={this.props.handleSuccess}
|
||||
getFormData={this.getFormData}>
|
||||
getFormData={this.getFormData}
|
||||
disabled={!this.props.editable}>
|
||||
<Property
|
||||
name={this.props.name}
|
||||
label={this.props.title}
|
||||
editable={this.props.editable}>
|
||||
label={this.props.title}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={this.props.editable}
|
||||
defaultValue={defaultValue}
|
||||
placeholder={getLangText('Fill in%s', ' ') + this.props.title}
|
||||
required="required"/>
|
||||
|
@ -112,7 +112,7 @@ let RegisterPieceForm = React.createClass({
|
||||
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
|
||||
isFineUploaderActive={this.props.isFineUploaderActive}
|
||||
onLoggedOut={this.props.onLoggedOut}
|
||||
editable={this.props.isFineUploaderEditable}
|
||||
disabled={!this.props.isFineUploaderEditable}
|
||||
enableLocalHashing={enableLocalHashing}/>
|
||||
</Property>
|
||||
<Property
|
||||
|
@ -60,10 +60,10 @@ let ShareForm = React.createClass({
|
||||
<Property
|
||||
name='share_message'
|
||||
label='Personal Message'
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required="required"/>
|
||||
|
@ -45,20 +45,20 @@ let PieceSubmitToPrizeForm = React.createClass({
|
||||
<Property
|
||||
name='artist_statement'
|
||||
label={getLangText('Artist statement')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('Enter your statement')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
<Property
|
||||
name='work_description'
|
||||
label={getLangText('Work description')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('Enter the description for your work')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
|
@ -61,10 +61,10 @@ let TransferForm = React.createClass({
|
||||
<Property
|
||||
name='transfer_message'
|
||||
label={getLangText('Personal Message')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required="required"/>
|
||||
|
@ -50,10 +50,10 @@ let UnConsignForm = React.createClass({
|
||||
<Property
|
||||
name='unconsign_message'
|
||||
label={getLangText('Personal Message')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required="required"/>
|
||||
|
@ -50,10 +50,10 @@ let UnConsignRequestForm = React.createClass({
|
||||
<Property
|
||||
name='unconsign_request_message'
|
||||
label={getLangText('Personal Message')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
defaultValue={this.props.message}
|
||||
placeholder={getLangText('Enter a message...')}
|
||||
required="required"/>
|
||||
|
@ -8,12 +8,14 @@ import AppConstants from '../../constants/application_constants';
|
||||
|
||||
import { getCookie } from '../../utils/fetch_api_utils';
|
||||
|
||||
let InputFileUploader = React.createClass({
|
||||
let InputFineUploader = React.createClass({
|
||||
propTypes: {
|
||||
setIsUploadReady: React.PropTypes.func,
|
||||
isReadyForFormSubmission: React.PropTypes.func,
|
||||
submitFileName: React.PropTypes.func,
|
||||
|
||||
areAssetsDownloadable: React.PropTypes.bool,
|
||||
|
||||
onClick: React.PropTypes.func,
|
||||
keyRoutine: React.PropTypes.shape({
|
||||
url: React.PropTypes.string,
|
||||
@ -33,7 +35,7 @@ let InputFileUploader = React.createClass({
|
||||
// before login in
|
||||
isFineUploaderActive: React.PropTypes.bool,
|
||||
onLoggedOut: React.PropTypes.func,
|
||||
editable: React.PropTypes.bool,
|
||||
|
||||
enableLocalHashing: React.PropTypes.bool,
|
||||
|
||||
// provided by Property
|
||||
@ -86,7 +88,7 @@ let InputFileUploader = React.createClass({
|
||||
submitFile={this.submitFile}
|
||||
setIsUploadReady={this.props.setIsUploadReady}
|
||||
isReadyForFormSubmission={this.props.isReadyForFormSubmission}
|
||||
areAssetsDownloadable={false}
|
||||
areAssetsDownloadable={this.props.areAssetsDownloadable}
|
||||
areAssetsEditable={editable}
|
||||
signature={{
|
||||
endpoint: AppConstants.serverUrl + 's3/signature/',
|
||||
@ -109,4 +111,4 @@ let InputFileUploader = React.createClass({
|
||||
}
|
||||
});
|
||||
|
||||
export default InputFileUploader;
|
||||
export default InputFineUploader;
|
@ -7,7 +7,7 @@ import TextareaAutosize from 'react-textarea-autosize';
|
||||
|
||||
let InputTextAreaToggable = React.createClass({
|
||||
propTypes: {
|
||||
editable: React.PropTypes.bool.isRequired,
|
||||
disabled: React.PropTypes.bool,
|
||||
rows: React.PropTypes.number.isRequired,
|
||||
required: React.PropTypes.string,
|
||||
defaultValue: React.PropTypes.string
|
||||
@ -54,7 +54,7 @@ let InputTextAreaToggable = React.createClass({
|
||||
let className = 'form-control ascribe-textarea';
|
||||
let textarea = null;
|
||||
|
||||
if(this.props.editable) {
|
||||
if(!this.props.disabled) {
|
||||
className = className + ' ascribe-textarea-editable';
|
||||
textarea = (
|
||||
<TextareaAutosize
|
||||
|
@ -84,10 +84,11 @@ let CoaVerifyForm = React.createClass({
|
||||
</Property>
|
||||
<Property
|
||||
name='signature'
|
||||
label="Signature">
|
||||
label="Signature"
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={3}
|
||||
editable={true}
|
||||
placeholder={getLangText('Copy paste the signature on the bottom of your Certificate of Authenticity')}
|
||||
required/>
|
||||
</Property>
|
||||
|
@ -426,10 +426,10 @@ let PrizePieceDetails = React.createClass({
|
||||
<Property
|
||||
name={data}
|
||||
label={label}
|
||||
editable={false}>
|
||||
editable={false}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={false}
|
||||
defaultValue={this.props.piece.extra_data[data]}/>
|
||||
</Property>);
|
||||
}
|
||||
|
@ -41,20 +41,20 @@ let PrizeRegisterPiece = React.createClass({
|
||||
<Property
|
||||
name='artist_statement'
|
||||
label={getLangText('Artist statement')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('Enter your statement')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
<Property
|
||||
name='work_description'
|
||||
label={getLangText('Work description')}
|
||||
editable={true}>
|
||||
editable={true}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('Enter the description for your work')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
|
@ -143,10 +143,10 @@ let CylandPieceDetails = React.createClass({
|
||||
key={i}
|
||||
name={data}
|
||||
label={label}
|
||||
editable={false}>
|
||||
editable={false}
|
||||
overrideForm={true}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={false}
|
||||
defaultValue={this.props.piece.extra_data[data]}/>
|
||||
</Property>);
|
||||
}
|
||||
|
@ -92,21 +92,17 @@ let CylandAdditionalDataForm = React.createClass({
|
||||
</div>
|
||||
<Property
|
||||
name='artist_bio'
|
||||
label={getLangText('Artist Biography')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Artist Biography')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
placeholder={getLangText('Enter the artist\'s biography...')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
<Property
|
||||
name='conceptual_overview'
|
||||
label={getLangText('Conceptual Overview')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Conceptual Overview')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
placeholder={getLangText('Enter a conceptual overview...')}
|
||||
required="required"/>
|
||||
</Property>
|
||||
@ -115,7 +111,6 @@ let CylandAdditionalDataForm = React.createClass({
|
||||
submitFile={this.submitFile}
|
||||
setIsUploadReady={this.setIsUploadReady}
|
||||
isReadyForFormSubmission={formSubmissionValidation.fileOptional}
|
||||
editable={!this.props.disabled}
|
||||
pieceId={this.props.piece.id}
|
||||
otherData={this.props.piece.other_data}
|
||||
multiple={true}/>
|
||||
|
@ -185,7 +185,9 @@ let IkonotvPieceDetails = React.createClass({
|
||||
title={getLangText('Further Details')}
|
||||
show={true}
|
||||
defaultExpanded={true}>
|
||||
<Form ref='form'>
|
||||
<Form
|
||||
ref='form'
|
||||
disabled={!this.props.piece.acl.acl_edit}>
|
||||
{Object.keys(this.props.piece.extra_data).map((data, i) => {
|
||||
let label = data.replace('_', ' ');
|
||||
return (
|
||||
@ -193,11 +195,9 @@ let IkonotvPieceDetails = React.createClass({
|
||||
key={i}
|
||||
name={data}
|
||||
label={label}
|
||||
hidden={!this.props.piece.extra_data[data]}
|
||||
editable={false}>
|
||||
hidden={!this.props.piece.extra_data[data]}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={false}
|
||||
defaultValue={this.props.piece.extra_data[data]}/>
|
||||
</Property>);
|
||||
}
|
||||
|
@ -91,41 +91,33 @@ let IkonotvArtistDetailsForm = React.createClass({
|
||||
</div>
|
||||
<Property
|
||||
name='artist_website'
|
||||
label={getLangText('Artist Website')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Artist Website')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.artist_website}
|
||||
placeholder={getLangText('The artist\'s website if present...')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='gallery_website'
|
||||
label={getLangText('Website of related Gallery, Museum, etc.')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Website of related Gallery, Museum, etc.')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.gallery_website}
|
||||
placeholder={getLangText('The website of any related Gallery or Museum')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='additional_websites'
|
||||
label={getLangText('Additional Websites/Publications')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Additional Websites/Publications')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.additional_websites}
|
||||
placeholder={getLangText('Enter additional Websites/Publications if any')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='conceptual_overview'
|
||||
label={getLangText('Short text about the Artist')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Short text about the Artist')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.conceptual_overview}
|
||||
placeholder={getLangText('Enter a short bio about the Artist')}
|
||||
/>
|
||||
|
@ -89,61 +89,49 @@ let IkonotvArtworkDetailsForm = React.createClass({
|
||||
</div>
|
||||
<Property
|
||||
name='medium'
|
||||
label={getLangText('Medium')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Medium')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.medium}
|
||||
placeholder={getLangText('The medium of the file (i.e. photo, video, other, ...)')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='size_duration'
|
||||
label={getLangText('Size/Duration')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Size/Duration')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.size_duration}
|
||||
placeholder={getLangText('The size of the file in MB or the duration of the movie')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='copyright'
|
||||
label={getLangText('Copyright')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Copyright')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.copyright}
|
||||
placeholder={getLangText('Which copyright is attached to this work?')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='courtesy_of'
|
||||
label={getLangText('Courtesy of')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Courtesy of')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.courtesy_of}
|
||||
placeholder={getLangText('The current owner of the artwork')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='copyright_of_photography'
|
||||
label={getLangText('Copyright of Photography')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Copyright of Photography')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.copyright_of_photography}
|
||||
placeholder={getLangText('Who should be attributed for the photography?')}/>
|
||||
</Property>
|
||||
<Property
|
||||
name='additional_details'
|
||||
label={getLangText('Additional Details about the artwork')}
|
||||
editable={!this.props.disabled}>
|
||||
label={getLangText('Additional Details about the artwork')}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.additional_details}
|
||||
placeholder={getLangText('Insert artwork overview')}/>
|
||||
</Property>
|
||||
|
Loading…
Reference in New Issue
Block a user