import React, { Component } from 'react' import PropTypes from 'prop-types' import * as action from '../actions' import { connect } from 'react-redux' import 'emojionearea' import $ from 'jquery' import '../../node_modules/emojionearea/dist/emojionearea.min.css'; var timeouts = {}, time = 2000, typing = false, timeout class Footer extends Component { constructor (props){ super(props) this.state = { message: '' } this.handleKeyPress = this.handleKeyPress.bind(this) this.handleValue = this.handleValue.bind(this) } componentDidMount () { let $this = this // let { sendMessage } = this.props /* $("#emojionearea5").emojioneArea({ pickerPosition: "top", search: false, tones: false, inline: true, hidePickerOnBlur: true, recentEmojis: true, events: { keydown: function (editor, event) { if(event.which === 13){ sendMessage(editor.text()) $("#emojionearea5").data("emojioneArea").setText('') } } } }) */ window.socket.on('eventwriting', function (user, room, evento) { console.log('Writing: ' + evento, room) if(evento === 'start') { $this.props.typing('Escribiendo...') } else { $this.props.typing('') } }) } handleValue (e) { this.setState({ message: e.target.value }) } handleKeyPress (e) { let $this = this let { sendMessage } = this.props if(e.key != 'Enter' && e.keyCode != 13) { let room = window.sessionStorage.getItem('sessionId') let user = JSON.parse(window.localStorage.getItem('user')) typing = true; window.socket.emit('typing', room, user, 0) clearTimeout(timeout) timeout = setTimeout($this.timeoutFunction, 500) } if(e.key == 'Enter' || e.keyCode == 13) { e.preventDefault() e.stopPropagation() sendMessage(e.target.value) this.setState({ message: '' }) } } timeoutFunction() { let user = JSON.parse(window.localStorage.getItem('user')) let room = window.sessionStorage.getItem('sessionId') typing = 1 window.socket.emit('typing', room, user, typing) } render () { let { message } = this.state return (