init

2024-10-07 15:16:41 -06:00
commit ae0a61884e
5 changed files with 1885 additions and 0 deletions
--- a/Cargo.lock
+++ b/Cargo.lock
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -0,0 +1,8 @@
+[package]
+name = "clarity"
+version = "0.1.0"
+edition = "2021"
+
+[dependencies]
+rocket = "0.5.1"
+rocket_ws = "0.1.1"
--- a/clarity.js
+++ b/clarity.js
@@ -0,0 +1,37 @@
+const socket = new WebSocket("ws://localhost:8000/echo")
+
+socket.addEventListener("message", event => {
+    console.debug(event.data)
+})
+
+let grid_size = 10;
+const map = new Map();
+
+document.addEventListener("click", event => {
+    let x = Math.floor(event.pageX / grid_size)
+    let y = Math.floor(event.pageY / grid_size)
+
+    let key = `x${x}y${y}`
+
+    let val = 0;
+    let element = undefined;
+
+    if (map.get(key) == undefined) {
+        val = 1
+        let d = document.createElement("div")
+        document.getElementsByTagName("body")[0].appendChild(d)
+        element = d
+        map.set(key, [val, d]); 
+    } else {
+        let index = map.get(key);
+        val = index[0]+1;
+        element = index[1];
+        map.set(key, [val, index[1]]); 
+    }
+
+    socket.send(key)
+
+    let hue = ((1 - (val/60)) * 100);
+    element.style = `width:${grid_size}px;height:${grid_size}px;background-color:hsl(${hue},100%,50%);position:absolute;left:${x*grid_size}px;top:${y*grid_size}px;z-index:1000`
+
+});
--- a/index.html
+++ b/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <title></title>
+        <meta name="description" content="">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <link rel="stylesheet" href="">
+    </head>
+    <body>
+        <script src="clarity.js" async module></script>
+        <p>Here's some awesome text</p>
+        <div style=width:500px;height:500px;background-color:red>
+            <p>Hello world</p>
+        </div>
+        <div style=width:500px;height:500px;background-color:green>
+            <p>Hello world</p>
+        </div>
+        <div style=width:500px;height:500px;background-color:blue>
+            <p>Hello world</p>
+        </div>
+    </body>
+</html>
--- a/src/main.rs
+++ b/src/main.rs
@@ -0,0 +1,19 @@
+use rocket::{get, routes, tokio};
+use rocket_ws::{Stream, WebSocket};
+
+
+#[rocket::main]
+async fn main() {
+    let j = rocket::build().mount("/", routes![ws]);
+    let _ = j.launch().await;
+}
+
+#[get("/echo")]
+fn ws(ws: WebSocket) -> Stream!['static] {
+    Stream! { ws =>
+        for await message in ws {
+            println!("{:?}", message);
+            yield message?;
+        }
+    }
+}