Add files via upload

2026-05-01 11:05:24 +00:00 · 2020-06-17 05:20:50 -04:00 · 2020-06-17 05:07:18 -04:00 · 2020-06-17 05:06:09 -04:00 · 2020-06-17 04:24:30 -04:00 · 2020-06-16 05:02:28 -04:00
22 changed files with 1865 additions and 1060 deletions
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@@ -0,0 +1,6 @@
+# These are supported funding model platforms
+
+# Thank you <3 
+
+github: [steveseguin]
+
--- a/README.md
+++ b/README.md
@@ -3,7 +3,7 @@
 ## What is OBS NINJA
 OBS.Ninja uses peer-to-peer technology to bring remote cameras into OBS. In most cases, all video data is transferred directly from peer to peer, without needing to go through any video server. This results in high-quality video with super low latency. In a small number of cases, video data may go through an encrypted TURN server, which is used to facilitate peer connections when otherwise not possible.

-OBS Ninja is not affiliated with OBS, but OBS Ninja is dependent on OBS to function. OBS.Ninja is designed to allow content creators to produce real-time live shows with OBS Studio and to allow smartphones to be used as webcams on a Windows PC. 
+OBS Ninja is not affiliated with OBS. OBS.Ninja is designed to allow content creators to produce real-time live shows with OBS Studio (or other compatible software) using remote media streams. It can also turn smartphones into wireless webcams, with additional Virtualcam software. 

 Please see the sub-reddit added info: https://reddit.com/r/obsninja  
 Also check out the FAQ for more info: https://github.com/steveseguin/obsninja/wiki
@@ -13,22 +13,22 @@ I demo the basic usage of OBS.Ninja on YouTube: https://www.youtube.com/watch?v=

 Check the subreddit for added use cases, advanced features, and support. Advanced features includes high-quality audio modes, custom video resolutions, and more.

-MacOS users will face some challenges in using OBS currently, but there are workarounds. Please see Reddit or the Wiki.
+MacOS users will face some challenges in using OBS currently, but there are workarounds. Please see the subreddit or the Wiki.

 ## What's in this repo?
-This repo contains the software for OBS.ninja and its TURN server deployment settings. Feel free to use it as you will; code contributions very welcomed. You may be best suited at getting ahold of me at steve@seguin.email instead of via Github if urgent though.
+This repo contains software for OBS.Ninja, including the HTML landing page for its Electron Capture app offering. A sample config file and instructions for setting up a TURN server (video relay server), is also provided. You may also find the Wiki for the project in this repo, which contains added information on how to use the software.

 ## How to Deploy this Repo:
-To use, just download and host on a HTTPS-enabled webserver. You may want to hide the .html extensions within your HTTP server as well, else the generated links will not work. Customize the code as desired. 
+To use, just download and host on a HTTPS-enabled webserver. You may want to hide the .html extensions within your HTTP server as well, else the generated links will not work. 

-Directions on how to deploy a TURN server are listed in the turnserver.conf file. You may wish to do so if you are having problems with my existing TURN server, although most users will not need one. About 10% of users, those often connected via 4G LTE, will require a TURN server. My TURN server does cost me money to host, which I do for free, so please do not abuse it.
-
-Why deploy OBS.Ninja? You may want to customize the UI for your brand/business, or control security/privacy beyond what I do already. I personally feel it is best to CONTRIBUTE desired changes to this repo instead, as technology moves fast and older forked versions will become obsolete. 
+Directions on how to deploy a TURN server are listed in the turnserver.conf file. You may wish to do so if you are having problems with my existing TURN server, although most users will not need one. About 10% of users, those often connected via 4G LTE, will require a TURN server. 

 ## Server side / API software?
-Other than the hosted TURN server, OBS.Ninja uses public STUN servers and a hosted handshake server. These are used to facilitate the initial setup of peer connections and are not required after a peer connection is established. Development builds of OBS.Ninja may include debugging software, but in-production releases have this removed.
+Since OBS.Ninja uses peer-2-peer technology, video connections are made directly between viewer and publisher in 90% of cases. Hosting a TURN server yourself may help improve performance, but less than 1% of users will see any benefit of this. Details on how to deploy a TURN server are provided. For those capable of hosting their own TURN server, that would be appreciated if possible, as TURN servers are the only real cost incurred by OBS.Ninja at present. (other than time, of course)

-A design goal of OBS.Ninja is to be serverless and we are 99% of the way there. This design objective ensures OBS.Ninja can be offered for free, along with providing increased levels of security and privacy.
+Other than TURN servers, OBS.Ninja also uses public STUN servers and a hosted handshake server. These are used to facilitate the initial setup of peer connections and are generally not required after a peer connection is established. Development builds of OBS.Ninja may include debugging software, but in-production releases have this removed. 
+
+A design goal of OBS.Ninja is to be serverless and we are 99% of the way there. This design objective ensures OBS.Ninja can be offered for free, along with providing increased levels of security and privacy. 

 ## Issues? problems? Not working?

@@ -47,13 +47,18 @@ https://github.com/steveseguin/electroncapture
 A website designed to also work with OBS.Ninja as a Broadcasting tool. Share your webcam, window, desktop, or video file with friends and family. Peer-2-peer, so privacy can be maintained, but you can also list your broadcasts for others to watch.
 https://steves.app/

+#### StageTen.tv
+A browser-based studio solution and simplified alternative to OBS, with built-in OBS.Ninja functionality. It is a server-based approach to group interactions and live production. Steve Seguin is affiliated with StageTen, yet StageTen is not affiliated with OBS.Ninja.
+
 ## Privacy
-I try to avoid data collection whenever possible and video streams are generally designed to be private, but use at your own risk. It is best to not share links created with OBS.Ninja with those you do not trust. I've provided instructions on how to deploy a TURN server if IP-address privacy is an issue for you. See: turnserver.conf
+I try to avoid data collection whenever possible and video streams are generally designed to be private, but use at your own risk. It is best to not share links created with OBS.Ninja with those you do not trust. I've provided instructions on how to deploy a TURN server if IP-address privacy is an issue for you. See: turnserver.conf 
+
+https://obs.ninja may unavoidably use cookies that are exempt from EU laws of requiring notice of their use; they are exempt as they are required and necessary for the technical functioning of the web service. Our webserver is cached by Cloudflare and it provides denial of server protection for the users of OBS.Ninja.

 Additional security features are being added weekly on request. Please ask about these options if added security and privacy are requirements for you.

 ## Feedback
-Idea, feed back, bugs, etc -- all welcomed.  I'm dumping many of my ideas as issues into Github. Feedback is typcially most welcomed via Email or Discord.
+Ideas, feedback, bugs, etc -- all welcomed.  I'm dumping many of my ideas as issues into Github. Feedback is typcially most welcomed via Email or Discord.

 ## Licence 
 OBS.Ninja is available as open-source; please see the LICENCE.md file for details.
