Hugging Face's logo

Spaces:
CVNSS
/
Chat
Running

App Files Community
CVNSS commited on
Commit
a148270
·
verified ·
1 Parent(s): d70ef42

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +90 -18
index.html CHANGED
@@ -1,19 +1,91 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="vi">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Ephemeral Chat CVNSS4.0</title>
6
+ <style>
7
+ body { font-family: Arial; background:#f4f4f4; margin:0; padding:0; }
8
+ #login, #chat { max-width:600px; margin:40px auto; padding:20px; background:white; border-radius:8px; box-shadow:0 0 10px rgba(0,0,0,0.1); }
9
+ #chat { display:none; }
10
+ #chatbox { height:400px; overflow-y:auto; border:1px solid #ccc; padding:10px; margin-bottom:10px; }
11
+ input, button { padding:10px; font-size:16px; }
12
+ #msg { width:70%; }
13
+ .msg { margin:5px 0; }
14
+ .you { color:blue; }
15
+ .other { color:green; }
16
+ </style>
17
+ </head>
18
+ <body>
19
+
20
+ <div id="login">
21
+ <h2>💬 Ephemeral Chat CVNSS4.0</h2>
22
+ <p>Nhập tên của bạn để vào phòng chat:</p>
23
+ <input type="text" id="nickname" placeholder="Tên bạn...">
24
+ <button onclick="enterChat()">Vào Chat</button>
25
+ </div>
26
+
27
+ <div id="chat">
28
+ <h3>Phòng: CVNSS4.0 (Ephemeral)</h3>
29
+ <div id="chatbox"></div>
30
+ <input type="text" id="msg" placeholder="Nhập tin nhắn...">
31
+ <button id="send">Gửi</button>
32
+ </div>
33
+
34
+ <script src="https://cdn.jsdelivr.net/npm/nostr-tools/lib/nostr.bundle.js"></script>
35
+ <script>
36
+ const relay = window.NostrTools.relayInit("wss://relay.damus.io");
37
+ relay.connect();
38
+
39
+ let nickname = "";
40
+
41
+ function addMsg(nick, text, type="other") {
42
+ let div = document.createElement("div");
43
+ div.className = "msg " + type;
44
+ div.textContent = nick + ": " + text;
45
+ document.getElementById("chatbox").appendChild(div);
46
+ document.getElementById("chatbox").scrollTop = document.getElementById("chatbox").scrollHeight;
47
+ }
48
+
49
+ function enterChat() {
50
+ nickname = document.getElementById("nickname").value.trim() || "Ẩn danh";
51
+ document.getElementById("login").style.display = "none";
52
+ document.getElementById("chat").style.display = "block";
53
+
54
+ // Sub ephemeral events
55
+ let sub = relay.sub([{ kinds: [20000], "#room": ["CVNSS4.0"] }]);
56
+ sub.on("event", event => {
57
+ let content = event.content;
58
+ let nick = "Khách";
59
+ try {
60
+ let parsed = JSON.parse(content);
61
+ nick = parsed.nick;
62
+ content = parsed.text;
63
+ } catch {}
64
+ addMsg(nick, content, "other");
65
+ });
66
+ }
67
+
68
+ document.getElementById("send").onclick = async () => {
69
+ let text = document.getElementById("msg").value;
70
+ if (!text) return;
71
+
72
+ let sk = window.NostrTools.generatePrivateKey();
73
+ let pk = window.NostrTools.getPublicKey(sk);
74
+
75
+ let evt = {
76
+ kind: 20000, // ephemeral
77
+ pubkey: pk,
78
+ created_at: Math.floor(Date.now()/1000),
79
+ tags: [["room","CVNSS4.0"]],
80
+ content: JSON.stringify({nick: nickname, text: text})
81
+ };
82
+ evt.id = window.NostrTools.getEventHash(evt);
83
+ evt.sig = window.NostrTools.signEvent(evt, sk);
84
+
85
+ relay.publish(evt);
86
+ addMsg(nickname, text, "you");
87
+ document.getElementById("msg").value = "";
88
+ };
89
+ </script>
90
+ </body>
91
  </html>