Welcome to the Massroom Docs! Here, you'll find comprehensive resources for building chatbots with pure vanilla JS and understanding massroom's functionality.
| Table of Contents |
|---|
| Source Code Documentation |
| Chat Commands Documentation |
| Chatbot Documentation |
Massroom’s core messaging system utilizes Xano’s realtime Websocket system, with a custom-built frontend.
This can help you when building chatbots in Massroom.
Use the displayMessages(message) function to display messages in the messageList HTML
varclientMessage;// code to handle message generationdisplayMessage(clientMessage);Leverage Xano’s API to send messages, considered public messages visible to all subscribed users. Note that sensitive information, like account details, should not be sent via this method. For example:
var clientSendMessage;
mainChannel.message(clientSentMessage);
// use mainChannel for the main chatroom
/help: Lists available commands (private bot reply)
/help about: Returns the about us section for Massroom (private bot reply)
/help text: Provides a guide on sending HTML over the input bar (private bot reply)
/help account: Displays account details without navigating to the dashboard (private bot reply)
/help faq: Currently under development
/ai ask *question here*: Returns a response from the AI (private bot reply)
/ai story *story topic here*: Generates a story from the AI (private bot reply)
Here you’ll find a quick-start guide on creating your very own Massroom Chatbots! First, you’ll need a Github account if you don’t already have one, then head to our Github Repo and fork it. Under the directory /js/bots/ create a file and give it a name that represents your bot, it must be in camelCase.
There are many ways to init a chatbot but the most common one is when a user clicks the send button. You’ll need to assign a variable to the input value too! An example is shown below:
// init botfunctionbotName(){// code}Tip: the user’s sent message is stored as a message variable!
// inside the functionconstmessage=messageInput.value;if(message==='/command'){// do something}if(message.startsWith('/command text')){constmessage=messageInput.value;consttext=message.slice('/command text'.length).trim();;// slice off the front part// do something};Massroom uses the Puter.ai js library to integrate AI chatbots in the chatrooms.
//from the main chatroom's chatbot codeconstquestion=message.slice('/ai ask'.length).trim();varresponse;//ensure the user is notifiedmainChannel.message(`<p style="color: #af9cff;">System Bot: Preparing response...</p>`)//refer to the puter.ai docs for moreputer.ai.chat(question+context,{model: "gpt-5.4-nano"}).then(response=>{//displaying the message in the chatmainChannel.message(`<p style="color: #af9cff;">System Bot: ${response}</p>`);});Locate the _data folder and edit the file scripts.yml, add:
- name: Bot Namepath: js/bots/fileName.jsTo ensure your bot is visible in the chatbot directory, go to search.json @ the root of the repo, then add:
{
"name": "Bot Name",
"description": "Bot Desc",
"init": "/helpcommand for your bot",
"author": "Your alias, username etc."
},Lastly, go to /js/bot.js and add the function you defined earlier!
Now with the fork you have of our repo, simply open a Pull Request for that branch and after review (up to 7 days), we will merge the PR and your bot will be in Massroom!