Mute source audio when linking audio media

src/app.ts

@@ -88,6 +88,7 @@ export class App {
   supplementaryAttenuation = new Map<ElOrEid, number>();
   clippingState = new Set<ElOrEid>();
   mutedState = new Set<ElOrEid>();
+  linkedMutedState = new Set<ElOrEid>();
   isAudioPaused = new Set<ElOrEid>();
   audioDebugPanelOverrides = new Map<SourceType, Partial<AudioSettings>>();
   sceneAudioDefaults = new Map<SourceType, Partial<AudioSettings>>();

src/bit-systems/audio-debug-system.ts

@@ -174,7 +174,11 @@ export function audioDebugSystem(world: HubsWorld) {
   if (isEnabled && uniforms) {
     let idx = 0;
     APP.audios.forEach((audio: AudioObject3D, audioEmitterId: ElOrEid) => {
-      if (APP.isAudioPaused.has(audioEmitterId) || APP.mutedState.has(audioEmitterId)) {
+      if (
+        APP.isAudioPaused.has(audioEmitterId) ||
+        APP.mutedState.has(audioEmitterId) ||
+        APP.linkedMutedState.has(audioEmitterId)
+      ) {
         return;
       }
       if (idx >= maxDebugEmitters) return;

src/bit-systems/linked-media-system.ts

@@ -1,9 +1,9 @@
-import { addComponent, defineQuery, enterQuery, entityExists, exitQuery, hasComponent, removeComponent } from "bitecs";
+import { addComponent, defineQuery, enterQuery, entityExists, exitQuery, removeComponent } from "bitecs";
 import { HubsWorld } from "../app";
-import { MirroredMedia, MediaMirrored, MediaLoaded, LinkedMedia } from "../bit-components";
+import { MirroredMedia, MediaMirrored, LinkedMedia } from "../bit-components";
 import { cloneObject } from "./linked-menu-system";
 import { deleteTheDeletableAncestor } from "./delete-entity-system";
-import { anyEntityWith, findChildWithComponent } from "../utils/bit-utils";
+import { anyEntityWith } from "../utils/bit-utils";
 import { EntityID } from "../utils/networking-types";
 
 export function linkMedia(world: HubsWorld, eid: EntityID, sourceMediaEid: EntityID) {
@@ -26,14 +26,12 @@ const mediaMirroredExitQuery = exitQuery(mediaMirroredQuery);
 const mirroredMediaQuery = defineQuery([MirroredMedia]);
 const mirroredMediaEnterQuery = enterQuery(mirroredMediaQuery);
 const mirroredMediaExitQuery = exitQuery(mirroredMediaQuery);
+const linkedMediaQuery = defineQuery([LinkedMedia]);
+const linkedMediaExitQuery = exitQuery(linkedMediaQuery);
 export function linkedMediaSystem(world: HubsWorld) {
   mirroredMediaExitQuery(world).forEach(eid => {
     const mediaMirroredEid = MirroredMedia.linkedRef[eid];
     if (entityExists(world, mediaMirroredEid)) {
-      const sourceMediaEid = findChildWithComponent(world, MediaLoaded, mediaMirroredEid)!;
-      if (hasComponent(world, LinkedMedia, sourceMediaEid)) {
-        removeComponent(world, LinkedMedia, sourceMediaEid);
-      }
       removeComponent(world, MediaMirrored, mediaMirroredEid);
     }
   });
@@ -51,4 +49,7 @@ export function linkedMediaSystem(world: HubsWorld) {
     addComponent(world, MirroredMedia, clonedEid);
     MirroredMedia.linkedRef[clonedEid] = eid;
   });
+  linkedMediaExitQuery(world).forEach(eid => {
+    removeComponent(world, LinkedMedia, LinkedMedia.linkedRef[eid]);
+  });
 }

src/bit-systems/linked-pdf-system.ts

@@ -1,4 +1,4 @@
-import { addComponent, defineQuery, enterQuery, exitQuery, hasComponent, removeComponent } from "bitecs";
+import { addComponent, defineQuery, enterQuery, hasComponent } from "bitecs";
 import { HubsWorld } from "../app";
 import { MirroredMedia, LinkedMedia, MediaPDF, NetworkedPDF, MediaPDFUpdated } from "../bit-components";
 import { findAncestorWithComponent, findChildWithComponent } from "../utils/bit-utils";
@@ -7,7 +7,6 @@ import { linkMedia } from "./linked-media-system";
 
 const mediaPDFQuery = defineQuery([MediaPDF]);
 const mediaPDFEnterQuery = enterQuery(mediaPDFQuery);
-const mediaPDFExitQuery = exitQuery(mediaPDFQuery);
 const updatedPDFQuery = defineQuery([MediaPDFUpdated]);
 const updatedPDFEnterQuery = enterQuery(updatedPDFQuery);
 export function linkedPDFSystem(world: HubsWorld) {
@@ -34,9 +33,4 @@ export function linkedPDFSystem(world: HubsWorld) {
       MediaPDFUpdated.pageNumber[linked] = MediaPDFUpdated.pageNumber[eid];
     }
   });
-  mediaPDFExitQuery(world).forEach(eid => {
-    if (hasComponent(world, LinkedMedia, eid)) {
-      removeComponent(world, LinkedMedia, eid);
-    }
-  });
 }

src/bit-systems/linked-video-system.ts

@@ -1,23 +1,26 @@
-import { defineQuery, enterQuery, exitQuery, hasComponent, removeComponent } from "bitecs";
+import { addComponent, defineQuery, enterQuery, exitQuery, hasComponent } from "bitecs";
 import { HubsWorld } from "../app";
 import {
   MirroredMedia,
   LinkedMedia,
   MediaVideo,
   NetworkedVideo,
   MediaVideoData,
-  MediaVideoUpdated
+  MediaVideoUpdated,
+  AudioEmitter
 } from "../bit-components";
 import { findAncestorWithComponent, findChildWithComponent } from "../utils/bit-utils";
 import { takeOwnership } from "../utils/take-ownership";
 import { OUT_OF_SYNC_SEC } from "./video-system";
 import { linkMedia } from "./linked-media-system";
+import { updateAudioSettings } from "../update-audio-settings";
 
 const mediaVideoQuery = defineQuery([MediaVideo]);
 const mediaVideoEnterQuery = enterQuery(mediaVideoQuery);
-const mediaVideoExitQuery = exitQuery(mediaVideoQuery);
 const updatedVideoQuery = defineQuery([MediaVideoUpdated]);
 const updatedVideoEnterQuery = enterQuery(updatedVideoQuery);
+const linkedMediaQuery = defineQuery([LinkedMedia]);
+const linkedMediaExitQuery = exitQuery(linkedMediaQuery);
 export function linkedVideoSystem(world: HubsWorld) {
   mediaVideoEnterQuery(world).forEach(eid => {
     const mirroredMediaEid = findAncestorWithComponent(world, MirroredMedia, eid);
@@ -26,18 +29,15 @@ export function linkedVideoSystem(world: HubsWorld) {
       const sourceMediaEid = findChildWithComponent(world, MediaVideo, mediaMirroredEid)!;
       if (sourceMediaEid) {
         linkMedia(world, eid, sourceMediaEid);
-        const video = MediaVideoData.get(eid)!;
-        const linkedVideo = MediaVideoData.get(sourceMediaEid)!;
-        if (video.paused !== linkedVideo.paused) {
-          if (linkedVideo.paused) {
-            video.pause();
-          } else {
-            video.play().catch(() => console.error("Error playing video."));
+        addComponent(world, MediaVideoUpdated, sourceMediaEid);
+        const sourceAudioEid = findChildWithComponent(world, AudioEmitter, sourceMediaEid);
+        if (sourceAudioEid) {
+          APP.linkedMutedState.add(sourceAudioEid);
+          const audio = APP.audios.get(sourceAudioEid);
+          if (audio) {
+            updateAudioSettings(sourceAudioEid, audio);
           }
         }
-        if (Math.abs(video.currentTime - linkedVideo.currentTime) > OUT_OF_SYNC_SEC) {
-          video.currentTime = linkedVideo.currentTime;
-        }
       }
     }
   });
@@ -57,16 +57,23 @@ export function linkedVideoSystem(world: HubsWorld) {
         linkedVideo.play().catch(() => console.error("Error playing video."));
       }
     }
-    if (Math.abs(video.currentTime - linkedVideo.currentTime) > OUT_OF_SYNC_SEC) {
+    if (Math.abs(video.currentTime - linkedVideo.currentTime)) {
       if (!hasComponent(world, NetworkedVideo, eid)) {
         takeOwnership(world, linked);
       }
       linkedVideo.currentTime = video.currentTime;
     }
   });
-  mediaVideoExitQuery(world).forEach(eid => {
-    if (hasComponent(world, LinkedMedia, eid)) {
-      removeComponent(world, LinkedMedia, eid);
+  linkedMediaExitQuery(world).forEach(eid => {
+    if (hasComponent(world, MediaVideo, eid)) {
+      const audioEid = findChildWithComponent(world, AudioEmitter, eid);
+      if (audioEid) {
+        APP.linkedMutedState.delete(audioEid);
+        const audio = APP.audios.get(audioEid);
+        if (audio) {
+          updateAudioSettings(audioEid, audio);
+        }
+      }
     }
   });
 }

src/systems/linked-media.js

@@ -51,7 +51,7 @@ AFRAME.registerSystem("linked-media", {
     elB.setAttribute("linked-media", "");
 
     // As a convenience, if elA has audio, we turn its volume off so we don't hear it twice
-    APP.mutedState.add(elA);
+    APP.linkedMutedState.add(elA);
     const audio = APP.audios.get(elA);
     if (audio) {
       updateAudioSettings(elA, audio);
@@ -68,7 +68,7 @@ AFRAME.registerSystem("linked-media", {
         elB.removeEventListener("componentchanged", handlerB);
       }
 
-      APP.mutedState.delete(elA);
+      APP.linkedMutedState.delete(elA);
       const audio = APP.audios.get(elA);
       if (audio) {
         updateAudioSettings(elA, audio);

src/update-audio-settings.js

@@ -75,6 +75,7 @@ export function getCurrentAudioSettings(el) {
   if (
     APP.clippingState.has(el) ||
     APP.mutedState.has(el) ||
+    APP.linkedMutedState.has(el) ||
     (isNonModeratorAvatarAudio && !APP.hub.member_permissions?.voice_chat)
   ) {
     settings.gain = 0;