Skip to content

Instantly share code, notes, and snippets.

@austinhinderer
Created October 18, 2016 03:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save austinhinderer/091b276fcb370d0f37b6aa5abdbf5ae0 to your computer and use it in GitHub Desktop.
Save austinhinderer/091b276fcb370d0f37b6aa5abdbf5ae0 to your computer and use it in GitHub Desktop.
import React from 'react';
import CSSModules from 'react-css-modules';
import styles from './ProgressButton.css';
import ProgressBar from '../ProgressBar';
class ProgressButton extends React.Component {
constructor(props) {
super(props);
this. _onClick = this. _onClick.bind(this);
this.state = { max: 1, value: 0 }
}
render() {
return (
<button
onClick={this._onClick}
styleName='root'>
{ this.props.value }
<ProgressBar value={ this.state.value } max={ this.state.max } />
</button>
)
}
_onClick() {
this.setState({ value: 0 });
console.log(this.state);
const interval = setInterval(tween, 10);
function tween({ state = this.state }) {
console.log('Ziggy!');
if (this.state.value >= 1) {
clearInterval(interval);
} else {
//this.setState({ value: thisstate.value + .01 });
}
}.bind(this)
}
}
export default CSSModules(ProgressButton, styles);
ProgressButton.propTypes = {
value: React.PropTypes.string.isRequired
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment