content: import { browserHistory } from 'react-router';
  import React from 'react';
  import Counter from './counter';
  import Display from './display';
  import Keyboard from './keyboard';
  import Lost from './lose';
  import Win from './win';
  
  export default class Game extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        'answerKey': ``,
        'currentWord': null,
        'triesLeft': 6,
        'lettersLeft': 0,
        'result': ``,
      };
      this.getInput = this.getInput.bind(this);
      this.getWord = this.getWord.bind(this);
      this.formatKey = this.formatKey.bind(this);
      this.checkProgress = this.checkProgress.bind(this);
      this.again = this.again.bind(this);
    }
  
    formatKey(word) {
      const key = [];
      const capA = 65;
      const capZ = 90;
      let letters = word.length;
      for (let i = 0; i < word.length; i++) {
        const code = word.charCodeAt(i);
        if (code < capA || code > capZ) {
          key.push(word[i]);
          letters--;
        }
        else { key.push(`_`); }
      }
      this.setState({
        'answerKey': key,
        'lettersLeft': letters,
      });
    }
  
    getWord() {
      $.ajax({
        'data': {
          'api_key': process.env.WORDNIK_KEY,
          'excludePartOfSpeech': `noun-plural,noun-posessive,proper-noun,` +
          `proper-noun-plural,proper-noun-posessive`,
          'hasDictionaryDef': true,
          'includePartOfSpeech': `noun,adjective,verb,adverb`,
          // 'minLength': 12,
          'maxLength': 12,
          'minCorpusCount': 100,
          'minDictionaryCount': 10,
        },
        'url': `http://api.wordnik.com:80/v4/words.json/randomWord`,
      })
      .done((data) => {
        $.ajax({
          'data': {
            'api_key': process.env.WORDNIK_KEY,
            'includeRelated': false,
            'includeTags': false,
            'limit': 1,
            'sourceDictionary': `webster,century,wiktionary,ahd`,
            'useCanonical': false,
          },
          'url': `http://api.wordnik.com:80/v4/word.json/${data.word}/definitions`,
        })
        .done((details) => {
          const detail = details[0];
          const newWord = {
            'attribution': detail.attributionText,
            'definition': detail.text,
            'partOfSpeech': detail.partOfSpeech,
            'word': detail.word.toUpperCase(),
          };
          this.setState({ 'currentWord': newWord }, () => { this.formatKey(newWord.word); });
        });
      });
    }
  
    componentWillMount() {
      this.getWord();
    }
  
    checkProgress() {
      const tries = this.state.triesLeft;
      const letters = this.state.lettersLeft;
  
      if (tries <= 0 && letters > 0) {
        this.setState({ 'result': `lost` });
      }
      if (letters <= 0) {
        if (this.props.mp) { this.props.scored(); }
        this.setState({ 'result': `won` });
      }
    }
  
    getInput() {
      const guess = event.target.innerHTML;
      const chime = document.getElementById(`chime`);
      const buzzer = document.getElementById(`buzzer`);
      const word = this.state.currentWord.word;
      const key = this.state.answerKey;
      let tries = this.state.triesLeft;
      let letters = this.state.lettersLeft;
      let match = false;
  
      for (let i = 0; i < word.length; i++) {
        if (guess === word[i]) {
          key[i] = guess;
          letters--;
          match = true;
        }
      }
      $(event.target).addClass(`chosen`);
      if (match) {
        chime.play();
      }
      else {
        buzzer.play();
        --tries;
      }
  
      this.setState({
        'answerKey': key,
        'lettersLeft': letters,
        'triesLeft': tries,
      }, () => { this.checkProgress(); });
    }
  
    again() {
      this.setState({
        'answerKey': ``,
        'currentWord': null,
        'triesLeft': 6,
        'lettersLeft': 0,
        'result': ``,
      });
      this.getWord();
    }
  
    render() {
      const result = this.state.result;
  
      if (result === `won`) { return <Win word={this.state.currentWord} again={this.again}/>; }
      if (result === `lost`) { return <Lost word={this.state.currentWord} again={this.again}/>; }
      return <div>
        <Counter value={this.state.triesLeft}/>
        <Display value={this.state.answerKey}/>
        <Keyboard onClick={this.getInput} />
      </div>;
    }
  }
  