Fix transitioning between hikes resets questions
parent
b2b933c153
commit
622974ca2a
|
@ -10,7 +10,7 @@ const initValue = {
|
|||
hikes: [],
|
||||
// lecture state
|
||||
currentHike: {},
|
||||
showQuestion: false
|
||||
showQuestions: false
|
||||
},
|
||||
jobsApp: {
|
||||
showModal: false
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import React, { PropTypes } from 'react';
|
||||
import { contain } from 'thundercats-react';
|
||||
import {
|
||||
Col,
|
||||
Panel,
|
||||
|
@ -8,40 +9,56 @@ import {
|
|||
import Lecture from './Lecture.jsx';
|
||||
import Questions from './Questions.jsx';
|
||||
|
||||
export default React.createClass({
|
||||
displayName: 'Hike',
|
||||
|
||||
propTypes: {
|
||||
currentHike: PropTypes.object,
|
||||
showQuestions: PropTypes.bool
|
||||
export default contain(
|
||||
{
|
||||
actions: ['hikesActions']
|
||||
},
|
||||
React.createClass({
|
||||
displayName: 'Hike',
|
||||
|
||||
renderBody(showQuestions) {
|
||||
if (showQuestions) {
|
||||
return <Questions />;
|
||||
propTypes: {
|
||||
currentHike: PropTypes.object,
|
||||
hikesActions: PropTypes.object,
|
||||
params: PropTypes.object,
|
||||
showQuestions: PropTypes.bool
|
||||
},
|
||||
|
||||
componentWillReceiveProps({ params: { dashedName }, showQuestions }) {
|
||||
if (
|
||||
showQuestions &&
|
||||
this.props.params.dashedName !== dashedName
|
||||
) {
|
||||
this.props.hikesActions.toggleQuestions();
|
||||
}
|
||||
},
|
||||
|
||||
renderBody(showQuestions) {
|
||||
if (showQuestions) {
|
||||
return <Questions />;
|
||||
}
|
||||
return <Lecture />;
|
||||
},
|
||||
|
||||
render() {
|
||||
const {
|
||||
currentHike: { title } = {},
|
||||
showQuestions
|
||||
} = this.props;
|
||||
|
||||
const videoTitle = <h4>{ title }</h4>;
|
||||
|
||||
return (
|
||||
<Col xs={ 12 }>
|
||||
<Row>
|
||||
<Panel
|
||||
className={ 'text-center' }
|
||||
header={ videoTitle }
|
||||
title={ title }>
|
||||
{ this.renderBody(showQuestions) }
|
||||
</Panel>
|
||||
</Row>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
return <Lecture />;
|
||||
},
|
||||
|
||||
render() {
|
||||
const {
|
||||
currentHike: { title } = {},
|
||||
showQuestions
|
||||
} = this.props;
|
||||
|
||||
const videoTitle = <h4>{ title }</h4>;
|
||||
|
||||
return (
|
||||
<Col xs={ 12 }>
|
||||
<Row>
|
||||
<Panel
|
||||
className={ 'text-center' }
|
||||
header={ videoTitle }
|
||||
title={ title }>
|
||||
{ this.renderBody(showQuestions) }
|
||||
</Panel>
|
||||
</Row>
|
||||
</Col>
|
||||
);
|
||||
}
|
||||
});
|
||||
})
|
||||
);
|
||||
|
|
|
@ -69,7 +69,7 @@ export default contain(
|
|||
<Row>
|
||||
<Vimeo
|
||||
onError={ this.handleError }
|
||||
onFinish= { this.handleFinish }
|
||||
onFinish= { () => this.handleFinish(hikesActions) }
|
||||
videoId={ id } />
|
||||
</Row>
|
||||
<Row>
|
||||
|
|
|
@ -88,7 +88,11 @@ export default Actions({
|
|||
toggleQuestions() {
|
||||
return {
|
||||
transform(state) {
|
||||
const hikesApp = { ...state.hikesApp, showQuestions: true };
|
||||
const hikesApp = {
|
||||
...state.hikesApp,
|
||||
showQuestions: !state.hikesApp.showQuestions,
|
||||
currentQuestion: 1
|
||||
};
|
||||
return { ...state, hikesApp };
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue