146 lines
4.0 KiB
CoffeeScript
146 lines
4.0 KiB
CoffeeScript
context = window
|
|
rest = new context.JK.Rest()
|
|
ChatActions = @ChatActions
|
|
|
|
|
|
@ChatWindow = React.createClass({
|
|
mixins: [Reflux.listenTo(@AppStore, "onAppInit"), Reflux.listenTo(@UserStore, "onUserChanged"),
|
|
Reflux.listenTo(@ChatStore, "onChatChanged")]
|
|
|
|
lastChannel: null
|
|
|
|
getInitialState: () ->
|
|
state = context.ChatStore.getState()
|
|
state
|
|
|
|
onChatChanged: (chatState) ->
|
|
@setState(chatState)
|
|
|
|
onUserChanged: (userState) ->
|
|
@setState(userState)
|
|
|
|
onAppInit: (app) ->
|
|
@app = app
|
|
|
|
activateChannel: (channel, e) ->
|
|
e.preventDefault()
|
|
ChatActions.activateChannel(channel);
|
|
|
|
render: () ->
|
|
tabs = []
|
|
|
|
for channel of @state.msgs
|
|
classes = {}
|
|
classes[channel] = true
|
|
classes['chat-tab'] = true
|
|
classes['active'] = channel == @state.channel
|
|
|
|
if channel == 'global'
|
|
display = 'Global'
|
|
else if channel == 'session'
|
|
display = 'Session'
|
|
else if !channel?
|
|
display = 'Global'
|
|
else
|
|
display = 'Unknown'
|
|
|
|
tabs.push(`<div key={channel} className={classNames(classes)}><a onClick={this.activateChannel.bind(this, channel)}>{display}</a></div>`)
|
|
|
|
msgs = []
|
|
activeMsgs = @state.msgs[@state.channel] || []
|
|
|
|
for msg in activeMsgs
|
|
|
|
timeago = $.timeago(msg.created_at)
|
|
if msg.sender_id == context.JK.currentUserId
|
|
sender = "me"
|
|
else
|
|
sender = msg.sender_name
|
|
|
|
msgs.push(`<div key={msg.msg_id} className="chat-message">
|
|
<span className="chat-message-sender">{sender}</span>
|
|
<span className="chat-message-text">{msg.msg}</span>
|
|
<time className="chat-message-timestamp timeago">{timeago}</time>
|
|
</div>`)
|
|
|
|
`<div className="ChatWindow">
|
|
<div className="chat-tabs">
|
|
{tabs}
|
|
</div>
|
|
<div className="active-tab">
|
|
<div className="chat-list-scroller">
|
|
{msgs}
|
|
</div>
|
|
</div>
|
|
<div className="chat-sender">
|
|
<form onSubmit={this.handleSendMessage} className="chat-message-form">
|
|
<textarea onKeyDown={this.handleEnter} name="chat-message" id="new-chat-message" placeholder="enter message"></textarea>
|
|
<a className="button-orange btn-send-chat-message" onClick={this.handleSendMessage}>SEND</a>
|
|
</form>
|
|
|
|
</div>
|
|
</div>`
|
|
|
|
sendMessage:()->
|
|
if !context.JK.JamServer.connected
|
|
return false
|
|
|
|
msg = @textBox.val()
|
|
if !msg? || msg == ''
|
|
# don't bother the server with empty messages
|
|
return false;
|
|
|
|
if !@sendingMessage
|
|
@sendingMessage = true
|
|
ChatActions.sendMsg(msg, @sendMsgDone, @sendMsgFail)
|
|
|
|
sendMsgDone: () ->
|
|
@textBox.val('')
|
|
@sendingMessage = false
|
|
|
|
sendMsgFail: (jqXHR) ->
|
|
if jqXHR.status == 404
|
|
@app.notifyServerError(jqXHR, 'Session chat is only available while in session.')
|
|
else
|
|
@app.notifyServerError(jqXHR, 'Unable to Send Chat Message')
|
|
@sendingMessage = false
|
|
|
|
handleSendMessage: (e) ->
|
|
e.preventDefault()
|
|
@sendMessage()
|
|
|
|
componentDidMount: () ->
|
|
@root = $(@getDOMNode())
|
|
@textBox = @root.find('textarea')
|
|
|
|
componentDidUpdate: () ->
|
|
if @lastChannel != @state.channel
|
|
speed = 0
|
|
else
|
|
speed = 'slow'
|
|
@lastChannel = @state.channel
|
|
|
|
#speed = 0 #slow
|
|
$scroller = @root.find('.chat-list-scroller')
|
|
$scroller.animate({scrollTop: $scroller[0].scrollHeight}, speed)
|
|
|
|
pasteIntoInput: (el, text) ->
|
|
el.focus();
|
|
if typeof el.selectionStart == "number" && typeof el.selectionEnd == "number"
|
|
val = el.value
|
|
selStart = el.selectionStart
|
|
el.value = val.slice(0, selStart) + text + val.slice(el.selectionEnd)
|
|
el.selectionEnd = el.selectionStart = selStart + text.length
|
|
else if typeof document.selection != "undefined"
|
|
textRange = document.selection.createRange()
|
|
textRange.text = text
|
|
textRange.collapse(false)
|
|
textRange.select()
|
|
|
|
handleEnter: (evt) ->
|
|
if evt.keyCode == 13 && evt.shiftKey
|
|
evt.preventDefault()
|
|
@pasteIntoInput($(evt.target).get(0), "\n")
|
|
else if evt.keyCode == 13 && !evt.shiftKey
|
|
@sendMessage()
|
|
}) |