Compare commits

..

No commits in common. "b82a0f32c7fcacb886f7d2aa4218e77f465e14ab" and "a3a6a52c8714ec3d1b637933c70a4febc92ab7a7" have entirely different histories.

2 changed files with 34 additions and 35 deletions

View file

@ -76,7 +76,7 @@ async fn main() {
tracing_subscriber::registry() tracing_subscriber::registry()
.with( .with(
tracing_subscriber::EnvFilter::try_from_default_env() tracing_subscriber::EnvFilter::try_from_default_env()
.unwrap_or_else(|_| "cards=trace".into()), .unwrap_or_else(|_| "example_chat=trace".into()),
) )
.with(tracing_subscriber::fmt::layer()) .with(tracing_subscriber::fmt::layer())
.init(); .init();

View file

@ -12,46 +12,45 @@
</head> </head>
<body> <body>
<h1>Cards For Humanity Test Client</h1> <h1>Cards For Humanity Test Client</h1>
<div id="status">
<p><em>Disconnected...</em></p>
</div>
<form id="login" onsubmit="loginSubmit();return false">
<input id="username" style="display:block; width:100px; box-sizing: border-box" type="text" placeholder="username"> <input id="username" style="display:block; width:100px; box-sizing: border-box" type="text" placeholder="username">
<button id="join-chat" type="submit">Join Chat</button> <button id="join-chat" type="button">Join Chat</button>
</form> <textarea id="chat" style="display:block; width:600px; height:400px; box-sizing: border-box" cols="30" rows="10"></textarea>
<form id="chat" onsubmit="chatSubmit();return false"> <input id="input" style="display:block; width:600px; box-sizing: border-box" type="text" placeholder="chat">
<textarea id="chat-history" style="display:block; width:600px; height:400px; box-sizing: border-box" cols="30" rows="10"></textarea>
<input id="chat-input" style="display:block; width:600px; box-sizing: border-box" type="text" placeholder="chat">
</form>
<script type="text/javascript"> <script type="text/javascript">
websocket = new WebSocket("ws://localhost:3030/websocket"); const username = document.querySelector("#username");
const join_btn = document.querySelector("#join-chat");
const textarea = document.querySelector("#chat");
const input = document.querySelector("#input");
function loginSubmit() { join_btn.addEventListener("click", function(e) {
document.getElementById("join-chat").disabled = true; this.disabled = true;
websocket.send(username.value);
}; const websocket = new WebSocket("ws://localhost:3000/websocket");
websocket.onopen = function() { websocket.onopen = function() {
console.log("connection opened"); console.log("connection opened");
document.getElementById("status").innerHTML = '<p><em>Connected!</em></p>'; websocket.send(username.value);
} }
const btn = this;
websocket.onclose = function() { websocket.onclose = function() {
console.log("connection closed"); console.log("connection closed");
// document.getElementById("join-chat").disabled = false; btn.disabled = false;
document.getElementById("status").innerHTML = '<p><em>Disconnected...</em></p>';
} }
websocket.onmessage = function(e) { websocket.onmessage = function(e) {
console.log("received message: "+e.data); console.log("received message: "+e.data);
document.getElementById("chat-history").value += e.data+"\r\n"; textarea.value += e.data+"\r\n";
} }
function chatSubmit() { input.onkeydown = function(e) {
let input = document.getElementById("chat-input"); if (e.key == "Enter") {
websocket.send(input.value); websocket.send(input.value);
input.value = ""; input.value = "";
}; }
}
});
</script> </script>
</body> </body>
</html> </html>