Fix(step): remove step animation

This commit is contained in:
Berkeley Martinez
2016-09-27 19:56:03 -07:00
parent a6f9e95ed8
commit ec8c0d1f39

View File

@ -3,7 +3,6 @@ import classnames from 'classnames';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import PureComponent from 'react-pure-render/component'; import PureComponent from 'react-pure-render/component';
import ReactTransitionReplace from 'react-css-transition-replace';
import LightBox from 'react-images'; import LightBox from 'react-images';
import { import {
@ -17,7 +16,6 @@ import {
import { challengeSelector } from '../../redux/selectors'; import { challengeSelector } from '../../redux/selectors';
import { Button, Col, Image, Row } from 'react-bootstrap'; import { Button, Col, Image, Row } from 'react-bootstrap';
const transitionTimeout = 1000;
const mapStateToProps = createSelector( const mapStateToProps = createSelector(
challengeSelector, challengeSelector,
state => state.challengesApp.currentIndex, state => state.challengesApp.currentIndex,
@ -39,8 +37,7 @@ const mapStateToProps = createSelector(
step: description[currentIndex], step: description[currentIndex],
steps: description, steps: description,
numOfSteps: description.length, numOfSteps: description.length,
isLastStep: currentIndex + 1 >= description.length, isLastStep: currentIndex + 1 >= description.length
isGoingForward: currentIndex > previousIndex
}) })
); );
@ -64,7 +61,6 @@ export class StepChallenge extends PureComponent {
step: PropTypes.array, step: PropTypes.array,
steps: PropTypes.array, steps: PropTypes.array,
isActionCompleted: PropTypes.bool, isActionCompleted: PropTypes.bool,
isGoingForward: PropTypes.bool,
isLastStep: PropTypes.bool, isLastStep: PropTypes.bool,
numOfSteps: PropTypes.number, numOfSteps: PropTypes.number,
stepForward: PropTypes.func, stepForward: PropTypes.func,
@ -240,23 +236,14 @@ export class StepChallenge extends PureComponent {
step, step,
steps, steps,
isLightBoxOpen, isLightBoxOpen,
isGoingForward,
closeLightBoxImage closeLightBoxImage
} = this.props; } = this.props;
const transitionName = 'challenge-step-' +
(isGoingForward ? 'forward' : 'backward');
return ( return (
<Col <Col
md={ 8 } md={ 8 }
mdOffset={ 2 } mdOffset={ 2 }
> >
<ReactTransitionReplace
transitionEnterTimeout={ transitionTimeout }
transitionLeaveTimeout={ transitionTimeout }
transitionName={ transitionName }
>
{ this.renderStep(this.props) } { this.renderStep(this.props) }
</ReactTransitionReplace>
<div className='hidden'> <div className='hidden'>
{ this.renderImages(steps) } { this.renderImages(steps) }
</div> </div>