more refactors

src/vr180player/media/media-adapter.ts

@@ -0,0 +1,70 @@
+export type MediaCapabilities = {
+	audio: boolean;
+	dynamicTexture: boolean;
+	playback: boolean;
+	timeline: boolean;
+};
+
+export interface MediaAdapter<TElement extends HTMLElement = HTMLElement, TTextureSource = TElement> {
+	readonly capabilities: MediaCapabilities;
+	readonly element: TElement;
+	readonly kind: string;
+	readonly textureSource: TTextureSource;
+	getTitle(): string;
+	hideElement(): void;
+	load(): void;
+	shouldUpdateTexture(): boolean;
+	showElement(): void;
+}
+
+export type SupportedMediaAdapter = VideoMediaAdapter;
+
+const VIDEO_CAPABILITIES: MediaCapabilities = {
+	audio: true,
+	dynamicTexture: true,
+	playback: true,
+	timeline: true
+};
+
+export class VideoMediaAdapter implements MediaAdapter<HTMLVideoElement, HTMLVideoElement> {
+	readonly capabilities = VIDEO_CAPABILITIES;
+	readonly kind = 'video';
+
+	constructor(readonly element: HTMLVideoElement) {}
+
+	get textureSource(): HTMLVideoElement {
+		return this.element;
+	}
+
+	getTitle(): string {
+		return this.element.getAttribute('title') ||
+			this.element.querySelector('source')?.src.split('/').pop()?.split('.')[0].replace(/-/g, ' ') ||
+			'Video Title';
+	}
+
+	hideElement(): void {
+		this.element.style.display = 'none';
+	}
+
+	load(): void {
+		this.element.load();
+	}
+
+	shouldUpdateTexture(): boolean {
+		return !this.element.paused && !this.element.ended;
+	}
+
+	showElement(): void {
+		this.element.style.display = '';
+	}
+}
+
+export function createMediaAdapter(playerContainer: HTMLElement): SupportedMediaAdapter | null {
+	const videoElement = playerContainer.querySelector<HTMLVideoElement>('video');
+	if (!videoElement) {
+		return null;
+	}
+
+	videoElement.classList.add('vrwp-video');
+	return new VideoMediaAdapter(videoElement);
+}