ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

Add labeling functionality to UploadButton

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-11-12 13:08:23 +01:00
parent b6773549ee
commit 1a67cd66f5
5 changed files with 127 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
js/components/ascribe_settings/contract_settings_update_button.js
View File

@ -56,7 +56,7 @@ let ContractSettingsUpdateButton = React.createClass({
render() {
return (
<ReactS3FineUploader
fileInputElement={UploadButton}
fileInputElement={UploadButton()}
keyRoutine={{
url: AppConstants.serverUrl + 's3/key/',
fileClass: 'contract'

11
js/components/ascribe_uploader/ascribe_upload_button/upload_button.js
View File

@ -9,7 +9,8 @@ import { getLangText } from '../../../utils/lang_utils';
import { truncateTextAtCharIndex } from '../../../utils/general_utils';
let UploadButton = React.createClass({
export default function UploadButton(label) {
return React.createClass({
propTypes: {
onDrop: React.PropTypes.func.isRequired,
filesToUpload: React.PropTypes.array,
@ -99,6 +100,7 @@ let UploadButton = React.createClass({
* Therefore the wrapping component needs to be an `anchor` tag instead of a `button`
*/
return (
<div className="upload-button-wrapper">
<a
onClick={this.handleOnClick}
className="btn btn-default btn-sm margin-left-2px"
@ -116,8 +118,9 @@ let UploadButton = React.createClass({
onChange={this.handleDrop}
accept={allowedExtensions}/>
</a>
{label}
</div>
);
}
});
export default UploadButton;
});
}

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

@ -54,6 +54,13 @@ const PRRegisterPieceForm = React.createClass({
submit() {
if(!this.validateForms()) {
return;
} else {
this.setState({
digitalWorkKeyReady: false,
thumbnailKeyReady: false,
supportingMaterialsReady: false,
proofOfPaymentReady: false
});
}
const { currentUser } = this.props;
@ -219,10 +226,9 @@ const PRRegisterPieceForm = React.createClass({
className="ascribe-form-bordered"
ref="uploadersForm">
<Property
name="digitalWorkKey"
className="input-upload-file-button-property">
name="digitalWorkKey">
<InputFineuploader
fileInputElement={UploadButton}
fileInputElement={UploadButton(<span>{getLangText('Select the PDF with your work')}</span>)}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('digitalWorkKeyReady')}
createBlobRoutine={{
@ -243,13 +249,11 @@ const PRRegisterPieceForm = React.createClass({
plural: getLangText('Upload the Portfolios')
}}
required/>
<span>{getLangText('Select the PDF with your work')}</span>
</Property>
<Property
name="thumbnailKey"
className="input-upload-file-button-property">
name="thumbnailKey">
<InputFineuploader
fileInputElement={UploadButton}
fileInputElement={UploadButton(<span>{getLangText('Featured Cover photo')}</span>)}
createBlobRoutine={{
url: ApiUrls.blob_thumbnails
}}
@ -270,13 +274,11 @@ const PRRegisterPieceForm = React.createClass({
plural: getLangText('Upload cover photos')
}}
required/>
<span>{getLangText('Featured Cover photo')}</span>
</Property>
<Property
name="supportingMaterials"
className="input-upload-file-button-property">
name="supportingMaterials">
<InputFineuploader
fileInputElement={UploadButton}
fileInputElement={UploadButton(<span>{getLangText('Supporting Materials (Optional)')}</span>)}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('supportingMaterialsReady')}
createBlobRoutine={this.getCreateBlobRoutine()}
@ -293,13 +295,11 @@ const PRRegisterPieceForm = React.createClass({
singular: getLangText('Upload supporting material'),
plural: getLangText('Upload supporting materials')
}}/>
<span>{getLangText('Supporting Materials (Optional)')}</span>
</Property>
<Property
name="proofOfPayment"
className="input-upload-file-button-property">
name="proofOfPayment">
<InputFineuploader
fileInputElement={UploadButton}
fileInputElement={UploadButton(<span>{getLangText('Proof of payment')}</span>)}
isReadyForFormSubmission={formSubmissionValidation.atLeastOneUploadedFile}
setIsUploadReady={this.setIsUploadReady('proofOfPaymentReady')}
createBlobRoutine={this.getCreateBlobRoutine()}
@ -318,7 +318,6 @@ const PRRegisterPieceForm = React.createClass({
plural: getLangText('Upload Screenshots')
}}
required/>
<span>{getLangText('Proof of payment')}</span>
</Property>
</Form>
<Form

13
sass/ascribe_property.scss
View File

@ -226,16 +226,3 @@ $ascribe-red-error: rgb(169, 68, 66);
margin-top: 0;
}
}
.input-upload-file-button-property {
text-align: left;
.btn {
font-size: 1em;
margin-right: 1em;
}
span + .btn {
margin-left: 1em;
}
}

12
sass/ascribe_uploader.scss
View File

@ -177,3 +177,15 @@
height: 12px;
}
.upload-button-wrapper {
text-align: left;
.btn {
font-size: 1em;
margin-right: 1em;
}
span + .btn {
margin-left: 1em;
}
}