Skip to content

Commit 37099f1

Browse files
committed
Issue #3 - Added a rudimentary websocket connection test
The connection test appears to be working correctly. I added a ping to websocket.org to test the test, and also tested against Cardshifter server running locally. Local connection raised `java.lang.ArrayIndexOutOfBoundsException` on server side, but maintained the connection until I shut down the server.
1 parent d5134d6 commit 37099f1

File tree

1 file changed

+57
-34
lines changed

1 file changed

+57
-34
lines changed

login/login.html

Lines changed: 57 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -9,64 +9,87 @@
99
<body>
1010
<noscript>To play CardShifter, please either enable JavaScript or use a JavaScript-enabled browser.</noscript>
1111
<h1>Cardshifter login</h1>
12-
<form name="login_information">
13-
Server:
14-
<select name="server">
15-
<option value="127.0.0.1">Local host</option>
16-
<option value="dwarftowers.com">dwarftowers.com</option>
17-
<option value = "ws://echo.websocket.org/">WebSocket.org echo test</option>
12+
<form name="login_information" id="login_information">
13+
<label for="server">Server:</label>
14+
<select name="server" id="server">
15+
<option value="ws://127.0.0.1:4243">Local host</option>
16+
<option value="ws://dwarftowers.com:4243">dwarftowers.com</option>
17+
<option value="ws://echo.websocket.org/">WebSocket.org echo test</option>
1818
<option value="other">Other...</option>
1919
</select>
2020
<br/>
2121
<div id="server_other">
22-
Other Server:
23-
<input name="server_other" type="text" />
22+
<label for="server_other">Other Server:</label>
23+
<input name="server_other" id="server_other" type="text" />
2424
<br/>
2525
</div>
26-
Username:
27-
<input name="username" type="text" placeholder="Enter name..." />
28-
<br/> Is secure server:
29-
<input name="secure" type="checkbox" />
26+
<label for="username">Username:</label>
27+
<input name="username" id="username" type="text" placeholder="Enter name..." />
28+
<br/>
29+
<label for="secure">Is secure server:</label>
30+
<input name="secure" id="secure" type="checkbox" value="secure" />
3031
<br/>
31-
Test message to server (for testing only):
32-
<input name = "testMessage" type = "test" placeholder = "Hello, World!" />
32+
<label for="test_message">Test message to server:</label>
3333
<br/>
34-
<input name="submit" type="button" value="Log in" />
35-
<input name ="test_websocket" type="button" value="Test WebSocket" />
34+
<input name="test_message" id="test_message" type="text" size="100" placeholder="Optional... Leave blank unless using for testing." />
35+
<br/>
36+
<input name="submit" id=submit" type="button" value="Log in" />
37+
<input name ="test_websocket" id="test_websocket "type="button" value="Test WebSocket" />
3638
</form>
3739
<script src="login.js"></script>
3840

3941
<!-- Temporary WebSocket connection test prints result to document -->
4042

41-
<!-- EXTERNAL SCRIP DOESN'T WORK YET | 2015-07-28 @Phrancis
42-
<script src="connection-test.js">
43-
-->
44-
45-
<script "type="text/javascript">
43+
<script type="text/javascript">
4644
// @TODO: Extract this functionality to external file.
4745

48-
loginForm = document.forms['login_information'];
46+
login_information = document.login_information;
4947

50-
loginForm.elements['test_websocket'].addEventListener("click", init);
48+
login_information.elements.test_websocket.addEventListener("click", init);
5149

52-
var wsUri = "ws://echo.websocket.org/";
53-
var output;
50+
//var server = "ws://echo.websocket.org/";
51+
//var username = document.getElementsByName("username").value.toString();
52+
53+
var server
54+
, username
55+
, test_message
56+
, websocket_output;
5457

5558
function init() {
56-
output = document.getElementById("output");
59+
60+
server = document.getElementById("server").value.toString();
61+
if (server === "other") {
62+
server = document.getElementById("server_other").value.toString();
63+
}
64+
username = document.getElementById("username").value.toString();
65+
test_message = document.getElementById("test_message").value.toString();
66+
if (!test_message) {
67+
test_message = '{ "command": "login", "username": "' + username + '" }';
68+
}
69+
70+
websocket_output = document.getElementById("websocket_output");
71+
5772
testWebSocket();
5873
}
5974

6075
function testWebSocket() {
6176

6277
// Message to append input values to document prior to printing test results
63-
var wsInfo = document.createElement("h3");
64-
wsInfo.innerHTML = "Testing WebSocket connection...";
65-
output.appendChild(wsInfo);
78+
var wsHeader = document.createElement("h3");
79+
wsHeader.innerHTML = "Testing WebSocket connection...";
80+
websocket_output.appendChild(wsHeader);
81+
82+
var wsInput = document.createElement("p");
83+
wsInput.innerHTML =
84+
"Server: " + server + "<br/>" +
85+
"Username: " + username + "<br/>" +
86+
"Message: " + test_message;
87+
88+
websocket_output.appendChild(wsInput);
6689

6790
// Begin WebSocket test
6891

69-
websocket = new WebSocket(wsUri);
92+
websocket = new WebSocket(server);
7093
websocket.onopen = function(evt) {
7194
onOpen(evt)
7295
};
@@ -83,7 +106,7 @@ <h1>Cardshifter login</h1>
83106

84107
function onOpen(evt) {
85108
writeToScreen("CONNECTED");
86-
doSend("TEST");
109+
doSend(test_message);
87110
}
88111

89112
function onClose(evt) {
@@ -109,12 +132,12 @@ <h1>Cardshifter login</h1>
109132
var pre = document.createElement("p");
110133
pre.style.wordWrap = "break-word";
111134
pre.innerHTML = message;
112-
output.appendChild(pre);
135+
websocket_output.appendChild(pre);
113136
}
114137

115138
</script>
116-
<!-- <h2>WebSocket Test</h2> -->
117-
<div id="output"></div>
139+
140+
<div id="websocket_output"></div>
118141

119142
<!-- end temporary connection test -->
120143

0 commit comments

Comments
 (0)