tuikit-atomicx-vue3 3.3.3 → 3.4.1

package/dist/components/LiveCoreView/PlayerControl/PlayerControlState.js

@@ -1,412 +1,267 @@
-import { ref, computed, watch } from "vue";
-import { useRoomEngine } from "../../../hooks/useRoomEngine.js";
-import { useLiveState } from "../../../states/LiveState/index.js";
-import { useLiveSeatState } from "../../../states/LiveSeatState/index.js";
-import { TRTCCloud } from "@tencentcloud/tuiroom-engine-js";
-import { getDeviceType, getCurrentOrientation, shouldRotateToLandscapeForFullscreen, hadLandscapeRotationToUndo } from "./utils/deviceDetection.js";
-import { OrientationManager, StyleManager, FullscreenMode, FullscreenManager } from "./utils/fullscreenManager.js";
-import { EventListenerManager, DOMElementGetter } from "./utils/domHelpers.js";
-import { LiveStatus } from "../../../types/live.js";
-var FillMode = /* @__PURE__ */ ((FillMode2) => {
-  FillMode2["CONTAIN"] = "contain";
-  FillMode2["COVER"] = "cover";
-  FillMode2["FILL"] = "fill";
-  return FillMode2;
-})(FillMode || {});
-const isPlaying = ref(true);
-const currentFillMode = ref(
+import { ref as m, computed as _, watch as ae } from "vue";
+import { TUIVideoQuality as E, TRTCCloud as V } from "@tencentcloud/tuiroom-engine-js";
+import { useRoomEngine as le } from "../../../hooks/useRoomEngine.js";
+import { useLiveState as oe } from "../../../states/LiveState/index.js";
+import { useLiveSeatState as se } from "../../../states/LiveSeatState/index.js";
+import { getDeviceType as re, getCurrentOrientation as R, shouldRotateToLandscapeForFullscreen as ie, hadLandscapeRotationToUndo as ce } from "./utils/deviceDetection.js";
+import { OrientationManager as F, StyleManager as I, FullscreenMode as k, FullscreenManager as D } from "./utils/fullscreenManager.js";
+import { EventListenerManager as ue, DOMElementGetter as i } from "./utils/domHelpers.js";
+import { LiveStatus as de } from "../../../types/live.js";
+var pe = /* @__PURE__ */ ((s) => (s.CONTAIN = "contain", s.COVER = "cover", s.FILL = "fill", s))(pe || {}), ve = ((s) => (s[s.R360P = E.kVideoQuality_360p] = "R360P", s[s.R540P = E.kVideoQuality_540p] = "R540P", s[s.R720P = E.kVideoQuality_720p] = "R720P", s[s.R1080P = E.kVideoQuality_1080p] = "R1080P", s))(ve || {});
+const r = m(!0), N = m(
   "contain"
   /* CONTAIN */
-);
-const isFullscreen = ref(false);
-const isLandscapeStyleMode = ref(false);
-const isPictureInPicture = ref(false);
-const currentVolume = ref(1);
-const roomEngine = useRoomEngine();
-function usePlayerControlState() {
-  const { localLiveStatus } = useLiveState();
-  const { canvas } = useLiveSeatState();
-  const eventManager = new EventListenerManager();
-  const orientationListenerId = `player-control-${Date.now()}`;
-  const isLandscapeStream = computed(
-    () => canvas.value ? canvas.value.width > canvas.value.height : false
-  );
-  const isPortraitStream = computed(
-    () => canvas.value ? canvas.value.width < canvas.value.height : false
-  );
-  const deviceType = getDeviceType();
-  const withErrorHandling = async (operation, operationName, fallbackValue) => {
+), d = m(!1), L = m(!1), P = m(!1), g = m(1), z = m([]), v = m(), me = "[LiveCoreView]ResolutionInitialized", h = le();
+function Ve() {
+  const { localLiveStatus: s } = oe(), { canvas: f } = se(), o = new ue(), x = `player-control-${Date.now()}`, p = _(
+    () => f.value ? f.value.width > f.value.height : !1
+  ), S = _(
+    () => f.value ? f.value.width < f.value.height : !1
+  ), c = re(), u = async (e, n, a) => {
     try {
-      return await operation();
-    } catch (error) {
-      console.error(`${operationName} operation failed:`, error);
-      return fallbackValue;
+      return await e();
+    } catch (t) {
+      return console.error(`${n} operation failed:`, t), a;
     }
-  };
-  const syncVolumeState = () => {
-    const video = DOMElementGetter.getVideoElement();
-    if (video) {
-      const actualVolume = video.volume;
-      if (Math.abs(currentVolume.value - actualVolume) > 0.01) {
-        console.log(`Syncing volume state: ${currentVolume.value} -> ${actualVolume}`);
-        currentVolume.value = actualVolume;
-      }
+  }, b = () => {
+    const e = i.getVideoElement();
+    if (e) {
+      const n = e.volume;
+      Math.abs(g.value - n) > 0.01 && (console.log(`Syncing volume state: ${g.value} -> ${n}`), g.value = n);
     }
-  };
-  const syncPlayingState = () => {
-    const video = DOMElementGetter.getVideoElement();
-    if (video) {
-      const actualPlayingState = !video.paused && !video.ended;
-      if (isPlaying.value !== actualPlayingState) {
-        console.log(`Syncing playing state: ${isPlaying.value} -> ${actualPlayingState}`);
-        isPlaying.value = actualPlayingState;
-      }
+  }, y = () => {
+    const e = i.getVideoElement();
+    if (e) {
+      const n = !e.paused && !e.ended;
+      r.value !== n && (console.log(`Syncing playing state: ${r.value} -> ${n}`), r.value = n);
     }
-  };
-  const resume = async () => {
-    return withErrorHandling(async () => {
-      const video = DOMElementGetter.getVideoElement();
-      if (!video) {
-        throw new Error("Video element not found");
-      }
-      if (DOMElementGetter.hasTcPlayerElement()) {
-        await video.play();
-      } else {
-        const trtcCloudMap = TRTCCloud.subCloudMap;
-        trtcCloudMap.forEach((trtcCloud) => {
-          const trtc = trtcCloud == null ? void 0 : trtcCloud._trtc;
-          trtc == null ? void 0 : trtc.callExperimentalAPI("resumeRemotePlayer", { userId: "*" });
-        });
-      }
-      isPlaying.value = true;
-      console.log("Video playback resumed");
-      return true;
-    }, "Resume playback", false);
-  };
-  const pause = async () => {
-    return withErrorHandling(async () => {
-      const video = DOMElementGetter.getVideoElement();
-      if (!video) {
-        throw new Error("Video element not found");
-      }
-      if (DOMElementGetter.hasTcPlayerElement()) {
-        await video.pause();
-      } else {
-        const trtcCloudMap = TRTCCloud.subCloudMap;
-        trtcCloudMap.forEach((trtcCloud) => {
-          const trtc = trtcCloud == null ? void 0 : trtcCloud._trtc;
-          trtc == null ? void 0 : trtc.callExperimentalAPI("pauseRemotePlayer", { userId: "*" });
-        });
-      }
-      isPlaying.value = false;
-      console.log("Video playback paused");
-      return true;
-    }, "Pause playback", false);
-  };
-  const handleOrientationChange = (newOrientation) => {
-    if (!isFullscreen.value) {
+  }, M = async () => u(async () => {
+    const e = i.getVideoElement();
+    if (!e)
+      throw new Error("Video element not found");
+    return i.hasTcPlayerElement() ? await e.play() : V.subCloudMap.forEach((a) => {
+      const t = a == null ? void 0 : a._trtc;
+      t == null || t.callExperimentalAPI("resumeRemotePlayer", { userId: "*" });
+    }), r.value = !0, console.log("Video playback resumed"), !0;
+  }, "Resume playback", !1), Q = async () => u(async () => {
+    const e = i.getVideoElement();
+    if (!e)
+      throw new Error("Video element not found");
+    return i.hasTcPlayerElement() ? await e.pause() : V.subCloudMap.forEach((a) => {
+      const t = a == null ? void 0 : a._trtc;
+      t == null || t.callExperimentalAPI("pauseRemotePlayer", { userId: "*" });
+    }), r.value = !1, console.log("Video playback paused"), !0;
+  }, "Pause playback", !1), U = (e) => {
+    if (!d.value || !p.value)
       return;
-    }
-    if (!isLandscapeStream.value) {
-      return;
-    }
-    const elements = DOMElementGetter.getAllElements();
-    if (!elements.view) {
+    const n = i.getAllElements();
+    if (!n.view) {
       console.warn("live-core-view element not found for orientation change handling");
       return;
     }
     console.log("Handling orientation change:", {
-      newOrientation,
-      deviceType,
-      isLandscapeStream: isLandscapeStream.value,
-      isFullscreen: isFullscreen.value
+      newOrientation: e,
+      deviceType: c,
+      isLandscapeStream: p.value,
+      isFullscreen: d.value
+    }), I.smartApplyLandscapeStyles(n.view, e);
+  }, G = async () => u(async () => {
+    const e = i.getAllElements(), n = i.validateElements(e);
+    if (!n.isValid)
+      throw new Error(`Missing required DOM elements: ${n.missingElements.join(", ")}`);
+    const a = R(), t = ie(c, p.value);
+    console.log("Request fullscreen:", {
+      deviceType: c,
+      currentOrientation: a,
+      streamType: p.value ? "landscape stream" : S.value ? "portrait stream" : "unknown",
+      shouldRotate: t,
+      reason: t ? "Mobile device in portrait with landscape stream" : a === "landscape" ? "Already in landscape orientation" : p.value ? "Desktop device or other reason" : "Not a landscape stream"
     });
-    StyleManager.smartApplyLandscapeStyles(elements.view, newOrientation);
-  };
-  const requestFullscreen = async () => {
-    return withErrorHandling(async () => {
-      const elements = DOMElementGetter.getAllElements();
-      const validation = DOMElementGetter.validateElements(elements);
-      if (!validation.isValid) {
-        throw new Error(`Missing required DOM elements: ${validation.missingElements.join(", ")}`);
-      }
-      const currentOrientation = getCurrentOrientation();
-      const shouldRotateToLandscape = shouldRotateToLandscapeForFullscreen(deviceType, isLandscapeStream.value);
-      console.log("Request fullscreen:", {
-        deviceType,
-        currentOrientation,
-        streamType: isLandscapeStream.value ? "landscape stream" : isPortraitStream.value ? "portrait stream" : "unknown",
-        shouldRotate: shouldRotateToLandscape,
-        reason: shouldRotateToLandscape ? "Mobile device in portrait with landscape stream" : currentOrientation === "landscape" ? "Already in landscape orientation" : !isLandscapeStream.value ? "Not a landscape stream" : "Desktop device or other reason"
-      });
-      const result = await FullscreenManager.requestFullscreen(
-        elements.container,
-        elements.view,
-        deviceType,
-        isPortraitStream.value,
-        shouldRotateToLandscape
-      );
-      if (result.success) {
-        isFullscreen.value = true;
-        console.log(`Fullscreen request successful (${result.mode})`);
-      } else {
-        console.error("Fullscreen request failed:", result.error);
-      }
-      isLandscapeStyleMode.value = result.shouldRotateToLandscape;
-      return result;
-    }, "Request fullscreen", { success: false, mode: FullscreenMode.CSS_SIMULATED, shouldRotateToLandscape: false });
-  };
-  const exitFullscreen = async () => {
-    return withErrorHandling(async () => {
-      const elements = DOMElementGetter.getAllElements();
-      if (!elements.view) {
-        throw new Error("live-core-view element not found");
+    const l = await D.requestFullscreen(
+      e.container,
+      e.view,
+      c,
+      S.value,
+      t
+    );
+    return l.success ? (d.value = !0, console.log(`Fullscreen request successful (${l.mode})`)) : console.error("Fullscreen request failed:", l.error), L.value = l.shouldRotateToLandscape, l;
+  }, "Request fullscreen", { success: !1, mode: k.CSS_SIMULATED, shouldRotateToLandscape: !1 }), T = async () => u(async () => {
+    const e = i.getAllElements();
+    if (!e.view)
+      throw new Error("live-core-view element not found");
+    const n = R(), a = ce(c, p.value);
+    console.log("Exit fullscreen:", {
+      deviceType: c,
+      currentOrientation: n,
+      streamType: p.value ? "landscape stream" : S.value ? "portrait stream" : "unknown",
+      hadLandscapeRotation: a,
+      reason: a ? "Mobile device with landscape stream in landscape mode" : n === "portrait" ? "Already in portrait orientation" : p.value ? "Desktop device or other reason" : "Not a landscape stream"
+    });
+    const t = await D.exitFullscreen(
+      e.view,
+      c,
+      a
+    );
+    return t.mode === k.CSS_SIMULATED && (d.value = !1), t.success ? console.log(`Fullscreen exit successful (${t.mode})`) : console.error("Fullscreen exit failed:", t.error), L.value = !1, t;
+  }, "Exit fullscreen", { success: !1, mode: k.CSS_SIMULATED, shouldRotateToLandscape: !1 }), H = async () => u(async () => {
+    const e = i.getVideoElement();
+    if (!e)
+      throw new Error("Video element not found");
+    if (!e.requestPictureInPicture)
+      throw new Error("Picture-in-picture not supported in current environment");
+    return C(), await e.requestPictureInPicture(), console.log("Picture-in-picture request successful"), !0;
+  }, "Request picture-in-picture", !1), A = async () => u(async () => {
+    if (!document.exitPictureInPicture)
+      throw new Error("Exit picture-in-picture not supported in current environment");
+    return await document.exitPictureInPicture(), console.log("Picture-in-picture exit successful"), !0;
+  }, "Exit picture-in-picture", !1), $ = async (e) => u(async () => {
+    if (!h.instance)
+      throw new Error("Room engine instance not available");
+    return await h.instance.callExperimentalAPI(
+      JSON.stringify({
+        api: "switchPlaybackQuality",
+        params: {
+          quality: e,
+          autoSwitch: !1
+        }
+      })
+    ), r.value || (r.value = !0), v.value = e, console.log(`Resolution switched to: ${e}`), !0;
+  }, "Switch resolution", !1), O = async (e) => u(async () => {
+    if (!h.instance)
+      throw new Error("Room engine instance not available");
+    const n = await h.instance.callExperimentalAPI(
+      JSON.stringify({
+        api: "queryPlaybackQualityList",
+        params: {
+          roomId: e
+        }
+      })
+    );
+    return console.log(`Retrieved resolution list for room ${e}:`, n), n || [];
+  }, "Get resolution list", []), J = async (e, n = !0) => {
+    try {
+      const a = `${me}_${e}`, t = localStorage.getItem(a) === "true", l = await O(e);
+      if (z.value = l, l.length === 0) {
+        console.warn("No resolutions available for room:", e);
+        return;
       }
-      const currentOrientation = getCurrentOrientation();
-      const hadLandscapeRotation = hadLandscapeRotationToUndo(deviceType, isLandscapeStream.value);
-      console.log("Exit fullscreen:", {
-        deviceType,
-        currentOrientation,
-        streamType: isLandscapeStream.value ? "landscape stream" : isPortraitStream.value ? "portrait stream" : "unknown",
-        hadLandscapeRotation,
-        reason: hadLandscapeRotation ? "Mobile device with landscape stream in landscape mode" : currentOrientation === "portrait" ? "Already in portrait orientation" : !isLandscapeStream.value ? "Not a landscape stream" : "Desktop device or other reason"
+      (!v.value || !l.includes(v.value)) && (v.value = l[0]);
+      const w = n && !t && v.value !== void 0;
+      w && (await $(v.value), localStorage.setItem(a, "true")), console.log(`Resolution initialized for room ${e}:`, {
+        availableResolutions: l,
+        currentResolution: v.value,
+        applied: w,
+        hasInitialized: t
       });
-      const result = await FullscreenManager.exitFullscreen(
-        elements.view,
-        deviceType,
-        hadLandscapeRotation
-      );
-      if (result.mode === FullscreenMode.CSS_SIMULATED) {
-        isFullscreen.value = false;
-      }
-      if (result.success) {
-        console.log(`Fullscreen exit successful (${result.mode})`);
-      } else {
-        console.error("Fullscreen exit failed:", result.error);
-      }
-      isLandscapeStyleMode.value = false;
-      return result;
-    }, "Exit fullscreen", { success: false, mode: FullscreenMode.CSS_SIMULATED, shouldRotateToLandscape: false });
-  };
-  const requestPictureInPicture = async () => {
-    return withErrorHandling(async () => {
-      const video = DOMElementGetter.getVideoElement();
-      if (!video) {
-        throw new Error("Video element not found");
-      }
-      if (!video.requestPictureInPicture) {
-        throw new Error("Picture-in-picture not supported in current environment");
-      }
-      setupVideoEventListeners();
-      await video.requestPictureInPicture();
-      console.log("Picture-in-picture request successful");
-      return true;
-    }, "Request picture-in-picture", false);
-  };
-  const exitPictureInPicture = async () => {
-    return withErrorHandling(async () => {
-      if (!document.exitPictureInPicture) {
-        throw new Error("Exit picture-in-picture not supported in current environment");
-      }
-      await document.exitPictureInPicture();
-      console.log("Picture-in-picture exit successful");
-      return true;
-    }, "Exit picture-in-picture", false);
-  };
-  const setVolume = async (volume) => {
-    return withErrorHandling(async () => {
-      var _a;
-      if (volume < 0 || volume > 1) {
-        throw new Error("Volume value must be between 0-1");
-      }
-      const trtcCloudMap = TRTCCloud.subCloudMap;
-      if (volume === 0) {
-        trtcCloudMap.forEach((trtcCloud) => {
-          const trtc = trtcCloud == null ? void 0 : trtcCloud._trtc;
-          trtc == null ? void 0 : trtc.muteRemoteAudio("*", true);
-        });
-      } else {
-        trtcCloudMap.forEach((trtcCloud) => {
-          const trtc = trtcCloud == null ? void 0 : trtcCloud._trtc;
-          trtc == null ? void 0 : trtc.muteRemoteAudio("*", false);
-        });
-      }
-      (_a = roomEngine.instance) == null ? void 0 : _a.setAudioPlayoutVolume({ volume: volume * 100 });
-      currentVolume.value = volume;
-      console.log(`Video volume set to: ${volume}`);
-      return true;
-    }, "Set volume", false);
-  };
-  const changeFillMode = async (fillMode) => {
-    return withErrorHandling(async () => {
-      currentFillMode.value = fillMode;
-      console.log(`Fill mode changed to: ${fillMode}`);
-      return true;
-    }, "Change fill mode", false);
-  };
-  const handleFullscreenExit = () => {
+    } catch (a) {
+      console.error("Failed to initialize resolution:", a);
+    }
+  }, j = async (e) => u(async () => {
+    var a;
+    if (e < 0 || e > 1)
+      throw new Error("Volume value must be between 0-1");
+    const n = V.subCloudMap;
+    return e === 0 ? n.forEach((t) => {
+      const l = t == null ? void 0 : t._trtc;
+      l == null || l.muteRemoteAudio("*", !0);
+    }) : n.forEach((t) => {
+      const l = t == null ? void 0 : t._trtc;
+      l == null || l.muteRemoteAudio("*", !1);
+    }), (a = h.instance) == null || a.setAudioPlayoutVolume({ volume: e * 100 }), g.value = e, console.log(`Video volume set to: ${e}`), !0;
+  }, "Set volume", !1), K = async (e) => u(async () => (N.value = e, console.log(`Fill mode changed to: ${e}`), !0), "Change fill mode", !1), q = () => {
     try {
-      const elements = DOMElementGetter.getAllElements();
-      if (!elements.view) {
+      const e = i.getAllElements();
+      if (!e.view) {
         console.warn("live-core-view element not found for fullscreen exit cleanup");
         return;
       }
       console.log("Executing fullscreen exit style cleanup:", {
-        deviceType,
-        hasLandscapeStream: isLandscapeStream.value,
-        currentOrientation: getCurrentOrientation()
-      });
-      StyleManager.removeFullscreenStyles(elements.view);
-      StyleManager.removeLandscapeStyles(elements.view);
-      if (deviceType !== "desktop") {
-        OrientationManager.unlockOrientation().catch((error) => {
-          console.warn("Failed to unlock orientation during cleanup:", error);
-        });
-      }
-      isLandscapeStyleMode.value = false;
-      console.log("Fullscreen exit style cleanup completed");
-    } catch (error) {
-      console.error("Fullscreen exit style cleanup failed:", error);
+        deviceType: c,
+        hasLandscapeStream: p.value,
+        currentOrientation: R()
+      }), I.removeFullscreenStyles(e.view), I.removeLandscapeStyles(e.view), c !== "desktop" && F.unlockOrientation().catch((n) => {
+        console.warn("Failed to unlock orientation during cleanup:", n);
+      }), L.value = !1, console.log("Fullscreen exit style cleanup completed");
+    } catch (e) {
+      console.error("Fullscreen exit style cleanup failed:", e);
     }
-  };
-  const setupFullscreenEventListeners = () => {
-    const handleFullscreenChange = () => {
-      const isCurrentlyFullscreen = !!document.fullscreenElement;
-      const wasFullscreen = isFullscreen.value;
+  }, X = () => {
+    const e = () => {
+      const a = !!document.fullscreenElement, t = d.value;
       console.log("Fullscreen state change:", {
         fullscreenElement: document.fullscreenElement,
-        isCurrentlyFullscreen,
-        previousValue: wasFullscreen,
-        deviceType,
-        changeType: isCurrentlyFullscreen ? "entered" : "exited"
-      });
-      isFullscreen.value = isCurrentlyFullscreen;
-      if (wasFullscreen && !isCurrentlyFullscreen) {
-        console.log("Detected passive fullscreen exit, executing style cleanup");
-        handleFullscreenExit();
-      }
+        isCurrentlyFullscreen: a,
+        previousValue: t,
+        deviceType: c,
+        changeType: a ? "entered" : "exited"
+      }), d.value = a, t && !a && (console.log("Detected passive fullscreen exit, executing style cleanup"), q());
     };
-    eventManager.addListener("fullscreenchange", document, "fullscreenchange", handleFullscreenChange);
-    eventManager.addListener("webkitfullscreenchange", document, "webkitfullscreenchange", handleFullscreenChange);
-    eventManager.addListener("mozfullscreenchange", document, "mozfullscreenchange", handleFullscreenChange);
-    eventManager.addListener("MSFullscreenChange", document, "MSFullscreenChange", handleFullscreenChange);
-    const handleVisibilityChange = () => {
-      if (document.visibilityState === "visible" && isFullscreen.value) {
-        const actuallyFullscreen = !!document.fullscreenElement;
-        if (!actuallyFullscreen) {
-          console.log("Detected fullscreen state inconsistency via visibilitychange, executing cleanup");
-          isFullscreen.value = false;
-          handleFullscreenExit();
-        }
-      }
+    o.addListener("fullscreenchange", document, "fullscreenchange", e), o.addListener("webkitfullscreenchange", document, "webkitfullscreenchange", e), o.addListener("mozfullscreenchange", document, "mozfullscreenchange", e), o.addListener("MSFullscreenChange", document, "MSFullscreenChange", e);
+    const n = () => {
+      document.visibilityState === "visible" && d.value && (document.fullscreenElement || (console.log("Detected fullscreen state inconsistency via visibilitychange, executing cleanup"), d.value = !1, q()));
     };
-    eventManager.addListener("visibilitychange", document, "visibilitychange", handleVisibilityChange);
-  };
-  const setupVideoEventListeners = () => {
-    const video = DOMElementGetter.getVideoElement();
-    if (!video) return;
-    const handleEnterPictureInPicture = () => {
-      console.log("Entered picture-in-picture mode");
-      isPictureInPicture.value = true;
-    };
-    const handleLeavePictureInPicture = () => {
-      console.log("Left picture-in-picture mode");
-      isPictureInPicture.value = false;
-      setTimeout(resume, 300);
-    };
-    const handlePlay = () => {
-      console.log("Video play event detected");
-      isPlaying.value = true;
-    };
-    const handlePause = () => {
-      console.log("Video pause event detected");
-      isPlaying.value = false;
-    };
-    const handleEnded = () => {
-      console.log("Video ended event detected");
-      isPlaying.value = false;
-    };
-    const handleLoadStart = () => {
-      console.log("Video load start event detected");
-      isPlaying.value = !video.paused;
-    };
-    const handleCanPlay = () => {
-      console.log("Video can play event detected");
-      isPlaying.value = !video.paused;
+    o.addListener("visibilitychange", document, "visibilitychange", n);
+  }, C = () => {
+    const e = i.getVideoElement();
+    if (!e) return;
+    const n = () => {
+      console.log("Entered picture-in-picture mode"), P.value = !0;
+    }, a = () => {
+      console.log("Left picture-in-picture mode"), P.value = !1, setTimeout(M, 300);
+    }, t = () => {
+      console.log("Video play event detected"), r.value = !0;
+    }, l = () => {
+      console.log("Video pause event detected"), r.value = !1;
+    }, w = () => {
+      console.log("Video ended event detected"), r.value = !1;
+    }, B = () => {
+      console.log("Video load start event detected"), r.value = !e.paused;
+    }, W = () => {
+      console.log("Video can play event detected"), r.value = !e.paused;
+    }, Y = () => {
+      console.log("Video seeking event detected"), y();
+    }, ee = () => {
+      console.log("Video seeked event detected"), y();
+    }, te = () => {
+      Math.random() < 0.1 && y();
+    }, ne = () => {
+      console.log("Video volume change event detected"), y(), b();
     };
-    const handleSeeking = () => {
-      console.log("Video seeking event detected");
-      syncPlayingState();
-    };
-    const handleSeeked = () => {
-      console.log("Video seeked event detected");
-      syncPlayingState();
-    };
-    const handleTimeUpdate = () => {
-      if (Math.random() < 0.1) {
-        syncPlayingState();
-      }
-    };
-    const handleVolumeChange = () => {
-      console.log("Video volume change event detected");
-      syncPlayingState();
-      syncVolumeState();
-    };
-    eventManager.addListener("enterpictureinpicture", video, "enterpictureinpicture", handleEnterPictureInPicture);
-    eventManager.addListener("leavepictureinpicture", video, "leavepictureinpicture", handleLeavePictureInPicture);
-    eventManager.addListener("play", video, "play", handlePlay);
-    eventManager.addListener("pause", video, "pause", handlePause);
-    eventManager.addListener("ended", video, "ended", handleEnded);
-    eventManager.addListener("loadstart", video, "loadstart", handleLoadStart);
-    eventManager.addListener("canplay", video, "canplay", handleCanPlay);
-    eventManager.addListener("seeking", video, "seeking", handleSeeking);
-    eventManager.addListener("seeked", video, "seeked", handleSeeked);
-    eventManager.addListener("timeupdate", video, "timeupdate", handleTimeUpdate);
-    eventManager.addListener("volumechange", video, "volumechange", handleVolumeChange);
-  };
-  const cleanup = () => {
-    console.log("Cleaning up player control state...");
-    OrientationManager.removeOrientationListener(orientationListenerId);
-    eventManager.removeAllListeners();
-    console.log(`Cleaned up ${eventManager.getListenerCount()} event listeners`);
+    o.addListener("enterpictureinpicture", e, "enterpictureinpicture", n), o.addListener("leavepictureinpicture", e, "leavepictureinpicture", a), o.addListener("play", e, "play", t), o.addListener("pause", e, "pause", l), o.addListener("ended", e, "ended", w), o.addListener("loadstart", e, "loadstart", B), o.addListener("canplay", e, "canplay", W), o.addListener("seeking", e, "seeking", Y), o.addListener("seeked", e, "seeked", ee), o.addListener("timeupdate", e, "timeupdate", te), o.addListener("volumechange", e, "volumechange", ne);
+  }, Z = () => {
+    console.log("Cleaning up player control state..."), F.removeOrientationListener(x), o.removeAllListeners(), console.log(`Cleaned up ${o.getListenerCount()} event listeners`);
   };
-  setupFullscreenEventListeners();
-  setupVideoEventListeners();
-  OrientationManager.addOrientationListener(orientationListenerId, handleOrientationChange);
-  syncPlayingState();
-  syncVolumeState();
-  watch(localLiveStatus, (newStatus) => {
-    if (newStatus === LiveStatus.Ended) {
-      exitFullscreen();
-      exitPictureInPicture();
-      isPlaying.value = true;
-      isFullscreen.value = false;
-      isPictureInPicture.value = false;
-      currentVolume.value = 1;
-    }
-  });
-  return {
+  return X(), C(), F.addOrientationListener(x, U), y(), b(), ae(s, (e) => {
+    e === de.Ended && (T(), A(), r.value = !0, d.value = !1, P.value = !1, g.value = 1);
+  }), {
     // State
-    isPlaying,
-    currentFillMode,
-    isFullscreen,
-    isLandscapeStyleMode,
-    isPictureInPicture,
-    currentVolume,
+    isPlaying: r,
+    currentFillMode: N,
+    isFullscreen: d,
+    isLandscapeStyleMode: L,
+    isPictureInPicture: P,
+    currentVolume: g,
+    // Resolution state
+    resolutionList: z,
+    currentResolution: v,
     // Methods
-    resume,
-    pause,
-    requestFullscreen,
-    exitFullscreen,
-    requestPictureInPicture,
-    exitPictureInPicture,
-    setVolume,
-    changeFillMode,
+    resume: M,
+    pause: Q,
+    requestFullscreen: G,
+    exitFullscreen: T,
+    requestPictureInPicture: H,
+    exitPictureInPicture: A,
+    switchResolution: $,
+    getResolutionList: O,
+    initializeResolution: J,
+    setVolume: j,
+    changeFillMode: K,
     // Cleanup
-    cleanup
+    cleanup: Z
   };
 }
 export {
-  FillMode,
-  usePlayerControlState
+  pe as FillMode,
+  ve as Resolution,
+  Ve as usePlayerControlState
 };