finalized: separation of edition creation and edition form

js/components/ascribe_accordion_list/accordion_list_item.js

@@ -35,20 +35,6 @@ let AccordionListItem = React.createClass({
         };
     },
 
-    componentDidUpdate() {
-        if(this.props.content.num_editions === 0 && typeof this.state.pollingIntervalIndex === 'undefined') {
-            this.startPolling();
-        }
-    },
-
-    componentWillUnmount() {
-        clearInterval(this.state.pollingIntervalIndex);
-    },
-
-    onChange(state) {
-        this.setState(state);
-    },
-
     getGlyphicon(){
         if (this.props.content.requestAction){
             return (
@@ -66,39 +52,20 @@ let AccordionListItem = React.createClass({
         });
     },
 
-    handleEditionCreationSuccess(response) {
-        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
-        GlobalNotificationActions.appendGlobalNotification(notification);
+    handleEditionCreationSuccess() {
         PieceListActions.updatePropertyForPiece({pieceId: this.props.content.id, key: 'num_editions', value: 0});
 
         this.toggleCreateEditionsDialog();
     },
 
-    startPolling() {
-        // start polling until editions are defined
-        let pollingIntervalIndex = setInterval(() => {
-            EditionListActions.fetchEditionList(this.props.content.id)
-            .then((res) => {
-
-                clearInterval(this.state.pollingIntervalIndex);
-
+    onPollingSuccess(pieceId, numEditions) {
         PieceListActions.updatePropertyForPiece({
-                    pieceId: this.props.content.id,
+            pieceId,
             key: 'num_editions',
-                    value: res.editions[0].num_editions
+            value: numEditions
         });
 
-                EditionListActions.toggleEditionList(this.props.content.id);
-
-            })
-            .catch(() => {
-                /* Ignore and keep going */
-            });
-        }, 5000);
-
-        this.setState({
-            pollingIntervalIndex
-        });
+        EditionListActions.toggleEditionList(pieceId);
     },
 
     getCreateEditionsDialog() {
@@ -153,7 +120,8 @@ let AccordionListItem = React.createClass({
                                 <AccordionListItemEditionWidget
                                     className="pull-right"
                                     piece={this.props.content}
-                                    toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}/>
+                                    toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}
+                                    onPollingSuccess={this.onPollingSuccess}/>
                             </div>
                         </div>
                         <span style={{'clear': 'both'}}></span>

js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js

@@ -6,13 +6,16 @@ import classNames from 'classnames';
 import EditionListActions from '../../actions/edition_list_actions';
 import EditionListStore from '../../stores/edition_list_store';
 
+import CreateEditionsButton from '../ascribe_buttons/create_editions_button';
+
 import { getLangText } from '../../utils/lang_utils';
 
 let AccordionListItemEditionWidget = React.createClass({
     propTypes: {
         className: React.PropTypes.string,
         piece: React.PropTypes.object.isRequired,
-        toggleCreateEditionsDialog: React.PropTypes.func.isRequired
+        toggleCreateEditionsDialog: React.PropTypes.func.isRequired,
+        onPollingSuccess: React.PropTypes.func
     },
 
     getInitialState() {
@@ -55,16 +58,9 @@ let AccordionListItemEditionWidget = React.createClass({
         let isEditionListOpen = this.state.isEditionListOpenForPieceId[pieceId] ? this.state.isEditionListOpenForPieceId[pieceId].show : false;
         
         if(isEditionListOpen) {
-            if(typeof this.state.editionList[pieceId] === 'undefined') {
-                return (
-                    <span className="glyph-ascribe-spool-chunked spin"/>
-                );
-            } else {
             return (
                 <span className="glyphicon glyphicon-menu-up" aria-hidden="true" style={{top: 2}}></span>
             );
-            }
-            
         } else {
             return (
                 <span className="glyphicon glyphicon-menu-down" aria-hidden="true" style={{top: 2}}></span>
@@ -76,23 +72,16 @@ let AccordionListItemEditionWidget = React.createClass({
         let piece = this.props.piece;
         let numEditions = piece.num_editions;
 
-        if(numEditions === -1) {
+        if(numEditions <= 0) {
             return (
-                <button
-                    onClick={this.props.toggleCreateEditionsDialog}
-                    className={classNames('btn', 'btn-default', 'btn-xs', 'ascribe-accordion-list-item-edition-widget', this.props.className)}>
-                    + Editions
-                </button>
+                <CreateEditionsButton
+                    label={getLangText('Create editions')}
+                    className="btn-xs pull-right"
+                    piece={piece}
+                    toggleCreateEditionsDialog={this.props.toggleCreateEditionsDialog}
+                    onPollingSuccess={this.props.onPollingSuccess}/>
             );
-        }
-        else if(numEditions === 0) {
-            return (
-                    <button disabled className={classNames('btn', 'btn-default', 'btn-xs', this.props.className)}>
-                        Creating Editions <span className="glyph-ascribe-spool-chunked spin"/>
-                    </button>
-                );
-        }
-        else if(numEditions === 1) {
+        } else if(numEditions === 1) {
             let editionMapping = piece && piece.first_edition ? piece.first_edition.edition_number + '/' + piece.num_editions : '';
 
             return (

js/components/ascribe_buttons/create_editions_button.js

@@ -6,11 +6,13 @@ import EditionListActions from '../../actions/edition_list_actions';
 import EditionListStore from '../../stores/edition_list_store';
 
 import { getAvailableAcls } from '../../utils/acl_utils';
+import { getLangText } from '../../utils/lang_utils';
 
 import classNames from 'classnames';
 
 let CreateEditionsButton = React.createClass({
     propTypes: {
+        label: React.PropTypes.string,
         className: React.PropTypes.string,
         piece: React.PropTypes.object.isRequired,
         toggleCreateEditionsDialog: React.PropTypes.func.isRequired,
@@ -47,7 +49,6 @@ let CreateEditionsButton = React.createClass({
             .then((res) => {
 
                 clearInterval(this.state.pollingIntervalIndex);
-
                 this.props.onPollingSuccess(this.props.piece.id, res.editions[0].num_editions);
 
             })
@@ -75,7 +76,7 @@ let CreateEditionsButton = React.createClass({
                 <button
                     disabled
                     className={classNames('btn', 'btn-default', this.props.className)}>
-                    CREATING EDITIONS <span className="glyph-ascribe-spool-chunked spin"/>
+                    {getLangText('Creating editions')} <span className="glyph-ascribe-spool-chunked spin"/>
                 </button>
             );
         } else {
@@ -83,7 +84,7 @@ let CreateEditionsButton = React.createClass({
                 <button
                     className={classNames('btn', 'btn-default', this.props.className)}
                     onClick={this.props.toggleCreateEditionsDialog}>
-                    CREATE EDITIONS
+                    {this.props.label}
                 </button>
             );
         }

js/components/ascribe_detail/piece.js

@@ -113,9 +113,9 @@ let Piece = React.createClass({
                     <AclButtonList
                         className="text-center ascribe-button-list"
                         availableAcls={this.props.piece.acl}
-                        editions={this.props.piece}
-                        handleSuccess={this.props.handleSuccess}>
+                        editions={this.props.piece}>
                             <CreateEditionsButton
+                                label={getLangText('CREATE EDITIONS')}
                                 className="btn-sm"
                                 piece={this.props.piece}
                                 toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}

js/components/ascribe_forms/create_editions_form.js

@@ -30,7 +30,7 @@ let CreateEditionsForm = React.createClass({
         GlobalNotificationActions.appendGlobalNotification(notification);
 
         if(this.props.handleSuccess) {
-            this.props.handleSuccess();
+            this.props.handleSuccess(response);
         }
     },