Gist e788d79614e145d046a33bd7b28a7c55

100%

Gist e788d79614e145d046a33bd7b28a7c55

✓ Published0🌍 Public

Last edited Jun 6, 2020

Created on Jun 2, 2020

This example connects a Mozilla Hubs virtual room to a Phoenix channel via the Reticulum client, logging real-time chat messages and presence rollups as they arrive. The code subscribes to channel events with `reticulumCh.channel.on` and tracks room occupancy through `PresenceRollups`, sending a test message with `sendMessage` after five seconds. It uses `HubStats` to record arrival timestamps and `dotenv` for configuration, demonstrating how to build a bot that monitors live activity in a Hubs room.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist db569066a21ec6afce10f185d9c1f60b

This example demonstrates a text-based bot connecting to a Mozilla Hubs room, logging presence updates and chat messages, and sending a greeting after a delay. It uses the ReticulumClient and HubState classes from the Hubs Discord Bot libraries to establish a Phoenix channel connection, while HubStats and PresenceRollups track room occupancy over time. The bot reads configuration from dotenv files and logs timestamped events to the console, showing real-time hub activity without any visual rendering.

UUtopiah

91% match

Loading thumbnail…

send commands to a Mozilla Hubs bot via chat

A Mozilla Hubs bot listens to chat messages and triggers actions when a user types a command. The example shows a "save" command that calls `pimvrSaveRemote("HubsTest", "testFromImportToolLibTris")` to save data. The bot runs in the browser and uses the `hubs_bot_command_via_chat.js` script, which loads the Mozilla Hubs library from `https://mozilla-hubs-lib.glitch.me/client.js`. It polls the chat log every 500 milliseconds by selecting `.Linkify` elements, reads the latest message and its author, and avoids repeating commands. The animation renders the bot's behavior in real time within the Hubs client.

UUtopiah

70% match

Loading thumbnail…

Gist 9e8c4fa996831859a1c099a9906f84e9

This example visualizes the presence of users in a Mozilla Hubs room over time by periodically sampling the room’s member list. It reads the DOM to extract each participant’s nickname and presence status, hashing names for privacy, and stores measurements in `localStorage`. The animation, driven by `setInterval`, appends timestamped snapshots every minute, enabling a temporal view of attendance and activity. The code relies on vanilla JavaScript DOM queries and the `hashCode` function, with no external charting library.

UUtopiah

70% match

Loading thumbnail…

Gist 8bf9375ef73d46b6c471c3ec2abae405

This visualization demonstrates how to automatically select the best available Hubs room from a public list, prioritizing rooms with space for new participants. It fetches room data from a Hubs API endpoint (`/api/v1/media/search`) and evaluates each room based on member count, lobby count, and room capacity, choosing one that is not full. The code uses the Fetch API to retrieve JSON data and iterates through the entries to find a suitable room URL, with a buffer of five slots to avoid overcrowding. The example highlights a practical approach to room balancing in shared virtual spaces.

UUtopiah

68% match

Loading thumbnail…

Gist 44d38c33dc9ab38f123530e4db1c49b8

This example shows a live console log of participant names appearing in a Hub’s presence log, capturing each new addition with a Unix timestamp. A `MutationObserver` watches the DOM node matching `[class^=presence-log]` and, on every child-list mutation, iterates over added nodes to print `Date.now()` and the node’s text content. The code relies solely on the browser’s native `MutationObserver` API, with no external libraries or rendering. It provides a minimal, text-based trace of when users join or appear in the chat, useful for auditing participation over time.

UUtopiah

68% match

Loading thumbnail…

Gist a0b28a0f9e9463498f93690d50c763eb

This example shows a cross-platform remote camera control system, where Twitch chat messages physically move the camera rig in a Mozilla Hubs virtual room. A MutationObserver on the Twitch chat log captures new messages and timestamps, storing them via a placeholder JSON store, while a polling loop in Hubs fetches that history and triggers panning animations toward a Google Poly burger model or resets the camera to its origin. The camera movement uses the A-Frame animation timeline and Three.js’s `object3D.position`, with the camera identity toggled by modifying the Hubs user profile display name.

UUtopiah

64% match

Loading thumbnail…

Gist b076c63afe4fb84322089c4f42d4c4ce

This example demonstrates how to fetch and display a web page’s Open Graph description as a text label inside a Mozilla Hubs virtual room, using A-Frame entities and the Fetch API with DOMParser. The code requests `/cloud`, parses the returned HTML for the `og:description` meta tag, and appends a networked A-Frame text element at a fixed position. Because the text is not integrated with Hubs’ NAF schemas, the label is visible only to the local user, not shared across participants.

UUtopiah

64% match

Loading thumbnail…

Gist 27b0eae72764e9e50963cdf7592e7849

This animation tracks avatar positions in a Mozilla Hubs virtual room over time. A JavaScript interval samples connected users every second, storing their networked IDs and Three.js position vectors in localStorage. The visualization reconstructs movement trails from these recorded snapshots, showing how participants navigate the shared 3D space. It uses the browser’s `setInterval` and `localStorage` APIs, with the Hubs network avatar attributes providing positional data for each connected client.

UUtopiah

64% match