quote test

class QuoteGenerator extends React.Component {
  constructor() {
    super();
    this.state = {
      url: "https://got-quotes.herokuapp.com/quotes",
      quote: "",
      character: ""
    }
    this.handleClick = this.handleClick.bind(this);
    this.handleTweet = this.handleTweet.bind(this);
  }

  componentDidMount() {
    fetch(this.state.url)
      .then(function(res) {
        return res.json();
      })
      .then(
        function(data) {
          this.setState({
            quote: data.quote,
            character: data.character
          });
        }.bind(this)
      );
  }

  handleClick() {
    fetch(this.state.url)
      .then(function(res) {
        return res.json();
      })
      .then(
        function(data) {
          this.setState({
            quote: data.quote,
            character: data.character
          });
        }.bind(this)
      );
  }

    handleTweet() {  window.open('https://twitter.com/intent/tweet?text=' + '{this.state.quote}');
  }

  render() {
    const quoteStyle = {
      backgroundColor: '#fff'
    }

    return (
      <div className="container-fluid bg-primary">
        <div className="row">
          <div className="col-sm-12 bg-secondary">
        <p>{this.state.quote}</p>
          </div>
        </div>
          <div className="row">
            <div className="col-sm-4 col-push-sm-4 bg-success">
              <a
              onClick={this.handleTweet}
              class="fa fa-twitter">Tweet this</a>
            </div>
            <div className="col-sm-4 col-pull-sm-8 bg-warning">
        <p>-{this.state.character}</p>
            </div>
            <div className="col-sm-4">
        <button className="btn btn-primary"
          onClick={this.handleClick}>New quote</button>
            </div>
        </div>
      </div>
    );
  }
}
ReactDOM.render(<QuoteGenerator />, document.getElementById("app"));