Fix bug in mute user modal
This commit is contained in:
parent
f2629ecb06
commit
98bf0d9e84
49
src/App.vue
49
src/App.vue
|
@ -1374,28 +1374,8 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (mute) {
|
// Common callback handler after the confirmation box.
|
||||||
this.modalConfirm({
|
const callback = () => {
|
||||||
title: `Mute ${username}`,
|
|
||||||
icon: "fa fa-comment-slash",
|
|
||||||
message: `Do you want to mute ${username}? If muted, you will no longer see their ` +
|
|
||||||
`chat messages or any DMs they send you going forward. Also, ${username} will ` +
|
|
||||||
`not be able to see whether your webcam is active until you unmute them.`,
|
|
||||||
}).then(() => {
|
|
||||||
this.muted[username] = true;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.modalConfirm({
|
|
||||||
title: `Un-mute ${username}`,
|
|
||||||
icon: "fa fa-comment",
|
|
||||||
message: `Do you want to remove your mute on ${username}? If you un-mute them, you ` +
|
|
||||||
`will be able to see their chat messages or DMs going forward, but most importantly, ` +
|
|
||||||
`they may be able to watch your webcam now if you are broadcasting!`,
|
|
||||||
}).then(() => {
|
|
||||||
delete this.muted[username];
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Hang up videos both ways.
|
// Hang up videos both ways.
|
||||||
this.closeVideo(username);
|
this.closeVideo(username);
|
||||||
|
|
||||||
|
@ -1409,6 +1389,31 @@ export default {
|
||||||
`You have unmuted <strong>${username}</strong> and can see their chat messages from now on.`,
|
`You have unmuted <strong>${username}</strong> and can see their chat messages from now on.`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (mute) {
|
||||||
|
this.modalConfirm({
|
||||||
|
title: `Mute ${username}`,
|
||||||
|
icon: "fa fa-comment-slash",
|
||||||
|
message: `Do you want to mute ${username}? If muted, you will no longer see their ` +
|
||||||
|
`chat messages or any DMs they send you going forward. Also, ${username} will ` +
|
||||||
|
`not be able to see whether your webcam is active until you unmute them.`,
|
||||||
|
}).then(() => {
|
||||||
|
this.muted[username] = true;
|
||||||
|
callback();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.modalConfirm({
|
||||||
|
title: `Un-mute ${username}`,
|
||||||
|
icon: "fa fa-comment",
|
||||||
|
message: `Do you want to remove your mute on ${username}? If you un-mute them, you ` +
|
||||||
|
`will be able to see their chat messages or DMs going forward, but most importantly, ` +
|
||||||
|
`they may be able to watch your webcam now if you are broadcasting!`,
|
||||||
|
}).then(() => {
|
||||||
|
delete this.muted[username];
|
||||||
|
callback();
|
||||||
|
});
|
||||||
|
}
|
||||||
},
|
},
|
||||||
sendMute(username, mute) {
|
sendMute(username, mute) {
|
||||||
this.client.send({
|
this.client.send({
|
||||||
|
|
|
@ -43,7 +43,10 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1>Help & Support</h1>
|
<h1 id="help">
|
||||||
|
Help & Support
|
||||||
|
<a href="#help" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="#tour">Tour of the user interface</a></li>
|
<li><a href="#tour">Tour of the user interface</a></li>
|
||||||
|
@ -54,7 +57,10 @@
|
||||||
<li><a href="#troubleshooting">Troubleshooting</a></li>
|
<li><a href="#troubleshooting">Troubleshooting</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h1 id="tour">Tour of the user interface</h1>
|
<h1 id="tour">
|
||||||
|
Tour of the user interface
|
||||||
|
<a href="#tour" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<div class="has-text-centered mb-4">
|
<div class="has-text-centered mb-4">
|
||||||
<img src="/static/img/screenshot.png" width="1269" height="582" alt="Screenshot of the user interface on desktop">
|
<img src="/static/img/screenshot.png" width="1269" height="582" alt="Screenshot of the user interface on desktop">
|
||||||
|
@ -200,9 +206,15 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1 id="features">Feature Highlights</h1>
|
<h1 id="features">
|
||||||
|
Feature Highlights
|
||||||
|
<a href="#features" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<h3 id="emoji-reactions">Emoji Reactions</h3>
|
<h3 id="emoji-reactions">
|
||||||
|
Emoji Reactions
|
||||||
|
<a href="#emoji-reactions" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
You may add emoji reactions to chat messages by clicking on the
|
You may add emoji reactions to chat messages by clicking on the
|
||||||
|
@ -218,7 +230,10 @@
|
||||||
reaction by clicking on it.
|
reaction by clicking on it.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>Muting spammy users</h3>
|
<h3 id="mute">
|
||||||
|
Muting spammy users
|
||||||
|
<a href="#mute" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
If somebody on chat is bothering you, you may <strong>mute</strong> their messages by clicking
|
If somebody on chat is bothering you, you may <strong>mute</strong> their messages by clicking
|
||||||
|
@ -244,7 +259,10 @@
|
||||||
session (until you log off).
|
session (until you log off).
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3 id="markdown">Styling Your Messages</h3>
|
<h3 id="markdown">
|
||||||
|
Styling Your Messages
|
||||||
|
<a href="#markdown" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
BareRTC supports Markdown syntax for your chat messages. You can make text <strong>bold</strong>
|
BareRTC supports Markdown syntax for your chat messages. You can make text <strong>bold</strong>
|
||||||
|
@ -264,9 +282,15 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1 id="video-sharing">Video Sharing How-To's</h1>
|
<h1 id="video-sharing">
|
||||||
|
Video Sharing How-To's
|
||||||
|
<a href="#video-sharing" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<h3 id="webcam">About webcam sharing</h3>
|
<h3 id="webcam">
|
||||||
|
About webcam sharing
|
||||||
|
<a href="#webcam" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
The WebRTC technology used by this chat room allows for direct, <strong>peer to peer</strong>
|
The WebRTC technology used by this chat room allows for direct, <strong>peer to peer</strong>
|
||||||
|
@ -293,7 +317,10 @@
|
||||||
way so that they may be banned from the chat room.
|
way so that they may be banned from the chat room.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>How do I go on video?</h3>
|
<h3 id="broadcast">
|
||||||
|
How do I go on video?
|
||||||
|
<a href="#broadcast" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
To share your webcam, click on the green
|
To share your webcam, click on the green
|
||||||
|
@ -326,14 +353,20 @@
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>How do I stop my camera?</h3>
|
<h3 id="stop-webcam">
|
||||||
|
How do I stop my camera?
|
||||||
|
<a href="#stop-webcam" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
When you are broadcasting, the red "<i class="fa fa-stop"></i> Stop" button at the top of the
|
When you are broadcasting, the red "<i class="fa fa-stop"></i> Stop" button at the top of the
|
||||||
page will turn your camera off.
|
page will turn your camera off.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>How do I mute my camera's microphone?</h3>
|
<h3 id="mute-microphone">
|
||||||
|
How do I mute my camera's microphone?
|
||||||
|
<a href="#mute-microphone" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
The button to <i class="fa fa-mute"></i> Mute will be at the top of the page next to the
|
The button to <i class="fa fa-mute"></i> Mute will be at the top of the page next to the
|
||||||
|
@ -341,7 +374,10 @@
|
||||||
your own webcam video preview to toggle the mute that way. Either button works!
|
your own webcam video preview to toggle the mute that way. Either button works!
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>How do I see who is watching me?</h3>
|
<h3 id="watching">
|
||||||
|
How do I see who is watching me?
|
||||||
|
<a href="#watching" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
You may click on the <button type="button" class="button is-small is-info is-outlined ml-1 px-1">
|
You may click on the <button type="button" class="button is-small is-info is-outlined ml-1 px-1">
|
||||||
|
@ -355,7 +391,10 @@
|
||||||
You may also click on the <i class="fa fa-eye"></i> Watching tab in the Who's Online list.
|
You may also click on the <i class="fa fa-eye"></i> Watching tab in the Who's Online list.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>How do I stop somebody from watching me?</h3>
|
<h3 id="boot">
|
||||||
|
How do I stop somebody from watching me?
|
||||||
|
<a href="#boot" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
On the Who's Online list, click on the <i class="fa fa-eye"></i> Watching tab to see who
|
On the Who's Online list, click on the <i class="fa fa-eye"></i> Watching tab to see who
|
||||||
|
@ -379,9 +418,64 @@
|
||||||
sure that you have booted them!
|
sure that you have booted them!
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<h3 id="video-size">
|
||||||
|
How do I make videos larger on my screen?
|
||||||
|
<a href="#video-size" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
There are a few methods available to change the size of videos on the chat room,
|
||||||
|
depending on whether your device has a mouse cursor or is a touch screen (such as a tablet).
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Options that may work with all devices (with mouse or touch screen):
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
Chat Settings: by clicking on the blue menu button on the top-right corner of the page, the
|
||||||
|
Display tab has a "Video size" dropdown with some options to change the size of all videos
|
||||||
|
open on your screen.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
On wide screens (such as an iPad in landscape orientation): when you have videos open, look
|
||||||
|
for the <i class="fa fa-magnifying-glass-plus"></i> <i class="fa fa-magnifying-glass-minus"></i>
|
||||||
|
buttons in the header just above the video dock. Clicking on these buttons will scale the docked
|
||||||
|
videos larger or smaller (in similar increments as the Chat Settings dropdown).
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
If you are on a device with a mouse cursor, such as a desktop or a laptop with a touchpad, there
|
||||||
|
are a couple of ways to resize individual videos how you see fit:
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
When videos are docked in the top of the page, hover your mouse over the bottom-right corner
|
||||||
|
of a video. It should show a 'resize' cursor, and you can click and drag from the bottom-right
|
||||||
|
corner to resize the video.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Videos can also be "popped out" of the dock at the top of the page. The pop-out button appears
|
||||||
|
on top of videos, next to the mute audio button. When popped out, you can drag videos anywhere
|
||||||
|
on the page and you can resize them by dragging from any edge except the top.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
And finally: you can put a video "full screen" too. In the control buttons at the bottom of each
|
||||||
|
video (beginning with the mute audio button), the one on the right will toggle the video into a
|
||||||
|
full screen view.
|
||||||
|
</p>
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1 id="browsers">Supported Browsers</h1>
|
<h1 id="browsers">
|
||||||
|
Supported Browsers
|
||||||
|
<a href="#browsers" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
All features of the chat room, including webcam sharing, should generally work on all current
|
All features of the chat room, including webcam sharing, should generally work on all current
|
||||||
|
@ -391,7 +485,10 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1 id="privacy">Privacy</h1>
|
<h1 id="privacy">
|
||||||
|
Privacy
|
||||||
|
<a href="#privacy" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Some of the privacy considerations with this chat room include:
|
Some of the privacy considerations with this chat room include:
|
||||||
|
@ -438,15 +535,24 @@
|
||||||
|
|
||||||
<hr>
|
<hr>
|
||||||
|
|
||||||
<h1 id="troubleshooting">Troubleshooting</h1>
|
<h1 id="troubleshooting">
|
||||||
|
Troubleshooting
|
||||||
|
<a href="#troubleshooting" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
This section contains some troubleshooting advice for issues commonly experienced in the chat room.
|
This section contains some troubleshooting advice for issues commonly experienced in the chat room.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h2>Webcam Sharing</h2>
|
<h2 id="webcam-troubleshooting">
|
||||||
|
Webcam Sharing
|
||||||
|
<a href="#webcam-troubleshooting" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h2>
|
||||||
|
|
||||||
<h3>Permission Denied, or NotAllowedError</h3>
|
<h3 id="NotAllowedError">
|
||||||
|
Permission Denied, or NotAllowedError
|
||||||
|
<a href="#NotAllowedError" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
If you see an error message from <strong class="has-text-danger">ChatClient</strong> that says
|
If you see an error message from <strong class="has-text-danger">ChatClient</strong> that says
|
||||||
|
@ -555,7 +661,10 @@
|
||||||
<li>For more information, try: <a href="https://support.microsoft.com/en-us/windows/manage-app-permissions-for-your-camera-in-windows-87ebc757-1f87-7bbf-84b5-0686afb6ca6b">https://support.microsoft.com/en-us/windows/manage-app-permissions-for-your-camera-in-windows-87ebc757-1f87-7bbf-84b5-0686afb6ca6b</a></li>
|
<li>For more information, try: <a href="https://support.microsoft.com/en-us/windows/manage-app-permissions-for-your-camera-in-windows-87ebc757-1f87-7bbf-84b5-0686afb6ca6b">https://support.microsoft.com/en-us/windows/manage-app-permissions-for-your-camera-in-windows-87ebc757-1f87-7bbf-84b5-0686afb6ca6b</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>Other Webcam Errors</h3>
|
<h3 id="other-webcam-errors">
|
||||||
|
Other Webcam Errors
|
||||||
|
<a href="#other-webcam-errors" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
The most common error is a Permission Error as described above, but there are some less common
|
The most common error is a Permission Error as described above, but there are some less common
|
||||||
|
@ -587,7 +696,10 @@
|
||||||
be the <a href="https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia">Mozilla documentation for getUserMedia.</a>
|
be the <a href="https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia">Mozilla documentation for getUserMedia.</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<h3>Other peoples' webcams don't load</h3>
|
<h3 id="webcam-not-loading">
|
||||||
|
Other peoples' webcams don't load
|
||||||
|
<a href="#webcam-not-loading" class="fa fa-paragraph is-size-6"></a>
|
||||||
|
</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
It may sometimes happen that you clicked to watch somebody else's webcam on chat, and their video doesn't
|
It may sometimes happen that you clicked to watch somebody else's webcam on chat, and their video doesn't
|
||||||
|
|
Loading…
Reference in New Issue
Block a user