Expose background blur setting

KibzGithub7407 · Jan 11, 2023 · eb50588 · eb50588
1 parent ba7d7d4
commit eb50588
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/image-capture/background-blur.html b/image-capture/background-blur.html
@@ -20,3 +20,7 @@ <h3>Background</h3>
 {% include output_helper.html %}
 
 {% include js_snippet.html filename='background-blur.js' %}
+
+<script>
+  log = ChromeSamples.log;
+</script>
diff --git a/image-capture/background-blur.js b/image-capture/background-blur.js
@@ -4,6 +4,11 @@ navigator.mediaDevices.getUserMedia({ video: true })
 
   const [track] = mediaStream.getVideoTracks();
   const capabilities = track.getCapabilities();
+  const settings = track.getSettings();
+
+  if ("backgroundBlur" in settings) {
+    log(`Background blur is ${settings.backgroundBlur ? "ON" : "OFF"}`);
+  }
 
   // Check whether toggling background blur is supported or not.
   if (capabilities.backgroundBlur?.length !== 2) {
@@ -12,6 +17,9 @@ navigator.mediaDevices.getUserMedia({ video: true })
     );
   }
 
+  // Listen to background blur changes.
+  track.onconfigurationchange = onconfigurationchange;
+
   const toggleButton = document.querySelector("button");
   toggleButton.onclick = () => {
     const backgroundBlur = track.getSettings().backgroundBlur;
@@ -21,4 +29,11 @@ navigator.mediaDevices.getUserMedia({ video: true })
   };
   toggleButton.disabled = false;
 })
-.catch((error) => ChromeSamples.log("Argh!", `${error}`));
+.catch((error) => log("Argh!", `${error}`));
+
+function onconfigurationchange(event) {
+  const settings = event.target.getSettings();
+  if ("backgroundBlur" in settings) {
+    log(`Background blur is now ${settings.backgroundBlur ? "ON" : "OFF"}`);
+  }
+}