Merge pull request #239 from steveseguin/version-10.1

Release version 10.1
2026-05-01 11:05:24 +00:00 · 2020-08-23 02:59:00 -04:00 · 2020-08-23 02:55:13 -04:00 · 2020-08-18 22:15:15 -04:00 · 2020-08-18 21:49:36 -04:00 · 2020-07-27 04:08:41 -04:00
15 changed files with 3330 additions and 565 deletions
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@@ -3,4 +3,4 @@
 # Thank you <3 

 github: [steveseguin]
-
+custom: ["https://www.paypal.me/steveseguin", "buymeacoffee.com/steveseguin"]
--- a/animations.js
+++ b/animations.js
@@ -39,26 +39,46 @@ $(".column").on('click', function() {
 	styles += '}';

 	/* Add keyframe to CSS */
+	$("#lightbox-animations").empty();
 	$("#lightbox-animations").get(0).sheet.insertRule(styles, 0);

 	/* Hide the window scrollbar */
 	$("body").css('overflow', 'hidden');
 });

+
 /* Click on close button when full-screen */
 $(".close").on('click', function(e) {
-$(this).hide();
-$(".container-inner").hide();
-/* Window scrollbar normal */
-$("body").css('overflow', 'auto');
+	$(this).hide();
+	$(".container-inner").hide();
+	
+	$("body").css('overflow', 'auto');

-var bounding_box = $(this).parent().get(0).getBoundingClientRect();
-$(this).parent().css({ top: bounding_box.top + 'px', left: bounding_box.left + 'px' });
+	var bounding_box = $(this).parent().get(0).getBoundingClientRect();
+	$(this).parent().css({ top: bounding_box.top + 'px', left: bounding_box.left + 'px' });

-/* Show animation */
-$(this).parent().addClass('out-animation');
+	/* Show animation */
+	$(this).parent().addClass('out-animation');

-e.stopPropagation();
+
+	try{
+		
+		var oldstream = getById('previewWebcam').srcObject;
+		
+		if (oldstream){
+			log("old stream found");
+			oldstream.getTracks().forEach(function(track) {
+				track.stop();
+				oldstream.removeTrack(track);
+				log("stopping old track");
+			});
+		}
+		activatedPreview=false;
+	} catch (e){
+		errorlog(e);
+	}
+	log("Cleaned up Video");
+	e.stopPropagation();
 });

 /* On animationend : from normal to full screen & full screen to normal */
@@ -70,34 +90,77 @@ if(e.originalEvent.animationName == 'inlightbox') {
 }
 /* On animation end from full-screen to normal */
 else if(e.originalEvent.animationName == 'outlightbox') {
-/* Remove fixed positioning, remove animation rules */
-$(this).removeClass('in-animation').removeClass('out-animation').removeClass('columnfade');
+	/* Remove fixed positioning, remove animation rules */
+	$(this).removeClass('in-animation').removeClass('out-animation').removeClass('columnfade');

-/* Remove the empty container that was earlier added */
-$("#empty-container").remove();
+	/* Remove the empty container that was earlier added */
+	$("#empty-container").remove();

-/* Delete the dynamic keyframe rule that was earlier created */
-$("#lightbox-animations").get(0).sheet.deleteRule(0);
+	/* Delete the dynamic keyframe rule that was earlier created */
+	$("#lightbox-animations").get(0).sheet.deleteRule(0);
 }
 });

+
+$('#audioSource').on('mousedown touchend focusin focusout', function(e) {
+     var state = $('#multiselect-trigger').data('state') || 0;
+     if( state == 0 ) {
+        ////open the dropdown
+        $('#multiselect-trigger').data('state', '1').addClass('open').removeClass('closed');
+        $('#multiselect-trigger').find('.chevron').removeClass('bottom'); 
+        $('#multiselect-trigger').parent().find('.multiselect-contents').show();
+		$('#multiselect-trigger').parent().find('.multiselect-contents').find('input[type="checkbox"]').parent().show();;
+		$('#multiselect-trigger').parent().find('.multiselect-contents').find('input[type="checkbox"]').show();;
+    } 
+    // e.preventDefault();
+});
+
+$('#audioSource3').on('mousedown touchend focusin focusout', function(e) {
+     var state = $('#multiselect-trigger3').data('state') || 0;
+     if( state == 0 ) {
+        ////open the dropdown
+        $('#multiselect-trigger3').data('state', '1').addClass('open').removeClass('closed');
+        $('#multiselect-trigger3').find('.chevron').removeClass('bottom'); 
+        $('#multiselect-trigger3').parent().find('.multiselect-contents').show();
+		$('#multiselect-trigger3').parent().find('.multiselect-contents').find('input[type="checkbox"]').parent().show();;
+		$('#multiselect-trigger3').parent().find('.multiselect-contents').find('input[type="checkbox"]').show();;
+    } 
+    // e.preventDefault();
+});
 
 // multiselect dropdowns
