<commit_before>import React, { Component, PropTypes } from 'react'
import { Card, Icon, Label, Button } from 'semantic-ui-react'
import _ from 'lodash'

class PrizeGrid extends Component {
  constructor(props) {
    super(props)
    const cards = this.parseExercises(this.props.users)
    this.state = {
      cards,
      enterLeaveAnimation: 'accordianVertical',
      shuffle: 0,
      winner: '',
      remaining: this.props.users,
      maxShuffle: 20,
      shuffling: false,
    }
  }

  parseExercises = (users) => {
    const userCards = []

    _.each(users, user => {
      userCards.push({
        key: user.name,
        header: user.name,
        image: {
          src: user.image,
        },
        extra: this.buildIcon(user.exercises),
      })
    })

    return userCards
  }

  chooseWinner = () => {
    let winners = []
    const remaining = this.state.remaining

    _.each(remaining, user => {
      for (let i = 0; i < user.exercises; i++) {
        winners.push(user.name)
      }
    })

    for (let i = 0; i < 50; i ++) {
      winners = _.shuffle(winners)
    }

    return winners[0]
  }

  buildIcon = (excercises) => {
    return (
      <Label size='large'>
        <Icon name='heartbeat' />{excercises} Exercises Completed
      </Label>
    )
  }

  shuffle = () => {
    const shuffleCount = this.state.shuffle + 1
    if (shuffleCount < this.state.maxShuffle) {
      let winner = this.state.winner
      if (shuffleCount === 1) {
        winner = this.chooseWinner()
      }
      window.setTimeout(() => { this.shuffle() }, 600)
      this.setState({
        cards: _.shuffle(this.state.cards),
        shuffle: shuffleCount,
        winner,
        shuffling: true,
      })
    } else {
      this.setState({ shuffle: 0, shuffling: false })
    }
  }

  buildWinnerLabel = () => {
    const { shuffle, winner } = this.state
    if (shuffle === 0 && winner !== '') {
      return <h1>Winner: {this.state.winner}</h1>
    }
  }

  render() {
    return (
      <div>
        <div>
          <Button
            positive
            size='massive'
            onClick={this.shuffle}
            disabled={this.state.shuffling}
          >
            Choose a Winner
          </Button>
          {this.buildWinnerLabel()}
        </div>
        <div>
          &nbsp;
        </div>
        <div>
          <Card.Group stackable>
            {this.state.cards.map(card =>
                <Card {...card} />
            )}
          </Card.Group>
        </div>
      </div>
    )
  }
}

PrizeGrid.propTypes = {
  users: PropTypes.array,
}

export default PrizeGrid
<commit_msg>Add throttle to prizes<commit_after>import React, { Component, PropTypes } from 'react'
import { Card, Icon, Label, Button } from 'semantic-ui-react'
import _ from 'lodash'

class PrizeGrid extends Component {
  constructor(props) {
    super(props)
    const cards = this.parseExercises(this.props.users)
    this.state = {
      cards,
      enterLeaveAnimation: 'accordianVertical',
      shuffle: 0,
      winner: '',
      remaining: this.props.users,
      maxShuffle: 30,
      shuffling: false,
    }
  }

  parseExercises = (users) => {
    const userCards = []

    _.each(users, user => {
      userCards.push({
        key: user.name,
        header: user.name,
        image: {
          src: user.image,
        },
        extra: this.buildIcon(user.exercises),
      })
    })

    return userCards
  }

  chooseWinner = () => {
    let winners = []
    const remaining = this.state.remaining

    _.each(remaining, user => {
      for (let i = 0; i < user.exercises; i++) {
        winners.push(user.name)
      }
    })

    for (let i = 0; i < 50; i ++) {
      winners = _.shuffle(winners)
    }

    return winners[0]
  }

  buildIcon = (excercises) => {
    return (
      <Label size='large'>
        <Icon name='heartbeat' />{excercises} Exercises Completed
      </Label>
    )
  }

  shuffle = () => {
    const shuffleCount = this.state.shuffle + 1
    if (shuffleCount < this.state.maxShuffle) {
      let winner = this.state.winner
      if (shuffleCount === 1) {
        winner = this.chooseWinner()
      }
      window.setTimeout(() => { this.shuffle() }, this.throttleTimeout(shuffleCount))
      this.setState({
        cards: _.shuffle(this.state.cards),
        shuffle: shuffleCount,
        winner,
        shuffling: true,
      })
    } else {
      this.setState({ shuffle: 0, shuffling: false })
    }
  }

  throttleTimeout = (suffleCount) => {
    const throttle = [150, 300, 450, 700]
    const max = this.state.maxShuffle
    const portion = max / 4
    let index = 1
    while (index < 4) {
      if (index * portion > suffleCount) {
        break
      }
      index ++
    }
    return throttle[index]
  }

  buildWinnerLabel = () => {
    const { shuffle, winner } = this.state
    if (shuffle === 0 && winner !== '') {
      return <h1>Winner: {this.state.winner}</h1>
    }
  }

  render() {
    return (
      <div>
        <div>
          <Button
            positive
            size='massive'
            onClick={this.shuffle}
            disabled={this.state.shuffling}
          >
            Choose a Winner
          </Button>
          {this.buildWinnerLabel()}
        </div>
        <div>
          &nbsp;
        </div>
        <div>
          <Card.Group stackable>
            {this.state.cards.map(card =>
                <Card {...card} />
            )}
          </Card.Group>
        </div>
      </div>
    )
  }
}

PrizeGrid.propTypes = {
  users: PropTypes.array,
}

export default PrizeGrid

{'fraction_non_alphanumeric': 0.13733213965980304, 'fraction_numerical': 0.008236347358997314, 'mean_word_length': 1.7722084367245658, 'pattern_counts': {'":': 0, '<': 46, '<?xml version=': 0, '>': 59, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4029258', 'n_tokens_mistral': 1873, 'n_tokens_neox': 1801, 'n_words': 376}