The @ Commands

@ commands are a quick and easy way to do things while you are chatting.  Be it change your AV or throw some animation at someone or boot someone.  Some of these commands are available to everyone and some only to those that a room owner gives permissions to.  Here is a list of all the @ commands but keep coming by as more get added.

@VIDEO (requires video posting permissions)

@VIDEO PLAY [url] - Plays a video from the specified URL to all users or targeted user 

@VIDEO OFF - Turns off/stops video playback for all users

@PVIDEO

@PVIDEO PLAY [url] - Plays a private/premium video from the specified URL (requires special video permissions)

@PVIDEO OFF - Turns off private video playback

@BOOT  (requires boot permissions)

@BOOT [number of minutes] Handles booting/kicking users from the chat room.  Select a user and type the command

 @BOOT LIST shows a list booted users

@BOOT -1 IP unboots the person with that IP 

@AV Changes user's avatar/display name

@AV SIMPLE [Just the image URL] - Sets a simple image avatar

@AV [AV Code] - Sets custom avatar text/HTML

@CLEAR (requires can clear permissions)

Clears the chat screen for all users

@GLASS

Visual effect command that "shatters glass" on targeted user's screen 

@PIE

Fun command that "tosses a pie" at the targeted user 

@BLOB

Fun command that "squirts" the targeted user

@SPANK

Fun command that "spanks" the targeted user (moderator/special permissions required)

@SLIMER

Fun command that "summons Slimer to haunt" the targeted user

@TOSS Image_url

Fun command that "tosses an image" the targeted user

@NORMAL (requires special permissions)

Grants normal chat privileges to a user in restricted access rooms.  With this command you can temporarily grant regular chat access to your room when your room is in restricted mode.

@AUCTION (requires auction permissions)

@AUCTION START - Starts an auction in the main room 

@AUCTION CLEAN - Stops/cleans up an auction

@FONTSIZE

@FONTSIZE [number] - Changes font size for the user's display

@IMAGESIZE

@IMAGESIZE [number] - Changes image size for the user's display

@VOICE (requires special permissions)

@VOICE ON - Turns on voice system for the room

@VOICE OFF - Turns off voice system for the room

@VOICE DJ [user] - Sets a specific user as DJ with voice privileges turns off voice for everyone else.

Adding themes and a description for your room

Now you can add a description to your room from the Admin screen.  This allows you to change the description over time if you so choose to do so.  You can also select up to 3 themes for your room.  This will allow chatters to filter the onlinechatters and room page to find a room that fits a certain theme.

When you log onto the admin screen this will be the first section.  So its easy to find and quite self explanatory on how to use it.

Voice Communications

 Voice Chat Feature - User Guide

Overview

The voice chat feature allows users to share audio (microphone and system sounds) with other participants in real-time. Users can either share their voice or listen to others without sharing their own audio.

NOTE:  This is a peer to peer connection.  You are using DeviantLives only as a mechanism to meet and then trigger a voice call.  The voice call/communications once established is between you and who all you are sharing with.  No voice goes through the DeviantLives server.  You get to choose whether you wish to participate or not.

Admin Setup Instructions

Setting Up User Permissions

Room admins can decide which room members can control this feature.  In the admin screen where members/registered users are added there is now an option to "Control Voice."  For new members you can select Yes or No.  For existing members click on the existing selection or Yes or No and type Yes or No to change the permission.  Then click on Save at the bottom of the screen.

Once a member has permission to control voice, they can, in the room do the following:

1. Turn the voice feature on by typing @voice on
2. Turn the voice feature off by typing @voice off
3. Turn the DJ feature on by selecting a chatter and typing @voice dj  This will allow anyone to select listen but only the DJ will be able to talk and play content from their computer.  DJs should share content that is shareable and this is their responsibility.  DeviantLives has no visibility or knowledge of what is being shared.

User Instructions

This works only if the voice feature has been enabled by the room owner or someone who has the permissions to do so.

Accessing the Voice Panel

1. **Open Voice Panel**:

   - Look for the microphone icon (🎤) in the chat interface

   - Click the microphone icon to open the floating voice panel

   - The panel can be dragged around the screen for convenient positioning

Using Listen-Only Mode

**What it does**: Allows you to hear other users' audio without sharing your own microphone or system sounds.

**How to use**:

1. Click the **"Listen Only"** button in the voice panel

