diff --git a/examples/chat/chat.go b/examples/chat/chat.go index 532e50f5..11920cbc 100644 --- a/examples/chat/chat.go +++ b/examples/chat/chat.go @@ -2,8 +2,8 @@ package main import ( "context" + "encoding/json" "errors" - "io/ioutil" "log" "net/http" "sync" @@ -14,6 +14,26 @@ import ( "nhooyr.io/websocket" ) +type clientJoin struct { + ClientID string `json:"client_id"` + ClientName string `json:"client_name"` +} + +type clientLeave struct { + ClientID string `json:"client_id"` +} + +type clientRename struct { + ClientID string `json:"client_id"` + ClientName string `json:"client_name"` +} + +type messageBroadcast struct { + ClientID string `json:"client_id"` + Time time.Time `json:"time"` + Message string `json:"msg"` +} + // chatServer enables broadcasting to a set of subscribers. type chatServer struct { // subscriberMessageBuffer controls the max number @@ -81,7 +101,7 @@ func (cs *chatServer) subscribeHandler(w http.ResponseWriter, r *http.Request) { return } if websocket.CloseStatus(err) == websocket.StatusNormalClosure || - websocket.CloseStatus(err) == websocket.StatusGoingAway { + websocket.CloseStatus(err) == websocket.StatusGoingAway { return } if err != nil { @@ -98,13 +118,18 @@ func (cs *chatServer) publishHandler(w http.ResponseWriter, r *http.Request) { return } body := http.MaxBytesReader(w, r.Body, 8192) - msg, err := ioutil.ReadAll(body) + + var msg message + err := json.NewDecoder(body).Decode(&msg) if err != nil { - http.Error(w, http.StatusText(http.StatusRequestEntityTooLarge), http.StatusRequestEntityTooLarge) + http.Error(w, http.StatusText(http.StatusBadRequest), http.StatusBadRequest) return } - cs.publish(msg) + msg.Author = + + // TODO improve + cs.publish([]byte(msg.Message)) w.WriteHeader(http.StatusAccepted) } diff --git a/examples/chat/index.css b/examples/chat/index.css index 73a8e0f3..fc7f372b 100644 --- a/examples/chat/index.css +++ b/examples/chat/index.css @@ -1,12 +1,8 @@ -body { - width: 100vw; - min-width: 320px; -} - #root { padding: 40px 20px; - max-width: 600px; margin: auto; + min-width: 320px; + max-width: 600px; height: 100vh; display: flex; @@ -79,3 +75,15 @@ body { #publish-form input[type="submit"]:active { background-color: red; } + +#username-form-overlay { + position: fixed; + width: 100%; + height: 100%; + margin: 0; + background-color: rgba(0, 0, 0, 0.5); + + display: flex; + align-items: center; + justify-content: center; +} diff --git a/examples/chat/index.html b/examples/chat/index.html index 76ae8370..3ca6dcf9 100644 --- a/examples/chat/index.html +++ b/examples/chat/index.html @@ -12,6 +12,13 @@
+
+
+ + +
+
+
diff --git a/examples/chat/index.js b/examples/chat/index.js index 5868e7ca..794354ab 100644 --- a/examples/chat/index.js +++ b/examples/chat/index.js @@ -64,7 +64,10 @@ try { const resp = await fetch("https://github.com/publish", { method: "POST", - body: msg, + body: { + time: new Date(), + msg: msg, + }, }) if (resp.status !== 202) { throw new Error(`Unexpected HTTP Status ${resp.status} ${resp.statusText}`)