mirror of
https://github.com/ascribe/onion.git
synced 2024-12-23 01:39:36 +01:00
Merge remote-tracking branch 'remotes/origin/AD-943-add-custom-additional-fields' into AD-996-add-action-buttons-to-piece-detai
This commit is contained in:
diminator
commit
6146a5f6f4
@ -89,6 +89,10 @@ class ContractAgreementListActions {
|
||||
});
|
||||
}
|
||||
|
||||
flushContractAgreementList(){
|
||||
this.actions.updateContractAgreementList(null);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default alt.createActions(ContractAgreementListActions);
|
||||
|
||||
@ -162,21 +162,24 @@ let AclButton = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
let shouldDisplay = this.props.availableAcls[this.props.action];
|
||||
let aclProps = this.actionProperties();
|
||||
let buttonClassName = this.props.buttonAcceptClassName ? this.props.buttonAcceptClassName : '';
|
||||
return (
|
||||
<ModalWrapper
|
||||
trigger={
|
||||
<button className={shouldDisplay ? 'btn btn-default btn-sm ' + buttonClassName : 'hidden'}>
|
||||
{this.sanitizeAction()}
|
||||
</button>
|
||||
}
|
||||
handleSuccess={aclProps.handleSuccess}
|
||||
title={aclProps.title}>
|
||||
{aclProps.form}
|
||||
</ModalWrapper>
|
||||
);
|
||||
if (this.props.availableAcls){
|
||||
let shouldDisplay = this.props.availableAcls[this.props.action];
|
||||
let aclProps = this.actionProperties();
|
||||
let buttonClassName = this.props.buttonAcceptClassName ? this.props.buttonAcceptClassName : '';
|
||||
return (
|
||||
<ModalWrapper
|
||||
trigger={
|
||||
<button className={shouldDisplay ? 'btn btn-default btn-sm ' + buttonClassName : 'hidden'}>
|
||||
{this.sanitizeAction()}
|
||||
</button>
|
||||
}
|
||||
handleSuccess={aclProps.handleSuccess}
|
||||
title={aclProps.title}>
|
||||
{aclProps.form}
|
||||
</ModalWrapper>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -152,8 +152,9 @@ let Edition = React.createClass({
|
||||
|
||||
<CollapsibleParagraph
|
||||
title="Notes"
|
||||
show={(this.state.currentUser.username && true || false) ||
|
||||
(this.props.edition.acl.acl_edit || this.props.edition.public_note)}>
|
||||
show={!!(this.state.currentUser.username
|
||||
|| this.props.edition.acl.acl_edit
|
||||
|| this.props.edition.public_note)}>
|
||||
<Note
|
||||
id={() => {return {'bitcoin_id': this.props.edition.bitcoin_id}; }}
|
||||
label={getLangText('Personal note (private)')}
|
||||
|
||||
@ -237,12 +237,11 @@ let PieceContainer = React.createClass({
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Notes')}
|
||||
show={(this.state.currentUser.username && true || false) ||
|
||||
(this.state.piece.public_note)}>
|
||||
show={!!(this.state.currentUser.username || this.state.piece.public_note)}>
|
||||
<Note
|
||||
id={this.getId}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.state.piece.private_note ? this.state.piece.private_note : null}
|
||||
defaultValue={this.state.piece.private_note || null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
|
||||
@ -35,7 +35,7 @@ let ContractAgreementForm = React.createClass({
|
||||
|
||||
componentDidMount() {
|
||||
ContractListStore.listen(this.onChange);
|
||||
ContractListActions.fetchContractList(true);
|
||||
ContractListActions.fetchContractList(true, false);
|
||||
},
|
||||
|
||||
componentWillUnmount() {
|
||||
@ -95,45 +95,56 @@ let ContractAgreementForm = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
if (this.state.contractList && this.state.contractList.length > 0) {
|
||||
return (
|
||||
<Form
|
||||
className="ascribe-form-bordered ascribe-form-wrapper"
|
||||
ref='form'
|
||||
url={ApiUrls.ownership_contract_agreements}
|
||||
getFormData={this.getFormData}
|
||||
handleSuccess={this.handleSubmitSuccess}
|
||||
buttons={<button
|
||||
type="submit"
|
||||
className="btn ascribe-btn ascribe-btn-login">
|
||||
{getLangText('Send loan request')}
|
||||
</button>}
|
||||
spinner={
|
||||
<span className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
|
||||
<img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
|
||||
</span>
|
||||
}>
|
||||
<div className="ascribe-form-header">
|
||||
<h3>{getLangText('Contract form')}</h3>
|
||||
</div>
|
||||
<Property
|
||||
name='signee'
|
||||
label={getLangText('Artist Email')}>
|
||||
<input
|
||||
type="email"
|
||||
placeholder={getLangText('(e.g. andy@warhol.co.uk)')}
|
||||
required/>
|
||||
</Property>
|
||||
{this.getContracts()}
|
||||
<PropertyCollapsible
|
||||
name='appendix'
|
||||
checkboxLabel={getLangText('Add appendix to the contract')}>
|
||||
<span>{getLangText('Appendix')}</span>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('This will be appended to the contract selected above')}/>
|
||||
</PropertyCollapsible>
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Form
|
||||
className="ascribe-form-bordered ascribe-form-wrapper"
|
||||
ref='form'
|
||||
url={ApiUrls.ownership_contract_agreements}
|
||||
getFormData={this.getFormData}
|
||||
handleSuccess={this.handleSubmitSuccess}
|
||||
buttons={<button
|
||||
type="submit"
|
||||
className="btn ascribe-btn ascribe-btn-login">
|
||||
{getLangText('Send loan request')}
|
||||
</button>}
|
||||
spinner={
|
||||
<span className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
|
||||
<img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
|
||||
</span>
|
||||
}>
|
||||
<div className="ascribe-form-header">
|
||||
<h3>{getLangText('Contract form')}</h3>
|
||||
</div>
|
||||
<Property
|
||||
name='signee'
|
||||
label={getLangText('Artist Email')}>
|
||||
<input
|
||||
type="email"
|
||||
placeholder={getLangText('(e.g. andy@warhol.co.uk)')}
|
||||
required/>
|
||||
</Property>
|
||||
{this.getContracts()}
|
||||
<PropertyCollapsible
|
||||
name='appendix'
|
||||
checkboxLabel={getLangText('Add appendix to the contract')}>
|
||||
<span>{getLangText('Appendix')}</span>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={true}
|
||||
placeholder={getLangText('This will be appended to the contract selected above')}/>
|
||||
</PropertyCollapsible>
|
||||
</Form>
|
||||
<div>
|
||||
<p className="text-center">
|
||||
{getLangText('No private contracts found, please go to the ')}
|
||||
<a href="settings">{getLangText('settings page')}</a>
|
||||
{getLangText(' and create them.')}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
75
js/components/ascribe_forms/form_copyright_association.js
Normal file
75
js/components/ascribe_forms/form_copyright_association.js
Normal file
@ -0,0 +1,75 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
|
||||
import GlobalNotificationModel from '../../models/global_notification_model';
|
||||
import GlobalNotificationActions from '../../actions/global_notification_actions';
|
||||
|
||||
import Form from './form';
|
||||
import Property from './property';
|
||||
|
||||
import ApiUrls from '../../constants/api_urls';
|
||||
import AppConstants from '../../constants/application_constants';
|
||||
|
||||
import { getLangText } from '../../utils/lang_utils';
|
||||
|
||||
let CopyrightAssociationForm = React.createClass({
|
||||
propTypes: {
|
||||
currentUser: React.PropTypes.object
|
||||
},
|
||||
|
||||
handleSubmitSuccess(){
|
||||
let notification = getLangText('Copyright association updated');
|
||||
notification = new GlobalNotificationModel(notification, 'success', 10000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
},
|
||||
|
||||
getProfileFormData(){
|
||||
return {email: this.props.currentUser.email};
|
||||
},
|
||||
|
||||
render() {
|
||||
let selectedState = -1;
|
||||
if (this.props.currentUser
|
||||
&& this.props.currentUser.profile
|
||||
&& this.props.currentUser.profile.copyright_association) {
|
||||
selectedState = AppConstants.copyrightAssociations.indexOf(this.props.currentUser.profile.copyright_association);
|
||||
}
|
||||
if (this.props.currentUser && this.props.currentUser.email){
|
||||
return (
|
||||
<Form
|
||||
ref='form'
|
||||
url={ApiUrls.users_profile}
|
||||
getFormData={this.getProfileFormData}
|
||||
handleSuccess={this.handleSubmitSuccess}>
|
||||
<Property
|
||||
name="copyright_association"
|
||||
className="ascribe-settings-property-collapsible-toggle"
|
||||
label={getLangText('Copyright Association')}
|
||||
style={{paddingBottom: 0}}>
|
||||
<select name="contract">
|
||||
<option disabled selected={selectedState === -1}>
|
||||
{' -- ' + getLangText('select an association') + ' -- '}
|
||||
</option>
|
||||
{AppConstants.copyrightAssociations.map((association, i) => {
|
||||
return (
|
||||
<option
|
||||
name={i}
|
||||
key={i}
|
||||
value={ association }
|
||||
selected={selectedState === i}>
|
||||
{ association }
|
||||
</option>
|
||||
);
|
||||
})}
|
||||
</select>
|
||||
</Property>
|
||||
<hr />
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
export default CopyrightAssociationForm;
|
||||
@ -35,6 +35,7 @@ let LoanForm = React.createClass({
|
||||
url: React.PropTypes.string,
|
||||
id: React.PropTypes.object,
|
||||
message: React.PropTypes.string,
|
||||
createPublicContractAgreement: React.PropTypes.bool,
|
||||
handleSuccess: React.PropTypes.func
|
||||
},
|
||||
|
||||
@ -44,7 +45,8 @@ let LoanForm = React.createClass({
|
||||
showPersonalMessage: true,
|
||||
showEndDate: true,
|
||||
showStartDate: true,
|
||||
showPassword: true
|
||||
showPassword: true,
|
||||
createPublicContractAgreement: true
|
||||
};
|
||||
},
|
||||
|
||||
@ -61,7 +63,7 @@ let LoanForm = React.createClass({
|
||||
// however, it can also be that at the time the component is mounting,
|
||||
// the email is not defined (because it's asynchronously fetched from the server).
|
||||
// Then we need to update it as soon as it is included into LoanForm's props.
|
||||
if(nextProps && nextProps.email) {
|
||||
if(nextProps && nextProps.email && this.props.email !== nextProps.email) {
|
||||
this.getContractAgreementsOrCreatePublic(nextProps.email);
|
||||
}
|
||||
},
|
||||
@ -77,9 +79,11 @@ let LoanForm = React.createClass({
|
||||
getContractAgreementsOrCreatePublic(email){
|
||||
ContractAgreementListActions.flushContractAgreementList();
|
||||
if (email) {
|
||||
// fetch the available contractagreements (pending/accepted)
|
||||
ContractAgreementListActions.fetchAvailableContractAgreementList(email).then(
|
||||
(contractAgreementList) => {
|
||||
if (!contractAgreementList) {
|
||||
if (!contractAgreementList && this.props.createPublicContractAgreement) {
|
||||
// for public contracts: fetch the public contract and create a contractagreement if available
|
||||
ContractAgreementListActions.createContractAgreementFromPublicContract(email);
|
||||
}
|
||||
}
|
||||
|
||||
@ -27,7 +27,7 @@ let LoginForm = React.createClass({
|
||||
onLogin: React.PropTypes.func
|
||||
},
|
||||
|
||||
mixins: [Router.Navigation],
|
||||
mixins: [Router.Navigation, Router.State],
|
||||
|
||||
getDefaultProps() {
|
||||
return {
|
||||
@ -95,6 +95,7 @@ let LoginForm = React.createClass({
|
||||
},
|
||||
|
||||
render() {
|
||||
let email = this.getQuery().email || null;
|
||||
return (
|
||||
<Form
|
||||
className="ascribe-form-bordered"
|
||||
@ -122,7 +123,8 @@ let LoginForm = React.createClass({
|
||||
<input
|
||||
type="email"
|
||||
placeholder={getLangText('Enter your email')}
|
||||
name="username"
|
||||
name="email"
|
||||
defaultValue={email}
|
||||
required/>
|
||||
</Property>
|
||||
<Property
|
||||
|
||||
@ -66,17 +66,24 @@ let SignupForm = React.createClass({
|
||||
}
|
||||
},
|
||||
|
||||
getFormData() {
|
||||
if (this.getQuery().token){
|
||||
return {token: this.getQuery().token};
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
render() {
|
||||
let tooltipPassword = getLangText('Your password must be at least 10 characters') + '.\n ' +
|
||||
getLangText('This password is securing your digital property like a bank account') + '.\n ' +
|
||||
getLangText('Store it in a safe place') + '!';
|
||||
let email = this.getQuery().email ? this.getQuery().email : null;
|
||||
let email = this.getQuery().email || null;
|
||||
return (
|
||||
<Form
|
||||
className="ascribe-form-bordered"
|
||||
ref='form'
|
||||
url={ApiUrls.users_signup}
|
||||
getFormData={this.getQuery}
|
||||
getFormData={this.getFormData}
|
||||
handleSuccess={this.handleSuccess}
|
||||
buttons={
|
||||
<button type="submit" className="btn ascribe-btn ascribe-btn-login">
|
||||
|
||||
@ -13,6 +13,8 @@ import Property from '../ascribe_forms/property';
|
||||
import InputCheckbox from '../ascribe_forms/input_checkbox';
|
||||
import CollapsibleParagraph from '../ascribe_collapsible/collapsible_paragraph';
|
||||
|
||||
import CopyrightAssociationForm from '../ascribe_forms/form_copyright_association';
|
||||
|
||||
import ApiUrls from '../../constants/api_urls';
|
||||
import AppConstants from '../../constants/application_constants';
|
||||
|
||||
@ -117,6 +119,7 @@ let AccountSettings = React.createClass({
|
||||
show={true}
|
||||
defaultExpanded={true}>
|
||||
{content}
|
||||
<CopyrightAssociationForm currentUser={this.state.currentUser}/>
|
||||
{profile}
|
||||
{/*<Form
|
||||
url={AppConstants.serverUrl + 'api/users/set_language/'}>
|
||||
|
||||
@ -178,7 +178,7 @@ let SlidesContainer = React.createClass({
|
||||
let breadcrumbs = [];
|
||||
|
||||
ReactAddons.Children.map(this.props.children, (child, i) => {
|
||||
if(i >= this.state.startFrom && child.props['data-slide-title']) {
|
||||
if(child && i >= this.state.startFrom && child.props['data-slide-title']) {
|
||||
breadcrumbs.push(child.props['data-slide-title']);
|
||||
}
|
||||
});
|
||||
@ -229,7 +229,7 @@ let SlidesContainer = React.createClass({
|
||||
|
||||
// since the default parameter of startFrom is -1, we do not need to check
|
||||
// if its actually present in the url bar, as it will just not match
|
||||
if(i >= this.state.startFrom) {
|
||||
if(child && i >= this.state.startFrom) {
|
||||
return ReactAddons.addons.cloneWithProps(child, {
|
||||
className: 'ascribe-slide',
|
||||
style: {
|
||||
|
||||
@ -1,8 +1,12 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import Router from 'react-router';
|
||||
import SignupForm from './ascribe_forms/form_signup';
|
||||
|
||||
import { getLangText } from '../utils/lang_utils';
|
||||
|
||||
let Link = Router.Link;
|
||||
|
||||
let SignupContainer = React.createClass({
|
||||
getInitialState() {
|
||||
@ -33,7 +37,12 @@ let SignupContainer = React.createClass({
|
||||
return (
|
||||
<div className="ascribe-login-wrapper">
|
||||
<SignupForm handleSuccess={this.handleSuccess} />
|
||||
<div className="ascribe-login-text">
|
||||
{getLangText('Already an ascribe user')}? <Link to="login">{getLangText('Log in')}...</Link><br/>
|
||||
{getLangText('Forgot my password')}? <Link to="password_reset">{getLangText('Rescue me')}...</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -98,12 +98,11 @@ let CylandPieceContainer = React.createClass({
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Notes')}
|
||||
show={(this.state.currentUser.username && true || false) ||
|
||||
(this.state.piece.public_note)}>
|
||||
show={!!(this.state.currentUser.username || this.state.piece.public_note)}>
|
||||
<Note
|
||||
id={() => {return {'id': this.state.piece.id}; }}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.state.piece.private_note ? this.state.piece.private_note : null}
|
||||
defaultValue={this.state.piece.private_note || null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
|
||||
@ -10,9 +10,6 @@ import Row from 'react-bootstrap/lib/Row';
|
||||
|
||||
import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece';
|
||||
|
||||
import Property from '../../../../ascribe_forms/property';
|
||||
import InputCheckbox from '../../../../ascribe_forms/input_checkbox';
|
||||
|
||||
import WhitelabelActions from '../../../../../actions/whitelabel_actions';
|
||||
import WhitelabelStore from '../../../../../stores/whitelabel_store';
|
||||
|
||||
@ -136,7 +133,7 @@ let CylandRegisterPiece = React.createClass({
|
||||
this.transitionTo('piece', {pieceId: this.state.piece.id});
|
||||
},
|
||||
|
||||
// We need to increase the step to lock the forms that are already filed out
|
||||
// We need to increase the step to lock the forms that are already filled out
|
||||
incrementStep() {
|
||||
// also increase step
|
||||
let newStep = this.state.step + 1;
|
||||
|
||||
@ -63,12 +63,16 @@ let IkonotvAccordionListItem = React.createClass({
|
||||
return (
|
||||
<div>
|
||||
<AclProxy
|
||||
aclObject={this.props.content.acl}
|
||||
aclObject={this.state.currentUser.acl}
|
||||
aclName="acl_submit">
|
||||
<IkonotvSubmitButton
|
||||
className="btn-xs pull-right"
|
||||
handleSuccess={this.handleSubmitSuccess}
|
||||
piece={this.props.content}/>
|
||||
<AclProxy
|
||||
aclObject={this.props.content.acl}
|
||||
aclName="acl_submit">
|
||||
<IkonotvSubmitButton
|
||||
className="btn-xs pull-right"
|
||||
handleSuccess={this.handleSubmitSuccess}
|
||||
piece={this.props.content}/>
|
||||
</AclProxy>
|
||||
</AclProxy>
|
||||
<AclProxy
|
||||
aclObject={this.props.content.acl}
|
||||
|
||||
@ -1,17 +1,8 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import Moment from 'moment';
|
||||
import classNames from 'classnames';
|
||||
|
||||
import ModalWrapper from '../../../../../ascribe_modal/modal_wrapper';
|
||||
|
||||
import LoanForm from '../../../../../ascribe_forms/form_loan';
|
||||
|
||||
import Property from '../../../../../ascribe_forms/property';
|
||||
import InputCheckbox from '../../../../../ascribe_forms/input_checkbox';
|
||||
|
||||
import ApiUrls from '../../../../../../constants/api_urls';
|
||||
import ButtonLink from 'react-router-bootstrap/lib/ButtonLink';
|
||||
|
||||
import { getLangText } from '../../../../../../utils/lang_utils';
|
||||
|
||||
@ -22,37 +13,30 @@ let IkonotvSubmitButton = React.createClass({
|
||||
piece: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
getSubmitButton() {
|
||||
return (
|
||||
<button
|
||||
className={classNames('btn', 'btn-default', this.props.className)}>
|
||||
{getLangText('Loan to IkonoTV')}
|
||||
</button>
|
||||
);
|
||||
},
|
||||
|
||||
render() {
|
||||
let piece = this.props.piece;
|
||||
let startFrom = 1;
|
||||
|
||||
let today = new Moment();
|
||||
let enddate = new Moment();
|
||||
enddate.add(1, 'years');
|
||||
// In the Ikonotv loan page a user has to complete two steps.
|
||||
// Since every one of those steps is atomic a user should always be able to continue
|
||||
// where he left of.
|
||||
// This is why we start the process form slide 1/2 if the user has already finished
|
||||
// it in another session.
|
||||
if(piece && piece.extra_data && Object.keys(piece.extra_data).length > 0) {
|
||||
startFrom = 1;
|
||||
}
|
||||
|
||||
return (
|
||||
<ModalWrapper
|
||||
trigger={this.getSubmitButton()}
|
||||
handleSuccess={this.props.handleSuccess}
|
||||
title={getLangText('Loan to IkonoTV archive')}>
|
||||
<LoanForm
|
||||
id={{piece_id: this.props.piece.id}}
|
||||
url={ApiUrls.ownership_loans_pieces}
|
||||
email="submissions@ikono.org"
|
||||
startdate={today}
|
||||
enddate={enddate}
|
||||
gallery="IkonoTV archive"
|
||||
showPersonalMessage={false}
|
||||
handleSuccess={this.props.handleSuccess} />
|
||||
</ModalWrapper>
|
||||
|
||||
<ButtonLink
|
||||
to="register_piece"
|
||||
query={{
|
||||
'slide_num': 0,
|
||||
'start_from': startFrom,
|
||||
'piece_id': piece.id
|
||||
}}
|
||||
className={classNames('btn', 'btn-default', 'btn-xs', this.props.className)}>
|
||||
{getLangText('Loan to IkonoTV')}
|
||||
</ButtonLink>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -5,32 +5,23 @@ import React from 'react';
|
||||
import PieceActions from '../../../../../../actions/piece_actions';
|
||||
import PieceStore from '../../../../../../stores/piece_store';
|
||||
|
||||
import PieceListActions from '../../../../../../actions/piece_list_actions';
|
||||
import PieceListStore from '../../../../../../stores/piece_list_store';
|
||||
|
||||
import UserStore from '../../../../../../stores/user_store';
|
||||
|
||||
import Piece from '../../../../../../components/ascribe_detail/piece';
|
||||
|
||||
import ListRequestActions from '../../../../../ascribe_forms/list_form_request_actions';
|
||||
import AclButtonList from '../../../../../ascribe_buttons/acl_button_list';
|
||||
import DeleteButton from '../../../../../ascribe_buttons/delete_button';
|
||||
import AppConstants from '../../../../../../constants/application_constants';
|
||||
|
||||
import Form from '../../../../../../components/ascribe_forms/form';
|
||||
import Property from '../../../../../../components/ascribe_forms/property';
|
||||
import InputTextAreaToggable from '../../../../../../components/ascribe_forms/input_textarea_toggable';
|
||||
import CollapsibleParagraph from '../../../../../../components/ascribe_collapsible/collapsible_paragraph';
|
||||
|
||||
import IkonotvSubmitButton from '../ascribe_buttons/ikonotv_submit_button';
|
||||
|
||||
import HistoryIterator from '../../../../../ascribe_detail/history_iterator';
|
||||
import Note from '../../../../../ascribe_detail/note';
|
||||
|
||||
import DetailProperty from '../../../../../ascribe_detail/detail_property';
|
||||
|
||||
|
||||
import GlobalNotificationModel from '../../../../../../models/global_notification_model';
|
||||
import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
|
||||
|
||||
import AclProxy from '../../../../../acl_proxy';
|
||||
|
||||
import AppConstants from '../../../../../../constants/application_constants';
|
||||
import ApiUrls from '../../../../../../constants/api_urls';
|
||||
|
||||
import { getLangText } from '../../../../../../utils/lang_utils';
|
||||
import { mergeOptions } from '../../../../../../utils/general_utils';
|
||||
@ -40,8 +31,7 @@ let IkonotvPieceContainer = React.createClass({
|
||||
getInitialState() {
|
||||
return mergeOptions(
|
||||
PieceStore.getState(),
|
||||
UserStore.getState(),
|
||||
PieceListStore.getState()
|
||||
UserStore.getState()
|
||||
);
|
||||
},
|
||||
|
||||
@ -49,7 +39,6 @@ let IkonotvPieceContainer = React.createClass({
|
||||
PieceStore.listen(this.onChange);
|
||||
PieceActions.fetchOne(this.props.params.pieceId);
|
||||
UserStore.listen(this.onChange);
|
||||
PieceListStore.listen(this.onChange);
|
||||
},
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
@ -67,7 +56,6 @@ let IkonotvPieceContainer = React.createClass({
|
||||
PieceActions.updatePiece({});
|
||||
PieceStore.unlisten(this.onChange);
|
||||
UserStore.unlisten(this.onChange);
|
||||
PieceListStore.unlisten(this.onChange);
|
||||
},
|
||||
|
||||
onChange(state) {
|
||||
@ -78,59 +66,6 @@ let IkonotvPieceContainer = React.createClass({
|
||||
PieceActions.fetchOne(this.props.params.pieceId);
|
||||
},
|
||||
|
||||
handleSubmitSuccess(response) {
|
||||
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
|
||||
this.state.orderBy, this.state.orderAsc, this.state.filterBy);
|
||||
|
||||
this.loadPiece();
|
||||
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
},
|
||||
|
||||
getActions(){
|
||||
if (this.state.piece &&
|
||||
this.state.piece.notifications &&
|
||||
this.state.piece.notifications.length > 0) {
|
||||
return (
|
||||
<ListRequestActions
|
||||
pieceOrEditions={this.state.piece}
|
||||
currentUser={this.state.currentUser}
|
||||
handleSuccess={this.loadPiece}
|
||||
notifications={this.state.piece.notifications}/>);
|
||||
}
|
||||
else {
|
||||
|
||||
//We need to disable the normal acl_loan because we're inserting a custom acl_loan button
|
||||
let availableAcls;
|
||||
|
||||
if(this.state.piece && this.state.piece.acl && typeof this.state.piece.acl.acl_loan !== 'undefined') {
|
||||
// make a copy to not have side effects
|
||||
availableAcls = mergeOptions({}, this.state.piece.acl);
|
||||
availableAcls.acl_loan = false;
|
||||
}
|
||||
|
||||
return (
|
||||
<AclButtonList
|
||||
className="text-center ascribe-button-list"
|
||||
availableAcls={availableAcls}
|
||||
editions={this.state.piece}
|
||||
handleSuccess={this.loadPiece}>
|
||||
<AclProxy
|
||||
aclObject={availableAcls}
|
||||
aclName="acl_submit">
|
||||
<IkonotvSubmitButton
|
||||
className="btn-sm"
|
||||
handleSuccess={this.handleSubmitSuccess}
|
||||
piece={this.state.piece}/>
|
||||
</AclProxy>
|
||||
<DeleteButton
|
||||
handleSuccess={this.handleDeleteSuccess}
|
||||
piece={this.state.piece}/>
|
||||
</AclButtonList>
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
render() {
|
||||
if(this.state.piece && this.state.piece.title) {
|
||||
return (
|
||||
@ -152,14 +87,28 @@ let IkonotvPieceContainer = React.createClass({
|
||||
<DetailProperty label={getLangText('ID')} value={ this.state.piece.bitcoin_id } ellipsis={true} />
|
||||
<hr/>
|
||||
</div>
|
||||
}
|
||||
buttons={this.getActions()}>
|
||||
}>
|
||||
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Loan History')}
|
||||
show={this.state.piece.loan_history && this.state.piece.loan_history.length > 0}>
|
||||
<HistoryIterator
|
||||
history={this.state.piece.loan_history} />
|
||||
</CollapsibleParagraph>
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Notes')}
|
||||
show={!!(this.state.currentUser.username || this.state.piece.public_note)}>
|
||||
<Note
|
||||
id={() => {return {'id': this.state.piece.id}; }}
|
||||
label={getLangText('Personal note (private)')}
|
||||
defaultValue={this.state.piece.private_note || null}
|
||||
placeholder={getLangText('Enter your comments ...')}
|
||||
editable={true}
|
||||
successMessage={getLangText('Private note saved')}
|
||||
url={ApiUrls.note_private_piece}
|
||||
currentUser={this.state.currentUser}/>
|
||||
</CollapsibleParagraph>
|
||||
<IkonotvPieceDetails piece={this.state.piece}/>
|
||||
</Piece>
|
||||
);
|
||||
} else {
|
||||
@ -172,4 +121,43 @@ let IkonotvPieceContainer = React.createClass({
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
let IkonotvPieceDetails = React.createClass({
|
||||
propTypes: {
|
||||
piece: React.PropTypes.object
|
||||
},
|
||||
|
||||
render() {
|
||||
if (this.props.piece && Object.keys(this.props.piece.extra_data).length !== 0){
|
||||
return (
|
||||
<CollapsibleParagraph
|
||||
title={getLangText('Further Details')}
|
||||
show={true}
|
||||
defaultExpanded={true}>
|
||||
<Form ref='form'>
|
||||
{Object.keys(this.props.piece.extra_data).map((data, i) => {
|
||||
let label = data.replace('_', ' ');
|
||||
return (
|
||||
<Property
|
||||
key={i}
|
||||
name={data}
|
||||
label={label}
|
||||
hidden={!this.props.piece.extra_data[data]}
|
||||
editable={false}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={false}
|
||||
defaultValue={this.props.piece.extra_data[data]}/>
|
||||
</Property>);
|
||||
}
|
||||
)}
|
||||
<hr />
|
||||
</Form>
|
||||
</CollapsibleParagraph>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
export default IkonotvPieceContainer;
|
||||
|
||||
@ -0,0 +1,145 @@
|
||||
'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 ApiUrls from '../../../../../../constants/api_urls';
|
||||
import AppConstants from '../../../../../../constants/application_constants';
|
||||
|
||||
import requests from '../../../../../../utils/requests';
|
||||
|
||||
import { getLangText } from '../../../../../../utils/lang_utils';
|
||||
|
||||
|
||||
let IkonotvArtistDetailsForm = React.createClass({
|
||||
propTypes: {
|
||||
handleSuccess: React.PropTypes.func.isRequired,
|
||||
piece: React.PropTypes.object.isRequired,
|
||||
|
||||
disabled: React.PropTypes.bool
|
||||
},
|
||||
|
||||
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() {
|
||||
if(this.props.piece && this.props.piece.id && this.props.piece.extra_data) {
|
||||
return (
|
||||
<Form
|
||||
disabled={this.props.disabled}
|
||||
className="ascribe-form-bordered"
|
||||
ref='form'
|
||||
url={requests.prepareUrl(ApiUrls.piece_extradata, {piece_id: this.props.piece.id})}
|
||||
handleSuccess={this.props.handleSuccess}
|
||||
getFormData={this.getFormData}
|
||||
buttons={
|
||||
<button
|
||||
type="submit"
|
||||
className="btn ascribe-btn ascribe-btn-login"
|
||||
disabled={!this.state.isUploadReady || this.props.disabled}>
|
||||
{getLangText('Proceed to artwork details')}
|
||||
</button>
|
||||
}
|
||||
spinner={
|
||||
<div className="modal-footer">
|
||||
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
|
||||
</div>
|
||||
}>
|
||||
<div className="ascribe-form-header">
|
||||
<h3>
|
||||
{getLangText('Artist Details')}
|
||||
</h3>
|
||||
</div>
|
||||
<Property
|
||||
name='artist_website'
|
||||
label={getLangText('Artist Website')}
|
||||
editable={!this.props.disabled}>
|
||||
<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}>
|
||||
<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}>
|
||||
<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}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.conceptual_overview}
|
||||
placeholder={getLangText('Enter a short bio about the Artist')}
|
||||
/>
|
||||
</Property>
|
||||
</Form>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div className="ascribe-loading-position">
|
||||
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
export default IkonotvArtistDetailsForm;
|
||||
@ -0,0 +1,162 @@
|
||||
'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 ApiUrls from '../../../../../../constants/api_urls';
|
||||
import AppConstants from '../../../../../../constants/application_constants';
|
||||
|
||||
import requests from '../../../../../../utils/requests';
|
||||
|
||||
import { getLangText } from '../../../../../../utils/lang_utils';
|
||||
|
||||
|
||||
let IkonotvArtworkDetailsForm = React.createClass({
|
||||
propTypes: {
|
||||
handleSuccess: React.PropTypes.func.isRequired,
|
||||
piece: React.PropTypes.object.isRequired,
|
||||
|
||||
disabled: React.PropTypes.bool
|
||||
},
|
||||
|
||||
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() {
|
||||
if(this.props.piece && this.props.piece.id && this.props.piece.extra_data) {
|
||||
return (
|
||||
<Form
|
||||
disabled={this.props.disabled}
|
||||
className="ascribe-form-bordered"
|
||||
ref='form'
|
||||
url={requests.prepareUrl(ApiUrls.piece_extradata, {piece_id: this.props.piece.id})}
|
||||
handleSuccess={this.props.handleSuccess}
|
||||
getFormData={this.getFormData}
|
||||
buttons={
|
||||
<button
|
||||
type="submit"
|
||||
className="btn ascribe-btn ascribe-btn-login"
|
||||
disabled={!this.state.isUploadReady || this.props.disabled}>
|
||||
{getLangText('Proceed to loan')}
|
||||
</button>
|
||||
}
|
||||
spinner={
|
||||
<div className="modal-footer">
|
||||
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_small.gif'} />
|
||||
</div>
|
||||
}>
|
||||
<div className="ascribe-form-header">
|
||||
<h3>
|
||||
{getLangText('Artwork Details')}
|
||||
</h3>
|
||||
</div>
|
||||
<Property
|
||||
name='medium'
|
||||
label={getLangText('Medium')}
|
||||
editable={!this.props.disabled}>
|
||||
<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}>
|
||||
<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}>
|
||||
<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}>
|
||||
<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}>
|
||||
<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}>
|
||||
<InputTextAreaToggable
|
||||
rows={1}
|
||||
editable={!this.props.disabled}
|
||||
defaultValue={this.props.piece.extra_data.additional_details}
|
||||
placeholder={getLangText('Insert artwork overview')}/>
|
||||
</Property>
|
||||
</Form>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<div className="ascribe-loading-position">
|
||||
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
export default IkonotvArtworkDetailsForm;
|
||||
@ -6,20 +6,24 @@ import Router from 'react-router';
|
||||
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
|
||||
import Button from 'react-bootstrap/lib/Button';
|
||||
|
||||
import Form from '../../../../ascribe_forms/form';
|
||||
import Property from '../../../../ascribe_forms/property';
|
||||
import InputCheckbox from '../../../../ascribe_forms/input_checkbox';
|
||||
|
||||
import NotificationActions from '../../../../../actions/notification_actions';
|
||||
import NotificationStore from '../../../../../stores/notification_store';
|
||||
|
||||
import UserActions from '../../../../../actions/user_actions';
|
||||
import UserStore from '../../../../../stores/user_store';
|
||||
|
||||
import OwnershipFetcher from '../../../../../fetchers/ownership_fetcher';
|
||||
|
||||
import WhitelabelStore from '../../../../../stores/whitelabel_store';
|
||||
import WhitelabelActions from '../../../../../actions/whitelabel_actions';
|
||||
|
||||
import GlobalNotificationModel from '../../../../../models/global_notification_model';
|
||||
import GlobalNotificationActions from '../../../../../actions/global_notification_actions';
|
||||
|
||||
import apiUrls from '../../../../../constants/api_urls';
|
||||
import CopyrightAssociationForm from '../../../../ascribe_forms/form_copyright_association';
|
||||
|
||||
import AppConstants from '../../../../../constants/application_constants';
|
||||
|
||||
import requests from '../../../../../utils/requests';
|
||||
import { getLangText } from '../../../../../utils/lang_utils';
|
||||
import { mergeOptions } from '../../../../../utils/general_utils';
|
||||
|
||||
@ -32,13 +36,17 @@ let IkonotvContractNotifications = React.createClass({
|
||||
getInitialState() {
|
||||
return mergeOptions(
|
||||
NotificationStore.getState(),
|
||||
UserStore.getState(),
|
||||
WhitelabelStore.getState()
|
||||
);
|
||||
},
|
||||
|
||||
componentDidMount() {
|
||||
NotificationStore.listen(this.onChange);
|
||||
UserStore.listen(this.onChange);
|
||||
UserActions.fetchCurrentUser();
|
||||
WhitelabelStore.listen(this.onChange);
|
||||
WhitelabelActions.fetchWhitelabel();
|
||||
if (this.state.contractAgreementListNotifications === null){
|
||||
NotificationActions.fetchContractAgreementListNotifications();
|
||||
}
|
||||
@ -87,8 +95,9 @@ let IkonotvContractNotifications = React.createClass({
|
||||
getAppendix() {
|
||||
let notifications = this.state.contractAgreementListNotifications[0];
|
||||
let appendix = notifications.contract_agreement.appendix;
|
||||
if (appendix) {
|
||||
return (<div>
|
||||
if (appendix && appendix.default) {
|
||||
return (
|
||||
<div className='notification-contract-footer'>
|
||||
<h1>{getLangText('Appendix')}</h1>
|
||||
<pre>
|
||||
{appendix.default}
|
||||
@ -99,30 +108,54 @@ let IkonotvContractNotifications = React.createClass({
|
||||
return null;
|
||||
},
|
||||
|
||||
handleConfirm() {
|
||||
let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
|
||||
OwnershipFetcher.confirmContractAgreement(contractAgreement).then(
|
||||
() => this.handleConfirmSuccess()
|
||||
);
|
||||
},
|
||||
|
||||
handleConfirmSuccess() {
|
||||
let notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 10000);
|
||||
let notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 5000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
this.transitionTo('pieces');
|
||||
},
|
||||
|
||||
handleDeny() {
|
||||
let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
|
||||
requests.put(apiUrls.ownership_contract_agreements_deny, {contract_agreement_id: contractAgreement.id}).then(
|
||||
OwnershipFetcher.denyContractAgreement(contractAgreement).then(
|
||||
() => this.handleDenySuccess()
|
||||
);
|
||||
},
|
||||
|
||||
handleDenySuccess() {
|
||||
let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 10000);
|
||||
let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
this.transitionTo('pieces');
|
||||
},
|
||||
|
||||
getCopyrightAssociationForm(){
|
||||
let c = this.state.currentUser;
|
||||
|
||||
if (c && c.profile && !c.profile.copyright_association) {
|
||||
return (
|
||||
<div className='notification-contract-footer'>
|
||||
<h1>{getLangText('Are you a member of any copyright societies?')}</h1>
|
||||
|
||||
<p>
|
||||
{AppConstants.copyrightAssociations.join(', ')}
|
||||
</p>
|
||||
<CopyrightAssociationForm currentUser={this.state.currentUser}/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
render() {
|
||||
|
||||
if (this.state.contractAgreementListNotifications &&
|
||||
this.state.contractAgreementListNotifications.length > 0) {
|
||||
let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
|
||||
return (
|
||||
<div className='container'>
|
||||
<div className='notification-contract-wrapper'>
|
||||
@ -133,41 +166,17 @@ let IkonotvContractNotifications = React.createClass({
|
||||
</div>
|
||||
</div>
|
||||
{this.getContract()}
|
||||
|
||||
<div className='notification-contract-footer'>
|
||||
{this.getAppendix}
|
||||
<h1>{getLangText('Are you a member of any copyright societies?')}</h1>
|
||||
<p>
|
||||
ARS, DACS, Bildkunst, Pictoright, SODRAC, Copyright Agency/Viscopy, SAVA, Bildrecht GmbH,
|
||||
SABAM, AUTVIS, CREAIMAGEN, SONECA, Copydan, EAU, Kuvasto, GCA, HUNGART, IVARO, SIAE, JASPAR-SPDA,
|
||||
AKKA/LAA, LATGA-A, SOMAAP, ARTEGESTION, CARIER, BONO, APSAV, SPA, GESTOR, VISaRTA, RAO, LITA,
|
||||
DALRO, VeGaP, BUS, ProLitteris, AGADU, AUTORARTE, BUBEDRA, BBDA, BCDA, BURIDA, ADAVIS, BSDA
|
||||
{this.getAppendix()}
|
||||
{this.getCopyrightAssociationForm()}
|
||||
<p style={{marginTop: '1em'}}>
|
||||
<Button type="submit" onClick={this.handleConfirm}>
|
||||
{getLangText('I agree with the conditions')}
|
||||
</Button>
|
||||
<Button bsStyle="danger" className="btn-delete" bsSize="medium" onClick={this.handleDeny}>
|
||||
{getLangText('I disagree')}
|
||||
</Button>
|
||||
</p>
|
||||
<Form
|
||||
ref='form'
|
||||
url={requests.prepareUrl(apiUrls.ownership_contract_agreements_confirm, {contract_agreement_id: contractAgreement.id})}
|
||||
handleSuccess={this.handleConfirmSuccess}
|
||||
method='put'
|
||||
buttons={
|
||||
<p style={{marginTop: '1em'}}>
|
||||
<Button type="submit">{getLangText('I agree with the conditions')}</Button>
|
||||
<Button bsStyle="danger" className="btn-delete" bsSize="medium" onClick={this.handleDeny}>
|
||||
{getLangText('I disagree')}
|
||||
</Button>
|
||||
</p>
|
||||
}>
|
||||
<Property
|
||||
name="terms"
|
||||
className="ascribe-settings-property-collapsible-toggle"
|
||||
style={{paddingBottom: 0}}>
|
||||
<InputCheckbox>
|
||||
<span>
|
||||
{' ' + getLangText('Yes') }
|
||||
</span>
|
||||
</InputCheckbox>
|
||||
</Property>
|
||||
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import Router from 'react-router';
|
||||
|
||||
import ButtonLink from 'react-router-bootstrap/lib/ButtonLink';
|
||||
|
||||
import UserActions from '../../../../../actions/user_actions';
|
||||
import UserStore from '../../../../../stores/user_store';
|
||||
|
||||
import { getLangText } from '../../../../../utils/lang_utils';
|
||||
@ -12,6 +12,8 @@ import { getLangText } from '../../../../../utils/lang_utils';
|
||||
|
||||
let IkonotvLanding = React.createClass({
|
||||
|
||||
mixins: [Router.Navigation, Router.State],
|
||||
|
||||
getInitialState() {
|
||||
return UserStore.getState();
|
||||
},
|
||||
@ -29,19 +31,19 @@ let IkonotvLanding = React.createClass({
|
||||
},
|
||||
|
||||
getEnterButton() {
|
||||
let redirect = 'login';
|
||||
|
||||
if(this.state.currentUser && this.state.currentUser.email) {
|
||||
return (
|
||||
<ButtonLink to="pieces">
|
||||
{getLangText('ENTER')}
|
||||
</ButtonLink>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<ButtonLink to="signup">
|
||||
{getLangText('ENTER')}
|
||||
</ButtonLink>
|
||||
);
|
||||
redirect = 'pieces';
|
||||
}
|
||||
else if (this.getQuery() && this.getQuery().redirect) {
|
||||
redirect = this.getQuery().redirect;
|
||||
}
|
||||
return (
|
||||
<ButtonLink to={redirect} query={this.getQuery()}>
|
||||
{getLangText('ENTER')}
|
||||
</ButtonLink>
|
||||
);
|
||||
},
|
||||
|
||||
render() {
|
||||
@ -52,7 +54,7 @@ let IkonotvLanding = React.createClass({
|
||||
<div className="tagline">
|
||||
<h1>PROTECT</h1>
|
||||
<img src="http://placehold.it/600x300" />
|
||||
<h1>& SHARE</h1>
|
||||
<h1>& SHARE</h1>
|
||||
</div>
|
||||
<h2>Welcome to the ikonoTV</h2>
|
||||
<h2>Registration Page</h2>
|
||||
@ -93,7 +95,7 @@ let IkonotvLanding = React.createClass({
|
||||
</section>
|
||||
<footer>
|
||||
<p>Elizabeth Markevitch</p>
|
||||
<p>Founder & CEO Markevitch Media GmbH</p>
|
||||
<p>Founder & CEO Markevitch Media GmbH</p>
|
||||
{this.getEnterButton()}
|
||||
</footer>
|
||||
</article>
|
||||
|
||||
@ -0,0 +1,268 @@
|
||||
'use strict';
|
||||
|
||||
import React from 'react';
|
||||
import Moment from 'moment';
|
||||
import Router from 'react-router';
|
||||
|
||||
import Col from 'react-bootstrap/lib/Col';
|
||||
import Row from 'react-bootstrap/lib/Row';
|
||||
|
||||
import PieceListStore from '../../../../../stores/piece_list_store';
|
||||
import PieceListActions from '../../../../../actions/piece_list_actions';
|
||||
|
||||
import UserStore from '../../../../../stores/user_store';
|
||||
import UserActions from '../../../../../actions/user_actions';
|
||||
|
||||
import PieceStore from '../../../../../stores/piece_store';
|
||||
import PieceActions from '../../../../../actions/piece_actions';
|
||||
|
||||
import GlobalNotificationModel from '../../../../../models/global_notification_model';
|
||||
import GlobalNotificationActions from '../../../../../actions/global_notification_actions';
|
||||
|
||||
import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece';
|
||||
import LoanForm from '../../../../ascribe_forms/form_loan';
|
||||
|
||||
import IkonotvArtistDetailsForm from './ascribe_forms/ikonotv_artist_details_form';
|
||||
import IkonotvArtworkDetailsForm from './ascribe_forms/ikonotv_artwork_details_form';
|
||||
|
||||
import SlidesContainer from '../../../../ascribe_slides_container/slides_container';
|
||||
|
||||
import ApiUrls from '../../../../../constants/api_urls';
|
||||
|
||||
import { mergeOptions } from '../../../../../utils/general_utils';
|
||||
import { getLangText } from '../../../../../utils/lang_utils';
|
||||
|
||||
let IkonotvRegisterPiece = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
handleSuccess: React.PropTypes.func,
|
||||
piece: React.PropTypes.object.isRequired
|
||||
},
|
||||
|
||||
mixins: [Router.Navigation, Router.State],
|
||||
|
||||
getInitialState(){
|
||||
return mergeOptions(
|
||||
UserStore.getState(),
|
||||
PieceListStore.getState(),
|
||||
PieceStore.getState(),
|
||||
{
|
||||
step: 0
|
||||
});
|
||||
},
|
||||
|
||||
componentDidMount() {
|
||||
PieceListStore.listen(this.onChange);
|
||||
UserStore.listen(this.onChange);
|
||||
PieceStore.listen(this.onChange);
|
||||
UserActions.fetchCurrentUser();
|
||||
|
||||
let queryParams = this.getQuery();
|
||||
|
||||
// Since every step of this register process is atomic,
|
||||
// we may need to enter the process at step 1 or 2.
|
||||
// If this is the case, we'll need the piece number to complete submission.
|
||||
// It is encoded in the URL as a queryParam and we're checking for it here.
|
||||
//
|
||||
// We're using 'in' here as we want to know if 'piece_id' is present in the url,
|
||||
// we don't care about the value.
|
||||
if (queryParams && 'piece_id' in queryParams) {
|
||||
PieceActions.fetchOne(queryParams.piece_id);
|
||||
}
|
||||
},
|
||||
|
||||
componentWillUnmount() {
|
||||
PieceListStore.unlisten(this.onChange);
|
||||
UserStore.unlisten(this.onChange);
|
||||
PieceStore.unlisten(this.onChange);
|
||||
},
|
||||
|
||||
onChange(state) {
|
||||
this.setState(state);
|
||||
|
||||
if(this.state.currentUser && this.state.currentUser.email) {
|
||||
// we should also make the fineuploader component editable again
|
||||
this.setState({
|
||||
isFineUploaderActive: true
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
handleRegisterSuccess(response){
|
||||
|
||||
this.refreshPieceList();
|
||||
|
||||
// also start loading the piece for the next step
|
||||
if(response && response.piece) {
|
||||
PieceActions.updatePiece(response.piece);
|
||||
}
|
||||
if (!this.canSubmit()) {
|
||||
this.transitionTo('pieces');
|
||||
}
|
||||
else {
|
||||
this.incrementStep();
|
||||
this.refs.slidesContainer.nextSlide();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
handleAdditionalDataSuccess() {
|
||||
|
||||
// We need to refetch the piece again after submitting the additional data
|
||||
// since we want it's otherData to be displayed when the user choses to click
|
||||
// on the browsers back button.
|
||||
PieceActions.fetchOne(this.state.piece.id);
|
||||
|
||||
this.refreshPieceList();
|
||||
|
||||
this.incrementStep();
|
||||
|
||||
this.refs.slidesContainer.nextSlide();
|
||||
},
|
||||
|
||||
handleLoanSuccess(response) {
|
||||
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
|
||||
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||
|
||||
this.refreshPieceList();
|
||||
|
||||
PieceActions.fetchOne(this.state.piece.id);
|
||||
this.transitionTo('piece', {pieceId: this.state.piece.id});
|
||||
},
|
||||
|
||||
// We need to increase the step to lock the forms that are already filled out
|
||||
incrementStep() {
|
||||
// also increase step
|
||||
let newStep = this.state.step + 1;
|
||||
this.setState({
|
||||
step: newStep
|
||||
});
|
||||
},
|
||||
|
||||
refreshPieceList() {
|
||||
PieceListActions.fetchPieceList(
|
||||
this.state.page,
|
||||
this.state.pageSize,
|
||||
this.state.searchTerm,
|
||||
this.state.orderBy,
|
||||
this.state.orderAsc,
|
||||
this.state.filterBy
|
||||
);
|
||||
},
|
||||
|
||||
changeSlide() {
|
||||
// only transition to the login store, if user is not logged in
|
||||
// ergo the currentUser object is not properly defined
|
||||
if(this.state.currentUser && !this.state.currentUser.email) {
|
||||
this.onLoggedOut();
|
||||
}
|
||||
},
|
||||
|
||||
// basically redirects to the second slide (index: 1), when the user is not logged in
|
||||
onLoggedOut() {
|
||||
this.transitionTo('login');
|
||||
},
|
||||
|
||||
canSubmit() {
|
||||
let c = this.state.currentUser;
|
||||
return c && c.acl && c.acl.acl_submit;
|
||||
},
|
||||
|
||||
getSlideArtistDetails() {
|
||||
if (this.canSubmit()) {
|
||||
return (
|
||||
<div data-slide-title={getLangText('Artist details')}>
|
||||
<Row className="no-margin">
|
||||
<Col xs={12} sm={10} md={8} smOffset={1} mdOffset={2}>
|
||||
<IkonotvArtistDetailsForm
|
||||
disabled={this.state.step > 1}
|
||||
handleSuccess={this.handleAdditionalDataSuccess}
|
||||
piece={this.state.piece}/>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
getSlideArtworkDetails() {
|
||||
if (this.canSubmit()) {
|
||||
return (
|
||||
<div data-slide-title={getLangText('Artwork details')}>
|
||||
<Row className="no-margin">
|
||||
<Col xs={12} sm={10} md={8} smOffset={1} mdOffset={2}>
|
||||
<IkonotvArtworkDetailsForm
|
||||
disabled={this.state.step > 1}
|
||||
handleSuccess={this.handleAdditionalDataSuccess}
|
||||
piece={this.state.piece}/>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
getSlideLoan() {
|
||||
if (this.canSubmit()) {
|
||||
|
||||
let today = new Moment();
|
||||
let enddate = new Moment();
|
||||
enddate.add(1, 'years');
|
||||
return (
|
||||
<div data-slide-title={getLangText('Loan')}>
|
||||
<Row className="no-margin">
|
||||
<Col xs={12} sm={10} md={8} smOffset={1} mdOffset={2}>
|
||||
<LoanForm
|
||||
loanHeading={getLangText('Loan to IkonoTV archive')}
|
||||
id={{piece_id: this.state.piece.id}}
|
||||
url={ApiUrls.ownership_loans_pieces}
|
||||
email="submissions@ikono.org"
|
||||
startdate={today}
|
||||
enddate={enddate}
|
||||
gallery="IkonoTV archive"
|
||||
showPersonalMessage={false}
|
||||
createPublicContractAgreement={false}
|
||||
handleSuccess={this.handleLoanSuccess}/>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
render() {
|
||||
return (
|
||||
<SlidesContainer
|
||||
ref="slidesContainer"
|
||||
forwardProcess={true}
|
||||
glyphiconClassNames={{
|
||||
pending: 'glyphicon glyphicon-chevron-right',
|
||||
completed: 'glyphicon glyphicon-lock'
|
||||
}}>
|
||||
<div data-slide-title={getLangText('Register work')}>
|
||||
<Row className="no-margin">
|
||||
<Col xs={12} sm={10} md={8} smOffset={1} mdOffset={2}>
|
||||
<RegisterPieceForm
|
||||
disabled={this.state.step > 0}
|
||||
enableLocalHashing={false}
|
||||
headerMessage={getLangText('Register work')}
|
||||
submitMessage={getLangText('Register')}
|
||||
isFineUploaderActive={this.state.isFineUploaderActive}
|
||||
handleSuccess={this.handleRegisterSuccess}
|
||||
onLoggedOut={this.onLoggedOut} />
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
{this.getSlideArtistDetails()}
|
||||
{this.getSlideArtworkDetails()}
|
||||
{this.getSlideLoan()}
|
||||
</SlidesContainer>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
export default IkonotvRegisterPiece;
|
||||
@ -19,7 +19,7 @@ let WalletApp = React.createClass({
|
||||
let ROUTES = getRoutes(null, subdomain);
|
||||
|
||||
let header = null;
|
||||
if ((this.isActive('landing') || this.isActive('login') || this.isActive('signup'))
|
||||
if ((this.isActive('landing') || this.isActive('login') || this.isActive('signup') || this.isActive('contract_notifications'))
|
||||
&& (['ikonotv', 'cyland']).indexOf(subdomain) > -1) {
|
||||
header = (
|
||||
<div className="hero"/>);
|
||||
|
||||
@ -22,6 +22,7 @@ import CylandPieceList from './components/cyland/cyland_piece_list';
|
||||
import IkonotvLanding from './components/ikonotv/ikonotv_landing';
|
||||
import IkonotvPieceList from './components/ikonotv/ikonotv_piece_list';
|
||||
import IkonotvRequestLoan from './components/ikonotv/ikonotv_request_loan';
|
||||
import IkonotvRegisterPiece from './components/ikonotv/ikonotv_register_piece';
|
||||
import IkonotvPieceContainer from './components/ikonotv/ascribe_detail/ikonotv_piece_container';
|
||||
import IkonotvContractNotifications from './components/ikonotv/ikonotv_contract_notifications';
|
||||
|
||||
@ -73,7 +74,7 @@ let ROUTES = {
|
||||
<Route name="signup" path="signup" handler={SignupContainer} />
|
||||
<Route name="password_reset" path="password_reset" handler={PasswordResetContainer} />
|
||||
<Route name="request_loan" path="request_loan" handler={IkonotvRequestLoan} headerTitle="SEND NEW CONTRACT" aclName="acl_send_contract" />
|
||||
<Route name="register_piece" path="register_piece" handler={RegisterPiece} headerTitle="+ NEW WORK"/>
|
||||
<Route name="register_piece" path="register_piece" handler={IkonotvRegisterPiece} headerTitle="+ NEW WORK"/>
|
||||
<Route name="pieces" path="collection" handler={IkonotvPieceList} headerTitle="COLLECTION"/>
|
||||
<Route name="piece" path="pieces/:pieceId" handler={IkonotvPieceContainer} />
|
||||
<Route name="edition" path="editions/:editionId" handler={EditionContainer} />
|
||||
|
||||
@ -74,7 +74,11 @@ let constants = {
|
||||
'whitelabel': {},
|
||||
'raven': {
|
||||
'url': 'https://0955da3388c64ab29bd32c2a429f9ef4@app.getsentry.com/48351'
|
||||
}
|
||||
},
|
||||
'copyrightAssociations': ['ARS', 'DACS', 'Bildkunst', 'Pictoright', 'SODRAC', 'Copyright Agency/Viscopy', 'SAVA',
|
||||
'Bildrecht GmbH', 'SABAM', 'AUTVIS', 'CREAIMAGEN', 'SONECA', 'Copydan', 'EAU', 'Kuvasto', 'GCA', 'HUNGART',
|
||||
'IVARO', 'SIAE', 'JASPAR-SPDA', 'AKKA/LAA', 'LATGA-A', 'SOMAAP', 'ARTEGESTION', 'CARIER', 'BONO', 'APSAV',
|
||||
'SPA', 'GESTOR', 'VISaRTA', 'RAO', 'LITA', 'DALRO', 'VeGaP', 'BUS', 'ProLitteris', 'AGADU', 'AUTORARTE', 'BUBEDRA', 'BBDA', 'BCDA', 'BURIDA', 'ADAVIS', 'BSDA']
|
||||
};
|
||||
|
||||
export default constants;
|
||||
|
||||
@ -44,6 +44,14 @@ let OwnershipFetcher = {
|
||||
return requests.get(ApiUrls.ownership_contract_agreements, queryParams);
|
||||
},
|
||||
|
||||
confirmContractAgreement(contractAgreement){
|
||||
return requests.put(ApiUrls.ownership_contract_agreements_confirm, {contract_agreement_id: contractAgreement.id});
|
||||
},
|
||||
|
||||
denyContractAgreement(contractAgreement){
|
||||
return requests.put(ApiUrls.ownership_contract_agreements_deny, {contract_agreement_id: contractAgreement.id});
|
||||
},
|
||||
|
||||
fetchLoanPieceRequestList(){
|
||||
return requests.get(ApiUrls.ownership_loans_pieces_request);
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user