2. No browser permissions required

3. The button turns red when active

4. You'll see a 👂 icon next to your name in the active users list

5. Click **"Stop Listening"** to exit listen-only mode

**When to use**: Perfect for meetings, presentations, or when you want to hear others but not participate vocally.

Sharing Your Voice (Microphone)

**What it does**: Shares your microphone audio with all other voice participants in the room.

**How to use**:

1. Click the **"Share Voice"** button in the voice panel

2. Your browser will ask for microphone permission - click **"Allow"**

3. The button turns active and shows **"Stop Voice"**

4. You'll see a 🎤 icon next to your name in the active users list

5. Your voice will be heard by all users who are in voice or listen-only mode

6. Click **"Stop Voice"** to stop sharing your microphone

**Audio Quality**: The system automatically applies noise suppression and echo cancellation for clearer audio.

Sharing System Audio

**What it does**: Shares your computer's system sounds (music, videos, game audio, etc.) along with your microphone.

**Requirements**: 

- You must first enable voice sharing (microphone)

- Limited support on Safari and mobile browsers

**How to use**:

1. First click **"Share Voice"** and allow microphone access

2. Click the **"Share System Audio"** button

3. Your browser will ask for screen sharing permission - click **"Allow"**

4. Select a specific application, browser tab, or **"Entire Screen"** and make sure **"Share audio"** is checked.

5. The button turns active and shows **"Stop System Audio"**

6. Both your microphone and system sounds will be shared

7. Click **"Stop System Audio"** to stop sharing system sounds (microphone continues)

Important: Use headphones to prevent audio feedback when sharing system audio.

Understanding the Active Users List

The voice panel shows all active voice participants:

- **🎤 Username**: User is sharing their voice (microphone and possibly system audio)

- **👂 Username**: User is in listen-only mode (can hear but not sharing audio)

- **"No active voice users"**: Nobody is currently using voice features

Best Practices

1. **Use Headphones**: Especially important when sharing system audio to prevent echo and feedback

2. **Check Your Microphone**: Test your microphone before important conversations

3. **Manage Background Noise**: The system has noise suppression, but a quiet environment is still best

4. **Be Mindful of System Audio**: Only share system audio when relevant to avoid distracting others

5. **Leave Cleanly**: Voice connections automatically clean up when you leave the room

Troubleshooting

No Audio Being Heard

- Check that you've clicked "Listen Only" or "Share Voice"

- Verify your browser allowed microphone/audio permissions

- Check your computer's audio output settings

- Ensure other users are actually sharing voice

Others Can't Hear You

- Verify the "Share Voice" button is active (red)

- Check browser microphone permissions

- Test your microphone in other applications

- Try refreshing the page and re-enabling voice sharing

System Audio Not Working

- Ensure you selected "Entire Screen" with "Share audio" checked

- Try using Chrome or Firefox (better system audio support)

- Check that your system has audio playing

- Verify your operating system allows audio capture

Echo or Feedback

- Use headphones instead of speakers

- Lower your system volume

- Check that multiple users aren't sharing system audio simultaneously

Connection Issues

- Check your internet connection

- Try refreshing the page

- Ensure your firewall isn't blocking WebRTC connections

- Try a different browser

Browser Compatibility

- **Chrome/Edge**: Full support for all features ✅

- **Firefox**: Full support for all features ✅  

- **Safari**: Voice sharing works, limited system audio support ⚠️

- **Mobile Browsers**: Voice sharing only, no system audio ⚠️

Privacy and Security

- **User Control**: Only you can enable your microphone - no one can remotely activate it

- **Browser Security**: All permissions go through your browser's security system

- **Direct Connections**: Audio streams directly between users (peer-to-peer), not through servers

- **Room-Based**: Voice sharing only works within your current chat room

- **Session-Based**: Permissions reset when you close your browser

---

*This voice feature uses WebRTC technology for high-quality, low-latency audio communication directly between users' browsers.*

Some animated fun

In an effort to raise interaction between chatters I am adding some animated actions to the room.  This is in addition to posting emojis which are fun and expressive but are static in nature.  So far there are three animations.  This is still being tested out.  But here is how they work:

Glass Shatter Effect:  Select a chatter and then type @glass.  Alternatively select "All" and type @glass

Toss a Pie:  Select a chatter and then type @pie.  Alternatively select "All" and type @pie

