mirror of
https://github.com/jech/galene.git
synced 2024-11-10 02:35:58 +01:00
Add Unshare button on each shared video and remove global unshare screen button
This commit is contained in:
parent
3ba2394be7
commit
b08a2e3943
3 changed files with 47 additions and 18 deletions
|
@ -478,7 +478,10 @@ textarea.form-reply {
|
|||
.top-video-controls {
|
||||
text-align: right;
|
||||
bottom: inherit;
|
||||
top: 5px;
|
||||
top: 0;
|
||||
line-height: 1.1;
|
||||
font-size: 1.3em;
|
||||
text-shadow: 1px 1px 2px rgb(90 86 86);
|
||||
}
|
||||
|
||||
.controls-button {
|
||||
|
@ -512,7 +515,7 @@ textarea.form-reply {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.video-controls span:last-child {
|
||||
.video-controls span:last-child, .top-video-controls span:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
|
@ -530,6 +533,10 @@ textarea.form-reply {
|
|||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
.video-controls .video-stop {
|
||||
color: #d03e3e;
|
||||
}
|
||||
|
||||
.video-controls span.disabled, .video-controls span.disabled:hover, .top-video-controls span.disabled:hover{
|
||||
opacity: .2;
|
||||
color: #c8c8c8
|
||||
|
@ -1233,6 +1240,10 @@ header .collapse {
|
|||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.top-video-controls {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
position: fixed;
|
||||
height: calc(var(--vh, 1vh) * 100 - 56px);
|
||||
|
|
|
@ -60,12 +60,6 @@
|
|||
<label>Share Screen</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div id="unsharebutton" class="invisible nav-link nav-button nav-cancel">
|
||||
<span><i class="fas fa-window-close" aria-hidden="true"></i></span>
|
||||
<label>Unshare Screen</label>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div id="stopvideobutton" class="invisible nav-link nav-button nav-cancel">
|
||||
<span><i class="fas fa-window-close" aria-hidden="true"></i></span>
|
||||
|
@ -265,6 +259,14 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="topvideocontrols-template" class="invisible">
|
||||
<div class="top-video-controls">
|
||||
<div class="controls-button controls-right">
|
||||
<span class="close-icon video-stop" title="Stop video">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/protocol.js" defer></script>
|
||||
<script src="/scripts/toastify.js" defer></script>
|
||||
|
|
|
@ -420,7 +420,6 @@ function setButtonsVisibility() {
|
|||
let connected = serverConnection && serverConnection.socket;
|
||||
let permissions = serverConnection.permissions;
|
||||
let local = !!findUpMedia('local');
|
||||
let share = !!findUpMedia('screenshare');
|
||||
let video = !!findUpMedia('video');
|
||||
let canWebrtc = !(typeof RTCPeerConnection === 'undefined');
|
||||
let canFile =
|
||||
|
@ -440,7 +439,6 @@ function setButtonsVisibility() {
|
|||
// allow multiple shared documents
|
||||
setVisibility('sharebutton', canWebrtc && permissions.present &&
|
||||
('getDisplayMedia' in navigator.mediaDevices));
|
||||
setVisibility('unsharebutton', share);
|
||||
|
||||
setVisibility('stopvideobutton', video);
|
||||
|
||||
|
@ -516,12 +514,6 @@ document.getElementById('sharebutton').onclick = function(e) {
|
|||
addShareMedia();
|
||||
};
|
||||
|
||||
document.getElementById('unsharebutton').onclick = function(e) {
|
||||
e.preventDefault();
|
||||
closeUpMediaKind('screenshare');
|
||||
resizePeers();
|
||||
};
|
||||
|
||||
document.getElementById('stopvideobutton').onclick = function(e) {
|
||||
e.preventDefault();
|
||||
closeUpMediaKind('video');
|
||||
|
@ -1428,10 +1420,18 @@ function addCustomControls(media, container, c) {
|
|||
|
||||
let template =
|
||||
document.getElementById('videocontrols-template').firstElementChild;
|
||||
let toptemplate =
|
||||
document.getElementById('topvideocontrols-template').firstElementChild;
|
||||
controls = cloneHTMLElement(template);
|
||||
controls.id = 'controls-' + c.localId;
|
||||
let topcontrols = cloneHTMLElement(toptemplate);
|
||||
topcontrols.id = 'topcontrols-' + c.localId;
|
||||
|
||||
let volume = getVideoButton(controls, 'volume');
|
||||
let stopsharing = getVideoButton(topcontrols, 'video-stop');
|
||||
if (c.kind !== "screenshare") {
|
||||
stopsharing.remove();
|
||||
}
|
||||
if(c.kind === 'local') {
|
||||
volume.remove();
|
||||
} else {
|
||||
|
@ -1440,8 +1440,9 @@ function addCustomControls(media, container, c) {
|
|||
getVideoButton(controls, "volume-slider"));
|
||||
}
|
||||
|
||||
container.appendChild(topcontrols);
|
||||
container.appendChild(controls);
|
||||
registerControlHandlers(media, container);
|
||||
registerControlHandlers(media, container, c);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -1474,8 +1475,9 @@ function setVolumeButton(muted, button, slider) {
|
|||
/**
|
||||
* @param {HTMLVideoElement} media
|
||||
* @param {HTMLElement} container
|
||||
* @param {Stream} c
|
||||
*/
|
||||
function registerControlHandlers(media, container) {
|
||||
function registerControlHandlers(media, container, c) {
|
||||
let play = getVideoButton(container, 'video-play');
|
||||
if(play) {
|
||||
play.onclick = function(event) {
|
||||
|
@ -1484,6 +1486,20 @@ function registerControlHandlers(media, container) {
|
|||
};
|
||||
}
|
||||
|
||||
let stop = getVideoButton(container, 'video-stop');
|
||||
if(stop) {
|
||||
stop.onclick = function(event) {
|
||||
event.preventDefault();
|
||||
try {
|
||||
c.close(true);
|
||||
delMedia(c.localId);
|
||||
} catch(e) {
|
||||
console.error(e);
|
||||
displayError(e);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
let volume = getVideoButton(container, 'volume');
|
||||
if (volume) {
|
||||
volume.onclick = function(event) {
|
||||
|
|
Loading…
Reference in a new issue