Improve menu interaction

Hubs-Foundation · Jan 22, 2024 · 8545126 · 8545126
1 parent 8ac0b72
commit 8545126
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 2 deletions.
diff --git a/src/bit-systems/link-hover-menu.ts b/src/bit-systems/link-hover-menu.ts
@@ -8,7 +8,8 @@ import {
  Interacted,
  LinkHoverMenuItem,
  LinkInitializing,
- ObjectMenuTransform
+ ObjectMenuTransform,
+ CursorRaycastable
 } from "../bit-components";
 import { findAncestorWithComponent, findChildWithComponent } from "../utils/bit-utils";
 import { hubIdFromUrl } from "../utils/media-url-utils";
@@ -24,6 +25,12 @@ const hoveredLinksQuery = defineQuery([HoveredRemoteRight, Link, Not(LinkInitial
 const hoveredMenuItemQuery = defineQuery([HoveredRemoteRight, LinkHoverMenuItem]);
 const clickedMenuItemQuery = defineQuery([Interacted, LinkHoverMenuItem]);
 
+function setCursorRaycastable(world: HubsWorld, menu: EntityID, enable: boolean) {
+ let change = enable ? addComponent : removeComponent;
+ change(world, CursorRaycastable, menu);
+ change(world, CursorRaycastable, LinkHoverMenu.linkButtonRef[menu]);
+}
+
 function updateLinkMenuTarget(world: HubsWorld, menu: EntityID, sceneIsFrozen: boolean) {
  if (LinkHoverMenu.targetObjectRef[menu] && !entityExists(world, LinkHoverMenu.targetObjectRef[menu])) {
  // Clear the invalid entity reference. (The link entity was removed).
@@ -145,6 +152,8 @@ function flushToObject3Ds(world: HubsWorld, menu: EntityID, frozen: boolean, for
  } else {
  buttonObj.visible = false;
  }
+
+ setCursorRaycastable(world, menu, visible);
 }
 
 export function linkHoverMenuSystem(world: HubsWorld, sceneIsFrozen: boolean) {

diff --git a/src/bit-systems/pdf-menu-system.ts b/src/bit-systems/pdf-menu-system.ts
@@ -1,7 +1,8 @@
-import { addComponent, defineQuery, entityExists, hasComponent } from "bitecs";
+import { addComponent, defineQuery, entityExists, hasComponent, removeComponent } from "bitecs";
 import { Text } from "troika-three-text";
 import type { HubsWorld } from "../app";
 import {
+ CursorRaycastable,
  Deleting,
  EntityStateDirty,
  HoveredRemoteRight,
@@ -17,6 +18,13 @@ import { takeOwnership } from "../utils/take-ownership";
 import { PDFResourcesMap } from "./pdf-system";
 import { ObjectMenuTransformFlags } from "../inflators/object-menu-transform";
 
+function setCursorRaycastable(world: HubsWorld, menu: EntityID, enable: boolean) {
+ let change = enable ? addComponent : removeComponent;
+ change(world, CursorRaycastable, menu);
+ change(world, CursorRaycastable, PDFMenu.prevButtonRef[menu]);
+ change(world, CursorRaycastable, PDFMenu.nextButtonRef[menu]);
+}
+
 function clicked(world: HubsWorld, eid: EntityID) {
  return hasComponent(world, Interacted, eid);
 }
@@ -100,6 +108,8 @@ function flushToObject3Ds(world: HubsWorld, menu: EntityID, frozen: boolean) {
  const numPages = PDFResourcesMap.get(target)!.pdf.numPages;
  (world.eid2obj.get(PDFMenu.pageLabelRef[menu]) as Text).text = `${NetworkedPDF.pageNumber[target]} / ${numPages}`;
  }
+
+ setCursorRaycastable(world, menu, visible);
 }
 
 const hoveredQuery = defineQuery([HoveredRemoteRight]);

diff --git a/src/bit-systems/video-menu-system.ts b/src/bit-systems/video-menu-system.ts
@@ -33,6 +33,8 @@ function setCursorRaycastable(world: HubsWorld, menu: number, enable: boolean) {
  let change = enable ? addComponent : removeComponent;
  change(world, CursorRaycastable, menu);
  change(world, CursorRaycastable, VideoMenu.trackRef[menu]);
+ change(world, CursorRaycastable, VideoMenu.playIndicatorRef[menu]);
+ change(world, CursorRaycastable, VideoMenu.pauseIndicatorRef[menu]);
 }
 
 const intersectInThePlaneOf = (() => {