Toss a "ummmm" blob:  Select a chatter and then type @blob.  Alternatively select "All" and type @blob

Slimer like ghost effect:  Select a chatter and then type @slimer.  Alternatively select "All" and type @slimer

NOTE:  Use this sparingly.  Not everyone has a super fast computer with high end graphics.  Excessive use of this feature may freeze some folk's browsers.  If I find excessive/abusive use of the feature I will and room owners will boot people.

Booting unwanted people

Room owners can give boot powers to trusted members.  If you are one of those trusted members to boot someone you select the person to be booted then type: @boot number_of_minutes (Room owner should have granted you permission to do so and you have to log in as a room member).

To un-boot someone first type @boot list  This will give you the list of people that have been booted and their IP.  To un-boot now type @boot -1 ip_ of_the_person

Posting videos in the room

To play a youtube video, first of all the room owner must give you permission to do so.  Once you are setup to do so, you must log in to the room.  Once in chat, make sure you select "All" (if you select a person then the video will play only for that person): @video play youtube_url (Room owner should have granted you permission to do so and you have to log in as a room member).  Youtube urls must be in one of three formats:

To play a single video.  Note the bold and colored part of the URL:  https://www.youtube.com/watch?v=87rhZTumujw

To play a youtube playlist.  This gets complicated.  Youtube has mixes and playlists.  A playlist is a fixed list of songs while a Mix is a list of songs based on some theme.  The other big difference is that when you play a playlist, then everyone gets the same song.  When you play a mix different people may get different songs. The URLs for the two are similar thus making this confusing.

For a playlist note the letters PL in the URL.  https://www.youtube.com/watch?list=PLn4GvABOzCQursVQ7qMU9CkNaKz4RgrVM

For a Mix note the letters RD in the URL.  https://www.youtube.com/watch?list=RDQMHIn4IannryI

Lookout for these subtle differences when you post a video or a playlist.

To toggle off the youtube screen: @video off (Room owner should have granted you permission to do so and you have to log in as a room member).

Designing your door page

 At DeviantLives you have a lot of artistic freedom on the design of your room door.  You can use a combination of HTML, CSS, and JavaScript to enhance the look and feel of your room door.

Lets start with some basics by providing a template for a simple room door where we add

1. Background color
2. Font color
3. A picture (centered)
4. A title (Centered)
5. Some Text (Centered)

<html>
<head>
<style>
body {
  background-color:black; /*background color for the entire page*/
  color:white;            /*font color for the entire page*/
}
h1 {
  color:red;             /*font color for the Heading*/
  font-weight:bold;      /*Making the Heading bold*/
}
/* Mobile Entry Page Styles */
@media (max-width: 768px) {
    body {
        font-size: 16px;
        padding: 20px 16px;
    }
    
    /* Mobile-friendly checkboxes */
    input[type="checkbox"] {
        width: 20px !important;
        height: 20px !important;
        margin-right: 8px !important;
    }
    
    /* Touch-friendly labels */
    label {
        display: flex !important;
        align-items: center !important;
        min-height: 44px !important;
        padding: 8px 0 !important;
        cursor: pointer !important;
        font-size: 16px !important;
    }
    
    /* Better buttons */
    .cssButton, input[type="submit"], input[type="button"] {
        min-height: 44px !important;
        min-width: 44px !important;
        font-size: 16px !important;
        padding: 12px 16px !important;
        border-radius: 8px !important;
        touch-action: manipulation !important;
    }
    
    /* Better text inputs */
    input[type="text"], input[type="password"] {
        font-size: 16px !important;
        padding: 12px !important;
        border-radius: 8px !important;
        min-height: 44px !important;
        box-sizing: border-box !important;
    }
    
    /* Focus indicators */
    input:focus, button:focus {
        outline: 2px solid #4CAF50 !important;
        outline-offset: 2px !important;
    }
}
</style>
</head>
<body>
<center>  <!-- In this case I want everything centered -->
<h1>
My Room Name or anything you want for this top line/heading.  Or simply remove this.
</h1>

 <!-- I may want an image or so -->
<br><img src="[Some image URL here]" />
<br><br><span>Here is some text and here are some rules for my room</span>
<span>

<br><br>
<br> Rule 1 
<br> Rule 2
</span>
</center>
</body>
</html>

This should get you started.  Here is an example of this code being used: Exp Lab