first slide cyland archive submission

js/components/ascribe_forms/form.js

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

js/components/register_piece.js

@@ -1,14 +1,11 @@
 'use strict';
 
 import React from 'react';
-
 import Router from 'react-router';
+
 import Col from 'react-bootstrap/lib/Col';
 import Row from 'react-bootstrap/lib/Row';
 
-import LicenseActions from '../actions/license_actions';
-import LicenseStore from '../stores/license_store';
-
 import WhitelabelActions from '../actions/whitelabel_actions';
 import WhitelabelStore from '../stores/whitelabel_store';
 
@@ -20,7 +17,6 @@ import UserStore from '../stores/user_store';
 import GlobalNotificationModel from '../models/global_notification_model';
 import GlobalNotificationActions from '../actions/global_notification_actions';
 
-import Property from './ascribe_forms/property';
 import PropertyCollapsible from './ascribe_forms/property_collapsible';
 import RegisterPieceForm from './ascribe_forms/form_register_piece';
 

js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js

@@ -1,55 +1,133 @@
 'use strict';
 
 import React from 'react';
-import RegisterPiece from '../../../../register_piece';
+import Router from 'react-router';
+
+import Col from 'react-bootstrap/lib/Col';
+import Row from 'react-bootstrap/lib/Row';
+
+import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece';
+
 import Property from '../../../../ascribe_forms/property';
 import InputTextAreaToggable from '../../../../ascribe_forms/input_textarea_toggable';
 import InputCheckbox from '../../../../ascribe_forms/input_checkbox';
 
-import { getLangText } from '../../../../../utils/lang_utils';
+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 GlobalNotificationModel from '../../../../../models/global_notification_model';
+import GlobalNotificationActions from '../../../../../actions/global_notification_actions';
+
+import SlidesContainer from '../../../../ascribe_slides_container/slides_container';
+
+import { getLangText } from '../../../../../utils/lang_utils';
+import { mergeOptions } from '../../../../../utils/general_utils';
 
 let CylandRegisterPiece = React.createClass({
+
+    getInitialState(){
+        return mergeOptions(
+            UserStore.getState(),
+            PieceListStore.getState(),
+            {
+                selectedLicense: 0,
+                isFineUploaderActive: false
+            });
+    },
+
+    mixins: [Router.Navigation],
+
+    componentDidMount() {
+        PieceListStore.listen(this.onChange);
+        UserStore.listen(this.onChange);
+    },
+
+    componentWillUnmount() {
+        PieceListStore.unlisten(this.onChange);
+        UserStore.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
+            });
+        }
+    },
+
+    handleSuccess(response){
+        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
+        GlobalNotificationActions.appendGlobalNotification(notification);
+
+        // once the user was able to register a piece successfully, we need to make sure to keep
+        // the piece list up to date
+        PieceListActions.fetchPieceList(
+            this.state.page,
+            this.state.pageSize,
+            this.state.searchTerm,
+            this.state.orderBy,
+            this.state.orderAsc,
+            this.state.filterBy
+        );
+
+        this.transitionTo('piece', {pieceId: response.piece.id});
+    },
+
+    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');
+    },
+
     render() {
         return (
-            <RegisterPiece
+            <SlidesContainer ref="slidesContainer">
-                enableLocalHashing={false}
+                <div
-                headerMessage={getLangText('Submit to Cyland')}
+                    onClick={this.changeSlide}
-                submitMessage={getLangText('Submit')}>
+                    onFocus={this.changeSlide}>
-                <Property
+                    <Row className="no-margin">
-                    name='loan'
+                        <Col xs={12} sm={10} md={8} smOffset={1} mdOffset={2}>
-                    label={getLangText('Loan to')}
+                            <RegisterPieceForm
-                    editable={true}>
+                                enableLocalHashing={false}
-                    <InputTextAreaToggable
+                                headerMessage={getLangText('Submit to Cyland Archive')}
-                        rows={1}
+                                submitMessage={getLangText('Submit')}
-                        editable={true}
+                                isFineUploaderActive={this.state.isFineUploaderActive}
-                        placeholder={getLangText('videoarchive@cyland.org')}
+                                handleSuccess={this.handleSuccess}
-                        required="required"/>
+                                onLoggedOut={this.onLoggedOut}>
-                </Property>
+                                <Property
-                <Property
+                                    name="terms"
-                    name='gallery'
+                                    className="ascribe-settings-property-collapsible-toggle"
-                    label={getLangText('Gallery')}
+                                    style={{paddingBottom: 0}}>
-                    editable={true}>
+                                    <InputCheckbox>
-                    <InputTextAreaToggable
+                                        <span>
-                        rows={1}
+                                            {' ' + getLangText('I agree to the Terms of Service the art price') + ' '}
-                        editable={true}
+                                            (<a href="https://s3-us-west-2.amazonaws.com/ascribe0/whitelabel/sluice/terms.pdf" target="_blank" style={{fontSize: '0.9em', color: 'rgba(0,0,0,0.7)'}}>
-                        placeholder={getLangText('Cyland Archive')}
+                                                {getLangText('read')}
-                        required="required"/>
+                                            </a>)
-                </Property>
+                                        </span>
-                <Property
+                                    </InputCheckbox>
-                    name="terms"
+                                </Property>
-                    className="ascribe-settings-property-collapsible-toggle"
+                            </RegisterPieceForm>
-                    style={{paddingBottom: 0}}>
+                        </Col>
-                    <InputCheckbox>
+                    </Row>
-                        <span>
+                </div>
-                            {' ' + getLangText('I agree to the Terms of Service the art price') + ' '}
+                <div>
-                            (<a href="https://s3-us-west-2.amazonaws.com/ascribe0/whitelabel/sluice/terms.pdf" target="_blank" style={{fontSize: '0.9em', color: 'rgba(0,0,0,0.7)'}}>
+                    {/* next slide */}
-                                {getLangText('read')}
+                </div>
-                            </a>)
+            </SlidesContainer>
-                        </span>
-                    </InputCheckbox>
-                </Property>
-            </RegisterPiece>
         );
     }
 });