From 46db7202049bb2d4567b6b4525f75bc46e72e288 Mon Sep 17 00:00:00 2001
From: steveseguin <punkrawker@gmail.com>
Date: Mon, 10 Apr 2023 19:59:39 -0400
Subject: [PATCH] sample audio/video off/on color state

---
 index.html |  6 +++---
 lib.js     | 41 ++++++++++++++++++++++++++++++++++++++---
 main.css   | 14 ++++++++++++++
 3 files changed, 55 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index dad32e0..2cca404 100644
--- a/index.html
+++ b/index.html
@@ -56,7 +56,7 @@
 		<meta property="twitter:image" content="./media/vdoNinja_logo_full.png" />
 		<meta name="msapplication-TileColor" content="#da532c" />
 		<meta name="theme-color" content="#ffffff" />
-		<link rel="stylesheet" href="./main.css?ver=286" />
+		<link rel="stylesheet" href="./main.css?ver=287" />
 		<script type="text/javascript" crossorigin="anonymous" src="./thirdparty/adapter.js"></script>
 		<style id="lightbox-animations" type="text/css"></style>
 		<!-- <link rel="manifest" href="manifest.json" /> -->
@@ -2494,11 +2494,11 @@
 			// session.hidehome = true; // If used, 'hide home' will make the landing page inaccessible, along with hiding a few go-home elements.
 			// session.record = false; // uncomment to block users from being able to record via vdo.ninja's built in recording function
 		</script>
-		<script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=726"></script>
+		<script type="text/javascript" crossorigin="anonymous" id="lib-js" src="./lib.js?ver=727"></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" crossorigin="anonymous" id="main-js" src="./main.js?ver=585"></script>
+		<script type="text/javascript" crossorigin="anonymous" id="main-js" src="./main.js?ver=586"></script>
 	</body>
 </html>
