import React from 'react';
import ReactDom from 'react-dom';
import classNames from 'classnames/dedupe';

import log from 'js/utils/log';

import {classname} from 'js/ENUM';

class ChatInput extends React.Component {
	static defaultProps = {
		inputKeyDown: () => {},
		keyBindingFn: () => {},
		onBeforeInput: () => {},
		onBlur: () => {},
		onEscape: () => {},
		onFoucus: () => {},
		onTab: () => {},
		placeholder: 'Typing messsage ...',
      	resizeFn: () => {},
      	uploadPhotoFn: () => {},
	};

	handleInputKeyDown(event) {
	  if (event.shiftKey === true && event.keyCode === 13) {
	    this.props.resizeFn(event);
	  }

	  this.props.inputKeyDown(event);
	}

	componentDidMount() {
		this.setFocus();
	}

	setFocus() {
		ReactDom.findDOMNode(this.refs.textInput).focus(); 
	}

  	render() {
	    return (
			<div>
				<div>
					<div >
						<div placeholder={this.props.placeholder} contentEditable={true} role={"textbox"} spellCheck={true} onKeyDown={::this.handleInputKeyDown} onBlur={this.props.onBlur} ref="textInput">
		
						</div>
					</div>
				</div>
			</div>
	    );
  	}
}

export default ChatInput;