mirror of
https://github.com/eliasstepanik/vdo.ninja.git
synced 2026-01-15 07:38:32 +00:00
Merge pull request #1036 from steveseguin/Screenshare-Buttons-fixed
Screenshare buttons fixed
This commit is contained in:
Steve Seguin
GitHub
commit
fe99027641
159
lib.js
159
lib.js
@ -2389,24 +2389,17 @@ function nextQueue(){
|
||||
if (!session.queue){return;}
|
||||
if (!session.director){return;}
|
||||
if (session.queueList.length==0){
|
||||
getById("queuebutton").classList.add("float2");
|
||||
getById("queuebutton").classList.add("red");
|
||||
getById("queuebutton").classList.remove("float");
|
||||
setTimeout(function(){
|
||||
getById("queuebutton").classList.add("float");
|
||||
getById("queuebutton").classList.remove("float2");
|
||||
getById("queuebutton").classList.remove("red");
|
||||
},50);
|
||||
return;
|
||||
}
|
||||
var nextStream = session.queueList.shift();
|
||||
|
||||
|
||||
getById("queuebutton").classList.add("float2");
|
||||
getById("queuebutton").classList.remove("float");
|
||||
getById("queuebutton").classList.add("red");
|
||||
setTimeout(function(){
|
||||
getById("queuebutton").classList.add("float");
|
||||
getById("queuebutton").classList.remove("float2");
|
||||
getById("queuebutton").classList.remove("red");
|
||||
},200);
|
||||
|
||||
updateQueue();
|
||||
@ -3457,16 +3450,17 @@ function updateMixer(e=false){
|
||||
|
||||
function updateMixerRun(e=false){ // this is the main auto-mixing code. It's a giant function that runs when there are changes to screensize, video track statuses, etc.
|
||||
try {
|
||||
if (getById("subControlButtons").dragElement){
|
||||
if (parseInt(getById("subControlButtons").style.top) > 0){
|
||||
getById("subControlButtons").style.top = "0px";
|
||||
} else if (parseInt(getById("subControlButtons").style.top) < parseInt(50 - window.innerHeight) ){
|
||||
getById("subControlButtons").style.top = parseInt( 50 - window.innerHeight)+"px";
|
||||
}
|
||||
if (parseInt(getById("subControlButtons").style.left) < 0){
|
||||
getById("subControlButtons").style.left = "0px";
|
||||
} else if (parseInt(getById("subControlButtons").style.left) > parseInt( window.innerWidth - getById("subControlButtons").offsetWidth) ){
|
||||
getById("subControlButtons").style.left = parseInt( window.innerWidth -getById("subControlButtons").offsetWidth )+"px";
|
||||
let controlButtons = getById("subControlButtons");
|
||||
if (controlButtons.dragElement){
|
||||
if (parseInt(controlButtons.style.top) > 53-parseInt(controlButtons.clientHeight)){
|
||||
controlButtons.style.top = parseInt(53 - controlButtons.clientHeight)+"px";
|
||||
} else if (parseInt(controlButtons.style.top) < parseInt(53 - window.innerHeight) ){
|
||||
controlButtons.style.top = parseInt( 53 - window.innerHeight)+"px";
|
||||
}
|
||||
if (parseInt(controlButtons.style.left) < 0){
|
||||
controlButtons.style.left = "0px";
|
||||
} else if (parseInt(controlButtons.style.left) > parseInt( window.innerWidth - controlButtons.offsetWidth) ){
|
||||
controlButtons.style.left = parseInt( window.innerWidth - controlButtons.offsetWidth )+"px";
|
||||
}
|
||||
}
|
||||
|
||||
@ -5650,8 +5644,6 @@ eventer(messageEvent, function(e) { // this listens for child IFRAMES.
|
||||
session.screenShareElement = false;
|
||||
|
||||
updateMixer();
|
||||
getById("screenshare2button").classList.add("float");
|
||||
getById("screenshare2button").classList.remove("float2");
|
||||
}
|
||||
}
|
||||
} else if (e.data.action == "video-loaded") {
|
||||
@ -10318,11 +10310,8 @@ function toggleMute(apply = false, event=false) { // TODO: I need to have this b
|
||||
if (session.muted == false) {
|
||||
session.muted = true;
|
||||
getById("mutetoggle").className = "las la-microphone-slash toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
getById("mutebutton").classList.remove("float");
|
||||
getById("mutebutton").classList.add("float2");
|
||||
getById("mutebutton").classList.add("red");
|
||||
getById("mutebutton").classList.add("puslate");
|
||||
if (!(session.cleanOutput)){
|
||||
getById("mutebutton").classList.add("red", "pulsate");
|
||||
getById("header").classList.add('red');
|
||||
|
||||
if (session.localMuteElement){
|
||||
@ -10346,11 +10335,7 @@ function toggleMute(apply = false, event=false) { // TODO: I need to have this b
|
||||
getById("mutetoggle").className = "las la-microphone toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
|
||||
getById("mutebutton").classList.add("float");
|
||||
getById("mutebutton").classList.remove("float2");
|
||||
getById("mutebutton").classList.remove("red");
|
||||
getById("mutebutton").classList.remove("puslate");
|
||||
|
||||
getById("mutebutton").classList.remove("red", "pulsate");
|
||||
getById("header").classList.remove('red');
|
||||
|
||||
if (session.localMuteElement){
|
||||
@ -10412,7 +10397,7 @@ function toggleSpeakerMute(apply = false) { // TODO: I need to have this be MUTE
|
||||
session.speakerMuted = true;
|
||||
getById("mutespeakertoggle").className = "las la-volume-mute toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
getById("mutespeakerbutton").className = "float2 red";
|
||||
getById("mutespeakerbutton").className = "float red";
|
||||
}
|
||||
var sounds = document.getElementsByTagName("video");
|
||||
|
||||
@ -10527,7 +10512,7 @@ function toggleChat(event = null) { // TODO: I need to have this be MUTE, toggle
|
||||
});
|
||||
session.chat = true;
|
||||
getById("chattoggle").className = "las la-comment-dots toggleSize";
|
||||
getById("chatbutton").className = "float2";
|
||||
getById("chatbutton").className = "float";
|
||||
getById("chatModule").style.display = "block";
|
||||
getById("chatInput").focus(); // give it keyboard focus
|
||||
} else {
|
||||
@ -10677,8 +10662,8 @@ function toggleVideoMute(apply = false) { // TODO: I need to have this be MUTE,
|
||||
session.videoMuted = true;
|
||||
getById("mutevideotoggle").className = "las la-video-slash toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
getById("mutevideobutton").className = "float2 red";
|
||||
getById("header").classList.add("red2");
|
||||
getById("mutevideobutton").className = "float red";
|
||||
getById("header").classList.add("red");
|
||||
if (session.remoteVideoMuted){
|
||||
getById("head8").classList.remove("hidden");
|
||||
}
|
||||
@ -10693,7 +10678,7 @@ function toggleVideoMute(apply = false) { // TODO: I need to have this be MUTE,
|
||||
getById("mutevideotoggle").className = "las la-video toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
getById("head8").classList.remove("hidden");
|
||||
getById("header").classList.add("red2");
|
||||
getById("header").classList.add("red");
|
||||
getById("mutevideobutton").className = "float";
|
||||
}
|
||||
if (session.streamSrc) {
|
||||
@ -10708,7 +10693,7 @@ function toggleVideoMute(apply = false) { // TODO: I need to have this be MUTE,
|
||||
getById("mutevideotoggle").className = "las la-video toggleSize";
|
||||
if (!(session.cleanOutput)){
|
||||
getById("mutevideobutton").className = "float";
|
||||
getById("header").classList.remove("red2");
|
||||
getById("header").classList.remove("red");
|
||||
}
|
||||
if (session.streamSrc) {
|
||||
session.streamSrc.getVideoTracks().forEach((track) => {
|
||||
@ -10801,8 +10786,7 @@ async function toggleSettings(forceShow = false) { // TODO: I need to have this
|
||||
}
|
||||
|
||||
getById("popupSelector").style.display = "inline-block"
|
||||
getById("settingsbutton").classList.add("float2");
|
||||
getById("settingsbutton").classList.remove("float");
|
||||
getById("settingsbutton").classList.add("brown");
|
||||
|
||||
loadTFLITEImages() // only triggers if effects==5 is true
|
||||
|
||||
@ -10819,8 +10803,8 @@ async function toggleSettings(forceShow = false) { // TODO: I need to have this
|
||||
|
||||
getById("popupSelector").style.right = "-400px";
|
||||
|
||||
getById("settingsbutton").classList.add("float");
|
||||
getById("settingsbutton").classList.remove("float2");
|
||||
|
||||
getById("settingsbutton").classList.remove("brown");
|
||||
setTimeout(function() {
|
||||
getById("popupSelector").style.display = "none";
|
||||
}, 200);
|
||||
@ -10876,14 +10860,13 @@ function hangup2() {
|
||||
getById("mutevideobutton").classList.add("hidden");
|
||||
getById("screenshare2button").classList.add("hidden");
|
||||
|
||||
getById("screensharebutton").classList.add("float");
|
||||
getById("screensharebutton").classList.remove("float2");
|
||||
getById("screensharebutton").classList.remove("green");
|
||||
|
||||
if (session.showDirector == false) {
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable"> enable director`s microphone or video<br />(only guests can see this feed)</span></button>';
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float green" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable"> enable director`s microphone or video<br />(only guests can see this feed)</span></button>';
|
||||
miniTranslate(getById("miniPerformer"));
|
||||
} else {
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable-2"> enable director`s microphone or video</span></button>';
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float green" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable-2"> enable director`s microphone or video</span></button>';
|
||||
}
|
||||
getById("miniPerformer").className = "";
|
||||
}
|
||||
@ -11668,7 +11651,7 @@ async function directTimer(ele, event=false) { // A directing room only is cont
|
||||
log("directTimer");
|
||||
var msg = {};
|
||||
ele.classList.remove("blue");
|
||||
ele.classList.remove("red2");
|
||||
ele.classList.remove("red");
|
||||
if (!event || (!((event.ctrlKey) || (event.metaKey)))) {
|
||||
if (ele.value == 0 || ele.value == 2) {
|
||||
var getTime = await promptAlt("Time to set count down timer", false, false, parseInt(getById("overlayClockContainer").dataset.initial), true);
|
||||
@ -11676,7 +11659,7 @@ async function directTimer(ele, event=false) { // A directing room only is cont
|
||||
getById("overlayClockContainer").dataset.initial = parseInt(getTime);
|
||||
ele.value = 1;
|
||||
ele.classList.add("pressed");
|
||||
ele.classList.remove("red2");
|
||||
ele.classList.remove("red");
|
||||
msg.setClock = getTime;
|
||||
msg.showClock = true;
|
||||
msg.startClock = true;
|
||||
@ -11685,7 +11668,7 @@ async function directTimer(ele, event=false) { // A directing room only is cont
|
||||
} else if (ele.value == 3) {
|
||||
ele.value = 1;
|
||||
msg.resumeClock = true;
|
||||
ele.classList.add("red2");
|
||||
ele.classList.add("red");
|
||||
} else {
|
||||
ele.value = 2;
|
||||
ele.classList.remove("pressed");
|
||||
@ -11702,7 +11685,7 @@ async function directTimer(ele, event=false) { // A directing room only is cont
|
||||
} else if (ele.value == 3) {
|
||||
ele.value = 1;
|
||||
msg.resumeClock = true;
|
||||
ele.classList.add("red2");
|
||||
ele.classList.add("red");
|
||||
}
|
||||
}
|
||||
|
||||
@ -11800,7 +11783,7 @@ async function directRoomTimer(ele, event=false) { // A directing room only is
|
||||
log("directGlobalRoomTimer");
|
||||
var msg = {};
|
||||
ele.classList.remove("blue");
|
||||
ele.classList.remove("red2");
|
||||
ele.classList.remove("red");
|
||||
|
||||
getById("overlayClockContainer").style.fontSize = "50px";
|
||||
|
||||
@ -11812,7 +11795,7 @@ async function directRoomTimer(ele, event=false) { // A directing room only is
|
||||
getById("overlayClockContainer").dataset.initial = getTime;
|
||||
ele.value = 1;
|
||||
ele.classList.add("pressed");
|
||||
ele.classList.remove("red2");
|
||||
ele.classList.remove("red");
|
||||
|
||||
session.roomTimer = Date.now()/1000 + getTime;
|
||||
|
||||
@ -11834,7 +11817,7 @@ async function directRoomTimer(ele, event=false) { // A directing room only is
|
||||
} else {
|
||||
session.roomTimer = Date.now()/1000 - session.roomTimer;
|
||||
}
|
||||
ele.classList.add("red2");
|
||||
ele.classList.add("red");
|
||||
} else {
|
||||
ele.value = 2;
|
||||
ele.classList.remove("pressed");
|
||||
@ -11872,7 +11855,7 @@ async function directRoomTimer(ele, event=false) { // A directing room only is
|
||||
session.roomTimer = Date.now()/1000 - session.roomTimer;
|
||||
}
|
||||
|
||||
ele.classList.add("red2");
|
||||
ele.classList.add("red");
|
||||
}
|
||||
}
|
||||
if (ele.dataset.UUID){
|
||||
@ -11893,17 +11876,17 @@ function updateRemoteTimerButton(UUID, currentTime) {
|
||||
time = time * -1;
|
||||
var minutes = Math.floor(time / 60);
|
||||
var seconds = time - minutes * 60;
|
||||
elements[0].classList.add("red2");
|
||||
elements[0].classList.add("red");
|
||||
elements[0].innerHTML = '<i class="las la-clock"></i> -' + (minutes) + "m : " + zpadTime(seconds) + "s";
|
||||
} else {
|
||||
var minutes = Math.floor(time / 60);
|
||||
var seconds = time - minutes * 60;
|
||||
elements[0].classList.remove("red2");
|
||||
elements[0].classList.remove("red");
|
||||
elements[0].innerHTML = '<i class="las la-clock"></i> ' + (minutes) + "m : " + zpadTime(seconds) + "s";
|
||||
}
|
||||
} else {
|
||||
elements[0].classList.remove("pressed");
|
||||
elements[0].classList.remove("red2");
|
||||
elements[0].classList.remove("red");
|
||||
elements[0].innerHTML = '<i class="las la-clock"></i><span data-translate="create-timer"> Create Timer</span>';
|
||||
}
|
||||
}
|
||||
@ -12658,7 +12641,7 @@ async function publishScreen() {
|
||||
getById("recordLocalbutton").className = "float";
|
||||
}
|
||||
if (session.screensharebutton) {
|
||||
getById("screensharebutton").className = "float2";
|
||||
getById("screensharebutton").className = "float";
|
||||
}
|
||||
getById("controlButtons").classList.remove("hidden");
|
||||
getById("helpbutton").style.display = "inherit";
|
||||
@ -12689,7 +12672,7 @@ async function publishScreen() {
|
||||
|
||||
if (session.screensharebutton === true) {
|
||||
getById("controlButtons").classList.remove("hidden");
|
||||
getById("screensharebutton").className = "float2";
|
||||
getById("screensharebutton").className = "float";
|
||||
}
|
||||
|
||||
if (session.hangupbutton === true){
|
||||
@ -15383,14 +15366,14 @@ async function createRoomCallback(passAdd, passAdd2) {
|
||||
}
|
||||
|
||||
if (session.showDirector == false) {
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable"> enable director`s microphone or video<br />(only guests can see this feed)</span></button>';
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float green" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable"> enable director`s microphone or video<br />(only guests can see this feed)</span></button>';
|
||||
miniTranslate(getById("miniPerformer"));
|
||||
getById("grabDirectorSoloLink").dataset.raw = "https://" + location.host + location.pathname + "?solo&sd&r=" + session.roomid + "&v="+session.streamID + passAdd2 + wss + token;
|
||||
getById("grabDirectorSoloLink").href = "https://" + location.host + location.pathname + "?solo&sd&r=" + session.roomid + "&v="+session.streamID + passAdd2 + wss + token;
|
||||
getById("grabDirectorSoloLink").innerText = "https://" + location.host + location.pathname + "?solo&sd&r=" + session.roomid + "&v="+session.streamID + passAdd2 + wss + token;
|
||||
getById("grabDirectorSoloLinkParent").classList.remove("hidden");
|
||||
} else {
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable-2"> enable director`s microphone or video</span></button>';
|
||||
getById("miniPerformer").innerHTML = '<button id="press2talk" onmousedown="event.preventDefault(); event.stopPropagation();" class="float green" onclick="press2talk(true);" title="You can also enable the director`s Video Output afterwards by clicking the Setting`s button"><i class="las la-headset"></i><span data-translate="push-to-talk-enable-2"> enable director`s microphone or video</span></button>';
|
||||
}
|
||||
getById("miniPerformer").className = "";
|
||||
|
||||
@ -17904,8 +17887,7 @@ function gotDevices2(deviceInfos) {
|
||||
notifyOfScreenShare();
|
||||
//session.refreshScale();
|
||||
}
|
||||
getById("screensharebutton").classList.add("float");
|
||||
getById("screensharebutton").classList.remove("float2");
|
||||
getById("screensharebutton").classList.remove("green");
|
||||
}
|
||||
|
||||
};
|
||||
@ -19104,10 +19086,8 @@ async function toggleScreenShare(reload = false) { ////////////////////////////
|
||||
session.screenShareState = true;
|
||||
|
||||
notifyOfScreenShare();
|
||||
|
||||
|
||||
getById("screensharebutton").classList.add("float2");
|
||||
getById("screensharebutton").classList.remove("float");
|
||||
|
||||
getById("screensharebutton").classList.add("green");
|
||||
enumerateDevices().then(gotDevices2).then(function() {});
|
||||
|
||||
pokeIframeAPI("screen-share-state", true);
|
||||
@ -19125,8 +19105,7 @@ async function toggleScreenShare(reload = false) { ////////////////////////////
|
||||
|
||||
//session.refreshScale();
|
||||
|
||||
getById("screensharebutton").classList.add("float2");
|
||||
getById("screensharebutton").classList.remove("float");
|
||||
getById("screensharebutton").classList.add("green");
|
||||
enumerateDevices().then(gotDevices2).then(function() {});
|
||||
|
||||
//if (session.videoElement.readyState!==4){
|
||||
@ -19193,6 +19172,7 @@ async function toggleScreenShare(reload = false) { ////////////////////////////
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (session.streamSrcClone){
|
||||
session.streamSrcClone.getVideoTracks().forEach(function(track) {
|
||||
if (beforeScreenShare && (track.id == beforeScreenShare.id)){
|
||||
@ -19214,9 +19194,8 @@ async function toggleScreenShare(reload = false) { ////////////////////////////
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
getById("screensharebutton").classList.add("float"); // disable the button after we know the tracks are disabled
|
||||
getById("screensharebutton").classList.remove("float2");
|
||||
|
||||
getById("screensharebutton").classList.remove("green");
|
||||
|
||||
if (beforeScreenShare){
|
||||
if (addedAlready==false){
|
||||
@ -19812,8 +19791,8 @@ async function grabScreen(quality = 0, audio = true, videoOnEnd = false) {
|
||||
|
||||
notifyOfScreenShare();
|
||||
|
||||
getById("screensharebutton").classList.add("float");
|
||||
getById("screensharebutton").classList.remove("float2");
|
||||
|
||||
getById("screensharebutton").classList.remove("green");
|
||||
|
||||
if (videoOnEnd == true) {
|
||||
if (beforeScreenShare) {
|
||||
@ -22748,7 +22727,7 @@ function addDownloadLink(fileList, UUID, pc){
|
||||
}
|
||||
|
||||
if (session.chat == false) {
|
||||
getById("chattoggle").className = "las la-comments toggleSize puslate";
|
||||
getById("chattoggle").className = "las la-comments toggleSize pulsate";
|
||||
getById("chatbutton").className = "float";
|
||||
|
||||
if (getById("chatNotification").value) {
|
||||
@ -24462,7 +24441,7 @@ function updateDirectorsAudio(dataN, UUID) {
|
||||
label.id = "label_" + i + "_"+n + "_"+UUID;
|
||||
label.htmlFor = "constraints_" + i + "_"+n + "_"+UUID;
|
||||
label.innerText = capitalizeFirstLetter(i).replace(/([a-z])([A-Z])/g, '$1 $2') + ":";
|
||||
label.style = "display:inline-block; padding:0;;";
|
||||
label.style = "display:inline-block; padding:0;";
|
||||
label.dataset.keyname = i;
|
||||
label.dataset.track = n;
|
||||
var input = document.createElement("select");
|
||||
@ -27573,8 +27552,7 @@ function createIframePopup() {
|
||||
session.screenShareElement.parentNode.removeChild(session.screenShareElement);
|
||||
session.screenShareElement = false;
|
||||
updateMixer();
|
||||
getById("screenshare2button").classList.add("float");
|
||||
getById("screenshare2button").classList.remove("float2");
|
||||
getById("screenshare2button").classList.remove("green");
|
||||
return;
|
||||
}
|
||||
|
||||
@ -27608,8 +27586,7 @@ function createIframePopup() {
|
||||
|
||||
updateMixer();
|
||||
|
||||
getById("screenshare2button").classList.add("float2");
|
||||
getById("screenshare2button").classList.remove("float");
|
||||
getById("screenshare2button").classList.add("green");
|
||||
|
||||
return; // ignore the rest.
|
||||
}
|
||||
@ -29451,7 +29428,7 @@ function getChatMessage(msg, label = false, director = false, overlay = false) {
|
||||
updateMessages();
|
||||
|
||||
if (session.chat == false) {
|
||||
getById("chattoggle").className = "las la-comments toggleSize puslate";
|
||||
getById("chattoggle").className = "las la-comments toggleSize pulsate";
|
||||
getById("chatbutton").className = "float";
|
||||
|
||||
if (getById("chatNotification").value) {
|
||||
@ -34863,16 +34840,13 @@ async function createSecondStream() { ////////////////////////////
|
||||
|
||||
session.screenShareElement.srcObject = session.screenStream;
|
||||
|
||||
getById("screensharebutton").classList.remove("float");
|
||||
getById("screensharebutton").classList.add("float2");
|
||||
getById("screensharebutton").classList.add("green");
|
||||
getById("screensharebutton").title = miscTranslations["stop-screen-sharing"];
|
||||
|
||||
getById("screenshare2button").classList.remove("float");
|
||||
getById("screenshare2button").classList.add("float2");
|
||||
getById("screenshare2button").classList.add("green");
|
||||
getById("screenshare2button").title = miscTranslations["stop-screen-sharing"];
|
||||
|
||||
getById("screenshare3button").classList.remove("float");
|
||||
getById("screenshare3button").classList.add("float2");
|
||||
getById("screenshare3button").classList.add("green");
|
||||
getById("screenshare3button").title = miscTranslations["stop-screen-sharing"];
|
||||
|
||||
|
||||
@ -34972,16 +34946,13 @@ function stopSecondScreenshare(){
|
||||
session.screenStream = false;
|
||||
session.screenShareState = false;
|
||||
|
||||
getById("screenshare2button").classList.remove("float2");
|
||||
getById("screenshare2button").classList.add("float");
|
||||
getById("screensharebutton").classList.remove("green");
|
||||
getById("screensharebutton").title = miscTranslations["share-a-screen"];
|
||||
|
||||
getById("screenshare2button").classList.remove("green");
|
||||
getById("screenshare2button").title = miscTranslations["share-a-screen"];
|
||||
|
||||
getById("screensharebutton").classList.remove("float2");
|
||||
getById("screensharebutton").classList.add("float");
|
||||
getById("screensharebutton").title = miscTranslations["share-a-screen"];
|
||||
|
||||
getById("screenshare3button").classList.remove("float2");
|
||||
getById("screenshare3button").classList.add("float");
|
||||
getById("screenshare3button").classList.remove("green");
|
||||
getById("screenshare3button").title = miscTranslations["share-a-screen"];
|
||||
pokeIframeAPI("screen-share-state", false);
|
||||
|
||||
|
||||
142
main.css
142
main.css
@ -248,6 +248,12 @@ button.hint {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
|
||||
/* #screenshare3button.green{
|
||||
animation: pulse 5s infinite;
|
||||
} */
|
||||
|
||||
/* Clicked buttons overwrite */
|
||||
.red {
|
||||
background-color: #840000 !important;
|
||||
}
|
||||
@ -255,13 +261,32 @@ button.hint {
|
||||
background-color: #b30c0c !important;
|
||||
}
|
||||
|
||||
.red2 {
|
||||
background-color: #840000 !important;
|
||||
.green {
|
||||
background-color: #64c04d !important;
|
||||
}
|
||||
|
||||
.green:hover {
|
||||
background-color: #76c762 !important;
|
||||
}
|
||||
|
||||
.blue {
|
||||
background-color: #000084 !important;
|
||||
background-color: #161699 !important;
|
||||
}
|
||||
|
||||
.blue:hover {
|
||||
background-color: #2727bb !important;
|
||||
}
|
||||
|
||||
.brown {
|
||||
background-color: #8d6418 !important;
|
||||
}
|
||||
|
||||
.brown:hover {
|
||||
background-color: #a06d10 !important;
|
||||
}
|
||||
|
||||
/* ///////////////////// */
|
||||
|
||||
.orange {
|
||||
background-color: #673100 !important;
|
||||
}
|
||||
@ -270,14 +295,14 @@ button.hint {
|
||||
background-color: #5c7785 !important;
|
||||
}
|
||||
|
||||
button.red {
|
||||
/* button.red {
|
||||
-webkit-app-region: no-drag;
|
||||
padding: 10px;
|
||||
margin: 10px 0px;
|
||||
cursor: pointer;
|
||||
border-radius: 2px;
|
||||
color: white;
|
||||
}
|
||||
} */
|
||||
|
||||
button {
|
||||
-webkit-app-region: no-drag;
|
||||
@ -834,7 +859,7 @@ hr {
|
||||
font-size: 12px;
|
||||
margin: 10px 0 0 0;
|
||||
}
|
||||
.puslate {
|
||||
.pulsate {
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 0 rgba(14, 19, 26, 1);
|
||||
transform: scale(1);
|
||||
@ -1182,12 +1207,13 @@ button.glyphicon-button.active.focus {
|
||||
position: fixed;
|
||||
z-index: 995;
|
||||
bottom: 0px;
|
||||
border: 0;
|
||||
min-height: 52px;
|
||||
pointer-events: none;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 60px;
|
||||
border: 0;
|
||||
pointer-events: none;
|
||||
transform-origin: bottom; /* Keeps it at bottom even if scaled */
|
||||
}
|
||||
#controlButtons:empty {
|
||||
display: none;
|
||||
@ -1195,14 +1221,17 @@ button.glyphicon-button.active.focus {
|
||||
|
||||
#subControlButtons {
|
||||
display: flex;
|
||||
border-radius: 38px;
|
||||
position: absolute;
|
||||
background-color: var(--discord-grey-0);
|
||||
box-shadow: 0px 0px 10px rgba(0,0,0,1);
|
||||
top: -10px;
|
||||
position: absolute;
|
||||
pointer-events: auto;
|
||||
border: #cccccc22 1px solid;
|
||||
border-radius: 10px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
bottom: 3px;
|
||||
min-width: 230px;
|
||||
}
|
||||
|
||||
#subControlButtons:empty{
|
||||
@ -1250,8 +1279,8 @@ button.glyphicon-button.active.focus {
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 640px){
|
||||
#subControlButtons {
|
||||
transform: scale(0.9) translateY(10%);
|
||||
#controlButtons {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
.labelSmall {
|
||||
@ -1279,16 +1308,16 @@ button.glyphicon-button.active.focus {
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 400px){
|
||||
#subControlButtons {
|
||||
transform: scale(0.8) translateY(20%);
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 300px){
|
||||
#subControlButtons {
|
||||
padding: 0px;
|
||||
#controlButtons {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
}
|
||||
@media only screen and (max-width: 300px){
|
||||
#controlButtons {
|
||||
transform: scale(0.7);
|
||||
}
|
||||
}
|
||||
|
||||
.orange{
|
||||
background-color: #8d5e1a
|
||||
@ -1333,34 +1362,19 @@ button.btnArmTransferRoom.selected{
|
||||
}
|
||||
|
||||
@media only screen and (max-height: 540px){
|
||||
#subControlButtons {
|
||||
transform: scale(0.88);
|
||||
}
|
||||
#gridlayout>#container.vidcon {
|
||||
height:88%
|
||||
}
|
||||
#controlButtons {
|
||||
height:54px;
|
||||
}
|
||||
#copythisurl {
|
||||
font-size:80%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-height: 500px){
|
||||
#subControlButtons {
|
||||
transform: scale(0.87);
|
||||
}
|
||||
#gridlayout>#container.vidcon {
|
||||
height:87%
|
||||
}
|
||||
#controlButtons {
|
||||
height:54px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-height: 400px){
|
||||
#subControlButtons {
|
||||
transform: scale(0.85);
|
||||
}
|
||||
#logoname{
|
||||
display:none;
|
||||
}
|
||||
@ -1374,7 +1388,7 @@ button.btnArmTransferRoom.selected{
|
||||
height:85%
|
||||
}
|
||||
#controlButtons {
|
||||
height:50px;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
#header{
|
||||
min-height:0px;
|
||||
@ -1384,12 +1398,6 @@ button.btnArmTransferRoom.selected{
|
||||
#gridlayout>#container.vidcon {
|
||||
height:81%
|
||||
}
|
||||
#subControlButtons {
|
||||
transform: scale(0.81);
|
||||
}
|
||||
#controlButtons {
|
||||
height:46.2px;
|
||||
}
|
||||
#head2 {
|
||||
display:none !important;
|
||||
}
|
||||
@ -1399,45 +1407,27 @@ button.btnArmTransferRoom.selected{
|
||||
#gridlayout>#container.vidcon {
|
||||
height:78%
|
||||
}
|
||||
#subControlButtons {
|
||||
transform: scale(0.77);
|
||||
}
|
||||
#controlButtons {
|
||||
height:46.2px;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
@media only screen and (max-height: 190px){
|
||||
#gridlayout>#container.vidcon {
|
||||
height:75%
|
||||
}
|
||||
#subControlButtons {
|
||||
transform: scale(0.73);
|
||||
}
|
||||
#controlButtons {
|
||||
height:42px
|
||||
}
|
||||
}
|
||||
@media only screen and (max-height: 160px){
|
||||
#gridlayout>#container.vidcon {
|
||||
height:70%
|
||||
}
|
||||
#subControlButtons {
|
||||
transform: scale(0.65);
|
||||
}
|
||||
#controlButtons {
|
||||
height:38px
|
||||
transform: scale(0.7);
|
||||
}
|
||||
}
|
||||
@media only screen and (max-height: 120px){
|
||||
#gridlayout>#container.vidcon {
|
||||
height:70%
|
||||
}
|
||||
#subControlButtons {
|
||||
transform: scale(0.52);
|
||||
}
|
||||
#controlButtons {
|
||||
height:30px
|
||||
}
|
||||
}
|
||||
|
||||
#header:empty{
|
||||
@ -1679,12 +1669,6 @@ select{
|
||||
background-color:#ddeeff;
|
||||
}
|
||||
|
||||
.green {
|
||||
background-color:#474!important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#effectSelector{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
@ -1976,16 +1960,7 @@ input[type=range]:focus::-ms-fill-upper {
|
||||
.tooltip:hover .tooltiptext {
|
||||
visibility: visible;
|
||||
}
|
||||
#screensharebutton.float2{
|
||||
background-color: #335c3a;
|
||||
}
|
||||
#screenshare2button.float2{
|
||||
background-color: #335c3a;
|
||||
}
|
||||
#screenshare3button.float2{
|
||||
background-color: #2bf96e88;
|
||||
animation: pulse 5s infinite;
|
||||
}
|
||||
|
||||
#previewWebcam.miconly {
|
||||
display:none;
|
||||
}
|
||||
@ -2333,8 +2308,8 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
.float {
|
||||
opacity: 0.8;
|
||||
min-width: 45px;
|
||||
height: 45px;
|
||||
background-color: #66b16a66;
|
||||
min-height: 45px;
|
||||
height: 100%;
|
||||
box-shadow: 1px 1px 3px rgba(0,0,0,0.75);
|
||||
color: #FFF;
|
||||
border-radius: 8px;
|
||||
@ -2342,11 +2317,13 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
margin: 5px;
|
||||
pointer-events: auto;
|
||||
outline:none;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
.float2 {
|
||||
opacity: 0.8;
|
||||
min-width: 45px;
|
||||
height: 45px;
|
||||
min-height: 45px;
|
||||
height: 100%;
|
||||
background-color: #8888;
|
||||
box-shadow: 1px 1px 3px rgba(0,0,0,0.75);
|
||||
color: #FFF;
|
||||
@ -2356,6 +2333,7 @@ span[data-action-type="stats-graphs-details-container"]>span{
|
||||
margin: 5px;
|
||||
pointer-events: auto;
|
||||
outline:none;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
|
||||
.rotate225 {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user