more refactors

src/vr180player/vr180-player.ts

@@ -32,7 +32,8 @@ import {
 	createPlayerRenderer,
 	resizePlayerRenderer
 } from './rendering/renderer-lifecycle.js';
-import { VideoTextureManager } from './rendering/texture-manager.js';
+import { MediaTextureManager } from './rendering/texture-manager.js';
+import type { SupportedMediaAdapter } from './media/media-adapter.js';
 
 const _playerBase = new URL('.', import.meta.url).href;
 
@@ -41,13 +42,14 @@ let scene, camera, renderer, video, sphereMaterial;
 let vr180Mesh, planeMesh, activeContentMesh;
 let xrSession = null;
 let raycaster, uiElements = [];
-let videoElement, playBtn;
+let mediaAdapter: SupportedMediaAdapter | undefined;
+let playBtn;
 let frameCounter = 0;
 
 let isXrLoopActive = false;
 let vrControlPanel;
 let mediaController: MediaController | undefined;
-let textureManager: VideoTextureManager | undefined;
+let textureManager: MediaTextureManager<HTMLVideoElement> | undefined;
 let vrPanel: VrControlPanel | undefined;
 let twoDMode: TwoDMode | undefined;
 const vrPanelVisibility = new VrPanelVisibility();
@@ -59,7 +61,8 @@ let fallbackCameraControls: FallbackCameraControls | undefined;
 bootstrapPlayer(_playerBase, (context) => {
 	playerContainer = context.playerContainer;
 	projectionMode = context.projectionMode;
-	videoElement = context.videoElement;
+	mediaAdapter = context.mediaAdapter;
+	video = mediaAdapter.element;
 	playBtn = context.playButton;
 	init();
 });
@@ -106,18 +109,16 @@ function closeActiveXrSessionAfterContextLoss() {
 }
 
 function restoreVideoTextureAfterContextRestored() {
-	if (video && sphereMaterial && activeContentMesh && activeContentMesh.visible && renderer.xr.isPresenting && xrSession) {
+	if (mediaAdapter && sphereMaterial && activeContentMesh && activeContentMesh.visible && renderer.xr.isPresenting && xrSession) {
 		textureManager?.assignToMaterial(sphereMaterial);
 		updateVRPlayPauseButtonIcon();
 		updateVRVolumeButtonIcon();
-		console.log("Re-initialized video texture after context restoration during VR.");
+		console.log("Re-initialized media texture after context restoration during VR.");
 	}
 }
 
-function getVideoTitle() {
-	return videoElement.getAttribute('title') ||
-		videoElement.querySelector('source')?.src.split('/').pop()?.split('.')[0].replace(/-/g, ' ') ||
-		"Video Title";
+function getMediaTitle() {
+	return mediaAdapter?.getTitle() || 'Video Title';
 }
 
 
@@ -131,9 +132,16 @@ function init() {
 		scene = playerRenderer.scene;
 		camera = playerRenderer.camera;
 		renderer = playerRenderer.renderer;
+		if (!mediaAdapter) {
+			throw new Error('Media adapter is not initialized.');
+		}
 
-		video = videoElement;
-		textureManager = new VideoTextureManager(video, createVideoTextureCore);
+		video = mediaAdapter.element;
+		textureManager = new MediaTextureManager(
+			mediaAdapter.textureSource,
+			createVideoTextureCore,
+			() => mediaAdapter?.shouldUpdateTexture() ?? false
+		);
 		mediaController = new MediaController({
 			is2DModeActive,
 			on2DPlaybackResume: show2DControlPanel,
@@ -171,12 +179,13 @@ function init() {
 			getCamera: () => camera2D,
 			getCameraControls: () => fallbackCameraControls,
 			getMaterial: () => sphereMaterial,
+			getMediaElement: () => mediaAdapter?.element,
 			getRenderer: () => renderer,
 			getScene: () => scene,
 			getVideo: () => video,
 			playerContainer,
 			projectionMode,
-			title: getVideoTitle()
+			title: getMediaTitle()
 		});
 	} catch (e) {
 		console.error("INIT_ERROR (Phase 1 - Core Setup):", e);
@@ -185,7 +194,7 @@ function init() {
 	}
 
 	try { // Phase 2: VR Control Panel UI
-		vrPanel = createVrControlPanel(scene, getVideoTitle());
+		vrPanel = createVrControlPanel(scene, getMediaTitle());
 		vrControlPanel = vrPanel.group;
 		vrPanelVisibility.setPanel(vrPanel);
 		uiElements.push(...vrPanel.interactables);
@@ -372,8 +381,8 @@ function onSelectStartVR(event) {
 }
 
 async function handleEnterVRButtonClick() {
-	if (!video) {
-		console.error("Video element not found for VR button click.");
+	if (!mediaAdapter) {
+		console.error("Media element not found for VR button click.");
 		return;
 	}
 	
@@ -418,10 +427,7 @@ async function actualSessionToggle() {
 			xrSession.addEventListener('end', onVRSessionEnd); 
 
 
-			// Hide the regular video element when entering VR
-			if (video) {
-				video.style.display = 'none';
-			}
+			mediaAdapter?.hideElement();
 
 			if (mediaController && video && (video.paused || video.ended)) {
 				try {
@@ -435,8 +441,8 @@ async function actualSessionToggle() {
 			positionPlaneForPresentation(false);
 
 			textureManager?.dispose();
-			if (!video) {
-				throw new Error("Video element not available for creating texture.");
+			if (!mediaAdapter) {
+				throw new Error("Media adapter not available for creating texture.");
 			}
 			if (!activeContentMesh || !sphereMaterial) {
 				throw new Error("VR mesh components not ready for texture.");
@@ -495,10 +501,7 @@ function onVRSessionEnd(event) {
 		}
 	}
 
-	// Show the regular video element when exiting VR
-	if (video) {
-		video.style.display = '';
-	}
+	mediaAdapter?.showElement();
 
 	mediaController?.pauseIfPlaying();
 
@@ -558,7 +561,7 @@ function renderXR(timestamp, frame) {
 		}
 	}
 	try {
-		textureManager?.updateIfPlaying();
+		textureManager?.updateIfNeeded();
 		renderer.render(scene, camera);
 	} catch (error) {
 		const renderErrorMsg = "ERROR_IN_RENDERXR_LOOP (F" + frameCounter + "): " + (error.message || String(error));