cgould/lingo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Display custom message if you join a game

Browse Source
This commit is contained in:
Charles Gould 2017-01-12 00:30:32 -05:00
parent adf5d7acf5
commit 8eb56ad1c4
5 changed files with 66 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client-api/src/main/java/lingo/client/api/StompTopics.java
View File

@ -4,6 +4,8 @@ public class StompTopics {
public static final String CHAT = createTopicName("chat");
public static final String GAME_STARTED = createTopicName("gameStarted");
public static final String OPPONENT_JOINED = createTopicName("opponentJoined");
public static final String OPPONENT_LEFT = createTopicName("opponentLeft");
@ -16,6 +18,8 @@ public class StompTopics {
public static final String PRACTICE_REPORTS = createTopicName("practiceReports");
public static final String USER_JOINED = createTopicName("userJoined");
private static String createTopicName(String suffix) {
return "/topic/lingo/" + suffix;
}

11
server/src/main/java/lingo/server/LingoController.java
View File

@ -89,7 +89,7 @@ public class LingoController implements ApplicationListener<AbstractSubProtocolE
public void join(String username, @Header(SESSION_ID_HEADER) String sessionId) {
log.info("Player joined: {}, {}", sessionId, username);
usernameBySession.put(sessionId, username);
sendAnnouncement(username + " joined");
send(StompTopics.USER_JOINED, username);
joinWaitingList(sessionId);
}
@ -105,7 +105,7 @@ public class LingoController implements ApplicationListener<AbstractSubProtocolE
private void leave(String sessionId) {
final String username = usernameBySession.remove(sessionId);
if (username != null) {
sendAnnouncement(username + " left");
send(StompTopics.CHAT, new ChatMessage(null, username + " left"));
}
final Game game = gameBySession.remove(sessionId);
if (game == null) {
@ -184,9 +184,8 @@ public class LingoController implements ApplicationListener<AbstractSubProtocolE
sendToUser(sessionId, StompTopics.PRACTICE_REPORTS, report);
}
private void sendAnnouncement(String message) {
final ChatMessage payload = new ChatMessage(null, message);
messagingTemplate.convertAndSend(StompTopics.CHAT, payload);
private void send(String destination, Object payload) {
messagingTemplate.convertAndSend(destination, payload);
}
private void sendToUser(String user, String destination, Object payload) {
@ -231,7 +230,7 @@ public class LingoController implements ApplicationListener<AbstractSubProtocolE
final String[] playerTwoMessage = new String[] { firstLetter, playerOneUsername };
sendToUser(playerOne, StompTopics.OPPONENT_JOINED, playerOneMessage);
sendToUser(playerTwo, StompTopics.OPPONENT_JOINED, playerTwoMessage);
sendAnnouncement(playerOneUsername + " is playing with " + playerTwoUsername);
send(StompTopics.GAME_STARTED, new String[] { playerOneUsername, playerTwoUsername });
}
}
}

5
server/src/main/resources/static/client.html
View File

@ -9,11 +9,12 @@
</head>
<body>
<div id="usernameDiv" class="jumbotron">
<p>What is your name?<p>
<h2>What is your name?</h2>
<form>
<div class="form-group">
<input id="username" type="text" class="form-control" maxlength="16" placeholder="Username">
<input id="username" type="text" class="form-control" maxlength="16" placeholder="Name">
</div>
<p id="usernameError" class="error-message"></p>
<button id="usernameButton" type="button" class="btn btn-default">Submit</button>
</form>
</div>

47
server/src/main/resources/static/client.js
View File

@ -28,6 +28,9 @@ var client;
function main() {
var usernameDiv = document.getElementById('usernameDiv');
var usernameInput = document.getElementById('username');
var usernameButton = document.getElementById('usernameButton');
var usernameError = document.getElementById('usernameError');
var submitUsernameFunction = function() {
var usernameValue = usernameInput.value.trim();
if (usernameValue.length === 0) {
@ -41,8 +44,6 @@ function main() {
waitingDiv.classList.remove('hidden');
appDiv.classList.remove('hidden');
}
var usernameInput = document.getElementById('username');
var usernameButton = document.getElementById('usernameButton');
usernameButton.addEventListener('click', submitUsernameFunction);
usernameInput.focus();
usernameInput.addEventListener('keydown', function(e) {
@ -51,6 +52,16 @@ function main() {
submitUsernameFunction();
}
});
usernameInput.addEventListener('keyup', function(e) {
var usernameValue = usernameInput.value.trim();
if (usernameValue.length === 0) {
usernameError.innerHTML = 'Name cannot be empty.';
usernameButton.disabled = true;
} else {
usernameError.innerHTML = '';
usernameButton.disabled = false;
}
});
var storedUsername = localStorage.getItem('lingo.username');
if (storedUsername === null) {
usernameInput.value = 'Alex Trebek';
@ -74,11 +85,13 @@ function start() {
client = Stomp.over(new SockJS('/stomp'));
client.connect({}, function(frame) {
subscribeToChatMessages();
subscribeToChat();
subscribeToGameStarted();
subscribeToOpponentJoined();
subscribeToOpponentLeft();
subscribeToOpponentReports();
subscribeToPlayerReports();
subscribeToUserJoined();
client.send('/app/lingo/join', {}, myUsername);
});
}
@ -329,7 +342,7 @@ function reset(firstLetter, clearScore) {
}
}
function subscribeToChatMessages() {
function subscribeToChat() {
client.subscribe('/topic/lingo/chat', function(message) {
var chatMessage = JSON.parse(message.body);
var messageSender = chatMessage.username;
@ -345,6 +358,21 @@ function subscribeToChatMessages() {
});
}
function subscribeToGameStarted() {
client.subscribe('/topic/lingo/gameStarted', function(message) {
var report = JSON.parse(message.body);
var playerOne = report[0];
var playerTwo = report[1];
if (playerOne === myUsername) {
addChatAnnouncement('You are playing with ' + playerTwo);
} else if (playerTwo === myUsername) {
addChatAnnouncement('You are playing with ' + playerOne);
} else {
addChatAnnouncement(playerOne + ' is playing with ' + playerTwo);
}
});
}
function subscribeToOpponentJoined() {
client.subscribe('/user/topic/lingo/opponentJoined', function(message) {
var report = JSON.parse(message.body);
@ -421,4 +449,15 @@ function subscribeToPlayerReports() {
});
}
function subscribeToUserJoined() {
client.subscribe('/topic/lingo/userJoined', function(message) {
var username = message.body;
if (username === myUsername) {
addChatAnnouncement('You joined');
} else {
addChatAnnouncement(username + ' joined');
}
});
}
main();

13
server/src/main/resources/static/style.css
View File

@ -17,10 +17,14 @@ button {
padding: 6px 12px;
}
button:hover {
button:hover:enabled {
cursor: pointer;
}
button:hover:disabled {
cursor: not-allowed;
}
/* Main area */
.header {
@ -68,12 +72,17 @@ button:hover {
border-radius: 6px;
}
.jumbotron p {
.jumbotron h2 {
margin-bottom: 15px;
font-size: 21px;
font-weight: 200;
}
.error-message {
color: red;
font-size: 14px;
}
.form-group {
margin-bottom: 15px;
}