--- a/electron.html
+++ b/electron.html
@@ -75,21 +75,31 @@ input[type='checkbox']:checked {
 <body >

 <div id="header" style="-webkit-app-region: drag;color:white;font-size:2em">OBS.Ninja</div>
-<div class="formcss"   >
+<div class="formcss" >
+
 	<input type="checkbox" class="check" id="prefervp9" name="prefervp9" value="false" onclick="modURL(this);">
 	<label for="prefervp9">Force VP9 Codec</label>
+	
 	<input type="checkbox" class="check" id="showcursor" name="showcursor" value="false" onclick="modURL(this);">
 	<label for="showcursor">Show Mouse Cursor</label>
+	
 	<input type="checkbox" class="check"  id="highbitrate" name="highbitrate" value="false" onclick="modURL(this);">
 	<label for="highbitrate">High Video Bitrate</label>
+	
 	<input type="checkbox" class="check" id="stereo" name="stereo" value="false" onclick="modURL(this);">
-	<label for="stereo">Pro Audio Mode</label><br><br><br>
-	<div class="formcss">
-    <input type="text" id="changeText" class="inputfield" value="http://obs.ninja/?view=" onchange="modURL"   onkeyup="enterPressed(event, gohere);" />
-	<button  onclick="gohere();" id="gobutton">GO</button>
-	<br><br>
-	<label for="audioOutput">Audio output destination: </label><select id="audioOutput" style="max-width:400px"></select>
-	</div>
+	<label for="stereo">Pro Audio Mode</label>
+	
+	<input type="checkbox" class="check" id="buffer" name="buffer" value="false" onclick="modURL(this);">
+	<label for="buffer">Lip-sync Fix</label>
+	
+	<br><br><br>
+	<div class="formcss"><center>
+		<input type="text" id="changeText" class="inputfield" value="http://obs.ninja/?view=" onchange="modURL"   onkeyup="enterPressed(event, gohere);" />
+		<button  onclick="gohere();" id="gobutton">GO</button>
+		<br><br>
+		<label for="audioOutput">Audio output destination: </label><select id="audioOutput" style="max-width:400px"></select>
+		
+	</center></div>
 </div>


@@ -121,7 +131,7 @@ function getPermssions(e){
 		return;
 	} 
 	e.currentTarget.blur();
-	navigator.mediaDevices.getUserMedia({audio: true,video: false}).then(function(stream){
+	navigator.mediaDevices.getUserMedia({audio: true,video: false}).then((stream)=>{
 		navigator.mediaDevices.enumerateDevices().then(gotDevices).catch(console.error); // list all devices
 		stream.getTracks().forEach(track => {
 		    track.stop();
@@ -207,10 +217,13 @@ function updateURLParameter(url, param, paramVal){
        if(TheParams){baseURL = TheParams;}
    }

-	if (paramVal==false){
+	if (paramVal===false){
 		temp="";
 		if(TheAnchor){temp += "#" + TheAnchor;}
 		var rows_txt = temp
+	} else if  (paramVal===""){
+		if(TheAnchor){paramVal += "#" + TheAnchor;}
+		var rows_txt = temp + "" + param;
 	} else {
 		if(TheAnchor){paramVal += "#" + TheAnchor;}
 		var rows_txt = temp + "" + param + "=" + paramVal;
@@ -230,7 +243,7 @@ function modURL(ele=false){
 	console.log(url);
 	if ((url.split("view").length>0) || (url.split("room").length>0)){
 			if (!document.getElementById("showcursor").checked){
-				url=updateURLParameter(url, "nocursor", "1");
+				url=updateURLParameter(url, "nocursor", "");
 			} else {
 				url=updateURLParameter(url, "nocursor", false);
 			}
@@ -254,12 +267,20 @@ function modURL(ele=false){
 			  
 			  if (ele.id =="stereo"){
 				if (document.getElementById("stereo").checked){
-					url=updateURLParameter(url, "stereo", "1");
+					url=updateURLParameter(url, "stereo", "");
 					alert('Audio bitrate increased to 256kbps.\n\nPlease note: the Video Publisher must also have the stereo flag enabled for stereo to work.');
 				} else {
 					url=updateURLParameter(url, "stereo", false);
 				}
 			  }
+			  
+			  if (ele.id =="buffer"){
+				if (document.getElementById("buffer").checked){
+					url=updateURLParameter(url, "buffer", "");
+				} else {
+					url=updateURLParameter(url, "buffer", false);
+				}
+			  }
 		}
 		  
 	}
--- a/images/icon.png
+++ b/images/icon.png
--- a/index.html
+++ b/index.html
@@ -2,24 +2,68 @@
 <head>
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
-<meta name="copyright" content="&copy; 2020 Stephen Seguin" />
 <meta content="utf-8" http-equiv="encoding">
+
+<meta name="copyright" content="&copy; 2020 Steve Seguin" />
 <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
 <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"> 
+
+
+<!-- Primary Meta Tags -->
+<title>OBS.Ninja</title>
+<meta name="title" content="OBS.Ninja">
+<meta name="description" content="Bring live video from your smartphone, computer, or friends directly into OBS Studio. 100% free.">
+<meta name="author" content="Steve Seguin">
+
+<!-- Open Graph / Facebook -->
+<meta property="og:site_name" content="OBS.Ninja" />
+<meta property="og:type" content="website" />
+<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 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">
+
+<!-- Twitter -->
+<meta property="twitter:card" content="summary_large_image">
+<meta property="twitter:url" content="https://obs.ninja/">
+<meta property="twitter:title" content="OBS.Ninja">
+<meta property="twitter:description" content="Bring live video from your smartphone, computer, or friends directly into OBS Studio. 100% free.">
+<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> -->
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-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" />
+
 </head>
-<body  id="main" class="cat">
-	<script language="javascript" type="text/javascript" src="./CodecsHandler.js"></script>
-	<script language="javascript" type="text/javascript" src="./webrtc.js?version=12"></script>
+<body id="main" class="cat">
+	<span itemprop="image" itemscope itemtype="image/png"> 
+      <link itemprop="url" href="./images/obsNinja_logo_full.png"> 
+    </span>
+	
+	<link itemprop="thumbnailUrl" href="./images/obsNinja_logo_full.png"> 
+	<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=2"></script>
+	<script language="javascript" type="text/javascript" src="./webrtc.js?ver=3"></script>
 	<input id='zoomSlider'type="range" style="display:none">
 	<div id="header">
 		<font style="font-size:130%;">
@@ -27,7 +71,8 @@
 			<span data-translate="logo-header"><font id="qos">O</font>BS.Ninja </a></span>
 			<div id="head1" style="display:inline-block;position:relative;">
 				<input id="joinroomID" name="joinroomID" size=26 placeholder=" Join by Room Name here"></input>
-				<button style="padding:0px;margin: 0 0" onclick="jumptoroom();">&nbsp;<span data-translate="GO">GO</span>&nbsp;</button>
+				<button style="padding:0px;margin: 0 0;background-color:#CCC;" onclick="jumptoroom();">&nbsp;<span data-translate="GO">GO</span>&nbsp;</button>
+				
 			</div>
 			<div id="head3" style="display:inline-block" class='advanced'>
 				<font style='font-size:80%;color:#888' id="copythisurl"> &nbsp; <span data-translate="copy-this-url">Copy this URL into an OBS "Browser Source"</span> =>  &nbsp; </font>
@@ -46,18 +91,23 @@
 			</div>

 		</font>
+		<span onclick="toggle(document.getElementById('languages'));" id="translateButton" style="cursor:pointer;" ><i style="float:right; bottom:0px; cursor:pointer; position: absolute;right: 10px;color: #D9E4EB;padding: 0;margin:2px 2px 0 0 ; font-size: 140%;" class="fa fa-language" aria-hidden="true"></i></span>
+				
 		<hr />
 	</div>

 	<div id="mutebutton" onclick="toggleMute()" class='advanced float3' style="cursor:pointer" alt="Toggle the mic">
-		<i style="font-size:48px;color:white" id="mutetoggle" class="fa fa-microphone my-float"></i>
+		<i id="mutetoggle" class="toggleSize fa fa-microphone my-float"></i>
 	</div>
-	<div id="helpbutton" 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.\n\nMacOS users should be using OBS v23 due to a bug in v24 and v25')"  class='advanced float2' style="cursor:pointer" alt="How to Use This with OBS">
-		<i style="font-size:48px;color:white;" class="fa fa-question-circle my-float"></i>
+	<div id="mutevideobutton" onclick="toggleVideoMute()" class='advanced float4' style="cursor:pointer" alt="Toggle the camera">
+		<i id="mutevideotoggle" class="toggleSize fa fa-eye my-float"></i>
+	</div>
+	<div id="helpbutton" 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.')"  class='advanced float2' style="cursor:pointer" alt="How to Use This with OBS">
+		<i class="toggleSize fa fa-question-circle my-float"></i>
 	</div>

-	<div id="mainmenu" class="row" style="align:center;">
-		<div id="container-1" class="column columnfade" style="background-color:#ddd;">
+	<div id="mainmenu" class="row" style="opacity: 0; align:center;">
+		<div id="container-1" class="column columnfade" style="background-color:#ddd;overflow-y:auto;">
 			<h2><span data-translate="add-group-chat">Add Group Chat to OBS</span></h2>
 			<div class="container-inner">
 				<br /><br /><span data-translate="rooms-allow-for">Rooms allow for simplified group-chat and the advanced management of multiple streams at once.</span><br /><br />
@@ -72,11 +122,9 @@
 				<span data-translate="added-notes">
 				<u><i>Added Notes:</i></u>
 				<li>Anyone can enter a room if they know the name, so keep it unique</li>
-				<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>
-				<li>iOS devices are limited to group sizes of no more than two (2) people. This is a hardware limitation.</li>
-				<li>The "Recording" option is new and is considered experimental.</li>
-				<li>You must "Add" a video feed to the "Group Scene" for it to appear there.</li>
-				<li>There is a new "enhanced fullscreen" button added to the Guest's view.</li>
+				<li>Invite only guests to the room you trust.</li>
+				<li>iOS devices will share just their audio with other guests; this is mainly a hardware limitation</li>
+				<li>The "Recording" option is considered experimental.</li>
 				</span>
 				</ul>
 			</div>
@@ -87,31 +135,38 @@
 			</div>
 		</div>

-		<div id="container-3" class="column columnfade" onclick="previewWebcam()"  style="background-color:#ddd;">
+		<div id="container-3" class="column columnfade" onclick="previewWebcam()"  style="background-color:#ddd;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><span data-translate="select-audio-video">Select the audio/video source below</span></p>
-				<button onclick="publishWebcam()" id="gowebcam" class="gowebcam"><span data-translate="waiting-for-camera">Waiting for Camera to Load</span></button>
-				<p><video id="previewWebcam" oncanplay="updateStats();"  muted controls autoplay playsinline style="max-width:640px; max-width:83vw; max-height:30vh"></video>
 				
-				</p>
+				<p><video id="previewWebcam" oncanplay="updateStats();"  muted controls autoplay playsinline style="max-width:640px; max-width:83vw; max-height:30vh"></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/>
-				<p><span data-translate="video-source">Video source</span>: <select id="videoSource"></select></p><br/>
 				
-				<form id="webcamquality">
-				<input type="radio" id="fullhd" name="resolution" value="0">
-				<label for="fullhd"><span data-translate="max-resolution">Max Resolution</span> </label> | 
-				<input type="radio" checked id="halfhd" name="resolution" value="1">
-				<label for="halfhd"><span data-translate="balanced">Balanced</span> </label> | 
-				<input type="radio" id="nothd" name="resolution" value="3">
-				<label for="nothd"><span data-translate="smooth-cool">Smooth and Cool</span></label>
-				</form>
-				<center><div id="webcamstats" ></div></center><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>: <select id="videoSource" style="background-color: #FFF; padding:5px; display: display:inline-block;vertical-align: middle;"></select>
+					<span id="gear_webcam" style="display:inline-block" onclick="toggle(document.getElementById('videoSettings'));">
+						&nbsp;&nbsp;<i class="fa fa-cog" style="font-size: 170%; 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;">
+					<form id="webcamquality">
+					<input type="radio" id="fullhd" name="resolution" value="0">
+					<label for="fullhd"><span data-translate="max-resolution">Max Resolution</span> </label> | 
+					<input type="radio" checked id="halfhd" name="resolution" value="1">
+					<label for="halfhd"><span data-translate="balanced">Balanced</span> </label> | 
+					<input type="radio" id="nothd" name="resolution" value="2">
+					<label for="nothd"><span data-translate="smooth-cool">Smooth and Cool</span></label>
+					<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" class="title"><span data-translate="select-audio-source">Select Audio Sources</span>:<i class="fa fa-chevron-down" aria-hidden="true"></i> </div>
+						<div id="audioTitle"  style="padding:5px" class="title"><span data-translate="select-audio-source">Select Audio Source</span>:<i class="fa fa-chevron-down" aria-hidden="true"></i> </div>
 					</a>
 					<ul id="audioSource" class="multiselect-contents">
 						<li><input type="checkbox" id="multiselect1" name="multiselect1" style="display:none" checked value="ZZZ"> <label for="multiselect1">
@@ -128,16 +183,34 @@
 			</div>
 		</div>

-		<div id="container-2" class="column columnfade" style="background-color:#ddd;">
+		<div id="container-2" class="column columnfade" style="background-color:#ddd;overflow-y:auto;">
 			<h2 id="add_screen"><span data-translate="remote-screenshare-obs">Remote Screenshare into OBS</span></h2>
 			<div class="container-inner">
 				<p><span data-translate="note-share-audio">
 					<b>note</b>: Do not forget to click "Share audio" in Chrome.<br />(Firefox does not support audio sharing.)</p>
-					<p><img src="./images/share.jpg" style="max-height:55vh"/></p>
+					<p><img id="screenshare" /></p>
 				</span>
 				<br />
-				<button style="padding:10px;border:3px solid #CCC; cursor:pointer; background-color:#FFF" onclick="publishScreen()" ><span data-translate="select-screen-to-share">SELECT SCREEN TO SHARE</span></button>
-				<br /><br />
+				<button style="padding:13px;border:3px solid #CCC; font-size:140%; cursor:pointer; background-color:#FFF" onclick="publishScreen()" ><span data-translate="select-screen-to-share">SELECT SCREEN TO SHARE</span></button>
+				
+				<span id="gear_screen" style="display:inline-block ;cursor:pointer;" onclick="toggle(document.getElementById('videoSettings2'));">
+					&nbsp;&nbsp;<i class="fa fa-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;">
+					<form id="webcamquality2">
+					<input type="radio" id="fullhd2" name="resolution2" value="0">
+					<label for="fullhd"><span data-translate="max-resolution">1080p (hi-def)</span> </label> &nbsp;&nbsp;|&nbsp;&nbsp;
+					<input type="radio" checked id="halfhd2" name="resolution2" value="1">
+					<label for="halfhd"><span data-translate="balanced">720p (balanced)</span> </label> &nbsp;&nbsp;|&nbsp;&nbsp;
+					<input type="radio" id="nothd2" name="resolution2" value="2">
+					<label for="nothd"><span data-translate="smooth-cool">360p (smooth)</span></label>
+					<div id="webcamstats2" style="padding:5px 0 0 0"></div>
+					</form>
+				</span><br/>
+				</center>
 				<p><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();">
 				<option value="screenshare" selected><span data-translate="screen-shrae-audio">Screen Share Audio (default)</span></option>
@@ -151,20 +224,49 @@
 			</div>
 		</div>

-		<div id="container-4" class="column columnfade" style="background-color:#ddd;">
+		<div id="container-4" class="column columnfade" style="background-color:#ddd;overflow-y:auto;">
 			<h2><span data-translate="create-reusable-invite">Create Reusable Invite</span></h2>
 			<div id="gencontent" class="container-inner">
 				<br /><br />
 				<span data-translate="here-you-can-pre-generate">Here you can pre-generate a reusable Browser Source link and a related guest invite link.</span><br /><br />
 				<p><input style="padding:5px;font-size:120%;" id="videoname4" onkeyup="enterPressed(event, generateQRPage);" placeholder="Give this media source a name (optional)" size=35 maxlength=70 style="padding:5px;" /></br ><br /></p>
-				<button style="padding:20px;" onclick="generateQRPage()" ><span data-translate="generate-invite-link">GENERATE THE INVITE LINK</span></button><br /><br /><br />
-				<div style="margin:20px;max-width:330px;text-align:left;margin:auto auto;;">
-				<h5 style="padding:0 0 10px 0"><i><span data-translate="advanced-paramaters">Advanced Parameters</span></i></h5>
+				<button style="padding:20px;" onclick="generateQRPage()" ><span data-translate="generate-invite-link">GENERATE THE INVITE LINK</span></button><br /><br />
+				<div style="margin:20px;max-width:400px;text-align:left;margin:auto auto;;">
+				<br />
+				<h4 style="padding:0 0 10px 0"><i><span data-translate="advanced-paramaters">Advanced Options:</span></i></h4><br />
 				<input type="checkbox" id="invite_bitrate" /><label for="invite_bitrate"> <span data-translate="unlock-video-bitrate">Unlock Video Bitrate (20mbps)</span></label><br />
 				<input type="checkbox" id="invite_vp9" /><label for="invite_vp9"> <span data-translate="force-vp9-video-codec">Force VP9 Video Codec (less artifacting)</span></label><br />
 				<input type="checkbox" id="invite_stereo" /><label for="invite_stereo"> <span data-translate="enable-stereo-and-pro">Enable Stereo and Pro HD Audio</span></label><br />
-				<input type="checkbox" id="invite_secure" /><label for="invite_secure"> <span data-translate="high-security-mode">High Security Mode</span></label><br /><br />
-				<div>See the <a style="text-decoration:none;color:blue;" target="_blank" href="https://docs.obs.ninja/advanced">documentation</a> for more options.</div>
+				
+				<br /><label for="invite_quality" data-translate="video-resolution">Video Resolution: </label>
+				<select id="invite_quality" name="invite_quality">
+					<option value="-1" selected>User Selectable</option>
+					<option value="0">Maximum Resolution</option>
+					<option value="1">Balanced</option>
+					<option value="2">Smooth and Cool</option>
+				</select>
+				<br /><br />
+				
+				<input type="checkbox" id="invite_secure" /><label for="invite_secure"> <span data-translate="high-security-mode">High Security Mode</span></label><br />
+				<input type="checkbox" id="invite_hidescreen" /><label for="invite_hidescreen"> <span data-translate="hide-screen-share">Hide Screenshare Option</span></label><br />
+				<input type="checkbox" id="invite_remotecontrol" /><label for="invite_remotecontrol"> <span data-translate="allow-remote-control">Remote Control Camera Zoom (android)</span></label>
+				
+				<br /><br /><br />
+				
+				<span data-translate="add-the-guest-to-a-room"> Add the guest to a room:</span>
+				<input id="invite_joinroom" placeholder="Enter Room name here" oninput="document.getElementById('invitegroupchat').style.display='block';" /><br /><br />
+				
+				<span id="invitegroupchat" style="display:none;">
+				<label for="invite_group_chat_type" data-translate="invite-group-chat-type">This room guest can:</label>
+				<select id="invite_group_chat_type" name="invite_group_chat_type">
+					<option value="0" selected data-translate="can-see-and-hear">Can see and hear the group chat</option>
+					<option value="1" data-translate="can-hear-only">Can only hear the group chat</option>
+					<option value="2" data-translate="cant-see-or-hear">Cannot hear or see the group chat</option>
+				</select>
+				</span>
+				<br /><br /><br />
+				
+				<div>See the <a style="text-decoration:none;color:blue;" target="_blank" href="https://docs.obs.ninja/advanced">documentation</a> for more options and info.</div>
 				</div>
 				
 			</div>
@@ -182,20 +284,18 @@
 					<span data-translate="info-blob">
 						<h2>What is OBS.Ninja</h2><br />
 						<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>
-						<li>Bring video from your smartphone, laptop, computer, or from your friends directly into your OBS video stream</li>
+						<li>Bring video from your smartphone, computer, or friends directly into your OBS video stream</li>
 						<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</li>
 						<br />
 						<li>Youtube video <i class="fa fa-youtube-play" aria-hidden="true"></i> <a href="https://www.youtube.com/watch?v=6R_sQKxFAhg">Demoing it here</a> </li>
-						<li>Code is available here: <i class="fa fa-github" aria-hidden="true"></i> <a href="https://github.com/steveseguin/obsninja">https://github.com/steveseguin/obsninja</a> </li>
-						<li>You can also check out <a href="https://steves.app">my other video app</a> designed for sharing video with friends and family</li>
 						<br />
 						<i><font style="color:red">Known issues:</font></i><br />

-						<li><i class="fa fa-apple" aria-hidden="true"></i> MacOS users need to use OBS v23 or resort to <i>Window Capturing</i> a Chrome Browser with OBS v25</li>
-						<li>Some users will have "pixelation" problems with videos. Please add the URL parameter <b>&codec=vp9</b> to the OBS Links to correct it.</li>
+						<li><i class="fa fa-apple" aria-hidden="true"></i> <a href='https://github.com/steveseguin/obsninja/wiki/FAQ#mac-os'>MacOS users</a> need to use OBS v23 or resort to <a href="https://github.com/steveseguin/electroncapture">Window Capturing</a> a browser with OBS v25</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.</li>
 						<br />
 						
-						Site last updated: <a href='https://www.reddit.com/r/OBSNinja/comments/gf5pd3/new_version_released_today_along_with_new/'>May 7th, 2020.</a> The previous version can be found at <a href="https://obs.ninja/v3/">https://obs.ninja/v3/</a> if you are having new issues.
+						Site last updated: June 17th, 2020. The previous version can be found at <a href="https://obs.ninja/v6/">https://obs.ninja/v6/</a> if you are having new issues.

 						<br /><br />
 						<i><h3>Check out the <a href="https://www.reddit.com/r/OBSNinja/">sub-reddit</a> <i class="fa fa-reddit-alien" aria-hidden="true"></i> for help and advanced info. I'm also on <a href="https://discord.gg/EksyhGA">Discord</a> and you can email me at steve@seguin.email</i></h3>
@@ -217,7 +317,7 @@
 				<b><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);"><span data-translate="add-to-group">Add to Group Scene</span></button>
 				<button style="font-size:112%" onclick="directMute(this);"><span data-translate="mute">Mute</span></button>
-				<button style="font-size:112%" onclick="var video = document.getElementById('videosource_'+this.parentNode.parentNode.dataset.UUID);video.recorder=recordVideo(event,video,this.parentNode.parentNode.dataset.UUID);"><span data-translate="record">Record</span></button>
+				<button style="font-size:112%" onclick="var video = document.getElementById('videosource_'+this.parentNode.parentNode.dataset.UUID);recordVideo(event.currentTarget,video,this.parentNode.parentNode.dataset.UUID);"><span data-translate="record">Record</span></button>
 				<br /><span data-translate="volume">Volume</span>:<input type="range" min="1" max="100" value="100" onclick="directVolume(this);"><br />
 			<br /><hr /></center>
 	</div>
@@ -233,7 +333,79 @@
  </nav>
  <div id="messagePopup" class="popup-message">
  </div>
-	<script type="text/javascript" src="./main.js?ver=12"></script>
+  <div id="languages" class="popup-message" style="display:none;right:0;bottom:25px;position:absolute;">
+	  <b>Available Languages:</b><br />
+	  <u>
+	  <a onclick="changeLg('ru');toggle(document.getElementById('languages'));" style="cursor:pointer">Russian</a><br />
+	  <a onclick="changeLg('fr');toggle(document.getElementById('languages'));" style="cursor:pointer">French</a><br />
+	  <a onclick="changeLg('en');toggle(document.getElementById('languages'));" style="cursor:pointer">English</a><br />
+	  <a onclick="changeLg('pt');toggle(document.getElementById('languages'));" style="cursor:pointer">Portuguese </a><br />
+	  <a onclick="changeLg('it');toggle(document.getElementById('languages'));" style="cursor:pointer">Italian </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
+		
+		session.configuration = 
+			{iceServers: [
+				{ urls: ["stun:stun.l.google.com:19302", "stun:stun4.l.google.com:19302" ]} // more than 4 stun+turn servers may cause issues
+			]};
+			
+		var turn = {};
+        turn.username = "steve";
+        turn.credential = "justtesting";
+        turn.urls = ["turn:turn.obs.ninja:443"]; // US CENTRAL
+        session.configuration.iceServers.push(turn);
+		
+		turn = {};
+        turn.username = "steve";
+        turn.credential = "justtesting";
+        turn.urls = ["turn:turn2.obs.ninja:443"];  // US WEST
+        session.configuration.iceServers.push(turn);
+		
+		// session.configuration.iceTransportPolicy = "relay";  // uncomment to enable "&privacy" and force the TURN server
+		
+		///// The following lets you set the defaults
+		
+		// session.webcamonly // true,false
+		// session.stereo // 0,1,2,3
+		// session.audiobitrate // int in kbps
+		// session.view // "xxxx"
+		// session.remote
+		// session.optimize
+		// session.disableOBS
+		// session.audio 
+		// session.video
+		// session.forceios
+		// session.nocursor
+		// session.codec
+		// session.scale
+		// session.bitrate  // int in kbps
+		// session.height // int 
+		// session.width // int 
+		// session.quality // int 
+		// session.sink 
+		// session.offsetChannel // int 
+		// session.audioChannels // int 
+		// session.security 
+		// session.framerate // int 
+		// session.sync
+		// session.buffer // int in milliseconds
+		// session.roomid // "yyyy"
+		// 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" id="main-js" src="./main.js?ver=5"></script>
 	<script type="text/javascript" src="./animations.js"></script>
 </body>

--- a/main.css
+++ b/main.css
--- a/main.js
+++ b/main.js
--- a/thirdparty/CodecsHandler.js
+++ b/thirdparty/CodecsHandler.js
@@ -21,6 +21,9 @@ Copyright (c) 2012-2020 [Muaz Khan](https://github.com/muaz-khan)
 	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 *
+
 var CodecsHandler = (function() {
    function preferCodec(sdp, codecName) {
        var info = splitLines(sdp);
@@ -118,16 +121,11 @@ var CodecsHandler = (function() {

        return info;
    }
-
-    function removeVPX(sdp) {
-        var info = splitLines(sdp);
-
-        // last parameter below means: ignore these codecs
-        sdp = preferCodecHelper(sdp, 'vp9', info, true);
-        sdp = preferCodecHelper(sdp, 'vp8', info, true);
-
-        return sdp;
-    }
+	
+	function extractSdp(sdpLine, pattern) {
+		var result = sdpLine.match(pattern);
+		return (result && result.length == 2)? result[1]: null;
+	}

    function disableNACK(sdp) {
        if (!sdp || typeof sdp !== 'string') {
@@ -142,72 +140,7 @@ var CodecsHandler = (function() {
        return sdp;
    }

-    function prioritize(codecMimeType, peer) {
-        if (!peer || !peer.getSenders || !peer.getSenders().length) {
-            return;
-        }
-
-        if (!codecMimeType || typeof codecMimeType !== 'string') {
-            throw 'Invalid arguments.';
-        }
-
-        peer.getSenders().forEach(function(sender) {
-            var params = sender.getParameters();
-            for (var i = 0; i < params.codecs.length; i++) {
-                if (params.codecs[i].mimeType == codecMimeType) {
-                    params.codecs.unshift(params.codecs.splice(i, 1));
-                    break;
-                }
-            }
-            sender.setParameters(params);
-        });
-    }
-
-    function removeNonG722(sdp) {
-        return sdp.replace(/m=audio ([0-9]+) RTP\/SAVPF ([0-9 ]*)/g, 'm=audio $1 RTP\/SAVPF 9');
-    }
-
-    function setBAS(sdp, bandwidth, isScreen) {
-        if (!bandwidth) {
-            return sdp;
-        }
-
-        if (typeof isFirefox !== 'undefined' && isFirefox) {
-            return sdp;
-        }
-
-        if (isScreen) {
-            if (!bandwidth.screen) {
-                console.warn('It seems that you are not using bandwidth for screen. Screen sharing is expected to fail.');
-            } else if (bandwidth.screen < 300) {
-                console.warn('It seems that you are using wrong bandwidth value for screen. Screen sharing is expected to fail.');
-            }
-        }
-
-        // if screen; must use at least 300kbs
-        if (bandwidth.screen && isScreen) {
-            sdp = sdp.replace(/b=AS([^\r\n]+\r\n)/g, '');
-            sdp = sdp.replace(/a=mid:video\r\n/g, 'a=mid:video\r\nb=AS:' + bandwidth.screen + '\r\n');
-        }
-
-        // remove existing bandwidth lines
-        if (bandwidth.audio || bandwidth.video) {
-            sdp = sdp.replace(/b=AS([^\r\n]+\r\n)/g, '');
-        }
-
-        if (bandwidth.audio) {
-            sdp = sdp.replace(/a=mid:audio\r\n/g, 'a=mid:audio\r\nb=AS:' + bandwidth.audio + '\r\n');
-        }
-
-        if (bandwidth.screen) {
-            sdp = sdp.replace(/a=mid:video\r\n/g, 'a=mid:video\r\nb=AS:' + bandwidth.screen + '\r\n');
-        } else if (bandwidth.video) {
-            sdp = sdp.replace(/a=mid:video\r\n/g, 'a=mid:video\r\nb=AS:' + bandwidth.video + '\r\n');
-        }
-
-        return sdp;
-    }
-
+  
    // Find the line in sdpLines that starts with |prefix|, and, if specified,
    // contains |substr| (case-insensitive search).
    function findLine(sdpLines, prefix, substr) {
@@ -236,21 +169,41 @@ var CodecsHandler = (function() {
        return (result && result.length === 2) ? result[1] : null;
    }

-    function setVideoBitrates(sdp, params) {
+    function setVideoBitrates(sdp, params, codec) {  // modified + Improved by Steve.
+		
+		if (codec){
+			codec = codec.toUpperCase();
+		} else{
+			codec="VP8";
+		}
+		
+		var sdpLines = sdp.split('\r\n');
+
+		// Search for m line.
+		var mLineIndex = findLine(sdpLines, 'm=', 'video');
+		if (mLineIndex === null) {
+			return sdp;
+		}
+		// Figure out the first codec payload type on the m=video SDP line.
+		var videoMLine = sdpLines[mLineIndex];
+		var pattern = new RegExp('m=video\\s\\d+\\s[A-Z/]+\\s');
+		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;
-        var xgoogle_max_bitrate = params.max;
+        var xgoogle_min_bitrate = params.min.toString();
+        var xgoogle_max_bitrate = params.max.toString();

-        var sdpLines = sdp.split('\r\n');
-
-        // VP8
-        var vp8Index = findLine(sdpLines, 'a=rtpmap', 'VP8/90000');
-        var vp8Payload;
-        if (vp8Index) {
-            vp8Payload = getCodecPayloadType(sdpLines[vp8Index]);
+        var codecIndex = findLine(sdpLines, 'a=rtpmap', codec+'/90000');
+        var codecPayload;
+        if (codecIndex) {
+            codecPayload = getCodecPayloadType(sdpLines[codecIndex]);
        }

-        if (!vp8Payload) {
+        if (!codecPayload) {
            return sdp;
        }

@@ -267,7 +220,7 @@ var CodecsHandler = (function() {
        var rtxFmtpLineIndex = findLine(sdpLines, 'a=fmtp:' + rtxPayload.toString());
        if (rtxFmtpLineIndex !== null) {
            var appendrtxNext = '\r\n';
-            appendrtxNext += 'a=fmtp:' + vp8Payload + ' x-google-min-bitrate=' + (xgoogle_min_bitrate || '228') + '; x-google-max-bitrate=' + (xgoogle_max_bitrate || '228');
+            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);
            sdp = sdpLines.join('\r\n');
        }
@@ -357,26 +310,18 @@ var CodecsHandler = (function() {
    }

    return {
-        removeVPX: removeVPX,
        disableNACK: disableNACK,
-        prioritize: prioritize,
-        removeNonG722: removeNonG722,
-        setApplicationSpecificBandwidth: function(sdp, bandwidth, isScreen) {
-            return setBAS(sdp, bandwidth, isScreen);
-        },
-        setVideoBitrates: function(sdp, params) {
-            return setVideoBitrates(sdp, params);
+       
+        setVideoBitrates: function(sdp, params, codec) {
+            return setVideoBitrates(sdp, params, codec);
        },
        setOpusAttributes: function(sdp, params) {
            return setOpusAttributes(sdp, params);
        },
-        preferVP9: function(sdp) {
-            return preferCodec(sdp, 'vp9');
-        },
+
        preferCodec: preferCodec,
+		
        forceStereoAudio: forceStereoAudio
    };
 })();

-// backward compatibility
-window.BandwidthHandler = CodecsHandler;
--- a/translations/blank.json
+++ b/translations/blank.json
@@ -0,0 +1,51 @@
+{
+  "GO": "GO",
+  "add-group-chat": "Add Group Chat",
+  "add-to-group": "Add to Group Scene",
+  "add-your-camera": "Add your Camera",
+  "added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Anyone can enter a room if they know the name, so keep it unique</li>\n\t\t\t\t<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>\n\t\t\t\t<li>iOS devices will have their video only be visible to the director. This is a hardware limitation.</li>\n\t\t\t\t<li>The \"Recording\" option is new and is considered experimental.</li>\n\t\t\t\t<li>You must \"Add\" a video feed to the \"Group Scene\" for it to appear there.</li>\n\t\t\t\t<li>There is a new \"enhanced fullscreen\" button added to the Guest's view.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Advanced Parameters",
+  "audio-sources": "Audio Sources",
+  "back": "Back",
+  "balanced": "Balanced",
+  "copy-this-url": "Sharable Link to this video",
+  "copy-to-clipboard": "Copy to Clipboard",
+  "create-reusable-invite": "Create Reusable Invite",
+  "enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
+  "enter-the-rooms-control": "Enter the Room's Control Center",
+  "force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
+  "generate-invite-link": "GENERATE THE INVITE LINK",
+  "here-you-can-pre-generate": "Here you can pre-generate a reusable view link and a related guest invite link.",
+  "high-security-mode": "High Security Mode",
+  "info-blob": "",
+  "joining-room": "You are joining room",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS Ninja",
+  "max-resolution": "Max Resolution",
+  "mute": "Mute",
+  "no-audio": "No Audio",
+  "note-share-audio": "\n\t\t\t\t\t<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
+  "open-in-new-tab": "Open in new Tab",
+  "record": "Record",
+  "remote-control-for-obs": "Remote Control",
+  "remote-screenshare-obs": "Remote Screenshare",
+  "room-name": "Room Name",
+  "rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
+  "select-audio-source": "Select Audio Sources",
+  "select-audio-video": "Select the audio/video source below",
+  "select-screen-to-share": "SELECT SCREEN TO SHARE",
+  "show-tips": "Show me some tips..",
+  "smooth-cool": "Smooth and Cool",
+  "unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
+  "video-source": "Video source",
+  "volume": "Volume",
+  "you-are-in-the-control-center": "You are in the room's control center",
+  "waiting-for-camera": "Waiting for Camera to Load",
+  "video-resolution": "Video Resolution: ",
+  "hide-screen-share": "Hide Screenshare Option",
+  "allow-remote-control": "Remote Control Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Add the guest to a room:",
+  "invite-group-chat-type": "This room guest can:",
+  "can-see-and-hear": "Can see and hear the group chat",
+  "can-hear-only": "Can only hear the group chat",
+  "cant-see-or-hear": "Cannot hear or see the group chat"
+}
--- a/translations/default.json
+++ b/translations/default.json
@@ -0,0 +1,50 @@
+{
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "GO": "GO",
+  "copy-this-url": "Copy this URL into an OBS \"Browser Source\"",
+  "you-are-in-the-control-center": "You are in the room's control center",
+  "joining-room": "You are joining room",
+  "add-group-chat": "Add Group Chat to OBS",
+  "rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
+  "room-name": "Room Name",
+  "enter-the-rooms-control": "Enter the Room's Control Center",
+  "show-tips": "Show me some tips..",
+  "added-notes": "\n<u><i>Added Notes:</i></u>\n<li>Anyone can enter a room if they know the name, so keep it unique</li>\n<li>Invite only guests to the room you trust.</li>\n<li>iOS devices will share just their audio with other guests; this is mainly a hardware limitation</li>\n<li>The \"Recording\" option is considered experimental.</li>\n",
+  "back": "Back",
+  "add-your-camera": "Add your Camera to OBS",
+  "waiting-for-camera": "Waiting for Camera to Load",
+  "video-source": "Video source",
+  "max-resolution": "1080p (hi-def)",
+  "balanced": "720p (balanced)",
+  "smooth-cool": "360p (smooth)",
+  "select-audio-source": "Select Audio Source",
+  "no-audio": "No Audio",
+  "remote-screenshare-obs": "Remote Screenshare into OBS",
+  "note-share-audio": "\n<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
+  "select-screen-to-share": "SELECT SCREEN TO SHARE",
+  "audio-sources": "Audio Sources",
+  "create-reusable-invite": "Create Reusable Invite",
+  "here-you-can-pre-generate": "Here you can pre-generate a reusable Browser Source link and a related guest invite link.",
+  "generate-invite-link": "GENERATE THE INVITE LINK",
+  "advanced-paramaters": "Advanced Options:",
+  "unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
+  "force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
+  "enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
+  "video-resolution": "Video Resolution: ",
+  "high-security-mode": "High Security Mode",
+  "hide-screen-share": "Hide Screenshare Option",
+  "allow-remote-control": "Remote Control Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Add the guest to a room:",
+  "invite-group-chat-type": "This room guest can:",
+  "can-see-and-hear": "Can see and hear the group chat",
+  "can-hear-only": "Can only hear the group chat",
+  "cant-see-or-hear": "Cannot hear or see the group chat",
+  "info-blob": "\n<h2>What is OBS.Ninja</h2><br>\n<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>\n<li>Bring video from your smartphone, computer, or friends directly into your OBS video stream</li>\n<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</li>\n<br>\n<li>Youtube video <i class=\"fa fa-youtube-play\" aria-hidden=\"true\"></i> <a href=\"https://www.youtube.com/watch?v=6R_sQKxFAhg\">Demoing it here</a> </li>\n<br>\n<i><font style=\"color:red\">Known issues:</font></i><br>\n<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> <a href=\"https://github.com/steveseguin/obsninja/wiki/FAQ#mac-os\">MacOS users</a> need to use OBS v23 or resort to <a href=\"https://github.com/steveseguin/electroncapture\">Window Capturing</a> a browser with OBS v25</li>\n<li>Some users will have <a href=\"https://github.com/steveseguin/obsninja/wiki/FAQ#video-is-pixelated\">\"pixelation\" problems</a> with videos. Adding <b>&amp;codec=vp9</b> to the OBS links will often correct it.</li>\n<br>\n",
+  "remote-control-for-obs": "Remote Control for OBS",
+  "add-to-group": "Add to Group Scene",
+  "mute": "Mute",
+  "record": "Record",
+  "volume": "Volume",
+  "open-in-new-tab": "Open in new Tab",
+  "copy-to-clipboard": "Copy to Clipboard"
+}
--- a/translations/en.json
+++ b/translations/en.json
@@ -0,0 +1,51 @@
+{
+  "GO": "GO",
+  "add-group-chat": "Add Group Chat to OBS",
+  "add-to-group": "Add to Group Scene",
+  "add-your-camera": "Add your Camera to OBS",
+  "added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Anyone can enter a room if they know the name, so keep it unique</li>\n\t\t\t\t<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>\n\t\t\t\t<li>iOS devices are limited to group sizes of no more than two (2) people. This is a hardware limitation.</li>\n\t\t\t\t<li>The \"Recording\" option is new and is considered experimental.</li>\n\t\t\t\t<li>You must \"Add\" a video feed to the \"Group Scene\" for it to appear there.</li>\n\t\t\t\t<li>There is a new \"enhanced fullscreen\" button added to the Guest's view.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Advanced Parameters",
+  "audio-sources": "Audio Sources",
+  "back": "Back",
+  "balanced": "Balanced",
+  "copy-this-url": "Copy this URL into an OBS \"Browser Source\"",
+  "copy-to-clipboard": "Copy to Clipboard",
+  "create-reusable-invite": "Create Reusable Invite",
+  "enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
+  "enter-the-rooms-control": "Enter the Room's Control Center",
+  "force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
+  "generate-invite-link": "GENERATE THE INVITE LINK",
+  "here-you-can-pre-generate": "Here you can pre-generate a reusable Browser Source link and a related guest invite link.",
+  "high-security-mode": "High Security Mode",
+  "info-blob": "\n\t\t\t\t\t\t<h2>What is OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>\n\t\t\t\t\t\t<li>Bring video from your smartphone, laptop, computer, or from your friends directly into your OBS video stream</li>\n\t\t\t\t\t\t<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</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\">Demoing it here</a> </li>\n\t\t\t\t\t\t<li>Code is available here: <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\">Known issues:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS users need to use OBS v23 or resort to <i>Window Capturing</i> a Chrome Browser with OBS v25</li>\n\t\t\t\t\t\t<li>Some users will have \"pixelation\" problems with videos. Please add the URL parameter <b>&amp;codec=vp9</b> to the OBS Links to correct it.</li>\n\t<h3><i>Check out the <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> for help and advanced info. I'm also on <a href=\"https://discord.gg/EksyhGA\">Discord</a> and you can email me at steve@seguin.email</i></h3>\n\t\t\t\t\t",
+  "joining-room": "You are joining room",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "max-resolution": "Max Resolution",
+  "mute": "Mute",
+  "no-audio": "No Audio",
+  "note-share-audio": "\n\t\t\t\t\t<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
+  "open-in-new-tab": "Open in new Tab",
+  "record": "Record",
+  "remote-control-for-obs": "Remote Control for OBS",
+  "remote-screenshare-obs": "Remote Screenshare into OBS",
+  "room-name": "Room Name",
+  "rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
+  "select-audio-source": "Select Audio Sources",
+  "select-audio-video": "Select the audio/video source below",
+  "select-screen-to-share": "SELECT SCREEN TO SHARE",
+  "show-tips": "Show me some tips..",
+  "smooth-cool": "Smooth and Cool",
+  "unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
+  "video-source": "Video source",
+  "volume": "Volume",
+  "you-are-in-the-control-center": "You are in the room's control center",
+  "waiting-for-camera": "Waiting for Camera to Load",
+  "video-resolution": "Video Resolution: ",
+  "hide-screen-share": "Hide Screenshare Option",
+  "allow-remote-control": "Remote Control Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Add the guest to a room:",
+  "invite-group-chat-type": "This room guest can:",
+  "can-see-and-hear": "Can see and hear the group chat",
+  "can-hear-only": "Can only hear the group chat",
+  "cant-see-or-hear": "Cannot hear or see the group chat"
+}
--- a/translations/en_ca.json
+++ b/translations/en_ca.json
@@ -1,42 +0,0 @@
-{
-	"GO": "GO",
-	"add-group-chat": "Add Group Chat to OBS",
-	"add-to-group": "Add to Group Scene",
-	"add-your-camera": "Add your Camera to OBS",
-	"added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Anyone can enter a room if they know the name, so keep it unique</li>\n\t\t\t\t<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>\n\t\t\t\t<li>iOS devices are limited to group sizes of no more than two (2) people. This is a hardware limitation.</li>\n\t\t\t\t<li>The \"Recording\" option is new and is considered experimental.</li>\n\t\t\t\t<li>You must \"Add\" a video feed to the \"Group Scene\" for it to appear there.</li>\n\t\t\t\t<li>There is a new \"enhanced fullscreen\" button added to the Guest's view.</li>\n\t\t\t\t",
-	"advanced-paramaters": "Advanced Parameters",
-	"audio-sources": "Audio Sources",
-	"back": "Back",
-	"balanced": "Balanced",
-	"copy-this-url": "Copy this URL into an OBS \"Browser Source\"",
-	"copy-to-clipboard": "Copy to Clipboard",
-	"create-reusable-invite": "Create Reusable Invite",
-	"enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
-	"enter-the-rooms-control": "Enter the Room's Control Center",
-	"force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
-	"generate-invite-link": "GENERATE THE INVITE LINK",
-	"here-you-can-pre-generate": "Here you can pre-generate a reusable Browser Source link and a related guest invite link.",
-	"high-security-mode": "High Security Mode",
-	"info-blob": "\n\t\t\t\t\t\t<h2>What is OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>\n\t\t\t\t\t\t<li>Bring video from your smartphone, laptop, computer, or from your friends directly into your OBS video stream</li>\n\t\t\t\t\t\t<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</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\">Demoing it here</a> </li>\n\t\t\t\t\t\t<li>Code is available here: <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<li>You can also check out <a href=\"https://steves.app\">my other video app</a> designed for sharing video with friends and family</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Known issues:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS users need to use OBS v23 or resort to <i>Window Capturing</i> a Chrome Browser with OBS v25</li>\n\t\t\t\t\t\t<li>Some users will have \"pixelation\" problems with videos. Please add the URL parameter <b>&amp;codec=vp9</b> to the OBS Links to correct it.</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t\n\t\t\t\t\t\tSite last updated: <a href=\"https://www.reddit.com/r/OBSNinja/comments/gf5pd3/new_version_released_today_along_with_new/\">May 7th, 2020.</a> The previous version can be found at <a href=\"https://obs.ninja/v3/\">https://obs.ninja/v3/</a> if you are having new issues.\n\n\t\t\t\t\t\t<br><br>\n\t\t\t\t\t\t<i></i><h3><i>Check out the <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> for help and advanced info. I'm also on <a href=\"https://discord.gg/EksyhGA\">Discord</a> and you can email me at steve@seguin.email</i></h3>\n\t\t\t\t\t",
-	"joining-room": "You are joining room",
-	"logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
-	"max-resolution": "Max Resolution",
-	"mute": "Mute",
-	"no-audio": "No Audio",
-	"note-share-audio": "\n\t\t\t\t\t<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
-	"open-in-new-tab": "Open in new Tab",
-	"record": "Record",
-	"remote-control-for-obs": "Remote Control for OBS",
-	"remote-screenshare-obs": "Remote Screenshare into OBS",
-	"room-name": "Room Name",
-	"rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
-	"select-audio-source": "Select Audio Sources",
-	"select-audio-video": "Select the audio/video source below",
-	"select-screen-to-share": "SELECT SCREEN TO SHARE",
-	"show-tips": "Show me some tips..",
-	"smooth-cool": "Smooth and Cool",
-	"unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
-	"video-source": "Video source",
-	"volume": "Volume",
-	"you-are-in-the-control-center": "You are in the room's control center"
-}
--- a/translations/en_uk.json
+++ b/translations/en_uk.json
@@ -1,42 +0,0 @@
-{
-	"GO": "GO",
-	"add-group-chat": "Add Group Chat to OBS",
-	"add-to-group": "Add to Group Scene",
-	"add-your-camera": "Add your Camera to OBS",
-	"added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Anyone can enter a room if they know the name, so keep it unique</li>\n\t\t\t\t<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>\n\t\t\t\t<li>iOS devices are limited to group sizes of no more than two (2) people. This is a hardware limitation.</li>\n\t\t\t\t<li>The \"Recording\" option is new and is considered experimental.</li>\n\t\t\t\t<li>You must \"Add\" a video feed to the \"Group Scene\" for it to appear there.</li>\n\t\t\t\t<li>There is a new \"enhanced fullscreen\" button added to the Guest's view.</li>\n\t\t\t\t",
-	"advanced-paramaters": "Advanced Parameters",
-	"audio-sources": "Audio Sources",
-	"back": "Back",
-	"balanced": "Balanced",
-	"copy-this-url": "Copy this URL into an OBS \"Browser Source\"",
-	"copy-to-clipboard": "Copy to Clipboard",
-	"create-reusable-invite": "Create Reusable Invite",
-	"enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
-	"enter-the-rooms-control": "Enter the Room's Control Center",
-	"force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
-	"generate-invite-link": "GENERATE THE INVITE LINK",
-	"here-you-can-pre-generate": "Here you can pre-generate a reusable Browser Source link and a related guest invite link.",
-	"high-security-mode": "High Security Mode",
-	"info-blob": "\n\t\t\t\t\t\t<h2>What is OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>\n\t\t\t\t\t\t<li>Bring video from your smartphone, laptop, computer, or from your friends directly into your OBS video stream</li>\n\t\t\t\t\t\t<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</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\">Demoing it here</a> </li>\n\t\t\t\t\t\t<li>Code is available here: <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<li>You can also check out <a href=\"https://steves.app\">my other video app</a> designed for sharing video with friends and family</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Known issues:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS users need to use OBS v23 or resort to <i>Window Capturing</i> a Chrome Browser with OBS v25</li>\n\t\t\t\t\t\t<li>Some users will have \"pixelation\" problems with videos. Please add the URL parameter <b>&amp;codec=vp9</b> to the OBS Links to correct it.</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t\n\t\t\t\t\t\tSite last updated: <a href=\"https://www.reddit.com/r/OBSNinja/comments/gf5pd3/new_version_released_today_along_with_new/\">May 7th, 2020.</a> The previous version can be found at <a href=\"https://obs.ninja/v3/\">https://obs.ninja/v3/</a> if you are having new issues.\n\n\t\t\t\t\t\t<br><br>\n\t\t\t\t\t\t<i></i><h3><i>Check out the <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> for help and advanced info. I'm also on <a href=\"https://discord.gg/EksyhGA\">Discord</a> and you can email me at steve@seguin.email</i></h3>\n\t\t\t\t\t",
-	"joining-room": "You are joining room",
-	"logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
-	"max-resolution": "Max Resolution",
-	"mute": "Mute",
-	"no-audio": "No Audio",
-	"note-share-audio": "\n\t\t\t\t\t<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
-	"open-in-new-tab": "Open in new Tab",
-	"record": "Record",
-	"remote-control-for-obs": "Remote Control for OBS",
-	"remote-screenshare-obs": "Remote Screenshare into OBS",
-	"room-name": "Room Name",
-	"rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
-	"select-audio-source": "Select Audio Sources",
-	"select-audio-video": "Select the audio/video source below",
-	"select-screen-to-share": "SELECT SCREEN TO SHARE",
-	"show-tips": "Show me some tips..",
-	"smooth-cool": "Smooth and Cool",
-	"unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
-	"video-source": "Video source",
-	"volume": "Volume",
-	"you-are-in-the-control-center": "You are in the room's control center"
-}
--- a/translations/en_us.json
+++ b/translations/en_us.json
@@ -1,42 +0,0 @@
-{
-	"GO": "GO",
-	"add-group-chat": "Add Group Chat to OBS",
-	"add-to-group": "Add to Group Scene",
-	"add-your-camera": "Add your Camera to OBS",
-	"added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Anyone can enter a room if they know the name, so keep it unique</li>\n\t\t\t\t<li>Having more than four (4) people in a room is not advisable due to performance reasons, but it depends on your hardware.</li>\n\t\t\t\t<li>iOS devices are limited to group sizes of no more than two (2) people. This is a hardware limitation.</li>\n\t\t\t\t<li>The \"Recording\" option is new and is considered experimental.</li>\n\t\t\t\t<li>You must \"Add\" a video feed to the \"Group Scene\" for it to appear there.</li>\n\t\t\t\t<li>There is a new \"enhanced fullscreen\" button added to the Guest's view.</li>\n\t\t\t\t",
-	"advanced-paramaters": "Advanced Parameters",
-	"audio-sources": "Audio Sources",
-	"back": "Back",
-	"balanced": "Balanced",
-	"copy-this-url": "Copy this URL into an OBS \"Browser Source\"",
-	"copy-to-clipboard": "Copy to Clipboard",
-	"create-reusable-invite": "Create Reusable Invite",
-	"enable-stereo-and-pro": "Enable Stereo and Pro HD Audio",
-	"enter-the-rooms-control": "Enter the Room's Control Center",
-	"force-vp9-video-codec": "Force VP9 Video Codec (less artifacting)",
-	"generate-invite-link": "GENERATE THE INVITE LINK",
-	"here-you-can-pre-generate": "Here you can pre-generate a reusable Browser Source link and a related guest invite link.",
-	"high-security-mode": "High Security Mode",
-	"info-blob": "\n\t\t\t\t\t\t<h2>What is OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>free</b>; no downloads; no personal data collection; no sign-in</li>\n\t\t\t\t\t\t<li>Bring video from your smartphone, laptop, computer, or from your friends directly into your OBS video stream</li>\n\t\t\t\t\t\t<li>We use cutting edge Peer-to-Peer forwarding technology that offers privacy and ultra-low latency</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\">Demoing it here</a> </li>\n\t\t\t\t\t\t<li>Code is available here: <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<li>You can also check out <a href=\"https://steves.app\">my other video app</a> designed for sharing video with friends and family</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Known issues:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> MacOS users need to use OBS v23 or resort to <i>Window Capturing</i> a Chrome Browser with OBS v25</li>\n\t\t\t\t\t\t<li>Some users will have \"pixelation\" problems with videos. Please add the URL parameter <b>&amp;codec=vp9</b> to the OBS Links to correct it.</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t\n\t\t\t\t\t\tSite last updated: <a href=\"https://www.reddit.com/r/OBSNinja/comments/gf5pd3/new_version_released_today_along_with_new/\">May 7th, 2020.</a> The previous version can be found at <a href=\"https://obs.ninja/v3/\">https://obs.ninja/v3/</a> if you are having new issues.\n\n\t\t\t\t\t\t<br><br>\n\t\t\t\t\t\t<i></i><h3><i>Check out the <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> for help and advanced info. I'm also on <a href=\"https://discord.gg/EksyhGA\">Discord</a> and you can email me at steve@seguin.email</i></h3>\n\t\t\t\t\t",
-	"joining-room": "You are joining room",
-	"logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
-	"max-resolution": "Max Resolution",
-	"mute": "Mute",
-	"no-audio": "No Audio",
-	"note-share-audio": "\n\t\t\t\t\t<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
-	"open-in-new-tab": "Open in new Tab",
-	"record": "Record",
-	"remote-control-for-obs": "Remote Control for OBS",
-	"remote-screenshare-obs": "Remote Screenshare into OBS",
-	"room-name": "Room Name",
-	"rooms-allow-for": "Rooms allow for simplified group-chat and the advanced management of multiple streams at once.",
-	"select-audio-source": "Select Audio Sources",
-	"select-audio-video": "Select the audio/video source below",
-	"select-screen-to-share": "SELECT SCREEN TO SHARE",
-	"show-tips": "Show me some tips..",
-	"smooth-cool": "Smooth and Cool",
-	"unlock-video-bitrate": "Unlock Video Bitrate (20mbps)",
-	"video-source": "Video source",
-	"volume": "Volume",
-	"you-are-in-the-control-center": "You are in the room's control center"
-}
--- a/translations/fr.json
+++ b/translations/fr.json
@@ -0,0 +1,51 @@
+{
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "GO": "Aller",
+  "add-group-chat": "Conversation de groupe",
+  "add-to-group": "Ajouter à la scène de groupe",
+  "add-your-camera": "Ajoutez votre caméra à OBS",
+  "added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>N'importe qui peut entrer dans une pièce s'il connaît le nom, alors gardez-le unique</li>\n\t\t\t\t<li>Il n'est pas conseillé d'avoir plus de quatre (4) personnes dans une pièce pour des raisons de performances, mais cela dépend de votre matériel.</li>\n\t\t\t\t<li>Les appareils iOS sont limités à des groupes de deux (2) personnes maximum. Il s'agit d'une limitation matérielle.</li>\n\t\t\t\t\n\t\t\t\t",
+  "advanced-paramaters": "Paramètres avancés",
+  "audio-sources": "Sources audio",
+  "back": "Retour",
+  "balanced": "Équilibré",
+  "copy-this-url": "Copiez cette URL dans un OBS \"Browser Source\"",
+  "copy-to-clipboard": "Copier dans le presse-papier",
+  "create-reusable-invite": "Créer une invitation réutilisable",
+  "enable-stereo-and-pro": "Activer l'audio stéréo et Pro HD",
+  "enter-the-rooms-control": "Entrez dans le centre de contrôle de la pièce",
+  "force-vp9-video-codec": "Forcer le codec vidéo VP9",
+  "generate-invite-link": "GÉNÉRER LE LIEN D'INVITATION",
+  "here-you-can-pre-generate": "Ici, vous pouvez pré-générer un lien de source de navigateur réutilisable et un lien d'invitation d'invité associé.",
+  "high-security-mode": "Mode haute sécurité",
+  "info-blob": "\n\t\t\t\t\t\t<h2>Qu'est-ce que OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b> gratuit </b>; aucun téléchargement; aucune collecte de données personnelles; pas de connexion</li>\n\t\t\t\t\t\t<li>Importez des vidéos de votre smartphone, ordinateur portable, ordinateur ou de vos amis directement dans votre flux vidéo OBS</li>\n\t\t\t\t\t\t<li>Nous utilisons une technologie de transfert Peer-to-Peer de pointe qui offre une confidentialité et une latence ultra-faible</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\">Démonstration ici</a> </li>\n\t\t\t\t\t\t<li>Le code est disponible ici: <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<h3>\n\t\t\t\t\t<i>Découvrez le <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> pour de l'aide et des informations avancées.</i></h3>",
+  "joining-room": "Vous rejoignez la salle",
+  "max-resolution": "Résolution max",
+  "mute": "Mute",
+  "no-audio": "Pas de son",
+  "note-share-audio": "\n\t\t\t\t\t<b>note</b>: N'oubliez pas de cliquer sur Partager l'audio dans Chrome.<br>(Firefox ne prend pas en charge le partage audio.)",
+  "open-in-new-tab": "Ouvrir dans un nouvel onglet",
+  "record": "Record",
+  "remote-control-for-obs": "Télécommande pour OBS",
+  "remote-screenshare-obs": "Partage d'écran à distance dans OBS",
+  "room-name": "Nom de la salle",
+  "rooms-allow-for": "Les salles permettent une conversation de groupe simplifiée et la gestion avancée de plusieurs flux à la fois.",
+  "select-audio-source": "Sélectionnez les sources audio",
+  "select-audio-video": "Sélectionnez la source audio / vidéo ci-dessous",
+  "select-screen-to-share": "CHOISIR L'ÉCRAN À PARTAGER",
+  "show-tips": "Montrez-moi quelques conseils ..",
+  "smooth-cool": "Lisse et frais",
+  "unlock-video-bitrate": "Déverrouiller le débit vidéo (20 Mbps)",
+  "video-source": "Source vidéo",
+  "volume": "Volume",
+  "you-are-in-the-control-center": "Vous êtes dans le centre de contrôle de la pièce",
+  "waiting-for-camera": "Waiting for Camera to Load",
+  "video-resolution": "Video Resolution: ",
+  "hide-screen-share": "Hide Screenshare Option",
+  "allow-remote-control": "Remote Control Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Add the guest to a room:",
+  "invite-group-chat-type": "This room guest can:",
+  "can-see-and-hear": "Can see and hear the group chat",
+  "can-hear-only": "Can only hear the group chat",
+  "cant-see-or-hear": "Cannot hear or see the group chat"
+}
--- a/translations/fr_ca.json
+++ b/translations/fr_ca.json
@@ -1,42 +0,0 @@
-{
-	"logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
-	"GO": "Aller",
-	"add-group-chat": "Conversation de groupe",
-	"add-to-group": "Ajouter à la scène de groupe",
-	"add-your-camera": "Ajoutez votre caméra à OBS",
-	"added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>N'importe qui peut entrer dans une pièce s'il connaît le nom, alors gardez-le unique</li>\n\t\t\t\t<li>Il n'est pas conseillé d'avoir plus de quatre (4) personnes dans une pièce pour des raisons de performances, mais cela dépend de votre matériel.</li>\n\t\t\t\t<li>Les appareils iOS sont limités à des groupes de deux (2) personnes maximum. Il s'agit d'une limitation matérielle.</li>\n\t\t\t\t\n\t\t\t\t",
-	"advanced-paramaters": "Paramètres avancés",
-	"audio-sources": "Sources audio",
-	"back": "Retour",
-	"balanced": "Équilibré",
-	"copy-this-url": "Copiez cette URL dans un OBS \"Browser Source\"",
-	"copy-to-clipboard": "Copier dans le presse-papier",
-	"create-reusable-invite": "Créer une invitation réutilisable",
-	"enable-stereo-and-pro": "Activer l'audio stéréo et Pro HD",
-	"enter-the-rooms-control": "Entrez dans le centre de contrôle de la pièce",
-	"force-vp9-video-codec": "Forcer le codec vidéo VP9",
-	"generate-invite-link": "GÉNÉRER LE LIEN D'INVITATION",
-	"here-you-can-pre-generate": "Ici, vous pouvez pré-générer un lien de source de navigateur réutilisable et un lien d'invitation d'invité associé.",
-	"high-security-mode": "Mode haute sécurité",
-	"info-blob": "\n\t\t\t\t\t\t<h2>Qu'est-ce que OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b> gratuit </b>; aucun téléchargement; aucune collecte de données personnelles; pas de connexion</li>\n\t\t\t\t\t\t<li>Importez des vidéos de votre smartphone, ordinateur portable, ordinateur ou de vos amis directement dans votre flux vidéo OBS</li>\n\t\t\t\t\t\t<li>Nous utilisons une technologie de transfert Peer-to-Peer de pointe qui offre une confidentialité et une latence ultra-faible</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\">Démonstration ici</a> </li>\n\t\t\t\t\t\t<li>Le code est disponible ici: <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<h3>\n\t\t\t\t\t<i>Découvrez le <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> pour de l'aide et des informations avancées.</i></h3>",
-	"joining-room": "Vous rejoignez la salle",
-	"max-resolution": "Résolution max",
-	"mute": "Mute",
-	"no-audio": "Pas de son",
-	"note-share-audio": "\n\t\t\t\t\t<b>note</b>: N'oubliez pas de cliquer sur Partager l'audio dans Chrome.<br>(Firefox ne prend pas en charge le partage audio.)",
-	"open-in-new-tab": "Ouvrir dans un nouvel onglet",
-	"record": "Record",
-	"remote-control-for-obs": "Télécommande pour OBS",
-	"remote-screenshare-obs": "Partage d'écran à distance dans OBS",
-	"room-name": "Nom de la salle",
-	"rooms-allow-for": "Les salles permettent une conversation de groupe simplifiée et la gestion avancée de plusieurs flux à la fois.",
-	"select-audio-source": "Sélectionnez les sources audio",
-	"select-audio-video": "Sélectionnez la source audio / vidéo ci-dessous",
-	"select-screen-to-share": "CHOISIR L'ÉCRAN À PARTAGER",
-	"show-tips": "Montrez-moi quelques conseils ..",
-	"smooth-cool": "Lisse et frais",
-	"unlock-video-bitrate": "Déverrouiller le débit vidéo (20 Mbps)",
-	"video-source": "Source vidéo",
-	"volume": "Volume",
-	"you-are-in-the-control-center": "Vous êtes dans le centre de contrôle de la pièce"
-}
--- a/translations/it.json
+++ b/translations/it.json
@@ -0,0 +1,50 @@
+{
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "GO": "Entra",
+  "copy-this-url": "Copia questo URL in un OBS \"Browser Source\"",
+  "you-are-in-the-control-center": "Sei nel pannello di controllo",
+  "joining-room": "Ti stai unendo alla stanza",
+  "add-group-chat": "Aggiungi chat di gruppo a OBS",
+  "rooms-allow-for": "Le stanze consentono una chat di gruppo semplificata e la gestione avanzata di più flussi contemporaneamente.",
+  "room-name": "Nome stanza",
+  "enter-the-rooms-control": "Entra nella gestione della stanza",
+  "show-tips": "Mosta alcuni suggerimenti..",
+  "added-notes": "\n<u><i>Aggiungi note:</i></u>\n<li>Chiunque può entrare in una stanza se conosce il nome, quindi mantienilo unico</li>\n<li>Invita solo persone fidate nella stanza.</li>\n<li>I dispositivi iOS condivideranno solo il loro audio con altri ospiti; questa è principalmente una limitazione hardware</li>\n<li>Opzione \"Registrazione\" è considerata opzioneale.</li>\n",
+  "back": "Indietro",
+  "add-your-camera": "Aggiungi camera ad  OBS",
+  "waiting-for-camera": "In attesa di caricamento",
+  "video-source": "Sorgente Video",
+  "max-resolution": "1080p (hi-def)",
+  "balanced": "720p (balanced)",
+  "smooth-cool": "360p (smooth)",
+  "select-audio-source": "Seleziona sorgente audio",
+  "no-audio": "No Audio",
+  "remote-screenshare-obs": "Screenshare remoto dentro OBS",
+  "note-share-audio": "\n<b>note</b>: Do not forget to click \"Share audio\" in Chrome.<br>(Firefox does not support audio sharing.)",
+  "select-screen-to-share": "Seleziona lo schermo da condividere",
+  "audio-sources": "Sorgenti Audio",
+  "create-reusable-invite": "Crea un invito riutilizzabile",
+  "here-you-can-pre-generate": "Qui è possibile pre-generare un collegamento Sorgente del browser riutilizzabile e un collegamento di invito ospite correlato.",
+  "generate-invite-link": "GENERATE THE INVITE LINK",
+  "advanced-paramaters": "Opzioni avanzate:",
+  "unlock-video-bitrate": "Sblocca Video Bitrate (20mbps)",
+  "force-vp9-video-codec": "Forza VP9 Video Codec (less artifacting)",
+  "enable-stereo-and-pro": "Abilita Stereo e Pro HD Audio",
+  "video-resolution": "Risoluzioni Video: ",
+  "high-security-mode": "Modalità sicurezza alta",
+  "hide-screen-share": "Nascondi opzione Screenshare",
+  "allow-remote-control": "Controllo remoto camera zoom (android)",
+  "add-the-guest-to-a-room": "Aggiungi l'ospite a una stanza:",
+  "invite-group-chat-type": "In questa stanza ospite può fare:",
+  "can-see-and-hear": "Può vedere e ascoltare la chat di gruppo",
+  "can-hear-only": "Può solo ascoltare la chat di gruppo",
+  "cant-see-or-hear": "Impossibile ascoltare o vedere la chat di gruppo",
+  "info-blob": "\n<h2>Cosa è OBS.Ninja</h2><br>\n<li>100% <b>free</b>; nessun download; nessuna raccolta di dati personali; nessun accesso</li>\n<li>Porta video dal tuo smartphone, computer o amici direttamente nel tuo flusso video OBS</li>\n<li>Utilizziamo una tecnologia di inoltro peer-to-peer all'avanguardia che offre privacy e latenza ultra bassa</li>\n<br>\n<li>Youtube video <i class=\"fa fa-youtube-play\" aria-hidden=\"true\"></i> <a href=\"https://www.youtube.com/watch?v=6R_sQKxFAhg\">Demoing è presente</a> </li>\n<br>\n<i><font style=\"color:red\">Problemi conosciuti:</font></i><br>\n<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> <a href=\"https://github.com/steveseguin/obsninja/wiki/FAQ#mac-os\">Utenti MacOS </a> è necessario utilizzare OBS v23 o ricorrere a <a href=\"https://github.com/steveseguin/electroncapture\">Window Capturing</a> a browser with OBS v25</li>\n<li>Alcuni utenti hanno problemi di <a href=\"https://github.com/steveseguin/obsninja/wiki/FAQ#video-is-pixelated\">\"pixelation\" </a>. Aggiungi <b>&amp;codec=vp9</b> ai collegamenti OBS. </li>\n<br>\n<i></i><h3><i>Mi trovi anche su <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> per aiuto e supporto. Sono presente su  <a href=\"https://discord.gg/EksyhGA\">Discord</a>e via email su steve@seguin.email</i></h3>\n",
+  "remote-control-for-obs": "Controllo Remoto per OBS",
+  "add-to-group": "Aggiungi a scena di gruppo",
+  "mute": "Muta",
+  "record": "Registra",
+  "volume": "Volume",
+  "open-in-new-tab": "Apri in una nuova Tab",
+  "copy-to-clipboard": "Copia negli appunti"
+}
--- a/translations/pt.json
+++ b/translations/pt.json
@@ -0,0 +1,51 @@
+{
+  "GO": "ENTRAR",
+  "add-group-chat": "Adicionar conversa de grupo ao OBS",
+  "add-to-group": "Adicionar à cena de grupo",
+  "add-your-camera": "Adicione a sua câmera ao OBS",
+  "added-notes": "\n\t\t\t\t<u><i>Added Notes:</i></u>\n\t\t\t\t<li>Qualquer pessoa pode entrar numa Sala se souber o nome, por isso mantenha-o único.</li>\n\t\t\t\t<li>Ter mais de quatro (4) pessoas numa Sala não é aconselhável devido a problemas de performance, mas depende do seu hardware.</li>\n\t\t\t\t<li>Dispositivos iOS são limitados a grupos de não mais de duas (2) pessoas. Esta é uma limitação de hardware.</li>\n\t\t\t\t<li>A opção \"Gravar\"é nova e considerada experimental.</li>\n\t\t\t\t<li>Deve \"Adicionar\" uma feed de vídeo à \"Cena de Grupo\" para que ela apareça lá.</li>\n\t\t\t\t<li>Existe um botão \"ecrã completo melhorado\" adicionado à vista de Convidado.</li>\n\t\t\t\t",
+  "advanced-paramaters": "Parâmetros avançados",
+  "audio-sources": "Fontes de áudio",
+  "back": "Voltar",
+  "balanced": "Balanceado",
+  "copy-this-url": "Copie este URL para uma \"Browser Source\" do OBS",
+  "copy-to-clipboard": "Copiar para área de transferência",
+  "create-reusable-invite": "Criar convite reutilizável",
+  "enable-stereo-and-pro": "Ativar áudio Stereo e Pro HD",
+  "enter-the-rooms-control": "Entrar no Centro de Controlo da Sala",
+  "force-vp9-video-codec": "Forçar Codec de vídeo VP9 (menos artefactos)",
+  "generate-invite-link": "GERAR O LINK DE CONVITE",
+  "here-you-can-pre-generate": "Aqui pode gerar um link Browser Source reutilizável e um link de convidado relacionado.",
+  "high-security-mode": "Modo de alta segurança",
+  "info-blob": "\n\t\t\t\t\t\t<h2>O que é o OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li>100% <b>grátis</b>; sem downloads; sem recolha de dados pessoais; sem login</li>\n\t\t\t\t\t\t<li>Leve vídeo do seu smartphone, portátil, computador, ou dos seus amigos diretamente para o seu stream de vídeo do OBS</li>\n\t\t\t\t\t\t<li>Usamos tecnologia de ponta de encaminhamento Peer-to-Peer que oferece privacidade e latência ultra-baixa</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<li>Vídeo de youtube <i class=\"fa fa-youtube-play\" aria-hidden=\"true\"></i> <a href=\"https://www.youtube.com/watch?v=6R_sQKxFAhg\">Demoing it here</a> </li>\n\t\t\t\t\t\t\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<i><font style=\"color:red\">Problemas conhecidos:</font></i><br>\n\n\t\t\t\t\t\t<li><i class=\"fa fa-apple\" aria-hidden=\"true\"></i> Utilizadores de MacOS precisam de usar OBS v23 ou usar <i>Captura de ecrã</i> de um browser Chrome com OBS v25</li>\n\t\t\t\t\t\t<li>Alguns utilizadores terão problemas de \"pixelização\" com vídeos. Por favor adicione o parâmetro <b>&amp;codec=vp9</b> ao URL dos links OBS para o corrigir.</li>\n\t\t\t\t\t\t<br><i></i><h3><i>Visite o <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> para ajuda e informação avançada. Também estou no <a href=\"https://discord.gg/EksyhGA\">Discord</a> e pode contactar-me por email em steve@seguin.email</i></h3>\n\t\t\t\t\t",
+  "joining-room": "Está a entrar na sala",
+  "logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja ",
+  "max-resolution": "Resolução Máxima",
+  "mute": "Mute",
+  "no-audio": "Sem áudio",
+  "note-share-audio": "\n\t\t\t\t\t<b>nota</b>: Não se esqueça de clicar em \"Partilhar áudio\" no Chrome.<br>(Firefox não suporta partilha de áudio.)",
+  "open-in-new-tab": "Abrir num novo separador",
+  "record": "Gravar",
+  "remote-control-for-obs": "Controlo remoto para OBS",
+  "remote-screenshare-obs": "Partilha de ecrã remota para OBS",
+  "room-name": "Nome da Sala",
+  "rooms-allow-for": "As Salas permitem conversas de grupo simplificadas e a gestão avançada de múltiplos streams simultâneos.",
+  "select-audio-source": "Selecionar fontes de áudio",
+  "select-audio-video": "Selectionar a fonte de áudio/vídeo abaixo",
+  "select-screen-to-share": "SELECIONAR ECRÃ A PARTILHAR",
+  "show-tips": "Mostre-me algumas dicas..",
+  "smooth-cool": "Smooth and Cool",
+  "unlock-video-bitrate": "Desbloquear Bitrate de Vídeo (20mbps)",
+  "video-source": "Fonte de vídeo",
+  "volume": "Volume",
+  "you-are-in-the-control-center": "Está no Centro de Controlo da Sala",
+  "waiting-for-camera": "Waiting for Camera to Load",
+  "video-resolution": "Video Resolution: ",
+  "hide-screen-share": "Hide Screenshare Option",
+  "allow-remote-control": "Remote Control Camera Zoom (android)",
+  "add-the-guest-to-a-room": " Add the guest to a room:",
+  "invite-group-chat-type": "This room guest can:",
+  "can-see-and-hear": "Can see and hear the group chat",
+  "can-hear-only": "Can only hear the group chat",
+  "cant-see-or-hear": "Cannot hear or see the group chat"
+}
--- a/translations/readme.md
+++ b/translations/readme.md
@@ -0,0 +1,18 @@
+Welcome to the translation / language section of OBS.Ninja
+
+You can specify a translation using this code, if deploying the code yourself. blank can be replaced with ru, en, pt, etc..
+```
+<script type="text/javascript" id="main-js" src="./main.js" data-translation="blank"></script>
+```
+
+You can also add &ln=ru to the URL as a parameter to launch the translation that way.
+
+There is a file called translate.js, which if you copy/paste the content (and hit enter) into the Chrome browser's console, while on OBS.Ninja, it will download the translation files.
+It will add any new translation entries and add them to the bottom of the files. Please feel to correct these new translations and upload them back to github as a pull request.
+
+In the future I will add a Github action so that this automatically occurs with new code posting.
+
+Translation files can contain more than just language; they can contain HTML and image links, etc. This offers a basic amount of customization.
+
+the "blank.json" file contains a minimal template.  Little to no OBS.Ninja branding.
+
--- a/translations/ru.json
+++ b/translations/ru.json
@@ -0,0 +1,42 @@
+{
+	"GO": "ВОЙТИ",
+	"add-group-chat": "Добавить групповой чат в OBS",
+	"add-to-group": "Добавить в групповую сцену",
+	"add-your-camera": "Добавьте свою камеру в OBS",
+	"added-notes": "\n\t\t\t\t<u><i>Добавленные заметки:</i></u>\n\t\t\t\t<li>Любой может войти в комнату, если знает имя, поэтому оставьте его уникальным</li>\n\t\t\t\t<li>Наличие более четырех (4) человек в комнате не рекомендуется по причинам производительности, но это зависит от вашего оборудования.</li>\n\t\t\t\t<li>Устройства iOS ограничены размерами группы не более двух (2) человек. Это аппаратное ограничение.</li>\n\t\t\t\t",
+	"advanced-paramaters": "Расширенные параметры",
+	"audio-sources": "Источники звука",
+	"back": "Назад",
+	"balanced": "Сбалансированный",
+	"copy-this-url": "Скопируйте этот URL-адрес в OBS \"Браузер\"",
+	"copy-to-clipboard": "Скопировано в буфер обмена",
+	"create-reusable-invite": "Создать многоразовое приглашение",
+	"enable-stereo-and-pro": "Включить стерео и Pro HD Audio",
+	"enter-the-rooms-control": "Войдите в центр управления комнатой",
+	"force-vp9-video-codec": "Видеокодек Force VP9 (меньше артефактов)",
+	"generate-invite-link": "СГЕНЕРИРОВАТЬ ССЫЛКУ-ПРИГЛАШЕНИЕ",
+	"here-you-can-pre-generate": "Здесь вы можете предварительно сгенерировать повторно используемую ссылку на источник браузера и связанную гостевую ссылку для приглашения..",
+	"high-security-mode": "Режим повышенной безопасности",
+	"info-blob": "\n\t\t\t\t\t\t<h2>Что такое OBS.Ninja</h2><br>\n\t\t\t\t\t\t<li><b>бесплатно</b> на 100%; нет загрузок; нет сбора личных данных; нет входа</li>\n\t\t\t\t\t\t<li>Добавляйте видео со своего смартфона, ноутбука, компьютера или друзей прямо в видеопоток OBS</li>\n\t\t\t\t\t\t<li>Мы используем передовую технологию переадресации Peer-to-Peer, которая обеспечивает конфиденциальность и сверхнизкую задержку</li>\n\t\t\t\t\t\t<br>\n\t\t\t\t\t\t<li>Пользователям MacOS необходимо использовать OBS v23 или использовать <i>захват окна</ i> в браузере Google Chrome с OBS v25</li>\n\t\t\t\t\t\t<br><h3><i>Проверьте <a href=\"https://www.reddit.com/r/OBSNinja/\">sub-reddit</a> <i class=\"fa fa-reddit-alien\" aria-hidden=\"true\"></i> для помощи и дополнительной информации.</i></h3>\n\t\t\t\t\t",
+	"joining-room": "Вы присоединяетесь к комнате",
+	"logo-header": "<font id=\"qos\" style=\"color: white;\">O</font>BS.Ninja (RU)",
+	"max-resolution": "Максимальное разрешение",
+	"mute": "Отключить звук",
+	"no-audio": "Нет звука",
+	"note-share-audio": "\n\t\t\t\t\tFirefox не поддерживает обмен аудио",
+	"open-in-new-tab": "Открыть в новой вкладке",
+	"record": "Запись",
+	"remote-control-for-obs": "Пульт дистанционного управления для OBS",
+	"remote-screenshare-obs": "Удаленный просмотр экрана в OBS",
+	"room-name": "Название комнаты",
+	"rooms-allow-for": "В комнатах предусмотрены упрощенный групповой чат и расширенное управление несколькими потоками одновременно.",
+	"select-audio-source": "Выберите источники звука",
+	"select-audio-video": "Выберите источник аудио / видео ниже",
+	"select-screen-to-share": "Выберите экран, чтобы поделиться",
+	"show-tips": "Покажите мне несколько советов..",
+	"smooth-cool": "Гладко и круто",
+	"unlock-video-bitrate": "Разблокировать битрейт видео (20 Мбит/с)",
+	"video-source": "Источники видео",
+	"volume": "Громкость",
+	"you-are-in-the-control-center": "Вы находитесь в центре управления комнатой"
+}
--- a/translations/translate.js
+++ b/translations/translate.js
@@ -0,0 +1,53 @@
+// Copy and paste this code into OBS.Ninja's developer's console to generate new Translation files
+
+function downloadTranslation(filename, trans={}){  // downloads the current translation to a file
+	document.querySelectorAll('[data-translate]').forEach(function(ele){
+		trans[ele.dataset.translate] = ele.innerHTML;
+	});
+
+	var textDoc = JSON.stringify(trans, null, 2);
+
+	var hiddenElement = document.createElement('a');
+	hiddenElement.href = 'data:text/html,' + encodeURIComponent(textDoc);
+	hiddenElement.target = '_blank';
+	hiddenElement.download = filename+".json";
+	hiddenElement.click();
+}
+
+
+function updateTranslation(filename){  // updates the website with a specific translation
+	return fetch("./translations/"+filename+'.json').then(function(response){
+		if (response.status !== 200) {
+			log('Looks like there was a problem. Status Code: ' +
+			response.status);
+			return false;
+		}
+		return response.json().then(function(data) {
+			document.querySelectorAll('[data-translate]').forEach(function(ele){
+				if (ele.dataset.translate in data){
+					ele.innerHTML = data[ele.dataset.translate];
+				}
+			});
+			getById("mainmenu").style.opacity = 1;;
+			return [filename, data];
+		}).catch(function(err){
+			errorlog(err);
+			getById("mainmenu").style.opacity = 1;
+			return false;
+		});
+	});
+}
+
+var updateList = ["en", "ru", "fr", "pl", "ar", "de", "it", "nl", "jp", "pt", "zh", "blank"];  // list of languages to update
+
+downloadTranslation("default");
+
+for (var i in updateList){
+	var ln = updateList[i];
+	updateTranslation(ln).then(function(res){
+		if (res[0]){
+			console.log(res[0]);
+			downloadTranslation(res[0], res[1]);
+		}
+	}); 
+}
--- a/webrtc.js
+++ b/webrtc.js
Author	SHA1	Message	Date
Steve Seguin	1aaae51db4	Add files via upload	2020-06-17 05:20:50 -04:00
Steve Seguin	d990bce2ea	Add files via upload	2020-06-17 05:07:18 -04:00
Steve Seguin	6c80bf83e0	Add files via upload	2020-06-17 05:06:09 -04:00
Steve Seguin	49df175df6	Version 7 Release Candidate Mainly just a 1-week sprint focusing on bug fixes and not so much on major features. Biggest fix this sprint was related to VP9 + Custom Video Bitrates now working as intended.	2020-06-17 04:24:30 -04:00
Steve Seguin	815c619313	Update index.html for private deployment, please see blank.json as a good starting point for unbranded customization text. My goal is to move towards more of a library for the core code, so I am trying to separate out the UI/text/style more and more. This should make forking of new branches of the code easier in the long run.	2020-06-16 05:02:28 -04:00
Steve Seguin	aa50333dc9	BETA Version -- bug fixes + main.js editable again &view should work in the previous version, but tested again in this version &view=xx,yy,zz should work &codec=vp9 issue fixed in codec handler numerous other fixes.	2020-06-16 04:41:07 -04:00
Steve Seguin	7300421a19	Add files via upload	2020-06-16 01:34:59 -04:00
Steve Seguin	6dbc64138a	translation tool and updated translation files. will improve on this all more in the upcoming next release	2020-06-14 21:27:03 -04:00
Steve Seguin	fa820d812c	Merge pull request #168 from jcalado/patch-1 Create pt.json	2020-06-14 13:49:54 -04:00
Joel Calado	2c955e62b1	Create pt.json	2020-06-14 11:16:47 +01:00
Steve Seguin	a6c9cfcf1b	added more configuration options TURN server can be specified, along with changing default values. not heavily tested yet.	2020-06-10 13:21:11 -04:00
Steve Seguin	6a2e5d1a84	Merge pull request #163 from steveseguin/Version-6 release version 6 updates	2020-06-09 12:37:52 -04:00
Steve Seguin	2d60c0a441	release version 6 updates I've fixed issues with innerHTML calls in this release that would normally totally break things if there were changes to index.html. Now, if there is an error, it is handled more gracefully and usually just a single UI element breaks. You should be able to customize the index.html file now without too many hassles. You will also notice that the index.html has the following line: <script type="text/javascript" id="main-js" data-translation="blank" src="./main.js"></script> you can specify different languages or different branding/wording translations by setting the data-translation value to that of the json filename located in the translations folder. You can also create your own json files and specify them that way. By default I am specifying the "blank" translation. I'm trying to steer the app code in the direction of being a bit like a library, for numerous reasons, but please reach out if you have issues with this new release. This release has numerous bug fixes and uses a new handshake server to improve the group-room experience, which I will continue to update. I will continue to work towards allowing greater accessibility in stylizing the application.	2020-06-09 12:35:40 -04:00
Steve Seguin	1db217d01c	Merge pull request #152 from willl/patch-1 Fix a tiny typo	2020-05-23 08:26:59 -04:00
Steve Seguin	f416348596	Update README.md	2020-05-18 08:34:08 -04:00
Steve Seguin	86fee88382	testing webhooks	2020-05-18 08:28:57 -04:00
Steve Seguin	e39d886602	thank you	2020-05-18 04:18:38 -04:00
Steve Seguin	f9f5093238	Create FUNDING.yml	2020-05-18 04:13:46 -04:00
William Luu	609ac042a9	Fix a tiny typo Change `unavoiably` to `unavoidably`.	2020-05-16 21:49:51 +10:00
Steve Seguin	f980555f18	Merge pull request #130 from KovalevArtem/patch-2 Update ru.json	2020-05-13 00:00:47 -04:00
Steve Seguin	d53528424e	Updating the readme with 'what is obs ninja' tweaks	2020-05-12 22:59:00 -04:00
Steve Seguin	2651755647	Update README.md	2020-05-12 22:58:16 -04:00
Steve Seguin	3263cbd684	fixing my last commit. :/	2020-05-12 05:02:21 -04:00
Steve Seguin	ac34971a50	audio devices + framerates on sceeenshare fixing a bug with audio devices not all listing and screenshare not allowing for custom frame rates	2020-05-12 04:58:03 -04:00
KovalevArtem	e9de1b9a4c	Update ru.json	2020-05-12 11:52:47 +03:00
Steve Seguin	d584a5cbdd	Merge pull request #129 from steveseguin/language-russian-auto Add files via upload	2020-05-11 21:37:44 -04:00
Steve Seguin	c5067c850b	Add files via upload Automatically applies a really bad (sorry) Russian translation to the site	2020-05-11 21:35:18 -04:00
Steve Seguin	af83c67def	Delete en_ca.json	2020-05-11 21:33:33 -04:00
Steve Seguin	1631ab8d18	Delete en_uk.json	2020-05-11 21:33:26 -04:00
Steve Seguin	8da4b746be	Merge pull request #128 from steveseguin/language-update Delete en_us.json	2020-05-11 21:33:01 -04:00
Steve Seguin	e658beb41e	Delete en_us.json	2020-05-11 21:31:50 -04:00
Steve Seguin	d746860c82	Delete fr_ca.json	2020-05-11 21:31:28 -04:00
Steve Seguin	735f77cec4	Update index.html removing some debugging code	2020-05-10 22:34:32 -04:00
Steve Seguin	94cb69703b	Add files via upload	2020-05-10 22:17:00 -04:00
Steve Seguin	7d81bc3b79	Add files via upload thank you for the bug report, sky	2020-05-10 22:16:22 -04:00
Steve Seguin	5ed0d7f6dc	Update README.md	2020-05-10 07:58:54 -04:00
Steve Seguin	252e73edac	cleaning up readme	2020-05-10 07:51:19 -04:00