<commit_before>import * as Actions from '../../actions/';
import React,{Component} from 'react';
import PropTypes from 'prop-types';
import Send from 'material-ui/svg-icons/content/send';
import Mic from 'material-ui/svg-icons/av/mic';
import UserPreferencesStore from '../../stores/UserPreferencesStore';
import IconButton from 'material-ui/IconButton';
import injectTapEventPlugin from 'react-tap-event-plugin';
import VoiceRecognition from './VoiceRecognition';
import Dialog from 'material-ui/Dialog';
injectTapEventPlugin();

let ENTER_KEY_CODE = 13;
const style = {
    mini: true,
    top: '4px',
    right:'3px',
    position: 'absolute',
};
const customContentStyle = {
  width: '100%',
  maxWidth: 'none',
  textAlign : 'center',
  background: '#fff',
};
const iconStyles = {
  display: 'inline-block',
  color: '#ccc',
  fill: 'currentcolor',
  height: '70px',
  width: '70px',
  userSelect: 'none',
  transition: 'all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms',
  marginTop: '36px'
}
let Button, speechRecog;
// Getting the Speech Recognition to test whether possible
const SpeechRecognition = window.SpeechRecognition
      || window.webkitSpeechRecognition
      || window.mozSpeechRecognition
      || window.msSpeechRecognition
      || window.oSpeechRecognition
// Setting buttons accordingly
if (SpeechRecognition != null) {
  Button = <Mic />
  speechRecog = true;
}
else {
  Button = <Send />;
  speechRecog = false;
}
class MessageComposer extends Component {

  constructor(props) {
    super(props);
    this.state = {
      text: '',
      start: false,
      stop: false,
      open: false,
      result:''
    };
    if(props.dream!==''){
      this.state= {text: 'dream '+ props.dream}
    }
  }

  onStart = () => {
    this.setState({ start: true, stop: false, open:true})
  }

  onEnd = () => {
    this.setState({ start: false, stop: false, open: false})
  }
  onResult = ({finalTranscript }) => {
    let result = finalTranscript;
    this.setState({ result:result});
    setTimeout(()=>this.setState({ start: false, stop: false, open:false}),400);
    Actions.createMessage(result, this.props.threadID);
    setTimeout(()=>this.setState({result: ''}), 500);
    Button = <Mic />
  }

  componentDidMount(){
    this.nameInput.focus();
  }

  render() {
    return (
      <div>
      <div className="message-composer" >
        {this.state.start && (
          <VoiceRecognition
            onStart={this.onStart}
            onEnd={this.onEnd}
            onResult={this.onResult}
            continuous={true}
            lang="en-US"
            stop={this.state.stop}
          />
        )}
        <textarea
          name="message"
          value={this.state.text}
          onChange={this._onChange.bind(this)}
          onKeyDown={this._onKeyDown.bind(this)}
          ref={(textarea)=> { this.nameInput = textarea; }}
          placeholder="Type a message..."
          style={{background:this.props.textarea}}
        />
        <IconButton
          iconStyle={{fill:UserPreferencesStore.getTheme()==='light'?'#607D8B':'#fff',
          marginTop:'6px'}}
          onTouchTap={this._onClickButton.bind(this)}
          style={style}>
          {Button}
        </IconButton>
      </div>
        <Dialog
          modal={true}
          open={this.state.open}
          contentStyle={customContentStyle}
        >
          <div className='mic-container'>
          <Mic style={iconStyles}/>
          </div>
          <h1 className='voice-output'>
          {this.state.result !=='' ? this.state.result :
          'Speak Now...'}
          </h1>
        </Dialog>
        </div>
    );
  }

