Hi guys. I saw 3 “chat” playgrounds during a playground search for inputText, yesterday.
Might be worth investigating.
InputText has quite a huge pile of observables. inputText docs It looks like a fun thing to experiment-with.
Possibly, your chat-panel will consist of two primary parts… the chatInput (inputText with possible allowance for up/down cursor back-buffer, and chatOutput (scrollView with word/line-wrapping).
There’s many BJS scenes that mix 3d canvas with HTML, often via side-bars/panels. I don’t believe such things… work with VR head-gear. If you don’t care about the VR folk, then a HTML chat-panel is an option for you… perhaps on the bottom of the screen.
An HTML chat-panel has quite a bit more power than a GUI chat-panel… primarily because-of CSS styling. For example, a user might input: I was dealt TERRIBLE cards this hand.
You could allow: I was dealt ::id=42:TERRIBLE:: cards this hand.
At the HTML output, the word TERRIBLE would use a CSS style named “42”. Perhaps it is a red-colored big-fonted style. Your double-colon feature could allow all sorts of inline CSS, and even little pictures, and possibly even sound effects… all embedded in a chat line. This makes for some VERY expressive chatting. Of course, ‘42’ could just as easily be named ‘bigred’. And a pop-open style-selector panel could easily be made… to help chatters determine WHICH styles are currently available to use, perhaps with a little demo-text next to each choice. (Helps remind chatters what style 42 looks-like, before embedding it in a chat line.)
I once built a system like this, and it worked fine, and was lots of fun. I even allowed users to publish there own stylesheets-of-favorite-chat-styles, and allowed a command to be sent to ALL other chatters… to tell THEIR browsers to include-in (link) the user’s personal stylesheet. ::link someStyleSheetUrl:: This allowed the RECEIVERS of the user’s personal chat styles… to understand id=42… and be able to look-up that style for THEIR chat output. (Everyone sees the very same id=42 style as the input person sees/created.)
In MY chat system, I even allowed HTML <object>
and <audio>
and <video>
elements to be sent to all chatters and insertNode’d into their DOM trees (I called it “The Media Cannon”). IF all chatters had their mimestype set properly for THAT media-type, and IF the media was published in a public CORS-clear place, they ALL see it. In effect, play a movie or share an image… within a bordered div… within their chat output window. COOOOOL! White-boarding festival! (whiteboarding = mega-collaboration). Keep in mind that the movie/video might take longer to load for SOME users, so the movie/video might not be in-sync (at same time-code place) for all chatters.
I also used it to start/loop “crickets chirping” sound effect… if the chat windows sat idle for a long time. Too fun! Don’t forget nametags… so other chatters know who “sent” something (especially important on media-containing divs). We need to know WHO keeps “spamming” the chat windows with pictures of naked chickens.
Inline CSS styles in chat lines - different… powerful… expressive. Media Cannon - beyond expressive. I even had an option to… query the allowed mimestypes of ALL chat listeners, and tell me which listeners don’t have a media player for various filetypes. For example… ::query AVI:: would report back ALL chat listeners who could/couldn’t play AVI files… a pre-check before sending ::object mediaURL.avi:: …to ensure that the avi wouldn’t fail-to-play for SOME listeners. Heavy, huh?
folder of screen grabs
You should avoid temptation to use the HTML frameset element, as that went obsolete in HTML 5+. I don’t know what they replaced its functionality-with, but as you can see by our playground (esp with inspector activated)… “framing” is still available in SOME non-frameset way.
I saw a playground/scene recently… that had some kind of scene-graph viewer on the left side, and standard inspector on the right side. I need to find that again. It was beautiful. The playground’s inspector is powerful and beautiful, in general, but that’s another topic.
Good luck, F. Go get 'em. Teach us / show us …stuff that you learn, ok? thx! Perhaps you should build your chat-panel in the playground so we can all help flesh and empower it. It would be a fun and reusable community project. InputText is not used very often, and ScrollView is quite new, so it would be good learning for all of us.