diff --git a/lib.js b/lib.js
index b4de4fc..06198c4 100644
--- a/lib.js
+++ b/lib.js
@@ -24464,7 +24464,9 @@ function updateDirectorsAudio(dataN, UUID) {
 			input.dataset.keyname = i;
 			input.dataset.track = n;
 			input.dataset.UUID = UUID;
+			input.dataset.chosen = input.value;
 			input.onchange = function(e) {
+				this.dataset.chosen = this.value;
 				//getById("label_"+e.target.dataset.keyname).innerText =e.target.dataset.keyname+": "+e.target.value;
 				//updateAudioConstraints(e.target.dataset.keyname, e.target.value);
 				requestChangeGating("gating", e.target.value, e.target.dataset.UUID, parseInt(e.target.dataset.track));
@@ -24513,7 +24515,9 @@ function updateDirectorsAudio(dataN, UUID) {
 			input.dataset.keyname = i;
 			input.dataset.track = n;
 			input.dataset.UUID = UUID;
+			input.dataset.chosen = input.value;
 			input.onchange = function(e) {
+				this.dataset.chosen = this.value;
 				//getById("label_"+e.target.dataset.keyname).innerText =e.target.dataset.keyname+": "+e.target.value;
 				//updateAudioConstraints(e.target.dataset.keyname, e.target.value);
 				requestChangeCompressor("compressor", e.target.value, e.target.dataset.UUID, parseInt(e.target.dataset.track));
@@ -24659,7 +24663,13 @@ function updateDirectorsAudio(dataN, UUID) {
 					if (data.audioConstraints[i].length > 1) {
 						for (var opts in data.audioConstraints[i]) {
 							log(opts);
-							var opt = new Option(data.audioConstraints[i][opts], data.audioConstraints[i][opts]);
+							if (data.audioConstraints[i][opts] === false){
+								var opt = new Option("Off", data.audioConstraints[i][opts]);
+							} else if (data.audioConstraints[i][opts] === true){
+								var opt = new Option("On", data.audioConstraints[i][opts]);
+							} else {
+								var opt = new Option(data.audioConstraints[i][opts], data.audioConstraints[i][opts]);
+							}
 							input.options.add(opt);
 							if (i in data.currentAudioConstraints) {
 								if (data.audioConstraints[i][opts] == data.currentAudioConstraints[i]) {
@@ -24691,7 +24701,9 @@ function updateDirectorsAudio(dataN, UUID) {
 					input.dataset.track = n;
 					input.dataset.deviceId = data.deviceId;
 					input.dataset.UUID = UUID;
+					input.dataset.chosen = input.value;
 					input.onchange = function(e) {
+						this.dataset.chosen = this.value;
 						//getById("label_"+e.target.dataset.keyname).innerText =e.target.dataset.keyname+": "+e.target.value;
 						//updateAudioConstraints(e.target.dataset.keyname, e.target.value);
 						requestAudioHack(e.target.dataset.keyname, e.target.value, e.target.dataset.UUID, e.target.dataset.deviceId);
@@ -24732,7 +24744,9 @@ function updateDirectorsAudio(dataN, UUID) {
 					input.dataset.keyname = i;
 					input.dataset.track = n;
 					input.dataset.UUID = UUID;
+					input.dataset.chosen = input.value;
 					input.onchange = function(e) {
+						this.dataset.chosen = this.value;
 						//getById("label_"+e.target.dataset.keyname).innerText =e.target.dataset.keyname+": "+e.target.value;
 						//updateAudioConstraints(e.target.dataset.keyname, e.target.value);
 						requestAudioHack(e.target.dataset.keyname, e.target.value, e.target.dataset.UUID, e.target.dataset.deviceId);
@@ -25091,7 +25105,15 @@ function updateDirectorsVideo(data, UUID) {
 				if (data.cameraConstraints[i].length > 1) {
 					for (var opts in data.cameraConstraints[i]) {
 						log(opts);
-						var opt = new Option(data.cameraConstraints[i][opts], data.cameraConstraints[i][opts]);
+						
+						if (data.cameraConstraints[i][opts] === false){
+							var opt = new Option("Off", data.cameraConstraints[i][opts]);
+						} else if (data.cameraConstraints[i][opts] === true){
+							var opt = new Option("On", data.cameraConstraints[i][opts]);
+						} else {
+							var opt = new Option(data.cameraConstraints[i][opts], data.cameraConstraints[i][opts]);
+						}
+						
 						input.options.add(opt);
 						if (i in data.currentCameraConstraints) {
 							if (data.cameraConstraints[i][opts] == data.currentCameraConstraints[i]) {
@@ -25121,7 +25143,9 @@ function updateDirectorsVideo(data, UUID) {
 				input.dataset.UUID = UUID;
 				input.style = "display:inline; padding:2px;";
 				input.dataset.keyname = i;
+				input.dataset.chosen = input.value;
 				input.onchange = function(e) {
+					this.dataset.chosen = this.value;
 					//getById("label_"+e.target.dataset.keyname+ "_" + e.target.dataset.UUID).innerText =e.target.dataset.keyname+": "+e.target.value;
 					//updateVideoConstraints(e.target.dataset.keyname, e.target.value);
 					if (CtrlPressed){
@@ -25165,7 +25189,9 @@ function updateDirectorsVideo(data, UUID) {
 				input.style = "display:inline; padding:2px;";
 				input.dataset.UUID = UUID;
 				input.dataset.keyname = i;
+				input.dataset.chosen = input.value;
 				input.onchange = function(e) {
+					this.dataset.chosen = this.value;
 					//getById("label_"+e.target.dataset.keyname+ "_" + e.target.dataset.UUID).innerText =e.target.dataset.keyname+": "+e.target.value;
 					//updateVideoConstraints(e.target.dataset.keyname, e.target.value);
 					if (CtrlPressed){
@@ -25644,8 +25670,9 @@ function listAudioSettings() {
 					input.name = "constraints_" + i + "_"+ii;
 					input.style = "display:inline; padding:2px;";
 					input.dataset.keyname = i;
-					
+					input.dataset.chosen = input.value;
 					input.onchange = function(e) {
+						this.dataset.chosen = this.value;
 						if (e.target.value == "false"){
 							session.noisegate = null;
 						} else if (e.target.value == "true"){
@@ -25857,7 +25884,9 @@ function listAudioSettings() {
 					input.dataset.deviceid = track0.id;
 					input.style = "display:inline; padding:2px;";
 					input.dataset.keyname = i;
+					input.dataset.chosen = input.value;
 					input.onchange = function(e) {
+						this.dataset.chosen = this.value;
 						applyAudioHack(e.target.dataset.keyname, e.target.value, e.target.dataset.deviceid);
 						log(e.target.dataset.keyname, e.target.value);
 					};
@@ -25895,7 +25924,9 @@ function listAudioSettings() {
 					input.name = "constraints_" + i + "_"+ii;
 					input.style = "display:inline; padding:2px;";
 					input.dataset.keyname = i;
+					input.dataset.chosen = input.value;
 					input.onchange = function(e) {
+						this.dataset.chosen = this.value;
 						//getById("label_"+e.target.dataset.keyname).innerHTML =e.target.dataset.keyname+": "+e.target.value;
 						//updateAudioConstraints(e.target.dataset.keyname, e.target.value);
 						applyAudioHack(e.target.dataset.keyname, e.target.value, e.target.dataset.deviceid);
@@ -26544,7 +26575,9 @@ function listCameraSettings() {
 				input.name = "constraints_" + i;
 				input.style = "display:inline; padding:2px;";
 				input.dataset.keyname = i;
+				input.dataset.chosen = input.value;
 				input.onchange = function(e) {
+					this.dataset.chosen = this.value;
 					//getById("label_"+e.target.dataset.keyname).innerHTML =e.target.dataset.keyname+": "+e.target.value;
 					if (CtrlPressed){
 						updateCameraConstraints(e.target.dataset.keyname, e.target.value, true, false, false);
@@ -26585,7 +26618,9 @@ function listCameraSettings() {
 				input.name = "constraints_" + i;
 				input.style = "display:inline; padding:2px;";
 				input.dataset.keyname = i;
+				input.dataset.chosen = input.value;
 				input.onchange = function(e) {
+					this.dataset.chosen = this.value;
 					//getById("label_"+e.target.dataset.keyname).innerHTML =e.target.dataset.keyname+": "+e.target.value;
 					if (CtrlPressed){
 						updateCameraConstraints(e.target.dataset.keyname, e.target.value, true, false, false);
diff --git a/main.css b/main.css
index 3d9514b..7a784c1 100644
--- a/main.css
+++ b/main.css
@@ -681,6 +681,20 @@ body.darktheme .credits>a:visited {
     height: 24px;
 
 }
+
+.advancedAudioSettings div select[data-chosen='false'] { 
+    border: 2px solid red;
+}
+.advancedAudioSettings div select[data-chosen='true'] { 
+    border: 2px solid green;
+}
+.advancedVideoSettings div select[data-chosen='false'] { 
+    border: 2px solid red;
+}
+.advancedVideoSettings div select[data-chosen='true'] { 
+    border: 2px solid green;
+}
+
 .advancedAudioSettings > div:nth-child(1) {
     flex-direction: column;
     align-items: flex-start;