/**
 * Created by sbardian on 5/16/17.
 */

import React from 'react';
import PropTypes from 'prop-types';
import utils from '../utils/utils';
import QuestionWrapper from './components/QuestionWrapper';

export default class OpenTrivia extends React.Component {
  constructor (props) {
    super(props);
    this.state = {
      loading: true,
      results: [{}],
      index: 0,
    }
  }

  nextQuestion () {
    this.setState({
      index: this.state.index++
    })
  }

  prevQuestion () {
    this.setState({
      index: this.state.index--
    })
  }

  componentWillMount () {
    const {
      amount,
      category,
      difficulty,
      type,
      encode,
      getToken
    } = this.props;
    const options = {
      amount: amount,
      category: category,
      difficulty: difficulty,
      type: type,
      encode: encode,
      getToken: getToken,
    }
    utils.getQuestions(options)
        .then((results) => {
          this.setState({
            results,
            loading: false,
          });
        });
  }

  render () {
    return this.state.loading === true
        ? <div><h1>Loading Question. . .</h1></div>
        : <div>
            <QuestionWrapper question={this.state.results[this.state.index]} loading={this.state.loading} />
          </div>
  }
}

OpenTrivia.propTypes = {
  // set default props the component will expect
  loading: PropTypes.bool,
  amount: PropTypes.number,
  category: PropTypes.number,
  difficulty: PropTypes.string,
  type: PropTypes.string,
  encode: PropTypes.string,
  getToken: PropTypes.bool,
};

OpenTrivia.defaultProps = {
  // set value of default props
  loading: true,
  results: [{}],
};
@@ -368,107 +368,323 @@
     
-index: 0,%0A    %7D%0A  %7D%0A%0A  nextQuestion () %7B%0A   
+token: null,%0A      index: 0,%0A    %7D%0A    this.nextQuestion = this.nextQuestion.bind(this);%0A    this.prevQuestion = this.prevQuestion.bind(this);%0A  %7D%0A%0A  nextQuestion () %7B%0A    console.log('NEXT');%0A    let i =
  this.s
-etS
 tate
-(%7B%0A      index:
+.index;%0A    if (i %3C this.props.amount) %7B%0A      i++;%0A    %7D%0A   
  this.s
+etS
 tate
-.
+(%7B%0A      
 index
-++
+: i
 %0A    %7D)
+;
 %0A  %7D
@@ -712,63 +712,136 @@
 %0A   
+ console.log('PREV');%0A    let i =
  this.s
-etS
 tate
-(%7B%0A      index:
+.index;%0A    if (i %3E 0) %7B%0A      i--;%0A    %7D%0A   
  this.s
+etS
 tate
-.
+(%7B%0A      
 index
---
+: i
 %0A    %7D)
+;
 %0A  %7D
@@ -1297,16 +1297,50 @@
  false,%0A
+            token: results.token,%0A
         
@@ -1479,24 +1479,166 @@
     : %3Cdiv%3E%0A
+          %3Cdiv%3E%3Cbutton onClick=%7Bthis.nextQuestion%7D%3ENext%3C/button%3E%3C/div%3E%0A          %3Cdiv%3E%3Cbutton onClick=%7Bthis.prevQuestion%7D%3EPrev%3C/button%3E%3C/div%3E%0A
             

Implement Next/Prev buttons.