jakelazaroff.com
a proof of concept realtime collaborative text editor using atproto as a sync server
jake.tngl.io/y-pds/
1.6 kB
39 lines
1<!doctype html>
2<html lang="en">
3 <head>
4 <title>yjs via pds</title>
5 <meta charset="utf8" />
6 <script type="importmap">
7 {
8 "imports": {
9 "preact": "https://esm.sh/preact",
10 "preact/hooks": "https://esm.sh/preact/hooks",
11 "htm/preact": "https://esm.sh/htm/preact?external=preact",
12 "@preact/signals": "https://esm.sh/@preact/signals?external=preact",
13 "@atcute/client": "https://esm.sh/@atcute/client",
14 "@atcute/identity-resolver": "https://esm.sh/@atcute/identity-resolver",
15 "@atcute/oauth-browser-client": "https://esm.sh/@atcute/oauth-browser-client@3.0.0",
16 "prosemirror-state": "https://esm.sh/prosemirror-state",
17 "prosemirror-view": "https://esm.sh/prosemirror-view",
18 "prosemirror-model": "https://esm.sh/prosemirror-model",
19 "prosemirror-schema-basic": "https://esm.sh/prosemirror-schema-basic",
20 "prosemirror-example-setup": "https://esm.sh/prosemirror-example-setup",
21 "yjs": "https://esm.sh/yjs",
22 "y-prosemirror": "https://esm.sh/y-prosemirror",
23 "y-protocols/awareness": "https://esm.sh/y-protocols/awareness",
24 "actor-typeahead": "https://esm.sh/actor-typeahead"
25 }
26 }
27 </script>
28 <link rel="stylesheet" href="/style.css" />
29 </head>
30 <body>
31 <div id="app"></div>
32 <script type="module">
33 import { render } from "preact";
34 import { html } from "htm/preact";
35 import { App } from "./app.js";
36 render(html`<${App} />`, document.getElementById("app"));
37 </script>
38 </body>
39</html>