init

2 years ago · 49b7c7f78e
commit 49b7c7f78e
3 changed files with 52 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
+venv/
--- a/app.py
+++ b/app.py
@ -0,0 +1,17 @@
+from flask import Flask, render_template
+from flask_sock import Sock
+
+app = Flask(__name__)
+sock = Sock(app)
+
+
+@app.route('/')
+def index():
+    return render_template('index.html')
+
+
+@sock.route('/echo')
+def echo(sock):
+    while True:
+        data = sock.receive()
+        sock.send(data)
--- a/templates/index.html
+++ b/templates/index.html
@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Flask-Sock Demo</title>
+	</head>
+	<body>
+		<h1>Flask-Sock Demo</h1>
+		<div id="log"></div>
+		<br />
+		<form id="form">
+			<label for="text">Input: </label>
+			<input type="text" id="text" autofocus />
+		</form>
+		<script>
+			const log = (text, color) => {
+				document.getElementById(
+					"log"
+				).innerHTML += `<span style="color: ${color}">${text}</span><br>`;
+			};
+
+			const socket = new WebSocket("ws://" + location.host + "/echo");
+			socket.addEventListener("message", (ev) => {
+				log("<<< " + ev.data, "blue");
+			});
+			document.getElementById("form").onsubmit = (ev) => {
+				ev.preventDefault();
+				const textField = document.getElementById("text");
+				log(">>> " + textField.value, "red");
+				socket.send(textField.value);
+				textField.value = "";
+			};
+		</script>
+	</body>
+</html>