mirror of
https://github.com/ascribe/onion.git
synced 2024-06-30 21:52:08 +02:00
separate polling-success functionality
This commit is contained in:
parent
e71c2f9fe0
commit
85ba816a53
|
@ -7,7 +7,8 @@ import PieceFetcher from '../fetchers/piece_fetcher';
|
||||||
class PieceActions {
|
class PieceActions {
|
||||||
constructor() {
|
constructor() {
|
||||||
this.generateActions(
|
this.generateActions(
|
||||||
'updatePiece'
|
'updatePiece',
|
||||||
|
'updateProperty'
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -3,18 +3,35 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import EditionListActions from '../../actions/edition_list_actions';
|
import EditionListActions from '../../actions/edition_list_actions';
|
||||||
import PieceListActions from '../../actions/piece_list_actions';
|
import EditionListStore from '../../stores/edition_list_store';
|
||||||
|
|
||||||
import { getAvailableAcls } from '../../utils/acl_utils';
|
import { getAvailableAcls } from '../../utils/acl_utils';
|
||||||
|
|
||||||
|
import classNames from 'classnames';
|
||||||
|
|
||||||
let CreateEditionsButton = React.createClass({
|
let CreateEditionsButton = React.createClass({
|
||||||
propTypes: {
|
propTypes: {
|
||||||
|
className: React.PropTypes.string,
|
||||||
piece: React.PropTypes.object.isRequired,
|
piece: React.PropTypes.object.isRequired,
|
||||||
toggleCreateEditionsDialog: React.PropTypes.func.isRequired
|
toggleCreateEditionsDialog: React.PropTypes.func.isRequired,
|
||||||
|
onPollingSuccess: React.PropTypes.func
|
||||||
},
|
},
|
||||||
|
|
||||||
getInitialState() {
|
getInitialState() {
|
||||||
return {};
|
return EditionListStore.getState();
|
||||||
|
},
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
EditionListStore.listen(this.onChange);
|
||||||
|
},
|
||||||
|
|
||||||
|
componentWillUnmount() {
|
||||||
|
EditionListStore.unlisten(this.onChange);
|
||||||
|
clearInterval(this.state.pollingIntervalIndex);
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(state) {
|
||||||
|
this.setState(state);
|
||||||
},
|
},
|
||||||
|
|
||||||
componentDidUpdate() {
|
componentDidUpdate() {
|
||||||
|
@ -23,10 +40,6 @@ let CreateEditionsButton = React.createClass({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
componentWillUnmount() {
|
|
||||||
clearInterval(this.state.pollingIntervalIndex);
|
|
||||||
},
|
|
||||||
|
|
||||||
startPolling() {
|
startPolling() {
|
||||||
// start polling until editions are defined
|
// start polling until editions are defined
|
||||||
let pollingIntervalIndex = setInterval(() => {
|
let pollingIntervalIndex = setInterval(() => {
|
||||||
|
@ -35,13 +48,7 @@ let CreateEditionsButton = React.createClass({
|
||||||
|
|
||||||
clearInterval(this.state.pollingIntervalIndex);
|
clearInterval(this.state.pollingIntervalIndex);
|
||||||
|
|
||||||
PieceListActions.updatePropertyForPiece({
|
this.props.onPollingSuccess(this.props.piece.id, res.editions[0].num_editions);
|
||||||
pieceId: this.props.piece.id,
|
|
||||||
key: 'num_editions',
|
|
||||||
value: res.editions[0].num_editions
|
|
||||||
});
|
|
||||||
|
|
||||||
EditionListActions.toggleEditionList(this.props.piece.id);
|
|
||||||
|
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
|
@ -58,20 +65,23 @@ let CreateEditionsButton = React.createClass({
|
||||||
let piece = this.props.piece;
|
let piece = this.props.piece;
|
||||||
|
|
||||||
let availableAcls = getAvailableAcls(piece);
|
let availableAcls = getAvailableAcls(piece);
|
||||||
|
|
||||||
if (availableAcls.indexOf('editions') < -1 || piece.num_editions > 0){
|
if (availableAcls.indexOf('editions') < -1 || piece.num_editions > 0){
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
if(piece.num_editions === 0) {
|
if(piece.num_editions === 0 && typeof this.state.editionList[piece.id] === 'undefined') {
|
||||||
return (
|
return (
|
||||||
<button disabled className="btn btn-default btn-sm">
|
<button
|
||||||
|
disabled
|
||||||
|
className={classNames('btn', 'btn-default', this.props.className)}>
|
||||||
CREATING EDITIONS <span className="glyph-ascribe-spool-chunked spin"/>
|
CREATING EDITIONS <span className="glyph-ascribe-spool-chunked spin"/>
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
className="btn btn-default btn-sm"
|
className={classNames('btn', 'btn-default', this.props.className)}
|
||||||
onClick={this.props.toggleCreateEditionsDialog}>
|
onClick={this.props.toggleCreateEditionsDialog}>
|
||||||
CREATE EDITIONS
|
CREATE EDITIONS
|
||||||
</button>
|
</button>
|
||||||
|
|
|
@ -10,9 +10,12 @@ import CollapsibleParagraph from './../ascribe_collapsible/collapsible_paragraph
|
||||||
import DetailProperty from './detail_property';
|
import DetailProperty from './detail_property';
|
||||||
|
|
||||||
import FurtherDetails from './further_details';
|
import FurtherDetails from './further_details';
|
||||||
|
|
||||||
import UserActions from '../../actions/user_actions';
|
import UserActions from '../../actions/user_actions';
|
||||||
import UserStore from '../../stores/user_store';
|
import UserStore from '../../stores/user_store';
|
||||||
|
|
||||||
|
import PieceActions from '../../actions/piece_actions';
|
||||||
|
|
||||||
import MediaContainer from './media_container';
|
import MediaContainer from './media_container';
|
||||||
|
|
||||||
import EditionDetailProperty from './detail_property';
|
import EditionDetailProperty from './detail_property';
|
||||||
|
@ -61,6 +64,11 @@ let Piece = React.createClass({
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
handleEditionCreationSuccess() {
|
||||||
|
PieceActions.updateProperty({key: 'num_editions', value: 0});
|
||||||
|
this.toggleCreateEditionsDialog();
|
||||||
|
},
|
||||||
|
|
||||||
getCreateEditionsDialog() {
|
getCreateEditionsDialog() {
|
||||||
if(this.props.piece.num_editions < 1 && this.state.showCreateEditionsDialog) {
|
if(this.props.piece.num_editions < 1 && this.state.showCreateEditionsDialog) {
|
||||||
return (
|
return (
|
||||||
|
@ -76,6 +84,13 @@ let Piece = React.createClass({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
handlePollingSuccess(pieceId, numEditions) {
|
||||||
|
PieceActions.updateProperty({
|
||||||
|
key: 'num_editions',
|
||||||
|
value: numEditions
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Row>
|
<Row>
|
||||||
|
@ -101,8 +116,10 @@ let Piece = React.createClass({
|
||||||
editions={this.props.piece}
|
editions={this.props.piece}
|
||||||
handleSuccess={this.props.handleSuccess}>
|
handleSuccess={this.props.handleSuccess}>
|
||||||
<CreateEditionsButton
|
<CreateEditionsButton
|
||||||
|
className="btn-sm"
|
||||||
piece={this.props.piece}
|
piece={this.props.piece}
|
||||||
toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}/>
|
toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}
|
||||||
|
onPollingSuccess={this.handlePollingSuccess}/>
|
||||||
</AclButtonList>
|
</AclButtonList>
|
||||||
|
|
||||||
{this.getCreateEditionsDialog()}
|
{this.getCreateEditionsDialog()}
|
||||||
|
|
|
@ -5,6 +5,9 @@ import React from 'react';
|
||||||
import Form from '../ascribe_forms/form';
|
import Form from '../ascribe_forms/form';
|
||||||
import Property from '../ascribe_forms/property';
|
import Property from '../ascribe_forms/property';
|
||||||
|
|
||||||
|
import GlobalNotificationModel from '../../models/global_notification_model';
|
||||||
|
import GlobalNotificationActions from '../../actions/global_notification_actions';
|
||||||
|
|
||||||
import apiUrls from '../../constants/api_urls';
|
import apiUrls from '../../constants/api_urls';
|
||||||
|
|
||||||
import { getLangText } from '../../utils/lang_utils';
|
import { getLangText } from '../../utils/lang_utils';
|
||||||
|
@ -22,13 +25,22 @@ let CreateEditionsForm = React.createClass({
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
handleSuccess(response) {
|
||||||
|
let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
|
||||||
|
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||||
|
|
||||||
|
if(this.props.handleSuccess) {
|
||||||
|
this.props.handleSuccess();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Form
|
<Form
|
||||||
ref='form'
|
ref='form'
|
||||||
url={apiUrls.editions}
|
url={apiUrls.editions}
|
||||||
getFormData={this.getFormData}
|
getFormData={this.getFormData}
|
||||||
handleSuccess={this.props.handleSuccess}
|
handleSuccess={this.handleSuccess}
|
||||||
spinner={
|
spinner={
|
||||||
<button className="btn ascribe-btn ascribe-btn-login ascribe-btn-login-spinner">
|
<button 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" />
|
<img src="https://s3-us-west-2.amazonaws.com/ascribe0/media/thumbnails/ascribe_animated_medium.gif" />
|
||||||
|
|
|
@ -13,6 +13,14 @@ class PieceStore {
|
||||||
onUpdatePiece(piece) {
|
onUpdatePiece(piece) {
|
||||||
this.piece = piece;
|
this.piece = piece;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onUpdateProperty({key, value}) {
|
||||||
|
if(this.piece && key in this.piece) {
|
||||||
|
this.piece[key] = value;
|
||||||
|
} else {
|
||||||
|
throw new Error('There is no piece defined in PieceStore or the piece object does not have the property you\'re looking for.');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default alt.createStore(PieceStore, 'PieceStore');
|
export default alt.createStore(PieceStore, 'PieceStore');
|
||||||
|
|
Loading…
Reference in New Issue
Block a user