search

kevinshen56714 / SkyOffice

Immersive virtual office built with Phaser, React, Redux, PeerJS, and Colyseus.
https://sky-office.co/
MIT License
930 stars 289 forks source link

Add Chat #25

Closed kevinshen56714 closed 2 years ago

netlify[bot] commented 2 years ago

🔮 Deploy Preview for skyoffice canceled.

🔨 Explore the source changes: 8377e760cd1f30ebd67d891ff86fb9e98a162197

🔍 Inspect the deploy log: https://app.netlify.com/sites/skyoffice/deploys/61b80a154e79d30008db7b41

DaxChen commented 2 years ago

Super cool!

Some random ideas & bugs found when playing with preview:

  1. Hit enter should focus to the chat input box?
  2. After a message is sent (via hitting enter), should we move the focus back to the scene so arrow keys work again? With "enter to focus" I think this is a good UX.
  3. Hitting esc when focused on the chat area should close the chat dialog?
  4. for really long text, should the bubble truncate the text and just show the first N chars (and with ellipsis)? edit: I noticed this is done on the server, but self bubble isn't truncated
  5. when typing chinese, hitting enter once to select character will send out the text once, and second enter will send out the text again, causing duplicate messages. This is a common mistake for implementing "enter to submit'. One easy fix is instead of listening to enter keydown/keyup event, wrap the input inside a
    and listen to the (submit) event on the <form (submit)={}> (remember to call event.preventDefault() on the submit event to prevent the page from refreshing).