1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00

Merge branch 'AD-419-decouple-piece-registration-from-'

This commit is contained in:
diminator 2015-07-15 18:01:38 +02:00
commit a0e6e0c5a4
9 changed files with 159 additions and 298 deletions

View File

@ -5,7 +5,7 @@ import React from 'react';
import ConsignForm from '../ascribe_forms/form_consign';
import UnConsignForm from '../ascribe_forms/form_unconsign';
import TransferForm from '../ascribe_forms/form_transfer';
import LoanForm from '../ascribe_forms/form_loan_new';
import LoanForm from '../ascribe_forms/form_loan';
import ShareForm from '../ascribe_forms/form_share_email';
import ModalWrapper from '../ascribe_modal/modal_wrapper';
import AppConstants from '../../constants/application_constants';

View File

@ -52,10 +52,10 @@ let DeleteButton = React.createClass({
} else if(availableAcls.acl_unshare){
if(this.props.editions && this.props.editions.constructor !== Array && this.props.editions.acl.acl_unshare) {
if(this.props.editions) {
content = <EditionRemoveFromCollectionForm editions={this.props.editions}/>;
title = getLangText('Remove Edition from Collection');
} else if(this.props.piece && this.props.piece.acl.acl_unshare) {
} else if(this.props.piece) {
content = <PieceRemoveFromCollectionForm pieceId={this.props.piece.id}/>;
title = getLangText('Remove Piece from Collection');
}

View File

@ -62,6 +62,7 @@ let Form = React.createClass({
if ('getFormData' in this.props){
data = mergeOptionsWithDuplicates(data, this.props.getFormData());
}
console.log(data);
return data;
},

View File

@ -2,151 +2,180 @@
import React from 'react';
import ApiUrls from '../../constants/api_urls';
import FormMixin from '../../mixins/form_mixin';
import InputText from './input_text';
import InputHidden from './input_hidden';
import InputCheckbox from './input_checkbox';
import Button from 'react-bootstrap/lib/Button';
import Form from './form';
import Property from './property';
import InputTextAreaToggable from './input_textarea_toggable';
import InputDate from './input_date';
import InputTextArea from './input_textarea';
import InputCheckbox from './input_checkbox';
import OwnershipFetcher from '../../fetchers/ownership_fetcher';
import ButtonSubmitOrClose from '../ascribe_buttons/button_submit_close';
import LoanContractStore from '../../stores/loan_contract_store';
import LoanContractActions from '../../actions/loan_contract_actions';
import AppConstants from '../../constants/application_constants';
import { mergeOptions } from '../../utils/general_utils';
import { getLangText } from '../../utils/lang_utils';
import { getLangText } from '../../utils/lang_utils.js';
let LoanForm = React.createClass({
propTypes: {
url: React.PropTypes.string,
id: React.PropTypes.object,
message: React.PropTypes.string,
onRequestHide: React.PropTypes.func,
handleSuccess: React.PropTypes.func
},
getInitialState() {
this.setState({
contract_key: null,
contract_url: null,
loaneeHasContract: false
});
return LoanContractStore.getState();
},
mixins: [FormMixin],
url() {
return ApiUrls.ownership_loans;
componentDidMount() {
LoanContractStore.listen(this.onChange);
},
getFormData() {
return {
bitcoin_id: this.getBitcoinIds().join(),
loanee: this.refs.loanee.state.value,
gallery_name: this.refs.gallery_name.state.value,
startdate: this.refs.startdate.state.value_formatted,
enddate: this.refs.enddate.state.value_formatted,
loan_message: this.refs.loan_message.state.value,
password: this.refs.password.state.value,
terms: this.refs.terms.state.value
};
componentWillUnmount() {
LoanContractStore.unlisten(this.onChange);
},
handleLoanEmailBlur(){
OwnershipFetcher.fetchLoanContract(this.refs.loanee.state.value)
.then((res) => {
if (res && res.length > 0) {
this.setState({
contract_key: res[0].s3Key,
contract_url: res[0].s3Url,
loaneeHasContract: true
});
}
else {
this.resetLoanContract();
}
})
.catch((err) => {
console.log(err);
this.resetLoanContract();
});
onChange(state) {
this.setState(state);
},
resetLoanContract(){
this.setState({
contract_key: null,
contract_url: null,
loaneeHasContract: false
});
getFormData(){
return this.props.id;
},
renderForm() {
let title = this.getTitlesString().join('');
let username = this.props.currentUser.username;
let message =
`${getLangText('Hi')},
${getLangText('I loan')} :
${title}${getLangText('to you')}.
handleOnBlur(event) {
LoanContractActions.fetchLoanContract(event.target.value);
},
${getLangText('Truly yours')},
${username}`;
let contract = <InputHidden ref="terms" value="True"/>;
if (this.state.loaneeHasContract){
let label = (<div>
getContractCheckbox() {
if(this.state.contractKey && this.state.contractUrl) {
return (
<Property
name="terms"
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<InputCheckbox>
<span>
{getLangText('I agree to the')}&nbsp;
<a href={this.state.contract_url} target="_blank">
{getLangText('terms of')} {this.refs.loanee.state.value}
<a href={this.state.contractUrl} target="_blank">
{getLangText('terms of')} {this.state.contractEmail}
</a>
</div>);
contract = (<InputCheckbox
ref="terms"
required="required"
label={label}
/>);
</span>
</InputCheckbox>
</Property>
);
} else {
return (
<Property
hidden={true}
name="terms"
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<input
ref="input"
type="checkbox"
defaultValue={true} />
</Property>
);
}
},
onRequestHide() {
// Since the modal can be opened without sending it to the server
// and therefore clearing the store,
// we'll need to make sure to flush the store once the
// modal unmounts
LoanContractActions.updateLoanContract({
contractUrl: null,
contractEmail: null,
contractKey: null
});
this.props.onRequestHide();
},
render() {
return (
<form id="loan_modal_content" role="form" onSubmit={this.submit}>
<input className="invisible" type="email" name="fake_loanee"/>
<input className="invisible" type="password" name="fake_password"/>
<InputText
ref="loanee"
placeHolder={getLangText('Loanee email')}
required="required"
type="email"
submitted={this.state.submitted}
onBlur={this.handleLoanEmailBlur}/>
<InputText
ref="gallery_name"
placeHolder={getLangText('Gallery/exhibition (optional)')}
required=""
type="text"
submitted={this.state.submitted}/>
<div className="row">
<div className="col-xs-6">
<InputDate
ref="startdate"
placeholderText={getLangText('Loan start date')} />
</div>
<div className="col-xs-6 form-group">
<InputDate
ref="enddate"
placeholderText={getLangText('Loan end date')} />
</div>
</div>
<InputTextArea
ref="loan_message"
defaultValue={message}
required=""
/>
<InputText
ref="password"
placeHolder={getLangText('Password')}
required="required"
type="password"
submitted={this.state.submitted}/>
{contract}
<ButtonSubmitOrClose
text={getLangText('LOAN')}
onClose={this.props.onRequestHide}
submitted={this.state.submitted} />
</form>
<Form
ref='form'
url={this.props.url}
getFormData={this.getFormData}
handleSuccess={this.props.handleSuccess}
buttons={
<div className="modal-footer">
<p className="pull-right">
<Button
className="btn btn-default btn-sm ascribe-margin-1px"
type="submit">{getLangText('LOAN')}</Button>
<Button
className="btn btn-danger btn-delete btn-sm ascribe-margin-1px"
style={{marginLeft: '0'}}
onClick={this.onRequestHide}>{getLangText('CLOSE')}</Button>
</p>
</div>}
spinner={
<div className="modal-footer">
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
</div>}>
<Property
name='loanee'
label={getLangText('Loanee Email')}
onBlur={this.handleOnBlur}>
<input
type="email"
placeholder={getLangText('Email of the loanee')}
required/>
</Property>
<Property
name='gallery_name'
label={getLangText('Gallery/exhibition (optional)')}
onBlur={this.handleOnBlur}>
<input
type="text"
placeholder={getLangText('Gallery/exhibition (optional)')}/>
</Property>
<Property
name='startdate'
label={getLangText('Start date')}>
<InputDate
placeholderText={getLangText('Loan start date')} />
</Property>
<Property
name='enddate'
label={getLangText('End date')}>
<InputDate
placeholderText={getLangText('Loan end date')} />
</Property>
<Property
name='loan_message'
label={getLangText('Personal Message')}
editable={true}>
<InputTextAreaToggable
rows={1}
editable={true}
defaultValue={this.props.message}
placeholder={getLangText('Enter a message...')}
required="required"/>
</Property>
<Property
name='password'
label={getLangText('Password')}>
<input
type="password"
placeholder={getLangText('Enter your password')}
required/>
</Property>
{this.getContractCheckbox()}
</Form>
);
}
});
export default LoanForm;
export default LoanForm;

View File

@ -1,168 +0,0 @@
'use strict';
import React from 'react';
import Button from 'react-bootstrap/lib/Button';
import Form from './form';
import Property from './property';
import InputTextAreaToggable from './input_textarea_toggable';
import InputDate from './input_date';
import InputCheckbox from './input_checkbox';
import LoanContractStore from '../../stores/loan_contract_store';
import LoanContractActions from '../../actions/loan_contract_actions';
import AppConstants from '../../constants/application_constants';
import { mergeOptions } from '../../utils/general_utils';
import { getLangText } from '../../utils/lang_utils';
let LoanForm = React.createClass({
propTypes: {
url: React.PropTypes.string,
id: React.PropTypes.object,
message: React.PropTypes.string,
onRequestHide: React.PropTypes.func,
handleSuccess: React.PropTypes.func
},
getInitialState() {
return LoanContractStore.getState();
},
componentDidMount() {
LoanContractStore.listen(this.onChange);
},
componentWillUnmount() {
LoanContractStore.unlisten(this.onChange);
},
onChange(state) {
this.setState(state);
},
getFormData(){
return this.props.id;
},
handleOnBlur(event) {
LoanContractActions.fetchLoanContract(event.target.value);
},
getContractCheckbox() {
if(this.state.contractKey && this.state.contractUrl) {
return (
<Property
name="terms"
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<InputCheckbox>
<span>
{getLangText('I agree to the')}&nbsp;
<a href={this.state.contractUrl} target="_blank">
{getLangText('terms of')} {this.state.contractEmail}
</a>
</span>
</InputCheckbox>
</Property>
);
}
},
onRequestHide() {
// Since the modal can be opened without sending it to the server
// and therefore clearing the store,
// we'll need to make sure to flush the store once the
// modal unmounts
LoanContractActions.updateLoanContract({
contractUrl: null,
contractEmail: null,
contractKey: null
});
this.props.onRequestHide();
},
render() {
return (
<Form
ref='form'
url={this.props.url}
getFormData={this.getFormData}
handleSuccess={this.props.handleSuccess}
buttons={
<div className="modal-footer">
<p className="pull-right">
<Button
className="btn btn-default btn-sm ascribe-margin-1px"
type="submit">{getLangText('LOAN')}</Button>
<Button
className="btn btn-danger btn-delete btn-sm ascribe-margin-1px"
style={{marginLeft: '0'}}
onClick={this.onRequestHide}>{getLangText('CLOSE')}</Button>
</p>
</div>}
spinner={
<div className="modal-footer">
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
</div>}>
<Property
name='loanee'
label={getLangText('Loanee Email')}
onBlur={this.handleOnBlur}>
<input
type="email"
placeholder={getLangText('Email of the loanee')}
required/>
</Property>
<Property
name='gallery_name'
label={getLangText('Gallery/exhibition (optional)')}
onBlur={this.handleOnBlur}>
<input
type="text"
placeholder={getLangText('Gallery/exhibition (optional)')}/>
</Property>
<Property
name='startdate'
label={getLangText('Start date')}>
<InputDate
placeholderText={getLangText('Loan start date')} />
</Property>
<Property
name='enddate'
label={getLangText('End date')}>
<InputDate
placeholderText={getLangText('Loan end date')} />
</Property>
<Property
name='loan_message'
label={getLangText('Personal Message')}
editable={true}>
<InputTextAreaToggable
rows={1}
editable={true}
defaultValue={this.props.message}
placeholder={getLangText('Enter a message...')}
required="required"/>
</Property>
<Property
name='password'
label={getLangText('Password')}>
<input
type="password"
placeholder={getLangText('Enter your password')}
required/>
</Property>
{this.getContractCheckbox()}
</Form>
);
}
});
export default LoanForm;

View File

@ -40,7 +40,7 @@ let InputCheckbox = React.createClass({
<span
onClick={this.handleFocus}
onFocus={this.handleFocus}>
<input type="checkbox" ref="checkbox"/>
<input type="checkbox" ref="checkbox" required="required"/>
<span className="checkbox">
{this.props.children}
</span>

View File

@ -31,7 +31,6 @@ let InputDate = React.createClass({
},
render: function () {
console.log(this.state.value);
return (
<div className="form-group">
<DatePicker

View File

@ -177,9 +177,9 @@ let RegisterPiece = React.createClass( {
{...this.props}
isFineUploaderEditable={this.state.isFineUploaderEditable}
handleSuccess={this.handleSuccess}>
{this.getSpecifyEditions()}
{this.props.children}
{this.getLicenses()}
{this.getSpecifyEditions()}
</RegisterPieceForm>
</Col>
</Row>

View File

@ -26,8 +26,8 @@ let apiUrls = {
'ownership_consigns_deny': AppConstants.apiEndpoint + 'ownership/consigns/deny/',
'ownership_loans_pieces': AppConstants.apiEndpoint + 'ownership/loans/pieces/',
'ownership_loans_editions': AppConstants.apiEndpoint + 'ownership/loans/editions/',
'ownership_loans_confirm': AppConstants.apiEndpoint + 'ownership/loans/confirm/',
'ownership_loans_deny': AppConstants.apiEndpoint + 'ownership/loans/deny/',
'ownership_loans_confirm': AppConstants.apiEndpoint + 'ownership/loans/editions/confirm/',
'ownership_loans_deny': AppConstants.apiEndpoint + 'ownership/loans/editions/deny/',
'ownership_loans_contract': AppConstants.apiEndpoint + 'ownership/loans/editions/contract/',
'ownership_shares_editions': AppConstants.apiEndpoint + 'ownership/shares/editions/',
'ownership_shares_pieces': AppConstants.apiEndpoint + 'ownership/shares/pieces/',