Folder organisation

src/vr180player/media/video-events.ts

@@ -0,0 +1,54 @@
+type VideoEventCallbacks = {
+	onEnded: () => void;
+	onPlaybackStateChange: () => void;
+	onTimelineChange: () => void;
+	onVolumeChange: () => void;
+};
+
+type BindVideoEventsOptions = VideoEventCallbacks & {
+	playButton: HTMLButtonElement | undefined;
+	video: HTMLVideoElement;
+};
+
+export function bindVideoEvents({
+	onEnded,
+	onPlaybackStateChange,
+	onTimelineChange,
+	onVolumeChange,
+	playButton,
+	video
+}: BindVideoEventsOptions): void {
+	video.onloadedmetadata = () => {
+		if (isFinite(video.duration) && playButton) {
+			playButton.disabled = false;
+		}
+
+		onTimelineChange();
+		onPlaybackStateChange();
+		onVolumeChange();
+	};
+
+	video.oncanplaythrough = () => {
+		if (playButton && video.readyState >= video.HAVE_FUTURE_DATA) {
+			playButton.disabled = false;
+		}
+	};
+
+	video.ontimeupdate = () => {
+		if (isFinite(video.duration)) {
+			onTimelineChange();
+		}
+	};
+
+	video.onplaying = onPlaybackStateChange;
+	video.onpause = onPlaybackStateChange;
+	video.onerror = (event) => {
+		const videoError = video.error;
+		const errorDetail = videoError ? `Code: ${videoError.code}, Message: ${videoError.message}` : 'Unknown error';
+		console.error('VIDEO_ERROR_EVENT:', event, 'Details:', errorDetail);
+		if (playButton) playButton.disabled = true;
+	};
+
+	video.addEventListener('ended', onEnded);
+	video.addEventListener('volumechange', onVolumeChange);
+}