import React from 'react'
import ReactDOM from 'react-dom'
import VoicePlayer from './voice-player'

class Demo extends React.Component {
  state = {
    play: true,
    pause: false
  }

  render () {
    return (
      <div>
        <button onClick={() => this.setState({ play: true })}>Play</button>
        <button onClick={() => this.setState({ pause: true })}>Pause</button>
        <button onClick={() => this.setState({ pause: false })}>Resume</button>
        <button onClick={() => this.setState({ cancel: true })}>Resume</button>

        <VoicePlayer
          text="Welcome to React Voice Components! Please turn off the lights before leaving"
          lang="en-us"
          play={this.state.play}
          pause={this.state.pause}
        />
      </div>
    )
  }
}

ReactDOM.render(
  <Demo />,
  document.getElementById('root')
)

import React from 'react'
import ReactDOM from 'react-dom'
import VoicePlayer from './voice-player'

class Demo extends React.Component {
  state = {
    play: true,
    pause: false
  }

  render () {
    return (
      <div>
        <button onClick={() => this.setState({ play: true })}>Play</button>
        <button onClick={() => this.setState({ pause: true })}>Pause</button>
        <button onClick={() => this.setState({ pause: false })}>Resume</button>

        <VoicePlayer
          play={this.state.play}
          pause={this.state.pause}
          text="Welcome to the jungle! We got fun and games"
          onPause={() => console.info('pause')}
          onResume={() => console.info('resume')}
          onStart={() => console.info('start')}
          onEnd={() => console.info('end')}
        />
      </div>
    )
  }
}

ReactDOM.render(
  <Demo />,
  document.getElementById('root')
)


Add pause/resume examples on demo
Add pause/resume examples on demo
