+ 
+
+ );
+ }
+ }
+});
+
+export default IkonotvArtistDetailsForm;
\ No newline at end of file
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ascribe_forms/ikonotv_artwork_details_form.js b/js/components/whitelabel/wallet/components/ikonotv/ascribe_forms/ikonotv_artwork_details_form.js
new file mode 100644
index 00000000..0ff3ae50
--- /dev/null
+++ b/js/components/whitelabel/wallet/components/ikonotv/ascribe_forms/ikonotv_artwork_details_form.js
@@ -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 (
+
+ );
+ } else {
+ return (
+
+
+
+ );
+ }
+ }
+});
+
+export default IkonotvArtworkDetailsForm;
\ No newline at end of file
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js
index 6a63657c..0f631758 100644
--- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js
+++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js
@@ -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 (
+ if (appendix && appendix.default) {
+ return (
+
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js
index 1e2d3803..3fee2e50 100644
--- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js
+++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js
@@ -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 (
- {getLangText('Appendix')}
{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 (
+
+ {getLangText('Are you a member of any copyright societies?')}
+
+
+ {AppConstants.copyrightAssociations.join(', ')}
+
+
+
+ );
+ }
+ return null;
+ },
+
render() {
if (this.state.contractAgreementListNotifications &&
this.state.contractAgreementListNotifications.length > 0) {
- let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
return (
@@ -133,41 +166,17 @@ let IkonotvContractNotifications = React.createClass({
{this.getContract()}
-
- {this.getAppendix}
- {getLangText('Are you a member of any copyright societies?')}
-
- 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()}
+
+
+
-
PROTECT
& SHARE
+& SHARE
Welcome to the ikonoTV
Registration Page
@@ -93,7 +95,7 @@ let IkonotvLanding = React.createClass({ diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js new file mode 100644 index 00000000..700b5678 --- /dev/null +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js @@ -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 ( +
+
+ 1}
+ handleSuccess={this.handleAdditionalDataSuccess}
+ piece={this.state.piece}/>
+
+
+
+ );
+ }
+ return null;
+ },
+
+ getSlideArtworkDetails() {
+ if (this.canSubmit()) {
+ return (
+
+
+ 1}
+ handleSuccess={this.handleAdditionalDataSuccess}
+ piece={this.state.piece}/>
+
+
+
+ );
+ }
+ return null;
+ },
+
+ getSlideLoan() {
+ if (this.canSubmit()) {
+
+ let today = new Moment();
+ let enddate = new Moment();
+ enddate.add(1, 'years');
+ return (
+
+
+
+
+
+
+ );
+ }
+ return null;
+ },
+
+ render() {
+ return (
+
+
+ 0}
+ enableLocalHashing={false}
+ headerMessage={getLangText('Register work')}
+ submitMessage={getLangText('Register')}
+ isFineUploaderActive={this.state.isFineUploaderActive}
+ handleSuccess={this.handleRegisterSuccess}
+ onLoggedOut={this.onLoggedOut} />
+
+
+
+ {this.getSlideArtistDetails()}
+ {this.getSlideArtworkDetails()}
+ {this.getSlideLoan()}
+