Skip to content

Instantly share code, notes, and snippets.

@wbspry
Created August 7, 2014 08:56
Show Gist options
  • Save wbspry/f780ec0ddfc9af87c773 to your computer and use it in GitHub Desktop.
Save wbspry/f780ec0ddfc9af87c773 to your computer and use it in GitHub Desktop.
Playframework付属のサンプル'websocket-chat'を見てみる(2/4) ref: http://qiita.com/yyyske/items/0d00e5e352b7078a501e
public static WebSocket<JsonNode> chat(final String username) {
return new WebSocket<JsonNode>() {
// Called when the Websocket Handshake is done.
public void onReady(WebSocket.In<JsonNode> in, WebSocket.Out<JsonNode> out){
// Join the chat room.
try {
ChatRoom.join(username, in, out);
} catch (Exception ex) {
ex.printStackTrace();
}
}
};
}
@(username: String)
@main(username) {
<div class="page-header">
<h1>Welcome to the chat room
<small>You are chatting as @username</small></h1>
</div>
<div id="onError" class="alert-message error">
<p>
<strong>Oops!</strong> <span></span>
</p>
</div>
<div id="onChat" class="row">
<div class="span10" id="main">
<div id="messages">
</div>
<textarea id="talk"></textarea>
</div>
<div class="span4">
<h2>Members</h2>
<ul id="members">
</ul>
</div>
</div>
<script type="text/javascript" charset="utf-8"
src="@routes.Application.chatRoomJs(username)"></script>
}
@(username: String)
$(function() {
var WS = window['MozWebSocket'] ? MozWebSocket : WebSocket
var chatSocket =
new WS("@routes.Application.chat(username).webSocketURL(request)")
var sendMessage = function() {
chatSocket.send(JSON.stringify(
{text: $("#talk").val()}
))
$("#talk").val('')
}
var receiveEvent = function(event) {
var data = JSON.parse(event.data)
// Handle errors
if(data.error) {
chatSocket.close()
$("#onError span").text(data.error)
$("#onError").show()
return
} else {
$("#onChat").show()
}
// Create the message element
var el = $('<div class="message"><span></span><p></p></div>')
$("span", el).text(data.user)
$("p", el).text(data.message)
$(el).addClass(data.kind)
if(data.user == '@username') $(el).addClass('me')
$('#messages').append(el)
// Update the members list
$("#members").html('')
$(data.members).each(function() {
var li = document.createElement('li');
li.textContent = this;
$("#members").append(li);
})
}
var handleReturnKey = function(e) {
if(e.charCode == 13 || e.keyCode == 13) {
e.preventDefault()
sendMessage()
}
}
$("#talk").keypress(handleReturnKey)
chatSocket.onmessage = receiveEvent
})
src="/assets/javascripts/chatroom.js?username=a"
var chatSocket =
new WS("@routes.Application.chat(username).webSocketURL(request)")
var chatSocket = new WS("ws:\/\/localhost:9000\/room\/chat?username=a")
GET /room/chat controllers.Application.chat(username)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment