gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

moving question to right answers true

Browse Source 
moving question to left answer false
This commit is contained in:
Berkeley Martinez
2015-07-21 20:55:32 -07:00
parent 524b59828c
commit c3ce578a26
1 changed files with 22 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
common/app/routes/Hikes/components/Question.jsx
View File

@ -11,6 +11,8 @@ import {
} from 'react-bootstrap'; } from 'react-bootstrap';
const debug = debugFactory('freecc:hikes'); const debug = debugFactory('freecc:hikes');
const ANSWER_THRESHOLD = 250;
export default React.createClass({ export default React.createClass({
displayName: 'Question', displayName: 'Question',
@ -62,13 +64,22 @@ export default React.createClass({
}); });
}, },
handleMouseMove({ pageX, pageY }) { handleMouseMove(answer) {
const { isPressed, delta: [dx, dy] } = this.state; return ({ pageX, pageY }) => {
if (isPressed) { const { isPressed, delta: [dx, dy] } = this.state;
this.setState({ if (isPressed) {
mouse: [pageX - dx, pageY - dy] const mouse = [pageX - dx, pageY - dy];
}); if (mouse[0] >= ANSWER_THRESHOLD) {
} this.handleMouseUp();
return this.onAnswer(answer, true)();
}
if (mouse[0] <= -ANSWER_THRESHOLD) {
this.handleMouseUp();
return this.onAnswer(answer, false)();
}
this.setState({ mouse });
}
};
}, },
hideInfo() { hideInfo() {
@ -162,7 +173,7 @@ export default React.createClass({
); );
}, },
renderQuestion(question, shake) { renderQuestion(question, answer, shake) {
return ({ val: { x } }) => { return ({ val: { x } }) => {
const style = { const style = {
WebkitTransform: `translate3d(${ x }px, 0, 0)`, WebkitTransform: `translate3d(${ x }px, 0, 0)`,
@ -170,10 +181,10 @@ export default React.createClass({
}; };
return ( return (
<Panel <Panel
className={ shake ? 'animated shake' : '' } className={ shake ? 'animated swing shake' : '' }
onMouseDown={ this.handleMouseDown } onMouseDown={ this.handleMouseDown }
onMouseLeave={ this.handleMouseUp } onMouseLeave={ this.handleMouseUp }
onMouseMove={ this.handleMouseMove } onMouseMove={ this.handleMouseMove(answer) }
onMouseUp={ this.handleMouseUp } onMouseUp={ this.handleMouseUp }
style={ style }> style={ style }>
<p>{ question }</p> <p>{ question }</p>
@ -196,7 +207,7 @@ export default React.createClass({
xsOffset={ 2 }> xsOffset={ 2 }>
<Row> <Row>
<Spring endValue={ this.getTweenValues }> <Spring endValue={ this.getTweenValues }>
{ this.renderQuestion(question, shake) } { this.renderQuestion(question, answer, shake) }
</Spring> </Spring>
{ this.renderInfo(showInfo, info) } { this.renderInfo(showInfo, info) }
<Panel> <Panel>