  _onClickButton(){
    if(this.state.text === ''){
      if(speechRecog){
      this.setState({ start: true })
      }
      else {
        this.setState({ start: false })<commit_msg>Fixes#414 Fixed the width of message composer (#424)<commit_after>import * as Actions from '../../actions/';
import React,{Component} from 'react';
import PropTypes from 'prop-types';
import Send from 'material-ui/svg-icons/content/send';
import Mic from 'material-ui/svg-icons/av/mic';
import UserPreferencesStore from '../../stores/UserPreferencesStore';
import IconButton from 'material-ui/IconButton';
import injectTapEventPlugin from 'react-tap-event-plugin';
import VoiceRecognition from './VoiceRecognition';
import Dialog from 'material-ui/Dialog';
injectTapEventPlugin();

let ENTER_KEY_CODE = 13;
const style = {
    mini: true,
    top: '4px',
    right:'3px',
    position: 'absolute',
};
const customContentStyle = {
  width: '100%',
  maxWidth: 'none',
  textAlign : 'center',
  background: '#fff',
};
const iconStyles = {
  display: 'inline-block',
  color: '#ccc',
  fill: 'currentcolor',
  height: '70px',
  width: '70px',
  userSelect: 'none',
  transition: 'all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms',
  marginTop: '36px'
}
let Button, speechRecog;
// Getting the Speech Recognition to test whether possible
const SpeechRecognition = window.SpeechRecognition
      || window.webkitSpeechRecognition
      || window.mozSpeechRecognition
      || window.msSpeechRecognition
      || window.oSpeechRecognition
// Setting buttons accordingly
if (SpeechRecognition != null) {
  Button = <Mic />
  speechRecog = true;
}
else {
  Button = <Send />;
  speechRecog = false;
}
class MessageComposer extends Component {

  constructor(props) {
    super(props);
    this.state = {
      text: '',
      start: false,
      stop: false,
      open: false,
      result:''
    };
    if(props.dream!==''){
      this.state= {text: 'dream '+ props.dream}
    }
  }

  onStart = () => {
    this.setState({ start: true, stop: false, open:true})
  }

  onEnd = () => {
    this.setState({ start: false, stop: false, open: false})
  }
  onResult = ({finalTranscript }) => {
    let result = finalTranscript;
    this.setState({ result:result});
    setTimeout(()=>this.setState({ start: false, stop: false, open:false}),400);
    Actions.createMessage(result, this.props.threadID);
    setTimeout(()=>this.setState({result: ''}), 500);
    Button = <Mic />
  }

  componentDidMount(){
    this.nameInput.focus();
  }

  render() {
    return (
      <div className="message-composer" >
        {this.state.start && (
          <VoiceRecognition
            onStart={this.onStart}
            onEnd={this.onEnd}
            onResult={this.onResult}
            continuous={true}
            lang="en-US"
            stop={this.state.stop}
          />
        )}
        <textarea
          name="message"
          value={this.state.text}
          onChange={this._onChange.bind(this)}
          onKeyDown={this._onKeyDown.bind(this)}
          ref={(textarea)=> { this.nameInput = textarea; }}
          placeholder="Type a message..."
          style={{background:this.props.textarea}}
        />
        <IconButton
          iconStyle={{fill:UserPreferencesStore.getTheme()==='light'?'#607D8B':'#fff',
          marginTop:'6px'}}
          onTouchTap={this._onClickButton.bind(this)}
          style={style}>
          {Button}
        </IconButton>

        <Dialog
          modal={true}
          open={this.state.open}
          contentStyle={customContentStyle}>
          <div className='mic-container'>
          <Mic style={iconStyles}/>
          </div>
          <h1 className='voice-output'>
          {this.state.result !=='' ? this.state.result :
          'Speak Now...'}
          </h1>
        </Dialog>
        </div>
    );
  }

  _onClickButton(){
    if(this.state.text === ''){
      if(speechRecog){
      this.setState({ start: true })
      }
      else {
        this.setState({ start: false })
{'fraction_non_alphanumeric': 0.15411764705882353, 'fraction_numerical': 0.010718954248366013, 'mean_word_length': 2.560260586319218, 'pattern_counts': {'":': 0, '<': 37, '<?xml version=': 0, '>': 49, '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': '2643585', 'n_tokens_mistral': 2437, 'n_tokens_neox': 2340, 'n_words': 481}