-$('.multiselect-trigger').on('mousedown touchend focusin focusout', function(e) {
+$('#multiselect-trigger').on('mousedown touchend focusin focusout', function(e) {
    var state = $(this).data('state') || 0;
    if( state == 0 ) {
        // open the dropdown
        $(this).data('state', '1').addClass('open').removeClass('closed');
-        $(this).find('.fa').removeClass('fa-chevron-down').addClass('fa-chevron-up');
+        $(this).find('.chevron').removeClass('bottom');
        $(this).parent().find('.multiselect-contents').show();
 		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').parent().show();;
 		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').show();;
    } else {
        // close the dropdown
        $(this).data('state', '0').addClass('closed').removeClass('open');
-        $(this).find('.fa').removeClass('fa-chevron-up').addClass('fa-chevron-down');
-        //$(this).parent().find('.multiselect-contents').hide();
-		//$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').hide();
+        $(this).find('.chevron').addClass('bottom');
+		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').not(":checked").parent().hide();;
+		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').hide();;
+    } 
+    e.preventDefault();
+});
+// multiselect dropdowns
+$('#multiselect-trigger3').on('mousedown touchend focusin focusout', function(e) {
+    var state = $(this).data('state') || 0;
+    if( state == 0 ) {
+        // open the dropdown
+        $(this).data('state', '1').addClass('open').removeClass('closed');
+        $(this).find('.chevron').removeClass('bottom');
+        $(this).parent().find('.multiselect-contents').show();
+		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').parent().show();;
+		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').show();;
+    } else {
+        // close the dropdown
+        $(this).data('state', '0').addClass('closed').removeClass('open');
+        $(this).find('.chevron').addClass('bottom');
 		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').not(":checked").parent().hide();;
 		$(this).parent().find('.multiselect-contents').find('input[type="checkbox"]').hide();;
    } 
@@ -105,11 +168,5 @@ $('.multiselect-trigger').on('mousedown touchend focusin focusout', function(e)
 });


-// when no preference is checked, uncheck the others
-$('#multiselect1').on('change', function(e) {
-    if( $(this).is(':checked') ) {
-        $(this).parent().parent().find('input[type="checkbox"]').not('#multiselect1').prop('checked', false);
-    }
-    e.preventDefault();
-});
+
 
--- a/dock.html
+++ b/dock.html
@@ -138,9 +138,12 @@ function generateInvite(){
 			sendstr+="&quality=2";
 		}
 	}
-
-	sendstr = 'https://obs.ninja/?push=' + sid + sendstr;
-	viewstr = 'https://obs.ninja/?view=' + sid + viewstr + title;
+	
+	var href = window.location.href;
+	var dir = href.substring(0, href.lastIndexOf('/')) + "/";
+	
+	sendstr = dir+'?push=' + sid + sendstr;
+	viewstr = dir+'?view=' + sid + viewstr + title;
 	getById("container-setup").style.display="none";
 	getById("container-links").style.display="block";
 	
@@ -162,7 +165,7 @@ document.addEventListener("dragstart", event => {
 	var streamId = url.split('view=');
 	var label = url.split('label=');

-	url += '&layer-name=OBS.Ninja';
+	url += '&layer-name=OBSN';
 	if (streamId.length>1) url += ': ' + streamId[1].split('&')[0];
 	if (label.length>1) url += ' - ' + decodeURI(label[1].split('&')[0]);
 	
--- a/dual.html
+++ b/dual.html
@@ -0,0 +1,326 @@
+<html>
+<head><title>Dual Input</title>
+<style>
+body{
+	padding:0;
+	margin:0;
+}
+iframe {
+	border:0;
+	margin:0;
+	padding:0;
+	display:block;
+	margin:0px;
+	min-height: 420px;
+    min-width: 350px;
+    max-height: 720px;
+    max-width: 1280px;
+    float: left;
+    position: fixed;
+}
+
+#viewlink {
+	width:400px;
+}
+
+
+input{
+	padding:5px;
+	margin:5px;
+}
+button{
+	padding:5px;
+	margin:5px;
+	position:relative;
+	
+}
+
+.menu {
+	z-index: 10;
+	float:right;
+	right: 20px;
+	color: #fff;
+}
+
+.close {
+	background-color: #d33;
+    color: #fff;
+}
+
+.reload {
+	background-color: #0a0;
+	color: #fff;
+}
+
+.popup {
+  z-index: 9;
+  background-color: #f1f1f1;
+  border: 1px solid #d3d3d3;
+  text-align: center;
+	min-height: 420px;
+    min-width: 350px;
+    max-height: 720px;
+    max-width: 1280px;
+  scale: 0.5;
+}
+
+.popup {
+  position: absolute;
+  /*resize: both; !*enable this to css resize*! */
+  overflow: auto;
+}
+
+.popup-header {
+  cursor: move;
+  background-color: #2196f3;
+}
+
+
+
+.popup .resizer-right {
+  width: 5px;
+  height: 100%;
+  background: transparent;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  cursor: e-resize;
+}
+
+.popup .resizer-bottom {
+  width: 100%;
+  height: 5px;
+  background: transparent;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  cursor: n-resize;
+}
+
+.popup .resizer-both {
+  width: 5px;
+  height: 5px;
+  background: transparent;
+  z-index: 10;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  cursor: nw-resize;
+}
+
+
+/*NOSELECT*/
+
+.popup * {
+  -webkit-touch-callout: none; /* iOS Safari */
+  -webkit-user-select: none; /* Safari */
+  -khtml-user-select: none; /* Konqueror HTML */
+  -moz-user-select: none; /* Firefox */
+  -ms-user-select: none; /* Internet Explorer/Edge */
+  user-select: none; /* Non-prefixed version, currently
+                                  supported by Chrome and Opera */
+}
+
+</style>
+</head>
+<body>
+
+<input placeholder="Enter an OBS.Ninja Room Link" id="viewlink" />
+
+<button onclick="loadIframe();">Load URL</button>You can drag and resize the generated windows; multiple can be created.
+
+<div id="container"></div>
+
+<script>
+
+function initDragElement(popup){
+
+	var pos1 = 0,
+		pos2 = 0,
+		pos3 = 0,
+		pos4 = 0;
+
+	var elmnt = null;
+	var currentZIndex = 100; //TODO reset z index when a threshold is passed
+
+	var header = getHeader(popup);
+	var iframe = getIFrame(popup);
+
+	popup.onmousedown = function() {
+	  this.style.zIndex = "" + ++currentZIndex;
+	};
+
+	if (header) {
+	  header.parentPopup = popup;
+	  header.onmousedown = dragMouseDown;
+	}
+  
+
+  function dragMouseDown(e) {
+    elmnt = this.parentPopup;
+    elmnt.style.zIndex = "" + ++currentZIndex;
+
+    e = e || window.event;
+    // get the mouse cursor position at startup:
+    pos3 = e.clientX;
+    pos4 = e.clientY;
+    document.onmouseup = closeDragElement;
+    // call a function whenever the cursor moves:
+    document.onmousemove = elementDrag;
+  }
+
+  function elementDrag(e) {
+    if (!elmnt) {
+      return;
+    }
+
+    e = e || window.event;
+    // calculate the new cursor position:
+    pos1 = pos3 - e.clientX;
+    pos2 = pos4 - e.clientY;
+    pos3 = e.clientX;
+    pos4 = e.clientY;
+    // set the element's new position:
+    elmnt.style.top = elmnt.offsetTop - pos2 + "px";
+    elmnt.style.left = elmnt.offsetLeft - pos1 + "px";
+	
+	iframe.style.top = elmnt.offsetTop - pos2 + "px";
+	iframe.style.left = elmnt.offsetLeft - pos1 + "px";
+  }
+
+  function closeDragElement() {
+    /* stop moving when mouse button is released:*/
+    document.onmouseup = null;
+    document.onmousemove = null;
+  }
+
+  function getHeader(element) {
+    var headerItems = element.getElementsByClassName("popup-header");
+
+    if (headerItems.length === 1) {
+      return headerItems[0];
+    }
+
+    return null;
+  }
+  
+  function getIFrame(element) {
+    var headerItems = element.getElementsByTagName("iframe");
+
+    if (headerItems.length === 1) {
+      return headerItems[0];
+    }
+
+    return null;
+  }
+}
+
+function initResizeElement(p) {
+
+	var iframe = getIFrame(p);
+	var element = null;
+	var startX, startY, startWidth, startHeight;
+
+    var right = document.createElement("div");
+    right.className = "resizer-right";
+    p.appendChild(right);
+    right.addEventListener("mousedown", initDrag, false);
+    right.parentPopup = p;
+
+    var bottom = document.createElement("div");
+    bottom.className = "resizer-bottom";
+    p.appendChild(bottom);
+    bottom.addEventListener("mousedown", initDrag, false);
+    bottom.parentPopup = p;
+
+    var both = document.createElement("div");
+    both.className = "resizer-both";
+    p.appendChild(both);
+    both.addEventListener("mousedown", initDrag, false);
+    both.parentPopup = p;
+  
+
+  function initDrag(e) {
+    element = this.parentPopup;
+
+    startX = e.clientX;
+    startY = e.clientY;
+    startWidth = parseInt(
+      document.defaultView.getComputedStyle(element).width,
+      10
+    );
+    startHeight = parseInt(
+      document.defaultView.getComputedStyle(element).height,
+      10
+    );
+    document.documentElement.addEventListener("mousemove", doDrag, false);
+    document.documentElement.addEventListener("mouseup", stopDrag, false);
+	document.documentElement.addEventListener("click", stopDrag, false)
+  }
+
+  function doDrag(e) {
+	if (e.buttons==0){
+		stopDrag(e);
+		return false;
+	}
+  
+    element.style.width = startWidth + e.clientX - startX + "px";
+    element.style.height = startHeight + e.clientY - startY + "px";
+	
+	iframe.style.width = startWidth + e.clientX - startX + "px";
+	iframe.style.height = startHeight + e.clientY - startY + "px";
+  }
+
+  function stopDrag(e) {
+    document.documentElement.removeEventListener("mousemove", doDrag, false);
+    document.documentElement.removeEventListener("mouseup", stopDrag, false);
+  }
+
+  function getIFrame(element) {
+    var headerItems = element.getElementsByTagName("iframe");
+
+    if (headerItems.length === 1) {
+      return headerItems[0];
+    }
+
+    return null;
+  }
+}
+  
+function loadIframe(){
+
+	var iframeContainer = document.createElement("div");
+	iframeContainer.className="popup";
+	
+	var button = document.createElement("button");
+	button.innerHTML = "Move";
+	button.className = "popup-header menu";
+	iframeContainer.appendChild(button);
+	
+	var button = document.createElement("button");
+	button.innerHTML = "Close";
+	button.className = "menu close";
+	button.onclick = function(){iframe.contentWindow.postMessage({"close":true}, '*');iframe.parentNode.parentNode.removeChild(iframeContainer);}
+	iframeContainer.appendChild(button);
+	
+	var button = document.createElement("button");
+	button.innerHTML = "Reload";
+	button.className = "menu reload";
+	button.onclick = function(){iframe.contentWindow.postMessage({"reload":true}, '*');}
+	iframeContainer.appendChild(button);
+
+	var iframe = document.createElement("iframe");
+	iframe.allow="autoplay";
+	iframe.src = document.getElementById("viewlink").value || "https://obs.ninja";
+	iframeContainer.appendChild(iframe);
+	
+	document.getElementById("container").appendChild(iframeContainer);
+
+	initDragElement(iframeContainer);
+	initResizeElement(iframeContainer);
+	
+}
+
+</script>
+</body>
+</html>
--- a/iframe.html
+++ b/iframe.html
@@ -0,0 +1,209 @@
+<html>
+<head><title>IFRAME Example</title>
+<style>
+body{
+	padding:0;
+	margin:0;
+	background-color: rgb(253,253,253);
+}
+iframe {
+	border:0;
+	margin:0;
+	padding:0;
+	display:block;
+	margin:10px;
+	width:640px;
+	height:320px;
+}
+#viewlink {
+	width:400px;
+}
+#container {
+	display:block;
+	padding:0px;
+}
+input{
+	padding:5px;
+	margin:5px;
+}
+button{
+	padding:5px;
+	margin:5px;
+}
+</style>
+<script>
+
+function loadIframe(){
+	
+	var iframe = document.createElement("iframe");
+	var iframeContainer = document.createElement("div");
+	var iframesrc = document.getElementById("viewlink").value;
+	iframe.allow="autoplay;camera;microphone";
+	iframe.allowtransparency="true"
+
+	if (iframesrc==""){
+		iframesrc="https://obs.ninja/";
+	}
+
+	if (document.getElementById("clean").checked){
+		if (iframesrc.includes("?")){
+			iframesrc+='&';
+		} else {
+			iframesrc+='?';
+		}
+		iframesrc+="cleanoutput";
+	}
+	if (document.getElementById("transparent").checked){
+		if (iframesrc.includes("?")){
+			iframesrc+='&';
+		} else {
+			iframesrc+='?';
+		}
+		iframesrc+="transparent";
+	}
+	
+	if (document.getElementById("hidemenu").checked){
+		if (iframesrc.includes("?")){
+			iframesrc+='&';
+		} else {
+			iframesrc+='?';
+		}
+		iframesrc+="hidemenu";
+	}
+	
+	iframe.src = iframesrc;
+	
+	iframeContainer.appendChild(iframe);
+	
+	document.getElementById("container").appendChild(iframeContainer);
+	
+	
+		var button = document.createElement("button");
+		button.innerHTML = "Mute Speaker";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mute":true}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Un-Mute Speaker";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mute":false}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Toggle Speaker";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mute":"toggle"}, '*');}
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Mute Mic";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mic":false}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Un-Mute Mic";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mic":true}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Toggle Mic";
+		button.onclick = function(){iframe.contentWindow.postMessage({"mic":"toggle"}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Disconnect";
+		button.onclick = function(){iframe.contentWindow.postMessage({"close":true}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Low Bitrate";
+		button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":30}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "High Bitrate";
+		button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":5000}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Default Bitrate";
+		button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":-1}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Reload";
+		button.onclick = function(){iframe.contentWindow.postMessage({"reload":true}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "50% Volume";
+		button.onclick = function(){iframe.contentWindow.postMessage({"volume":0.5}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "100% Volume";
+		button.onclick = function(){iframe.contentWindow.postMessage({"volume":1.0}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Request Stats";
+		button.onclick = function(){iframe.contentWindow.postMessage({"getStats":true}, '*');};
+		iframeContainer.appendChild(button);
+		
+		
+		var button = document.createElement("button");
+		button.innerHTML = "Say Hello";
+		button.onclick = function(){iframe.contentWindow.postMessage({"sendChat":"Hello!"}, '*');};
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "previewWebcam()";
+		button.onclick = function(){iframe.contentWindow.postMessage({"function":"previewWebcam"}, '*');};  // publishScreen
+		iframeContainer.appendChild(button);
+		
+		var button = document.createElement("button");
+		button.innerHTML = "CLOSE IFRAME";
+		button.onclick = function(){iframeContainer.parentNode.removeChild(iframeContainer);};
+		iframeContainer.appendChild(button);
+		
+		
+		////////////  LISTEN FOR EVENTS
+	
+		var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
+		var eventer = window[eventMethod];
+		var messageEvent = eventMethod === "attachEvent" ? "onmessage" : "message";
+
+
+		/// If you have a routing system setup, you could have just one global listener for all iframes instead.
+		
+		eventer(messageEvent, function (e) {
+			if (e.source != iframe.contentWindow){return} // reject messages send from other iframes
+			
+			if ("stats" in e.data){
+				var outputWindow = document.createElement("outputWindow");
+				outputWindow.innerHTML = e.data.stats;
+				iframeContainer.appendChild(outputWindow);
+			}
+			
+			if ("gotChat" in e.data){
+				var outputWindow = document.createElement("outputWindow");
+				outputWindow.innerHTML = e.data.gotChat.msg;
+				outputWindow.style.border="1px dotted black";
+				iframeContainer.appendChild(outputWindow);
+			}
+		});
+		
+}
+
+</script>
+</head>
+<body>
+
+<input placeholder="Enter an OBS.Ninja View URL here" id="viewlink" />
+<button onclick="loadIframe();">ADD</button>
+<input type="checkbox" id="clean" checked>Clean Output
+<input type="checkbox" id="transparent" checked>Transparent
+<input type="checkbox" id="hidemenu">Hide Menu
+<div id="container">
+
+</div>
+</body>
+</html>
--- a/index.html
+++ b/index.html
@@ -1,5 +1,19 @@
 <html>
 	<head>
+		<script type="text/javascript">
+			//  MS Internet Explorer must not be given a chance to fail before I can give the user an error message.
+			try {
+				var msie = window.navigator.userAgent.indexOf("MSIE ");
+				if (msie>0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)){ // If MSIE or IE 11
+					alert("Internet Explorer is not supported.\n\nPlease consider using Google Chrome instead\n\nYou will be forwarded to the download page for Google Chrome now.");
+					console.error("INTERNET EXPLORER IS EVIL");
+					window.location = "https://www.google.com/chrome/";
+				}
+			} catch(e){
+				console.error(e);
+			}
+		
+		</script>
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		<meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
 		<meta content="utf-8" http-equiv="encoding" />
@@ -8,7 +22,7 @@
 		<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png" />
 		<link rel="icon" type="image/png" sizes="16x16" href="./images/favicon-16x16.png" />
 		<link rel="icon" href="./images/favicon.ico" />
-		<link itemprop="thumbnailUrl" href="./images/obsNinja_logo_full.png" />
+		<link itemprop="thumbnailUrl" href="//images/obsNinja_logo_full.png" />
 		<!-- Primary Meta Tags -->
 		<title>OBS.Ninja</title>
 		<meta name="title" content="OBS.Ninja" />
@@ -20,11 +34,11 @@
 		<meta property="og:url" content="https://obs.ninja/" />
 		<meta property="og:title" content="OBS.Ninja" />
 		<meta property="og:description" content="Bring live video from your smartphone, computer, or friends directly into OBS Studio. 100% free." />
-		<meta property="og:image" itemprop="image" content="./images/obsNinja_logo_full.png" />
+		<meta property="og:image" itemprop="image" content="https://obs.ninja/images/obsNinja_logo_full.png" />
 		<meta name="msapplication-TileImage" content="./images/obsNinja_logo_full.png" />
 		<meta property="og:image:type" content="image/png" />
-		<meta property="og:image:width" content="256" />
-		<meta property="og:image:height" content="256" />
+		<meta property="og:image:width" content="1200" />
+		<meta property="og:image:height" content="630" />
 		<!-- Twitter -->
 		<meta property="twitter:card" content="summary_large_image" />
 		<meta property="twitter:url" content="https://obs.ninja/" />
@@ -33,12 +47,12 @@
 		<meta property="twitter:image" content="./images/obsNinja_logo_full.png" />
 		<meta name="msapplication-TileColor" content="#da532c" />
 		<meta name="theme-color" content="#ffffff" />
-		<!-- <script src="//console.re/connector.js" data-channel="obsninjaalpha" id="consolerescript"></script> -->
+		<!--<script src="//console.re/connector.js" data-channel="obsninjaalpha" id="consolerescript"></script>-->
 		<link rel="stylesheet" href="./lineawesome/css/line-awesome.min.css">
 		<script type="text/javascript" src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
 		<script type="text/javascript" src="./thirdparty/qrcode.min.js"></script>
 		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
-		<link rel="stylesheet" href="./main.css" />
+		<link rel="stylesheet" href="./main.css?ver=10" />
 	</head>
 	<body id="main" class="cat">
 		<span itemprop="image" itemscope itemtype="image/png">
@@ -48,8 +62,8 @@
 		<span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject">
 			<link itemprop="url" href="./images/obsNinja_logo_full.png" />
 		</span>
-		<script language="javascript" type="text/javascript" src="./thirdparty/CodecsHandler.js?ver=5"></script>
-		<script language="javascript" type="text/javascript" src="./webrtc.js?ver=6"></script>
+		<script language="javascript" type="text/javascript" src="./thirdparty/CodecsHandler.js?ver=17"></script>
+		<script language="javascript" type="text/javascript" src="./webrtc.js?ver=33"></script>
 		<input id="zoomSlider" type="range" style="display: none;" />
 		<div id="header">
 			<a id="logoname" href="./" style="text-decoration: none; color: white; margin: 2px;">
@@ -57,8 +71,9 @@
 					<font id="qos">O</font>BS.Ninja 
 				</span>
 			</a>
-			<div id="head1" style="display: inline-block; position: relative;">
-				
+			<div id="head1" style="display: inline-block; padding:1px; position: relative;">
+				<input id="joinroomID" name="joinroomID" size="22" placeholder="Join by Room Name here" />
+				<button style="padding:1px;margin:0;" onclick="jumptoroom();">GO</button>
 			</div>
 			<div id="head3" style="display: inline-block;" class="advanced">
 				<font style="color: #888;" id="copythisurl"> &nbsp; 
@@ -70,7 +85,7 @@
                    onclick="popupMessage(event);copyFunction(this)"
                    class="task"
                    onmousedown="copyFunction(this)"
-                    style="font-weight: bold; color: #afa; cursor: grab; background-color: #0000; font-size: 115%; min-width: 300px; max-width: 800px;"
+                    style="font-weight: bold; color: #afa; cursor: grab; background-color: #0000; font-size: 115%; min-width: 335px; max-width: 800px;"
                />
 				<i class="las la-paperclip task" style="color: #DDD;" onclick="popupMessage(event);copyFunction(document.getElementById('reshare'));" onmouseover="this.style.cursor='pointer'"></i>
 			</div>
@@ -90,31 +105,38 @@
 			
 		</div>
 		<div id="controlButtons">
+			<div id="chatbutton" title="Toggle the Chat" onclick="toggleChat()" class="advanced float" style="cursor: pointer;" alt="Toggle the Chat">
+				<i id="chattoggle" class="toggleSize las la-comment-alt my-float"></i>
+				<div id="chatNotification"></div>
+			</div>
 			<div id="mutebutton" title="Mute the Mic" onclick="toggleMute()" class="advanced float" style="cursor: pointer;" alt="Toggle the mic">
 				<i id="mutetoggle" class="toggleSize las la-microphone my-float"></i>
 			</div>
 			<div id="mutevideobutton" title="Disable the Camera" onclick="toggleVideoMute()" class="advanced float" style="cursor: pointer;" alt="Toggle the camera">
 				<i id="mutevideotoggle" class="toggleSize las la-eye my-float"></i>
 			</div>
-			<div
-                id="helpbutton"
-				title="Show Help Info" 
-                onclick="alert('Email steve@seguin.email if the system breaks or check https://reddit.com/r/obsninja for support.\n\nThere are some advanced options hidden away, such as persistent stream links and custom resolutions; see the Wiki.')"
-                class="advanced float"
-                style="cursor: pointer;"
-                alt="How to Use This with OBS"
-            >
-				<i class="toggleSize las la-question-circle my-float"></i>
+			<div id="settingsbutton" title="Settings" onclick="toggleSettings(this)" class="advanced float" style="cursor: pointer;" alt="Toggle the Settings Menu">
+				<i id="settingstoggle" class="toggleSize las la-cog my-float"></i>
 			</div>
 			<div id="hangupbutton" title="Hangup the Call" onclick="hangup()" class="advanced float" style="cursor: pointer;" alt="Disconnect and End">
 				<i class="toggleSize my-float las la-phone rotate225" aria-hidden="true"></i>
 			</div>
+			
 		</div>
+		<span
+                id="helpbutton"
+				title="Show Help Info" 
+                onclick="alert('Email steve@seguin.email if the system breaks or check https://reddit.com/r/obsninja for support.\n\nThere are some advanced options hidden away, such as persistent stream links and custom resolutions; see the Wiki.')"
+                style="cursor: pointer; display:none;"
+                alt="How to Use This with OBS"
+            >
+				<i class="las la-question-circle " style="float: right; bottom: 0px; cursor: pointer; position: fixed; right: 24px; color: #d9e4eb; padding: 2px; margin: 2px 2px 0 0; font-size: 140%;"></i>
+		</span>
 		<span title="Language Options" onclick="toggle(document.getElementById('languages'));" id="translateButton">
-			<i style="float: right; bottom: 0px; cursor: pointer; position: fixed; right: 10px; color: #d9e4eb; padding: 0; margin: 2px 2px 0 0; font-size: 140%;" class="las la-language" aria-hidden="true"></i>
+			<i style="float: right; bottom: 0px; cursor: pointer; position: fixed; right: 2px; color: #d9e4eb; padding: 2px; margin: 2px 2px 0 0; font-size: 140%;" class="las la-language" aria-hidden="true"></i>
 		</span>
 		<div id="mainmenu" class="row" style="opacity: 0; align: center;">
-			<div id="container-1" class="column columnfade" style="background-color: #ddd; overflow-y: auto;">
+			<div id="container-1" class="column columnfade" style=" overflow-y: auto;">
 				<h2>
 					<span data-translate="add-group-chat">Add Group Chat to OBS</span>
 				</h2>
@@ -147,8 +169,8 @@
 					<br />
 					<button onclick="toggle(document.getElementById('roomnotes'),this);">
 						<span data-translate="show-tips">Show me some tips..</span>
-					</button>
-					<ul style="padding: 10px; margin: auto auto; max-width: 500px; display: none; text-align: left;" id="roomnotes">
+					</button><br />
+					<ul style=" margin: auto auto; max-width: 500px; display: none; text-align: left;" id="roomnotes">
 						<br />
 						<span data-translate="added-notes">
 							<u>
@@ -168,32 +190,32 @@
 					</div>
 				</div>
 			</div>
-			<div id="container-3" class="column columnfade" onclick="previewWebcam()" style="background-color: #ddd; overflow-y: auto;">
+			<div id="container-3" class="column columnfade" onclick="previewWebcam()" style=" overflow-y: auto;">
 				<h2 id="add_camera">
 					<span data-translate="add-your-camera">Add your Camera to OBS</span>
 				</h2>
 				<div class="container-inner">
 					<br />
 					<p>
-						<video id="previewWebcam" oncanplay="updateStats();" muted controls autoplay playsinline style="max-width: 640px; max-width: 83vw; max-height: 30vh;"></video>
+						<video id="previewWebcam" class="previewWebcam" oncanplay="updateStats();"  disablePictureInPicture controlsList="nodownload" muted autoplay playsinline ></video>
 					</p>
 					<div id="infof"></div>
 					<button onclick="publishWebcam()" id="gowebcam" class="gowebcam" disabled>
 						<span data-translate="waiting-for-camera">Waiting for Camera to Load</span>
 					</button>
 					<br />
-					<span style="background-color: #f3f3f3; display: inline-block; padding: 5px 10px; border: 1px solid #ccc; vertical-align: middle;">
-						<span data-translate="video-source">Video source</span>:
+					<span id="videoMenu" class="videoMenu">
+						<i class="las la-video"></i><span data-translate="video-source"> Video Source </span>
                        
-						<select id="videoSource" style="background-color: #FFF; padding:5px; display: display:inline-block;vertical-align: middle;"></select>
+						<select id="videoSource" ></select>
 						<span id="gear_webcam" style="display: inline-block;" onclick="toggle(document.getElementById('videoSettings'));">
                            &nbsp;&nbsp;
-							<i class="las la-cog" style="font-size: 170%; vertical-align: middle;" aria-hidden="true"></i>
+							<i class="las la-cog" style="font-size: 140%; vertical-align: middle;" aria-hidden="true"></i>
 						</span>
 					</span>
 					<br />
 					<center>
-						<span id="videoSettings" style="margin: auto auto; display: none; background-color: #f3f3f3; max-width: 500px; padding: 10px 0; margin: 0 0 5px 0;">
+						<span id="videoSettings" style="display: none;">
 							<form id="webcamquality">
 								<input type="radio" id="fullhd" name="resolution" value="0" />
 								<label for="fullhd">
@@ -212,16 +234,16 @@
 								<div id="webcamstats" style="padding: 5px 0 0 0;"></div>
 							</form>
 						</span>
-						<br />
 					</center>
-					<div class="form-group multiselect">
-						<a class="form-control multiselect-trigger" tabindex="3">
-							<div id="audioTitle" style="padding: 5px;" class="title">
-								<span data-translate="select-audio-source">Select Audio Source</span>:
-								<i class="las la-chevron-down" aria-hidden="true"></i>
+					<div id="audioMenu" class="form-group multiselect" alt="tip: Hold CTRL (command) to select Multiple" title="tip: Hold CTRL (command) to select Multiple">
+						<a id="multiselect-trigger" class="form-control multiselect-trigger" tabindex="3">
+							<div id="audioTitle"  class="title">
+								<i class="las la-microphone-alt"></i><span data-translate="select-audio-source"> Audio Source(s) </span>
+								<i id='chevarrow1' class="chevron bottom" aria-hidden="true"></i>
+								<div class="meter" id="meter1"></div>
 							</div>
 						</a>
-						<ul id="audioSource" class="multiselect-contents">
+						<ul id="audioSource" class="multiselect-contents" >
 							<li>
 								<input type="checkbox" id="multiselect1" name="multiselect1" style="display: none;" checked value="ZZZ" />
 								<label for="multiselect1">
@@ -230,6 +252,14 @@
 							</li>
 						</ul>
 					</div>
+					<br />
+					<span id="headphonesDiv" style="text-align:left; margin:17px 0; max-width: 550px; min-width: 420px; background-color: #f3f3f3; display: none; padding: 10px 10px; border: 1px solid #ccc; vertical-align: middle;">
+						<div id="audioTitle2"  class="title">
+						<i class="las la-headphones"></i><span data-translate="select-output-source"> Audio Output Destination:</span></div>
+						<select id="outputSource" ></select>
+						
+					</span>
+					
 				</div>
 				<div class="outer close">
 					<div class="inner">
@@ -239,7 +269,8 @@
 					</div>
 				</div>
 			</div>
-			<div id="container-2" class="column columnfade" style="background-color: #ddd; overflow-y: auto;">
+			
+			<div id="container-2" class="column columnfade" style=" overflow-y: auto;">
 				<h2 id="add_screen">
 					<span data-translate="remote-screenshare-obs">Remote Screenshare into OBS</span>
 				</h2>
@@ -258,7 +289,7 @@
 						<i class="las la-cog" style="font-size: 170%; vertical-align: middle;" aria-hidden="true"></i>
 					</span>
 					<center>
-						<span id="videoSettings2" style="margin: auto auto; display: none; background-color: white; vertical-aligh: middle; border: 3px solid #ccc; max-width: 500px; padding: 10px 0 5px 0; margin: 10px 0 5px 0;">
+						<span id="videoSettings2" style="margin: auto auto; display: none; background-color: white; vertical-aligh: middle; border: 3px solid #ccc; max-width: 500px; padding: 10px 10px 5px 10px; margin: 10px 0 5px 0;">
 							<form id="webcamquality2">
 								<input type="radio" id="fullhd2" name="resolution2" value="0" />
 								<label for="fullhd">
@@ -279,10 +310,10 @@
 						</span>
 						<br />
 					</center>
-					<p>
-						<span data-translate="audio-sources">Audio Sources</span>:
+					<p id="audioScreenShare1">
+						<span data-translate="audio-sources">Audio Sources</span>
 						<br />
-						<select id="audioSourceScreenshare" multiple style="height: 60px; width: 200px; resize: both; overflow: auto; padding: 5px;" onchange="requestAudioStream();">
+						<select id="audioSourceScreenshare" multiple  alt="tip: Hold CTRL (command) to select Multiple" title="tip: Hold CTRL (command) to select Multiple"  style="height: 60px; width: 200px; resize: both; overflow: auto; padding: 5px;" onchange="requestAudioStream();">
 							<option value="screenshare" selected>
 								<span data-translate="screen-shrae-audio">Screen Share Audio (default)</span>
 							</option>
@@ -291,6 +322,15 @@
 							</option>
 						</select>
 					</p>
+					<br />
+					<span id="headphonesDiv2" style="background-color: #f3f3f3; display: none; padding: 5px 10px; border: 1px solid #ccc; vertical-align: middle;">
+						<i class="las la-headphones"></i><span data-translate="select-output-source"> Audio Output Destination:</span>:<br />
+						<select id="outputSourceScreenshare" style="background-color: #FFF; padding:5px; display: display:inline-block;vertical-align: middle;" onclick="requestOutputAudioStream();">
+							<option value="default">
+								<span data-translate="default">Default Device</span>
+							</option>
+						</select>
+					</span>
 				</div>
 				<div class="outer close">
 					<div class="inner">
@@ -300,7 +340,7 @@
 					</div>
 				</div>
 			</div>
-			<div id="container-4" class="column columnfade" style="background-color: #ddd; overflow-y: auto;">
+			<div id="container-4" class="column columnfade" style=" overflow-y: auto;">
 				<h2>
 					<span data-translate="create-reusable-invite">Create Reusable Invite</span>
 				</h2>
@@ -430,13 +470,13 @@
                            
 							</li>
 							<li>Some users will have 
-								<a href="https://github.com/steveseguin/obsninja/wiki/FAQ#video-is-pixelated">"pixelation" problems</a> with videos. Adding 
-								<b>&codec=vp9</b> to the OBS links will often correct it.
+								<a href="https://github.com/steveseguin/obsninja/wiki/FAQ#video-is-pixelated">"pixel smearing"</a> problems with videos. Avoid Wi-Fi to reduce it or add 
+								<b>&codec=vp9</b> to the OBS view links to prevent it.
 							</li>
 							<br />

-                            Site last updated: June 28th, 2020. The previous version can be found at 
-							<a href="https://obs.ninja/v7/">https://obs.ninja/v7/</a> if you are having new issues.
+                            Site last updated: <a href="https://www.reddit.com/r/OBSNinja/comments/ib7vhk/version_10_released_text_chat_and_more_added_see/">August 17th, 2020</a>. The previous version can be found at 
+							<a href="https://obs.ninja/v9/">https://obs.ninja/v9/</a> if you are having new issues.

                            
 							<br />
@@ -444,9 +484,8 @@
 							<h3>
 								<i>
                                    Check out the 
-									<a href="https://www.reddit.com/r/OBSNinja/">sub-reddit</a>
-									<i class="lab la-reddit-alien"></i> for help and advanced info. I'm also on
-                                    
+									<a href="https://www.reddit.com/r/OBSNinja/">sub-reddit
+									<i class="lab la-reddit-alien"></i> </a>for help and see the <a href="https://github.com/steveseguin/obsninja/wiki/">Wiki for advanced info</a>. I'm also on
 									<a href="https://discord.gg/EksyhGA">Discord</a> and you can email me at steve@seguin.email
                                
 								</i>
@@ -477,13 +516,13 @@
 					<span data-translate="remote-control-for-obs">Remote Control for OBS</span>
 				</b>
 				<br />
-				<button data-value="0" style="font-size: 112%;" onclick="directEnable(this);">
+				<button data-value="0" style="font-size: 112%;" onclick="directEnable(this, event);">
 					<span data-translate="add-to-group">Add to Group Scene</span>
 				</button>
-				<button style="font-size: 112%;" onclick="directMute(this);">
+				<button style="font-size: 112%;" onclick="directMute(this, event);">
 					<span data-translate="mute">Mute</span>
 				</button>
-				<button style="font-size: 112%;" onclick="recordVideo(this)">
+				<button style="font-size: 112%;" onclick="recordVideo(this, event)">
 					<span data-translate="record">Record</span>
 				</button>
 				<br />
@@ -494,6 +533,40 @@
 				<hr />
 			</center>
 		</div>
+		<div id="popupSelector" style="display:none;">
+				<span id="videoMenu3" class="videoMenu">
+					<i class="las la-video"></i><span data-translate="video-source"> Video Source </span>
+					
+					<select id="videoSource3" ></select>
+					
+				</span>
+				<br />
+				<br />
+				
+				<div id="audioMenu3" class="form-group multiselect" alt="tip: Hold CTRL (command) to select Multiple" title="tip: Hold CTRL (command) to select Multiple" style="padding: 10px; background-color:#f3f3f3;">
+					<a id="multiselect-trigger3" class="form-control multiselect-trigger" tabindex="3">
+						<div id="audioTitle2" class="title">
+							<i class="las la-microphone-alt"></i><span data-translate="select-audio-source"> Audio Source(s) </span>
+							<i id="chevarrow2" class="chevron bottom" aria-hidden="true"></i>
+						</div>
+					</a>
+					<ul id="audioSource3" style="background-color:white;"  class="multiselect-contents">
+						<li>
+						</li>
+					</ul>
+				</div>
+				<br />
+				<span id="headphonesDiv3" style="display: inline-block;">
+					<div id="audioTitle3"  class="title">
+						<i class="las la-headphones"></i><span data-translate="select-output-source"> Audio Output Destination:</span>
+					</div>
+					<select id="outputSource3" ></select>
+				</span>
+				<br />
+				<button id="shareScreenGear" style="padding:20px;" onclick="grabScreen()"><b>Share Screen</b><br /><i style="padding:5px; font-size:300%;" class="las la-desktop"></i></button><br />
+				<button onclick="toggleSettings()" style="background-color:#EFEFEF;padding:10px 12px 12px 2px;"><i class="chevron right" style="font-size:150%;top:3px;position:relative;"></i> <b>Close Settings</b></button>
+			</p>
+		</div>
 		<nav id="context-menu" class="context-menu">
 			<ul class="context-menu__items">
 				<li class="context-menu__item">
@@ -510,6 +583,21 @@
 				</li>
 			</ul>
 		</nav>
+		
+		<div id="chatModule" style="display:none;">
+			<div id="chatBody"> 
+				<div class="inMessage">
+					Welcome to OBS.Ninja! You can send text messages directly to connected peers from here.
+				</div>
+				<div class="outMessage">
+					Names identifying connected peers will be a feature in an upcoming release.
+				</div>
+			</div>
+			<input id="chatInput" placeholder="Enter chat message to send here"onkeypress="EnterButtonChat(event)" />
+			<button style="width:60px;background-color:#EEE;" onclick="sendChatMessage()">Send</button>
+		</div>
+		
+		
 		<div id="messagePopup" class="popup-message"></div>
 		<div id="languages" class="popup-message" style="display: none; right: 0; bottom: 25px; position: absolute;">
 			<b>Available Languages:</b>
@@ -525,12 +613,19 @@
 				<br />
 				<a onclick="changeLg('it');toggle(document.getElementById('languages'));" style="cursor: pointer;">Italian </a>
 				<br />
+				<a onclick="changeLg('de');toggle(document.getElementById('languages'));" style="cursor: pointer;">German </a>
+				<br />
+				<a onclick="changeLg('es');toggle(document.getElementById('languages'));" style="cursor: pointer;">Spanish </a>
+				<br />
+				<a onclick="changeLg('nl');toggle(document.getElementById('languages'));" style="cursor: pointer;">Dutch </a>
+				<br />
 			</u>
 			<br />
 			<a href="https://github.com/steveseguin/obsninja/tree/master/translations">Add More Here!</a>
 			<br />
 		</div>
 		<script>
+		
            var session = WebRTC.Media; // session is a required global variable if configuring manually. Run before loading main.js but after webrtc.js.

            session.streamID = session.generateStreamID(); // randomly generates a streamID for this session. You can set your own programmatically if needed
@@ -550,7 +645,7 @@
            turn = {};
            turn.username = "steve";
            turn.credential = "justtesting";
-            turn.urls = ["turn:turn2.obs.ninja:443"]; // US WEST
+            turn.urls = ["turn:turn2.obs.ninja:3478?transport=tcp"]; // US WEST
            session.configuration.iceServers.push(turn);

            // session.configuration.iceTransportPolicy = "relay";  // uncomment to enable "&privacy" and force the TURN server
@@ -585,9 +680,11 @@
            // session.scene
            // session.title // "zzzz"
        </script>
-
+		<!-- 
+		// If you wish to change branding, blank offers a good clean start.
 		<script type="text/javascript" id="main-js" src="./main.js" data-translation="blank"></script>
-	
-		<script type="text/javascript" src="./animations.js"></script>
+	-->
+		<script type="text/javascript" id="main-js" src="./main.js?ver=33"></script>
+		<script type="text/javascript" src="./animations.js?ver=8"></script>
 	</body>
 </html>
--- a/main.css
+++ b/main.css
@@ -5,10 +5,21 @@
 	border:0;

 }
+
+
+
+.meter {
+  display: inline-block;
+  width: 0px;
+  height: 10px;
+  background: green;
+  transition: all 52ms linear;
+}
+
 #mynetwork {
-		width: 600px;
-		height: 400px;
-		border: 1px solid lightgray;
+	width: 600px;
+	height: 400px;
+	border: 1px solid lightgray;
 }
 	
 .email { 
@@ -51,26 +62,54 @@ button {

 #header {
 	width: 100%;
-	height: 24px;
+	min-height: 24px;
 	background-color:#0F131D;
 	color:#FFF;
 	
 }

 .credits {
-	color:black;
+	color:#101020;
 	position:fixed;
 	bottom:0;
 	right:0;
 	z-index:-1;
+	font-size:80%;
 }
 .credits  >a {
-	color:black;
+	color:#101020;
 }
 .credits >a:visited{
-	color:black;
+	color:#101020;
 }

+.chevron{
+	padding:0px 6px;
+}
+
+.chevron::before {
+	border-style: solid;
+	border-width: 0.14em 0.14em 0 0;
+	content: '';
+	display: inline-block;
+	height: 0.32em;
+	left: 0.15em;
+	position: relative;
+	top: .43em;
+	transform: rotate(-45deg);
+	vertical-align: top;
+	width: 0.32em;
+}
+
+.chevron.bottom::before {
+	top: .28em;
+	transform: rotate(135deg);
+}
+
+.chevron.right::before {
+	top: .28em;
+	transform: rotate(45deg);
+}

 .pressed {
  background: #e3e3e3;
@@ -89,11 +128,7 @@ hr {
 	 height:2px;border-width:0;color:gray;background-color:gray;
 }

-#videosource {
-	max-width:100%;
-	max-height:100%;
-	background-color:white;
-}
+
 /* Clear floats after the columns */
 .row:after {
 	content: "";
@@ -152,6 +187,7 @@ hr {
 	min-width: 300px;
 	padding:10px 10px 0px 10px !important;
 }
+
 .directorsgrid .vidcon {
 	display: inline-block !important;
 	max-width: 400px !important;
@@ -159,6 +195,81 @@ hr {
 	background: #E3E4EF;
 }

+.puslate {
+	border-radius: 50%;
+	box-shadow: 0 0 0 0 rgba(14, 19, 26, 1);
+	transform: scale(1);
+	animation: pulse 2s infinite;
+}
+
+.notification {
+	position: relative;
+    top: -40px;
+    right: -33px;
+    padding: 2px 0;
+    border-radius: 50%;
+    background: red;
+    color: white;
+    width: 11px;
+    height: 11px;
+    margin: 0;
+}
+
+video::-webkit-media-controls-current-time-display{
+	display:none;
+}
+
+video::-webkit-media-controls-time-remaining-display{
+	display:none;
+}
+
+video::-webkit-media-controls-timeline{
+	display:none;
+}
+
+video::-webkit-media-controls-timeline-container{
+	display:none;
+}
+
+video::-webkit-media-controls-toggle-closed-captions-button{
+	display:none;
+}
+
+
+
+@keyframes pulse {
+	0% {
+		transform: scale(0.95);
+		box-shadow: 0 0 0 0 rgba(14, 19, 26, 0.7);
+	}
+
+	70% {
+		transform: scale(1);
+		box-shadow: 0 0 0 10px rgba(2, 3, 4, 0);
+	}
+
+	100% {
+		transform: scale(0.95);
+		box-shadow: 0 0 0 0 rgba(14, 19, 26, 0);
+	}
+}
+
+
+.icn-spinner {
+  /* animation: spin-animation 3s infinite; */
+  display: inline-block;
+}
+
+
+
+@keyframes spin-animation {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(359deg);
+  }
+}

 html {
 	border:0;
@@ -168,7 +279,7 @@ html {
 li {
    margin: 0.1em 0;
    padding-left: 0.1em;
-    line-height: 1.4em;
+    line-height: 1.3em;
 }

 body {
@@ -193,13 +304,23 @@ body {

 	
 }
+.previewWebcam{
+	max-width: 640px; 
+	max-width: 83vw; 
+	max-height: 30vh;
+}

 .gowebcam {
 	font-size:110%;
-	padding:10px;
 	border:3px solid #DDDDDD;
 	cursor:pointer;
 	background-color:#DDDDDD;
+	margin: 20px;
+	padding:10px 50px;
+}
+
+.mainmenuclass{
+	display:inherit;
 }

 .gobutton {
@@ -243,6 +364,7 @@ body {
 	   }
 	   .gowebcam {
 		   padding:5px;
+		   margin: 5px;
 	   }

 	   .infoblob {
@@ -263,11 +385,17 @@ body {
 		   top:0px;
 		   right:0px;
 	   }
+	   
+	   
 	  
   }
-
+	

   @media only screen and (max-width: 650px) {
+	   .mainmenuclass{
+		   display:inline-block;
+	   }
+	   
 	   .outer {
 		   width:50px;
 	   }
@@ -283,7 +411,7 @@ body {
 	   #reshare{
 		   max-width:650px !important;
 		   font-size:96% !important;
-		   min-width:400px !important;
+		   width:300px !important;
 		   
 	   }
 		.fa-paperclip {
@@ -302,16 +430,79 @@ body {
 			float:none !important;
 			padding: 15px 10px 1px 10px !important;
 	    }
-		input[type=radio]{
-			b
-			
+		
+		#videoSettings {
+			max-width: 100% !important;
+			min-width: 100% !important;
 		}

+		.videoMenu {
+			max-width: 100% !important;
+			min-width: 100% !important;
+		}
+
+		div.multiselect { 
+			max-width: 100% !important;
+			min-width: 100% !important;
+		}	
+		
+		#headphonesDiv3 {
+			max-width: 100% !important;
+			min-width: 100% !important;
+			overflow: hidden !important;
+		}
+		#headphonesDiv {
+			max-width: 100% !important;
+			min-width: 100% !important;
+			overflow: hidden !important;
+		}
+		
+		#outputSource {
+			width: 100% !important;
+		}
+		
+		#outputSource3 {
+			width: 100% !important;
+		}
+		
+		#audioSourceScreenshare {
+			max-width: 90% !important;
+			min-width: 90% !important;
+			overflow: hidden !important;
+		}
+		
+		#videoSettings2 {
+			max-width: 90% !important;
+			min-width: 90% !important;
+			overflow: hidden !important;
+		}
+		
+		#popupSelector{
+		   padding: 20px 5px 0px 15px  !important;
+		   font-size:92%;
+		   width: 385px !important
+	   }
+		
   }

-
+	
+	#popupSelector {
+		background: linear-gradient(6deg, rgba(221, 221, 221, 0) 4%, rgb(221, 221, 221) 30%, rgba(120,120,100,.5) 100%); 
+		transition: all 0.2s linear 0s;
+		padding: 20px 20px 0px 20px;
+		position: fixed;
+		top: 0px;
+		height: 90%;
+		width: 490px;
+		right:-400px;
+	}
+	
   h2 {
 	   color: white;
+	   -webkit-user-select: none; /* Safari */        
+		-moz-user-select: none; /* Firefox */
+		-ms-user-select: none; /* IE10+/Edge */
+		user-select: none; /* Standard */
   }


@@ -398,12 +589,19 @@ body {
 	   font-size:100%;
 	   /* Add shadows to create the "card" effect */
 	   box-shadow: 0 4px 8px 0 rgba(0,0,0,.1);
+	   background-color: #ddd;
+	   transition: box-shadow 0.1s ease-in-out;
 	   
   }
   /* On mouse-over, add a deeper shadow */
   .column:hover {
 	   box-shadow: 0 8px 16px 0 rgba(0,0,0,.3);
   }
+   
+   .column:active{
+	    box-shadow: 0 8px 16px 0 rgba(0,0,0,.5);
+   }
+   
   .column > h2 {color:black;}


@@ -455,8 +653,15 @@ img {
 #container-3{
 	background-repeat: no-repeat;
 	background-size: 80px;
+	
+	
+	transition: background-image 0.3s ease-in-out;
+	-webkit-transition: background-image 0.3s ease-in-out;
+	
 	background-position: 50% 65%;
 	background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjkgMTI5IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMjkgMTI5IiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiPgogIDxnPgogICAgPHBhdGggZD0ibTk2LjYsMjYuOGgtODYuMWMtMi4yLDAtNC4xLDEuOC00LjEsNC4xdjY3LjJjMCwyLjIgMS44LDQuMSA0LjEsNC4xaDg2LjFjMi4yLDAgNC4xLTEuOCA0LjEtNC4xdi0xOS40bDE0LjksMTQuOWMwLjgsMC44IDEuOCwxLjIgMi45LDEuMiAwLjUsMCAxLjEtMC4xIDEuNi0wLjMgMS41LTAuNiAyLjUtMi4xIDIuNS0zLjh2LTUyLjVjMC0xLjYtMS0zLjEtMi41LTMuOC0xLjUtMC42LTMuMy0wLjMtNC40LDAuOWwtMTQuOSwxNC45di0xOS4zYy0wLjEtMi4zLTEuOS00LjEtNC4yLTQuMXptLTQuMSwzMy4zdjguOCAyNS4yaC03OHYtNTkuMmg3OHYyNS4yem0yMS45LTEydjMyLjlsLTEzLjctMTMuN3YtNS40bDEzLjctMTMuOHoiIGZpbGw9IiMwMDAwMDAiLz4KICA8L2c+Cjwvc3ZnPgo=)
+	
+	
 }

 #container-4 {
@@ -476,9 +681,12 @@ img {
 .container-inner {
 	display: none;
 	background-color: rgb(221, 221, 221);
-	padding:0 0 80px 0;
+	max-height: 100%;
+	min-height: 90%;
+}
+#add_screen{
+	padding-bottom:20px;
 }
-
 .float{
 	opacity: 0.8;
 	width:45px;
@@ -488,6 +696,7 @@ img {
 	border-radius:38px;
 	text-align:center;
 	margin:5px;
+	pointer-events: auto; 
 }

 .float2{
@@ -500,6 +709,7 @@ img {
 	text-align:center;
 	z-index:10;
 	margin:5px;
+	pointer-events: auto; 
 }

 .rotate225 {
@@ -519,7 +729,6 @@ img {
 	display: block !important;
 	margin: auto auto !important;
 	position: relative !important;
-	transform: translate(0, -50%) !important;
 	top: 50% !important;
 }

@@ -532,11 +741,12 @@ img {
 	z-index:5;
 	bottom:5px;
 	width:100%;
-	display: flex;
+	display: none;
 	justify-content: center;
 	align-items: center;
 	height: 60px;
 	border: 0;
+	pointer-events: none;
 }


@@ -570,6 +780,7 @@ img {
 		border-radius:38px;
 		text-align:center;
 		margin:5px;
+		pointer-events: auto; 
 	}

 	.float2{
@@ -582,6 +793,7 @@ img {
 		text-align:center;
 		z-index:10;
 		margin:5px;
+		pointer-events: auto; 
 	}
 }

@@ -699,7 +911,13 @@ video {
 	background-image:url("data:image/svg+xml,%3Csvg viewBox='-42 0 512 512.002' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m210.351562 246.632812c33.882813 0 63.222657-12.152343 87.195313-36.128906 23.972656-23.972656 36.125-53.304687 36.125-87.191406 0-33.875-12.152344-63.210938-36.128906-87.191406-23.976563-23.96875-53.3125-36.121094-87.191407-36.121094-33.886718 0-63.21875 12.152344-87.191406 36.125s-36.128906 53.308594-36.128906 87.1875c0 33.886719 12.15625 63.222656 36.132812 87.195312 23.976563 23.96875 53.3125 36.125 87.1875 36.125zm0 0'/%3E%3Cpath d='m426.128906 393.703125c-.691406-9.976563-2.089844-20.859375-4.148437-32.351563-2.078125-11.578124-4.753907-22.523437-7.957031-32.527343-3.308594-10.339844-7.808594-20.550781-13.371094-30.335938-5.773438-10.15625-12.554688-19-20.164063-26.277343-7.957031-7.613282-17.699219-13.734376-28.964843-18.199219-11.226563-4.441407-23.667969-6.691407-36.976563-6.691407-5.226563 0-10.28125 2.144532-20.042969 8.5-6.007812 3.917969-13.035156 8.449219-20.878906 13.460938-6.707031 4.273438-15.792969 8.277344-27.015625 11.902344-10.949219 3.542968-22.066406 5.339844-33.039063 5.339844-10.972656 0-22.085937-1.796876-33.046874-5.339844-11.210938-3.621094-20.296876-7.625-26.996094-11.898438-7.769532-4.964844-14.800782-9.496094-20.898438-13.46875-9.75-6.355468-14.808594-8.5-20.035156-8.5-13.3125 0-25.75 2.253906-36.972656 6.699219-11.257813 4.457031-21.003906 10.578125-28.96875 18.199219-7.605469 7.28125-14.390625 16.121094-20.15625 26.273437-5.558594 9.785157-10.058594 19.992188-13.371094 30.339844-3.199219 10.003906-5.875 20.945313-7.953125 32.523437-2.058594 11.476563-3.457031 22.363282-4.148437 32.363282-.679688 9.796875-1.023438 19.964844-1.023438 30.234375 0 26.726562 8.496094 48.363281 25.25 64.320312 16.546875 15.746094 38.441406 23.734375 65.066406 23.734375h246.53125c26.625 0 48.511719-7.984375 65.0625-23.734375 16.757813-15.945312 25.253906-37.585937 25.253906-64.324219-.003906-10.316406-.351562-20.492187-1.035156-30.242187zm0 0'/%3E%3C/svg%3E");
 }

-/* context menu */
+
+.mirrorControl::-webkit-media-controls-enclosure {
+	padding: 0px;
+	height: 30px;
+	transform: scaleX(-1);
+	-webkit-transform: scaleX(-1);
+}

 .context-menu {
  display: none;
@@ -758,6 +976,15 @@ video {
  background-color: #0066aa  !important;
 }

+#audioTitle{
+	text-align:left;
+	padding: 7px 0px;
+}
+
+#audioTitle2{
+	text-align:left;
+	padding: 0px 10px 10px 1px;
+}
 .multiselect .multiselect-trigger:hover {
    cursor: pointer;
    cursor: hand;
@@ -774,34 +1001,131 @@ video {
    border-bottom-right-radius: 4px;
 }

+#headphonesDiv3{
+	text-align:left; 
+	margin:17px 0; 
+	width: 450px;
+	background-color: #f3f3f3; 
+	padding: 10px 10px; 
+	border: 1px solid #ccc; 
+	vertical-align: middle;
+}
+
+#headphonesDiv{
+	text-align:left; 
+	margin:17px 0; 
+	width: 450px;
+	background-color: #f3f3f3; 
+	padding: 10px 10px; 
+	border: 1px solid #ccc; 
+	vertical-align: middle;
+}
+
+#videoSettings {
+	margin: auto auto; 
+	background-color: #f3f3f3; 
+	width: 450px;   
+	padding: 10px 0; 
+	margin: 0px 0 0px 0;
+	border: 1px solid #ccc;
+}
+
+#audioMenu {
+	margin:15px 0 0 0 ;
+}
+
+#videoSource {
+	background-color: #FFF; 
+	display: inline-block;
+	vertical-align: middle;
+
+	max-width:260px;
+	max-height:100%;
+	background-color:white;
+	
+	padding: 3px;
+	font-size:93%;
+}
+
+#videoSettings3 {
+	margin: auto auto; 
+	background-color: #f3f3f3; 
+	width: 450px;   
+	padding: 10px 0; 
+	margin: 0 0 5px 0;
+	border: 1px solid #ccc;
+	padding: 3px;
+    font-size: 90%;
+}
+
+#videoSource3 {
+	background-color: #FFF; 
+	display: inline-block;
+	vertical-align: middle;
+	padding: 3px;
+	font-size:93%;
+}
+
+
+#outputSource {
+	background-color: #FFF; 
+	display: inline-block;
+	vertical-align: middle;
+	padding: 4px;
+	font-size:93%;
+	max-width: 100%;
+}
+
+#outputSource3 {
+	background-color: #FFF; 
+	display: inline-block;
+	vertical-align: middle;
+	padding: 3px;
+	font-size:93%;
+	max-width: 100%;
+}
+
+
+.videoMenu{
+	background-color: #f3f3f3; 
+	width: 450px; 
+	display: inline-block; 
+	padding: 10px 10px; 
+	border: 1px solid #ccc; 
+	vertical-align: middle;
+	text-align:left;
+}
+
 div.multiselect {
-	background-color:#FFF;
-	max-width:550px;
+	width: 450px; 
 	white-space: nowrap;
 	overflow:hidden;
-	min-width:100px;
 	margin:auto auto;
 	border: 1px solid #ccc;
 	border-bottom:0;
+	display: inline-block;
+	padding: 4px 10px 10px 10px;
+	background-color:#f3f3f3;
 }

 .multiselect .multiselect-contents {
    display: block;
    margin: 0;
 	font-size:80%;
-    padding: 5px 5px 5px;
+    padding: 3px 5px 1px;
    
    border-top: 0;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
 	text-align:left;
-	background-color:#f3f3f3;
+	background-color: white;
 	
 }
 .multiselect .multiselect-contents li {
    list-style: none;
-	font-size:130%;
+	font-size:120%;
 	padding:2px;	
+	overflow:hidden;
 }
 .select .select-trigger:hover {
    cursor: pointer;
@@ -853,12 +1177,13 @@ label {
 input[type=checkbox]
 {
  /* Double-sized Checkboxes */
-  -ms-transform: scale(1.3); /* IE */
-  -moz-transform: scale(1.3); /* FF */
-  -webkit-transform: scale(1.3); /* Safari and Chrome */
-  -o-transform: scale(1.3); /* Opera */
-  transform: scale(1.3);
+  -ms-transform: scale(1.4); /* IE */
+  -moz-transform: scale(1.4); /* FF */
+  -webkit-transform: scale(1.4); /* Safari and Chrome */
+  -o-transform: scale(1.4); /* Opera */
+  transform: scale(1.4);
  padding: 5px;
+  margin: 0 5px 0 1px;
 }

 #screenshare {
@@ -875,4 +1200,80 @@ input[type=checkbox]
 	border-image-width:0;
    background-size: contain;
 	background-color: rgba(0,0,0,0);
-}
+}
+
+.inMessage{
+  color: #000;
+  margin:3px;
+  border-radius: 5px;
+  background: #FFF8;
+  padding: 5px;
+  text-align:left;
+  margin: 10px 3px;
+}
+
+.outMessage{
+  color: #000;
+  margin:3px;
+  border-radius: 5px;
+  background: #FFF7;
+  padding: 5px;
+  text-align:right;
+  margin: 10px 3px;
+}
+
+#chatBody{
+	z-index: 12;
+	background-color: #FFF1;
+	width: 100%;
+	border-radius: 5px;
+	padding: 1px 7px;
+}
+
+#chatModule{
+	bottom:50px;
+	position:fixed;
+	margin:10px;
+	align-self: center;
+	width:400px;
+	max-width:100%;
+}
+
+#chatInput{
+	color: #000;
+	background-color:#FFFE;
+	max-width:700px;
+	min-width:320px;
+	font-size:105%;
+	margin-left:7px;
+	padding:3px;
+	   
+}
+
+@media only screen and (max-width: 390px) {
+	#chatBody{
+		z-index: 12;
+		background-color: #FFF1;
+		width: 100%;
+		border-radius: 5px;
+		padding: 1px 7px;
+		margin:0px;
+	}
+
+	#chatModule{
+		bottom:50px;
+		position:fixed;
+		margin:0px;
+		align-self: center;
+		width:400px;
+		max-width:100%;
+	}
+
+	#chatInput{
+		max-width:99%;
+		min-width: 240px;
+		margin-left: 11px;
+		font-size: 100%;
+	}
+}
+
--- a/main.js
+++ b/main.js
--- a/thirdparty/CodecsHandler.js
+++ b/thirdparty/CodecsHandler.js
@@ -20,6 +20,7 @@ Copyright (c) 2012-2020 [Muaz Khan](https://github.com/muaz-khan)
    IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
    CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
    */
+	
 // Sourced from: https://cdn.webrtc-experiment.com/CodecsHandler.js

 // *FILE HAS BEEN HEAVILY MODIFIED BY STEVE SEGUIN. ALL RIGHTS RESERVED WHERE APPLICABLE *
@@ -171,10 +172,12 @@ var CodecsHandler = (function() {

    function getVideoBitrates(sdp) { 

+		var defaultBitrate = 2500;
+
        var sdpLines = sdp.split('\r\n');
        var mLineIndex = findLine(sdpLines, 'm=', 'video');
        if (mLineIndex === null) {
-            return 2500;
+            return defaultBitrate;
        }
        var videoMLine = sdpLines[mLineIndex];
        var pattern = new RegExp('m=video\\s\\d+\\s[A-Z/]+\\s');
@@ -189,7 +192,7 @@ var CodecsHandler = (function() {
        }

        if (!codecPayload) {
-            return 2500;
+            return defaultBitrate;
        }

        var rtxIndex = findLine(sdpLines, 'a=rtpmap', 'rtx/90000');
@@ -199,7 +202,7 @@ var CodecsHandler = (function() {
        }

        if (!rtxIndex) {
-            return 2500;
+            return defaultBitrate;
        }

        var rtxFmtpLineIndex = findLine(sdpLines, 'a=fmtp:' + rtxPayload.toString());
@@ -208,7 +211,7 @@ var CodecsHandler = (function() {
                var maxBitrate = parseInt(sdpLines[rtxFmtpLineIndex].split("x-google-max-bitrate=")[1].split(";")[0]);
                var minBitrate = parseInt(sdpLines[rtxFmtpLineIndex].split("x-google-min-bitrate=")[1].split(";")[0]);
            } catch(e){
-                return 2500;
+                return defaultBitrate;
            }
           
           if (minBitrate>maxBitrate){
@@ -217,7 +220,7 @@ var CodecsHandler = (function() {
           if (maxBitrate<1){maxBitrate=1;}
           return maxBitrate
        } else {
-            return 2500;
+            return defaultBitrate;
        }

        
@@ -245,12 +248,13 @@ var CodecsHandler = (function() {
        var sendPayloadType = videoMLine.split(pattern)[1].split(' ')[0];
        var fmtpLine = sdpLines[findLine(sdpLines, 'a=rtpmap', sendPayloadType)];
        var codecName = fmtpLine.split('a=rtpmap:' + sendPayloadType)[1].split('/')[0];
-        
+		
        codec = codecName || codec; // Try to find first Codec; else use expected/default
        
        params = params || {};
-        var xgoogle_min_bitrate = params.min.toString();
-        var xgoogle_max_bitrate = params.max.toString();
+        var min_bitrate = params.min.toString() || '30';
+        var max_bitrate = params.max.toString() || '2500';
+		

        var codecIndex = findLine(sdpLines, 'a=rtpmap', codec+'/90000');
        var codecPayload;
@@ -269,26 +273,29 @@ var CodecsHandler = (function() {
        }

        if (!rtxIndex) {
+			sdpLines[mLineIndex] += '\r\nb=AS:' + max_bitrate;
+			sdp = sdpLines.join('\r\n');
            return sdp;
-        }
+        } 
+		

-        var rtxFmtpLineIndex = findLine(sdpLines, 'a=fmtp:' + rtxPayload.toString());
-        if (rtxFmtpLineIndex !== null) {
+        var rtxFmtpLineIndexChromium = findLine(sdpLines, 'a=fmtp:' + rtxPayload.toString());
+		
+        if (rtxFmtpLineIndexChromium !== null){
            var appendrtxNext = '\r\n';
-            appendrtxNext += 'a=fmtp:' + codecPayload + ' x-google-min-bitrate=' + (xgoogle_min_bitrate || '228') + '; x-google-max-bitrate=' + (xgoogle_max_bitrate || '228');
-            sdpLines[rtxFmtpLineIndex] = sdpLines[rtxFmtpLineIndex].concat(appendrtxNext);
+            appendrtxNext += 'a=fmtp:' + codecPayload + ' x-google-min-bitrate=' + min_bitrate + '; x-google-max-bitrate=' + max_bitrate;
+            sdpLines[rtxFmtpLineIndexChromium] = sdpLines[rtxFmtpLineIndexChromium].concat(appendrtxNext);
            sdp = sdpLines.join('\r\n');
        }
-
+		
        return sdp;
    }

-    function setOpusAttributes(sdp, params) {
+    function setOpusAttributes(sdp, params) { 
        params = params || {};

        var sdpLines = sdp.split('\r\n');

-        // Opus
        var opusIndex = findLine(sdpLines, 'a=rtpmap', 'opus/48000');
        var opusPayload;
        if (opusIndex) {
@@ -305,65 +312,58 @@ var CodecsHandler = (function() {
        }

        var appendOpusNext = '';
-        appendOpusNext += '; stereo=' + (typeof params.stereo != 'undefined' ? params.stereo : '1');
-        appendOpusNext += '; sprop-stereo=' + (typeof params['sprop-stereo'] != 'undefined' ? params['sprop-stereo'] : '1');
-
+		
+		// Please see https://tools.ietf.org/html/rfc7587 for more details on OPUS settings
+		
+		if (typeof params.maxptime != 'undefined') {  // max packet size in milliseconds
+            appendOpusNext += ';maxptime:' + params.maxptime; // 3, 5, 10, 20, 40, 60 and the default is 120. (20 is minimum recommended for webrtc)
+        }
+		
+		if (typeof params.ptime != 'undefined') {  // packet size; webrtc doesn't support less than 10 or 20 I think.
+            appendOpusNext += ';ptime:' + params.ptime; 
+        }
+		
+		if (typeof params.stereo != 'undefined'){
+			if (params.stereo==0){
+				appendOpusNext += ';stereo=0;sprop-stereo=0';  // defaults to 0
+			} else if (params.stereo==1){
+				appendOpusNext += ';stereo=1;sprop-stereo=1'; // defaults to 0
+			} else if (params.stereo==2){
+				sdpLines[opusIndex] = sdpLines[opusIndex].replace("opus/48000/2", "multiopus/48000/6");
+				appendOpusNext += ';channel_mapping=0,4,1,2,3,5;num_streams=4;coupled_streams=2';  // Multi-channel 5.1 audio
+			}
+		}
+		
        if (typeof params.maxaveragebitrate != 'undefined') {
-            appendOpusNext += '; maxaveragebitrate=' + (params.maxaveragebitrate || 128 * 1024 * 8);
+            appendOpusNext += ';maxaveragebitrate=' + params.maxaveragebitrate; // default 2500 (kbps)
        }

        if (typeof params.maxplaybackrate != 'undefined') {
-            appendOpusNext += '; maxplaybackrate=' + (params.maxplaybackrate || 128 * 1024 * 8);
+            appendOpusNext += ';maxplaybackrate=' + params.maxplaybackrate; // Default should be 48000 (hz) , 8000 to 48000 are valid options
        }

        if (typeof params.cbr != 'undefined') {
-            appendOpusNext += '; cbr=' + (typeof params.cbr != 'undefined' ? params.cbr : '1');
+            appendOpusNext += ';cbr=' + params.cbr; // default is 0 (vbr)
        }

-        if (typeof params.useinbandfec != 'undefined') {
-            appendOpusNext += '; useinbandfec=' + params.useinbandfec;
+        //if (typeof params.useinbandfec != 'undefined') {  // useful for handling packet loss
+        //    appendOpusNext += '; useinbandfec=' + params.useinbandfec;  // Defaults to 0
+        //}
+
+        if (typeof params.usedtx != 'undefined') {  // Default is 0
+            appendOpusNext += ';usedtx=' + params.usedtx; // if decoder prefers the use of DTX.
        }

-        if (typeof params.usedtx != 'undefined') {
-            appendOpusNext += '; usedtx=' + params.usedtx;
-        }
-
-        if (typeof params.maxptime != 'undefined') {
-            appendOpusNext += '\r\na=maxptime:' + params.maxptime;
-        }
+        

        sdpLines[opusFmtpLineIndex] = sdpLines[opusFmtpLineIndex].concat(appendOpusNext);

        sdp = sdpLines.join('\r\n');
+		
        return sdp;
    }

-    // forceStereoAudio => via webrtcexample.com
-    // requires getUserMedia => echoCancellation:false
-    function forceStereoAudio(sdp) {
-        var sdpLines = sdp.split('\r\n');
-        var fmtpLineIndex = null;
-        for (var i = 0; i < sdpLines.length; i++) {
-            if (sdpLines[i].search('opus/48000') !== -1) {
-                var opusPayload = extractSdp(sdpLines[i], /:(\d+) opus\/48000/i);
-                break;
-            }
-        }
-        for (var i = 0; i < sdpLines.length; i++) {
-            if (sdpLines[i].search('a=fmtp') !== -1) {
-                var payload = extractSdp(sdpLines[i], /a=fmtp:(\d+)/);
-                if (payload === opusPayload) {
-                    fmtpLineIndex = i;
-                    break;
-                }
-            }
-        }
-        if (fmtpLineIndex === null) return sdp;
-        sdpLines[fmtpLineIndex] = sdpLines[fmtpLineIndex].concat('; stereo=1; sprop-stereo=1');
-        sdp = sdpLines.join('\r\n');
-        return sdp;
-    }
-
+	
    return {
        disableNACK: disableNACK,
        
@@ -378,9 +378,7 @@ var CodecsHandler = (function() {
            return setOpusAttributes(sdp, params);
        },

-        preferCodec: preferCodec,
-        
-        forceStereoAudio: forceStereoAudio
+        preferCodec: preferCodec
    };
 })();

--- a/translations/IMG_1148.jpg
+++ b/translations/IMG_1148.jpg
--- a/translations/de.json
+++ b/translations/de.json
@@ -0,0 +1,51 @@
+{
+  "GO": "LOS",
+  "add-group-chat": "Gruppenchat hinzufügen",
+  "add-to-group": "Zur Gruppen-Szene hinzfügen",
+  "add-your-camera": "Kamera hinzufügen",
+  "added-notes": "\n\t\t\t\t<u><i>Weitere Infos:</i></u>\n\t\t\t\t<li>Räume können von allen betreten werden, die den Raumnamen wissen. Vermeiden Sie daher zu einfache Namen.</li>\n\t\t\t\t<li>Je nach Hardwareausstattung können mehr als vier Teilnehmende in einem Raum zu Performance-Problemen führen.</li>\n\t\t\t\t<li>Aufgrund einer Hardware-Einschränkung können iOS-Devices Video nur mit dem Regisseur/Director teilen.</li>\n\t\t\t\t<li>Bitte betrachten Sie die \"Aufnehmen\"-Funktion als neu und experimentell. Sie sollten sie vermutlich nicht in Produktivumgebungen einsetzen.</li>\n\t\t\t\t<li>Damit ein Video-Feed in einer Gruppen-Szene erscheint, müssen Sie ihn zunächst dort hinzufügen.</li>\n\t\t\t\t<li>Der Gäste-View enthält einen neuen \"fortgeschrittenen Fullscreen\"-Button.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Weitere Einstellungen",
+  "audio-sources": "Audioquellen",
+  "back": "Zurück",
+  "balanced": "Ausgeglichen",
+  "copy-this-url": "Teilbare Links für dieses Video",
+  "copy-to-clipboard": "In die Zwischenablage kopieren",
+  "create-reusable-invite": "Wiederverwendbare Einladung erstellen",
+  "enable-stereo-and-pro": "Stereo und Pro HD Audio einschalten",
+  "enter-the-rooms-control": "Control Center für diesen Raum betreten",
+  "force-vp9-video-codec": "VP9 Video- Codec verwenden (weniger Störungen)",
+  "generate-invite-link": "EINLADUNGS-LINK ERSTELLEN",
+  "here-you-can-pre-generate": "Erzeugen Sie einen wiederwendbaren Empfangs-Link und die zugehörigen Einladungslinks für Gäste.",
+  "high-security-mode": "High Security Modus",
+  "info-blob": "",
+  "joining-room": "Sie betreten Raum",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS Ninja",
+  "max-resolution": "Höchste Auflösung",
+  "mute": "Stummschalten",
+  "no-audio": "Kein Audio",
+  "note-share-audio": "\n\t\t\t\t\t<b>note</b>: Vergessen Sie nicht, in Chrome \"Audio teilen\" zu klicken.<br>(Firefox unterstütz das Teilen von Audio nicht.)",
+  "open-in-new-tab": "In neuem Tab öffnen.",
+  "record": "Aufnehmen",
+  "remote-control-for-obs": "Fernsteuerung",
+  "remote-screenshare-obs": "Bildschirm teilen",
+  "room-name": "Raum",
+  "rooms-allow-for": "Räume erlauben einfachen Gruppen-Chat und die gleichzeitige Verwaltung verschiedener Streams.",
+  "select-audio-source": "Audio-Quellen auswählen",
+  "select-audio-video": "Wählen Sie die Audio-/Videoquelle unten aus.",
+  "select-screen-to-share": "ZU TEILENDEN BILDSCHIRM AUSWÄHLEN",
+  "show-tips": "Ich möchte Tipps..",
+  "smooth-cool": "Smooth und Cool",
+  "unlock-video-bitrate": "Video-Bitrate auf Maximum (20mbps)",
+  "video-source": "Videoquelle",
+  "volume": "Lautstärke",
+  "you-are-in-the-control-center": "Sie befinden sich im Control-Center dieses Raums",
+  "waiting-for-camera": "Kamera lädt. Bitte warten.",
+  "video-resolution": "Video-Auflösung: ",
+  "hide-screen-share": "Option zum Bildschirm teilen nicht anzeigen",
+  "allow-remote-control": "Gast-Kamera zoomen (Android)",
+  "add-the-guest-to-a-room": " Gast zu diesem Raum hinzufügen:",
+  "invite-group-chat-type": "Dieser Gast..",
+  "can-see-and-hear": "..kann den Gruppen-Chat sehen und hören",
+  "can-hear-only": "..kann den Gruppen-Chat nur hören",
+  "cant-see-or-hear": "..kann den Gruppen-chat weder hören noch sehen"
+}
--- a/translations/es.json
+++ b/translations/es.json
@@ -0,0 +1,51 @@
+{
+  "GO": "VAMOS",
+  "add-group-chat": "Agregar grupo de chat a OBS",
+  "add-to-group": "Agregar a la escena de grupo",
+  "add-your-camera": "Agregar tu camara a OBS",
+  "added-notes": "\n\t\t\t\t<u><i>Notas agregadas:</i></u>\n\t\t\t\t<li>cualquiera puede entrar en una sala si sabe el nombre, así que mantenlo único</li>\n\t\t\t\t<li>Tener más de quatro (4) personas en una sala no es recomendable debido a razones de rendimiento, pero depende de tú hardware.</li>\n\t\t\t\t<li>iOS dispositivos están limitados a tamaño de grupos de no más de dos (2) personas. Esto es una limitación de hardware.</li>\n\t\t\t\t<li>La opción de \"grabación\" es nueva y es considerada experimental.</li>\n\t\t\t\t<li>Tienes que \"Añadir\" una alimentación de video a la \"escena de grupo\" para que aparezca allí.</li>\n\t\t\t\t<li>Hay un botón nuevo añadido \"pantalla completa mejorada\" a la vista de invitados.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Parámetros Avanzados",
+  "audio-sources": "Fuentes de Audio",
+  "back": "Vuelta",
+  "balanced": "Equilibrado",
+  "copy-this-url": "Copia este URL a un OBS \"fuente del navegador\"",
+  "copy-to-clipboard": "Copia a portapapeles",
+  "create-reusable-invite": "Crear una invitación reusable",
+  "enable-stereo-and-pro": "Habilitar el Estereo and Pro HD Audio",
+  "enter-the-rooms-control": "Entrar la sala del centro de control",
+  "force-vp9-video-codec": "Fuerza VP9 Video Codec (menos deformación)",
+  "generate-invite-link": "GENERAR EL LINK DE INVITACIÓN",
+  "here-you-can-pre-generate": "Aquí puedes pregenerar un enlace de fuente de navegador reutilizable y un enlace invitación correspondiente para invitados.",
+  "high-security-mode": "Modo de alta seguridad",
+  "info-blob": "\n\t\t\t\t\t\t<h2>Qué es OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>gratis</b>; sin descargas; sin recopilación de datos personales; sin registración</li>\n\t\t\t\t\t\t<li>Trae video desde el móbil, ordenador portátil, ordenador, o de tus amigos directamente al video OBS stream</li>\n\t\t\t\t\t\t<li>Uitlizamos tecnologia innovadora Peer-to-Peer que ofrece privacidad y ultra baja latencia</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<li>Youtube video <i class=\"fa fa-youtube-play\" aria-hidden=\"true\"></i> <a href=\"https://www.youtube.com/watch?v=6R_sQKxFAhg\">Demo aquí</a> </li>\n\t\t\t\t\t\t<li>Codigo está disponible aquí: <i class=\"fa fa-github\" aria-hidden=\"true\"></i> <a href=\"https://github.com/steveseguin/obsninja\">https://github.com/steveseguin/obsninja</a> </li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Problemas conocidos:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS usuarios necesitan utilizar OBS v23 or recurrir a i>Captura de Window</i> un navegador Chrome con OBS v25</li>\n\t\t\t\t\t\t<li>Algunos usuarios tenrdán \"pixelación\" problemas con videos. Porfavor añadir el parametro URL <b>&amp;codec=vp9</b> al enlace OBS para corregirlo.</li>\n\t<h3><i>Revisa <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> para ayuda e información avanzada. También estoy en <a href=\"https://discord.gg/EksyhGA\">Discord</a> y puedes enviarme un email a steve@seguin.email</i></h3>\n\t\t\t\t\t",
+  "joining-room": "Estás entrado en la sala",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "max-resolution": "Max Resolución",
+  "mute": "Mudo",
+  "no-audio": "Sin Audio",
+  "note-share-audio": "\n\t\t\t\t\t<b>Nota</b>: No te olvides de hacer clic \"Compartir audio\" en cromo.<br>(Firefox no soporta compartir audio.)",
+  "open-in-new-tab": "Abrir en un tab nuevo",
+  "record": "Record",
+  "remote-control-for-obs": "Control remoto para OBS",
+  "remote-screenshare-obs": "Compartir pantalla remota en OBS",
+  "room-name": "Nombre de sala",
+  "rooms-allow-for": "Salas permiten grupos de chats simplificados y gestión avanzada de múltiples flujos a la vez.",
+  "select-audio-source": "Seleccionar fuentes de Audio",
+  "select-audio-video": "Seleccionar fuentes de audio/video source abajo",
+  "select-screen-to-share": "SELECCIONAR PANTALLA PARA COMPARTIR",
+  "show-tips": "Muestrame algunos consejos..",
+  "smooth-cool": "Suave y fresco",
+  "unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
+  "video-source": "Fuente de video",
+  "volume": "Volumen",
+  "you-are-in-the-control-center": "Te encuentras in la sala de control",
+  "waiting-for-camera": "Esperando a que se carge la camara",
+  "video-resolution": "Video Resolución: ",
+  "hide-screen-share": "Esconder opción compartir pantalla",
+  "allow-remote-control": "Control remoto Camara Zoom (android)",
+  "add-the-guest-to-a-room": " Añadir el invitado a una sala:",
+  "invite-group-chat-type": "Este invitado a la sala puede:",
+  "can-see-and-hear": "Puede ver y oir el chat de grupo",
+  "can-hear-only": "Sólo puede oir el chat de grupo",
+  "cant-see-or-hear": "No puede ni oir ni ver el chat de grupo"
+}
--- a/translations/nl.json
+++ b/translations/nl.json
@@ -0,0 +1,51 @@
+{
+  "GO": "START",
+  "add-group-chat": "Voeg Groepsgesprek toe",
+  "add-to-group": "Voeg toe aan Groepsscene",
+  "add-your-camera": "Voeg je Camera toe",
+  "added-notes": "\n\t\t\t\t<u><i>Notities:</i></u>\n\t\t\t\t<li>Iedereen kan de kamer binnenkomen als ze de naam kennen, dus hou hem uniek</li>\n\t\t\t\t<li>Meer dan vier (4) mensen in een kamer is niet aan te raden vanwege prestatie redenen, maar is afhankelijk van uw hardware.</li>\n\t\t\t\t<li>Bij iOS apparaten is de video alleen zichtbaar voor de regiseur. Dit is een hardware beperking.</li>\n\t\t\t\t<li>De \"Opname\" optie is nieuw en is experimenteel.</li>\n\t\t\t\t<li>U moet een video stroom \"Toevoegen\" aan de \"Groeps Scene\" om het hier te tonen.</li>\n\t\t\t\t<li>Er is een nieuwe \"uitgebreid volledig scherm\" knop toegevoegd aan het Gasten scherm.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Geavanceerde Parameters",
+  "audio-sources": "Geluidsbronnen",
+  "back": "Terug",
+  "balanced": "Gebalanceerd",
+  "copy-this-url": "Deelbare Link naar deze video",
+  "copy-to-clipboard": "Kopiëren naar Clipboard",
+  "create-reusable-invite": "Maak Herbruikbare Uitnodiging",
+  "enable-stereo-and-pro": "Activeer Stereo en Pro HD Geluid",
+  "enter-the-rooms-control": "Ga de Kamer's Controle Centrum in",
+  "force-vp9-video-codec": "Forceer VP9 Video Codec (minder verstoring)",
+  "generate-invite-link": "GENEREER DE UITNODIGINGS LINK",
+  "here-you-can-pre-generate": "Hier kan u vooraf een herbruikbare weergave link en een bijbehorende gast uitnodigingslink aanmaken.",
+  "high-security-mode": "Hoge Beveilingsstand",
+  "info-blob": "\n\t\t\t\t\t\t<h2>Wat is OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>gratis</b>; geen downloads; geen persoonlijke gegevens verzamelen; niet inloggen</li>\n\t\t\t\t\t\t<li>Breng video van uw smartphone, laptop, computer, of van uw vrienden direct in uw OBS video stroom</li>\n\t\t\t\t\t\t<li>We gebruiken vooruitstrevende Peer-to-Peer technologie die privacy en ultra lage vertraging biedt</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<li>Youtube video <i class=\"fa fa-youtube-play\" aria-hidden=\"true\"></i> <a href=\"https://www.youtube.com/watch?v=6R_sQKxFAhg\">Demonstratie</a> </li>\n\t\t\t\t\t\t<li>Code is beschikbaar op: <i class=\"fa fa-github\" aria-hidden=\"true\"></i> <a href=\"https://github.com/steveseguin/obsninja\">https://github.com/steveseguin/obsninja</a> </li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Bekende problemen:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS gebruikers moeten OBS v23 gebruiken of terugvallen op <i>Window Capturing</i> van een Chrome Browser met OBS v25</li>\n\t\t\t\t\t\t<li>Sommige gebruikers kunnen \"pixelatie\" problemen met videos ervaren. Voeg dan de URL parameter <b>&amp;codec=vp9</b> toe aan de OBS Links om dit te corrigeren.</li>\n\t<h3><i>Kijk ook op <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> voor hulp en uitgebreide informatie. Ik zit ook op <a href=\"https://discord.gg/EksyhGA\">Discord</a> en u kan me mailen op steve@seguin.email</i></h3>\n\t\t\t\t\t",
+  "joining-room": "U neemt deel aan de kamer",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS Ninja",
+  "max-resolution": "Max Resolutie",
+  "mute": "Demp",
+  "no-audio": "Geen Geluid",
+  "note-share-audio": "\n\t\t\t\t\t<b>Noot</b>: Vergeet niet op \"Deel geluid\" te klikken in Chrome.<br>(Firefox ondersteung geen geluid delen.)",
+  "open-in-new-tab": "Open in nieuwe Tab",
+  "record": "Neem op",
+  "remote-control-for-obs": "Afstandsbediening",
+  "remote-screenshare-obs": "Deel externe scherm",
+  "room-name": "Kamer Naam",
+  "rooms-allow-for": "Kamers maken eenvoudige groepsgespreken en geavanceerd beheer van meerdere streams tegelijk mogelijk.",
+  "select-audio-source": "Selecteer Geluidsbronnen",
+  "select-audio-video": "Selecteer de geluid/video bron hieronder",
+  "select-screen-to-share": "SELECTEER SCHERM OM TE DELEN",
+  "show-tips": "Toon me wat tips..",
+  "smooth-cool": "Soepel en Koel",
+  "unlock-video-bitrate": "Ontsluit Video Bitrate (20mbps)",
+  "video-source": "Video bron",
+  "volume": "Volume",
+  "you-are-in-the-control-center": "U bent in het kamer beheers centrum",
+  "waiting-for-camera": "Wachten op het Laden van de Camera",
+  "video-resolution": "Video Resolutie: ",
+  "hide-screen-share": "Verberg Scherm Delen Optie",
+  "allow-remote-control": "Afstandsbediening Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Voeg de gast toe aan een kamer:",
+  "invite-group-chat-type": "Deze kamer gast kan:",
+  "can-see-and-hear": "Het groepsgesprek zien en horen",
+  "can-hear-only": "Alleen het groepsgesprek horen",
+  "cant-see-or-hear": "Het groepsgesprek niet horen en zien"
+}
--- a/turnserver.conf
+++ b/turnserver.conf
@@ -15,35 +15,38 @@
 # Use with obs.ninja by adding: https://obs.ninja/?streamid=XXXXXXXXXXX&turn=steve;justtesting;turn:turn.obs.ninja:443  
 # Obviously update the TURN settings with your domain, username, and password -- keep the password private.

+
 listening-port=80
 tls-listening-port=443
 #alt-listening-port=0
 #alt-tls-listening-port=0

-listening-ip = 10.128.0.10 ## CHANGE ME: INTERNAL IP
-listening-ip = 0.0.0.0
-listening-ip = 127.0.0.1
-## listening-ip =  and optionally put the IPV6 address here I think
+listening-ip = {10.168.0.2, 0.0.0.0, 127.0.0.1}   ## CHANGE ME (internal IP)

-relay-ip=10.128.0.10  ## CHANGE ME: IINTERNAL IP
-relay-ip =0.0.0.0
-relay-ip =127.0.0.1
+relay-ip = {10.168.0.2, 0.0.0.0, 127.0.0.1}   ## CHANGE ME (internal IP)

-external-ip=34.67.58.241/10.128.0.10  ## CHANGE ME: PUBLIC IP / CHANGE ME: INTERNAL IP
+external-ip = 34.94.203.138/10.168.0.2   ## CHANGE ME ( external + internal IP)

-realm=turn.obs.ninja # CHANGE ME
-server-name=turn.obs.ninja # CHANGE ME 
+realm=turn2.obs.ninja  ## CHANGE ME
+server-name=turn2.obs.ninja   ## CHANGE ME

 #lt-cred-mech
 #userdb=/etc/turnuserdb.conf
+fingerprint
+stale-nonce
+no-multicast-peers
+
+min-port=10000
+max-port=20000

 #oauth
 lt-cred-mech
-user=steve:justtesting    # CHANGE ME to a username and password you make up
+user=steve:justtesting   ## CHANGE ME

 # use real-valid certificate/privatekey files
-cert=/etc/letsencrypt/live/turn.obs.ninja/fullchain.pem ## CHANGE ME ; see certbot
-pkey=/etc/letsencrypt/live/turn.obs.ninja/privkey.pem ## CHANGE ME ; see certbot
+cert=/etc/letsencrypt/live/turn2.obs.ninja/fullchain.pem   ## CHANGE ME
+pkey=/etc/letsencrypt/live/turn2.obs.ninja/privkey.pem   ## CHANGE ME

 # verbose
 no-stdout-log
+
--- a/webrtc.js
+++ b/webrtc.js
Author	SHA1	Message	Date
Steve Seguin	588e99d581	Merge pull request #239 from steveseguin/version-10.1 Release version 10.1	2020-08-23 02:59:00 -04:00
Steve Seguin	4c4bdeb026	Release version 10.1 release notes here https://www.reddit.com/r/OBSNinja/comments/ib7vhk/version_10_released_text_chat_and_more_added_see/	2020-08-23 02:55:13 -04:00
Steve Seguin	d1d736549d	Update FUNDING.yml	2020-08-18 22:15:15 -04:00
Steve Seguin	8af2a94edc	Update FUNDING.yml	2020-08-18 21:49:36 -04:00
Steve Seguin	2a31e5508e	fixed an issue with advanced audio settings; added meter	2020-07-27 04:08:41 -04:00
Steve Seguin	dd950b1c4e	Add files via upload added translations	2020-07-17 02:25:36 -04:00
Steve Seguin	079b1e8545	Added iFrame communication and an example	2020-07-17 02:25:09 -04:00
Steve Seguin	9d1c466025	Update turnserver.conf	2020-07-05 17:11:57 -04:00
Steve Seguin	be741878e8	tweaked the auto mixer; side by side instead of over/under as default	2020-07-01 22:17:54 -04:00
Steve Seguin	7dcaf7f6f3	Delete IMG_1148.jpg	2020-06-30 04:51:54 -04:00
Steve Seguin	3719f4a4da	version 8.01 minor bug fixes	2020-06-28 21:05:33 -04:00