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);
}