@therealtinhtute/baroiplayer 1.2.0 → 2.0.0-beta.1

package/src/hooks/use-focus-trap.tsx

@@ -1,162 +0,0 @@
-import { type RefObject, useCallback, useEffect, useRef } from "react"
-
-interface UseFocusTrapOptions {
-	active?: boolean
-	initialFocus?: boolean
-	returnFocus?: boolean
-	trapId?: string
-}
-
-export function useFocusTrap(
-	containerRef: RefObject<HTMLElement>,
-	options: UseFocusTrapOptions = {}
-) {
-	const { active = true, initialFocus = true, returnFocus = true, trapId } = options
-	const previousFocusRef = useRef<HTMLElement | null>(null)
-	const lastFocusedElementRef = useRef<HTMLElement | null>(null)
-
-	const getFocusableElements = useCallback(() => {
-		const container = containerRef.current
-		if (!container) return []
-
-		return container.querySelectorAll<HTMLElement>(
-			'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-		)
-	}, [containerRef])
-
-	const handleKeyDown = useCallback((e: KeyboardEvent) => {
-		if (!active || e.key !== "Tab") return
-
-		const focusableElements = getFocusableElements()
-		if (focusableElements.length === 0) return
-
-		const firstElement = focusableElements[0]
-		const lastElement = focusableElements[focusableElements.length - 1]
-
-		if (e.shiftKey) {
-			if (document.activeElement === firstElement) {
-				e.preventDefault()
-				lastElement?.focus()
-			}
-		} else {
-			if (document.activeElement === lastElement) {
-				e.preventDefault()
-				firstElement?.focus()
-			}
-		}
-	}, [active, getFocusableElements])
-
-	const handleTabKeyDown = useCallback((e: KeyboardEvent) => {
-		handleKeyDown(e)
-	}, [handleKeyDown])
-
-	useEffect(() => {
-		if (!active) return
-
-		const container = containerRef.current
-		if (!container) return
-
-		previousFocusRef.current = document.activeElement as HTMLElement
-
-		const handleTab = (e: KeyboardEvent) => {
-			if (e.key === "Tab") {
-				handleTabKeyDown(e)
-			}
-		}
-
-		container.addEventListener("keydown", handleTab)
-
-		if (initialFocus) {
-			const focusableElements = getFocusableElements()
-			const firstFocusable = focusableElements[0]
-			if (firstFocusable) {
-				setTimeout(() => firstFocusable.focus(), 0)
-			}
-		}
-
-		if (trapId) {
-			container.setAttribute("id", trapId)
-		}
-
-		return () => {
-			container.removeEventListener("keydown", handleTab)
-
-			if (returnFocus && previousFocusRef.current) {
-				try {
-					previousFocusRef.current.focus()
-				} catch {
-				}
-			}
-
-			if (trapId) {
-				container.removeAttribute("id")
-			}
-		}
-	}, [active, containerRef, initialFocus, returnFocus, trapId, getFocusableElements, handleTabKeyDown])
-
-	const focusFirstElement = useCallback(() => {
-		const focusableElements = getFocusableElements()
-		const firstElement = focusableElements[0]
-		firstElement?.focus()
-		lastFocusedElementRef.current = firstElement || null
-	}, [getFocusableElements])
-
-	const focusLastElement = useCallback(() => {
-		const focusableElements = getFocusableElements()
-		const lastElement = focusableElements[focusableElements.length - 1]
-		lastElement?.focus()
-		lastFocusedElementRef.current = lastElement || null
-	}, [getFocusableElements])
-
-	return {
-		focusFirstElement,
-		focusLastElement
-	}
-}
-
-interface FocusScopeProps {
-	children: React.ReactNode
-	active?: boolean
-	initialFocus?: boolean
-	returnFocus?: boolean
-	onEscape?: (event: KeyboardEvent) => void
-}
-
-export function FocusScope({
-	children,
-	active = true,
-	initialFocus = true,
-	returnFocus = true,
-	onEscape
-}: FocusScopeProps) {
-	const containerRef = useRef<HTMLDivElement>(null)
-
-	const handleKeyDown = useCallback((e: KeyboardEvent) => {
-		if (e.key === "Escape") {
-			onEscape?.(e)
-		}
-	}, [onEscape])
-
-	useEffect(() => {
-		const container = containerRef.current
-		if (!container || !active) return
-
-		const handleKeyDownEvent = (e: KeyboardEvent) => {
-			if (e.key === "Escape") {
-				handleKeyDown(e)
-			}
-		}
-
-		container.addEventListener("keydown", handleKeyDownEvent)
-
-		return () => {
-			container.removeEventListener("keydown", handleKeyDownEvent)
-		}
-	}, [active, handleKeyDown])
-
-	return (
-		<div ref={containerRef} data-focus-scope={active ? "active" : "inactive"}>
-			{children}
-		</div>
-	)
-}

package/src/hooks/use-intelligent-preloading.ts

@@ -1,387 +0,0 @@
-/**
- * Intelligent Preloading Hook
- * Combines user behavior analysis with network conditions for optimal preloading
- */
-
-import { useCallback, useEffect, useMemo, useRef } from "react"
-import { MediaSource } from "../types"
-
-interface NetworkInformation {
-	type?: string
-	downlink?: number
-	effectiveType?: "slow-2g" | "2g" | "3g" | "4g"
-	saveData?: boolean
-	rtt?: number
-	addEventListener?: (type: string, listener: EventListener) => void
-	removeEventListener?: (type: string, listener: EventListener) => void
-}
-
-interface IntelligentPreloadingOptions {
-	/** Enable user behavior tracking */
-	trackUserBehavior?: boolean
-	/** Adapt to network conditions */
-	adaptToNetwork?: boolean
-	/** Preload strategy */
-	strategy?: "conservative" | "balanced" | "aggressive"
-	/** Maximum number of items to preload */
-	maxPreloadItems?: number
-	/** Preload radius for playlist items */
-	preloadRadius?: number
-}
-
-interface UserBehaviorData {
-	mouseMovements: number
-	scrollEvents: number
-	keyPresses: number
-	focusEvents: number
-	timeOnPage: number
-	engagementScore: number
-	lastInteraction: number
-}
-
-interface PreloadingDecision {
-	shouldPreload: boolean
-	priority: "high" | "medium" | "low"
-	reason: string
-}
-
-export const useIntelligentPreloading = (
-	sources: MediaSource[],
-	options: IntelligentPreloadingOptions = {}
-) => {
-	const {
-		trackUserBehavior = true,
-		adaptToNetwork = true,
-		strategy = "balanced",
-		maxPreloadItems = 3,
-		preloadRadius = 2
-	} = options
-
-	const userBehaviorRef = useRef<UserBehaviorData>({
-		mouseMovements: 0,
-		scrollEvents: 0,
-		keyPresses: 0,
-		focusEvents: 0,
-		timeOnPage: 0,
-		engagementScore: 0,
-		lastInteraction: Date.now()
-	})
-
-	const networkInfoRef = useRef<NetworkInformation | null>(null)
-	const preloadedItemsRef = useRef<Set<string>>(new Set())
-	const preloadQueueRef = useRef<Array<{ source: MediaSource; priority: number }>>([])
-
-	// Calculate user engagement score
-	const calculateEngagementScore = useCallback((): number => {
-		const behavior = userBehaviorRef.current
-		const timeFactor = Math.min(behavior.timeOnPage / 60000, 1) // Cap at 1 minute
-		const interactionFactor = Math.min(
-			(behavior.mouseMovements + behavior.scrollEvents + behavior.keyPresses) / 100,
-			1
-		)
-
-		return (timeFactor * 0.4 + interactionFactor * 0.6) * 100
-	}, [])
-
-	// Update user behavior tracking
-	const updateUserBehavior = useCallback(
-		(type: keyof UserBehaviorData, increment = 1) => {
-			const behavior = userBehaviorRef.current
-			behavior[type] = typeof behavior[type] === "number" ? behavior[type] + increment : Date.now()
-			behavior.engagementScore = calculateEngagementScore()
-			behavior.lastInteraction = Date.now()
-		},
-		[calculateEngagementScore]
-	)
-
-	// Get current network conditions
-	const getNetworkConditions = useCallback(() => {
-		if (!networkInfoRef.current || !adaptToNetwork) {
-			return { type: "unknown", downlink: 10, effectiveType: "4g", saveData: false }
-		}
-
-		const network = networkInfoRef.current
-		return {
-			type: network.type,
-			downlink: network.downlink || 10,
-			effectiveType: network.effectiveType || "4g",
-			saveData: network.saveData || false,
-			rtt: network.rtt || 100
-		}
-	}, [adaptToNetwork])
-
-	// Determine if a source should be preloaded
-	const shouldPreloadSource = useCallback(
-		(source: MediaSource, index: number, currentIndex: number = 0): PreloadingDecision => {
-			// Skip if already preloaded
-			if (preloadedItemsRef.current.has(source.src)) {
-				return { shouldPreload: false, priority: "low", reason: "Already preloaded" }
-			}
-
-			// Check if within preload radius
-			const distance = Math.abs(index - currentIndex)
-			if (distance > preloadRadius) {
-				return { shouldPreload: false, priority: "low", reason: "Outside preload radius" }
-			}
-
-			const behavior = userBehaviorRef.current
-			const network = getNetworkConditions()
-			const engagementScore = behavior.engagementScore
-			const timeSinceInteraction = Date.now() - behavior.lastInteraction
-
-			// Network-based decisions
-			if (network.saveData) {
-				return { shouldPreload: false, priority: "low", reason: "Data saver mode" }
-			}
-
-			// Strategy-based filtering
-			let shouldPreload = false
-			let priority: "high" | "medium" | "low" = "medium"
-			let reason = ""
-
-			switch (strategy) {
-				case "conservative":
-					shouldPreload = engagementScore > 70 && network.effectiveType !== "2g" && distance === 1
-					priority = shouldPreload ? "medium" : "low"
-					reason = shouldPreload ? "High engagement and optimal network" : "Conservative strategy"
-					break
-
-				case "aggressive":
-					shouldPreload = engagementScore > 30 && network.effectiveType !== "slow-2g"
-					priority = engagementScore > 70 ? "high" : engagementScore > 50 ? "medium" : "low"
-					reason = shouldPreload ? "Aggressive preloading" : "Low engagement"
-					break
-
-				case "balanced":
-				default:
-					const networkMultiplier =
-						network.effectiveType === "4g" ? 1 : network.effectiveType === "3g" ? 0.7 : 0.3
-					const adjustedScore = engagementScore * networkMultiplier
-
-					shouldPreload = adjustedScore > 40 && distance <= 2
-					priority = adjustedScore > 70 ? "high" : adjustedScore > 55 ? "medium" : "low"
-					reason = shouldPreload
-						? `Balanced: score ${adjustedScore.toFixed(1)}`
-						: "Low adjusted score"
-					break
-			}
-
-			// Additional heuristics
-			if (shouldPreload) {
-				const sourceType = source.type as string
-
-				// Prioritize HLS and adaptive streaming
-				if (sourceType === "hls" || sourceType === "m3u8" || sourceType === "application/x-mpegURL") {
-					priority = priority === "low" ? "medium" : "high"
-				}
-
-				// Boost priority for recent user interaction
-				if (timeSinceInteraction < 5000) {
-					// Within 5 seconds
-					priority = "high"
-					reason += " + Recent interaction"
-				}
-
-				// Consider content type (video gets higher priority than audio)
-				if (sourceType === "mp4" || sourceType === "webm" || sourceType === "video/mp4" || sourceType === "video/webm") {
-					priority = priority === "low" ? "medium" : priority
-				}
-			}
-
-			return { shouldPreload, priority, reason }
-		},
-		[strategy, preloadRadius, getNetworkConditions, calculateEngagementScore]
-	)
-
-	// Preload a specific source
-	const preloadSource = useCallback(async (source: MediaSource, priority: number) => {
-		try {
-			// Create a preload link element
-			const link = document.createElement("link")
-			link.rel = "preload"
-			link.href = source.src
-
-			const sourceType = source.type as string
-
-			// Determine the correct 'as' attribute
-			switch (sourceType) {
-				case "hls":
-				case "m3u8":
-				case "application/x-mpegURL":
-					link.as = "fetch"
-					break
-				case "mp4":
-				case "webm":
-				case "video/mp4":
-				case "video/webm":
-					link.as = "video"
-					break
-				case "mp3":
-				case "wav":
-				case "ogg":
-				case "audio/mpeg":
-				case "audio/wav":
-				case "audio/ogg":
-					link.as = "audio"
-					break
-				default:
-					link.as = "fetch"
-			}
-
-			link.crossOrigin = "anonymous"
-
-			// Add to document head
-			document.head.appendChild(link)
-
-			// Mark as preloaded
-			preloadedItemsRef.current.add(source.src)
-
-			console.debug(`Preloaded: ${source.src} (${priority})`)
-
-			// Cleanup after 30 seconds to prevent memory issues
-			setTimeout(() => {
-				if (document.head.contains(link)) {
-					document.head.removeChild(link)
-				}
-			}, 30000)
-		} catch (error) {
-			console.warn("Failed to preload source:", source.src, error)
-		}
-	}, [])
-
-	// Process preload queue
-	const processPreloadQueue = useCallback(() => {
-		if (preloadQueueRef.current.length === 0) return
-
-		// Sort by priority (higher number = higher priority)
-		const sortedQueue = [...preloadQueueRef.current].sort((a, b) => b.priority - a.priority)
-
-		// Take top items based on maxPreloadItems
-		const itemsToPreload = sortedQueue.slice(0, maxPreloadItems)
-
-		// Clear queue
-		preloadQueueRef.current = []
-
-		// Preload items
-		itemsToPreload.forEach(({ source, priority }) => {
-			preloadSource(source, priority)
-		})
-	}, [maxPreloadItems, preloadSource])
-
-	// Update preloading decisions
-	const updatePreloading = useCallback(
-		(currentIndex: number = 0) => {
-			preloadQueueRef.current = []
-
-			sources.forEach((source, index) => {
-				const decision = shouldPreloadSource(source, index, currentIndex)
-
-				if (decision.shouldPreload) {
-					const priority = decision.priority === "high" ? 3 : decision.priority === "medium" ? 2 : 1
-
-					preloadQueueRef.current.push({ source, priority })
-				}
-			})
-
-			processPreloadQueue()
-		},
-		[sources, shouldPreloadSource, processPreloadQueue]
-	)
-
-	// Set up user behavior tracking
-	useEffect(() => {
-		if (!trackUserBehavior) return
-
-		const handleMouseMove = () => updateUserBehavior("mouseMovements")
-		const handleScroll = () => updateUserBehavior("scrollEvents")
-		const handleKeyPress = () => updateUserBehavior("keyPresses")
-		const handleFocus = () => updateUserBehavior("focusEvents")
-
-		// Add event listeners
-		document.addEventListener("mousemove", handleMouseMove, { passive: true })
-		document.addEventListener("scroll", handleScroll, { passive: true })
-		document.addEventListener("keydown", handleKeyPress, { passive: true })
-		document.addEventListener("focusin", handleFocus, { passive: true })
-
-		// Update time on page every second
-		const timeInterval = setInterval(() => {
-			updateUserBehavior("timeOnPage", 1)
-		}, 1000)
-
-		return () => {
-			document.removeEventListener("mousemove", handleMouseMove)
-			document.removeEventListener("scroll", handleScroll)
-			document.removeEventListener("keydown", handleKeyPress)
-			document.removeEventListener("focusin", handleFocus)
-			clearInterval(timeInterval)
-		}
-	}, [trackUserBehavior, updateUserBehavior])
-
-	// Set up network monitoring
-	useEffect(() => {
-		if (!adaptToNetwork || !("connection" in navigator)) return
-
-		const network = (navigator as any).connection
-		networkInfoRef.current = network
-
-		const handleNetworkChange = () => {
-			// Re-evaluate preloading when network conditions change
-			updatePreloading()
-		}
-
-		network.addEventListener("change", handleNetworkChange)
-
-		return () => {
-			network.removeEventListener("change", handleNetworkChange)
-		}
-	}, [adaptToNetwork, updatePreloading])
-
-	// Initial preloading
-	useEffect(() => {
-		updatePreloading()
-	}, [updatePreloading])
-
-	// Memoize return values
-	const controls = useMemo(
-		() => ({
-			/**
-			 * Manually trigger preloading for specific index
-			 */
-			preloadAtIndex: (index: number) => {
-				updatePreloading(index)
-			},
-
-			/**
-			 * Get current user behavior data
-			 */
-			getUserBehavior: () => ({ ...userBehaviorRef.current }),
-
-			/**
-			 * Get current network conditions
-			 */
-			getNetworkConditions: getNetworkConditions,
-
-			/**
-			 * Clear preloaded items cache
-			 */
-			clearCache: () => {
-				preloadedItemsRef.current.clear()
-			},
-
-			/**
-			 * Get preloading statistics
-			 */
-			getStats: () => ({
-				preloadedItems: preloadedItemsRef.current.size,
-				engagementScore: userBehaviorRef.current.engagementScore,
-				queueLength: preloadQueueRef.current.length,
-				maxPreloadItems
-			})
-		}),
-		[updatePreloading, getNetworkConditions, maxPreloadItems]
-	)
-
-	return controls
-}
-
-export default useIntelligentPreloading

package/src/hooks/use-keyboard-controls.ts

@@ -1,115 +0,0 @@
-"use client"
-
-import { useCallback, useEffect } from "react"
-import type { MediaPlayerControls, MediaPlayerState } from "../types/index"
-
-interface UseKeyboardControlsOptions {
-	enabled?: boolean
-	state: MediaPlayerState
-	controls: MediaPlayerControls
-	seekStep?: number // seconds to seek forward/backward
-	volumeStep?: number // volume step (0-1)
-}
-
-export function useKeyboardControls({
-	enabled = true,
-	state,
-	controls,
-	seekStep = 10,
-	volumeStep = 0.1
-}: UseKeyboardControlsOptions) {
-	const handleKeyDown = (event: KeyboardEvent) => {
-		if (!enabled) return
-
-		// Don't handle keyboard events if user is typing in an input
-		const target = event.target as HTMLElement
-		if (
-			target.tagName === "INPUT" ||
-			target.tagName === "TEXTAREA" ||
-			target.contentEditable === "true"
-		) {
-			return
-		}
-
-		switch (event.code) {
-			case "Space":
-			case "KeyK":
-				event.preventDefault()
-				controls.toggle()
-				break
-
-			case "KeyM":
-				event.preventDefault()
-				controls.toggleMute()
-				break
-
-			case "KeyF":
-				event.preventDefault()
-				controls.toggleFullscreen()
-				break
-
-			case "ArrowLeft":
-				event.preventDefault()
-				controls.seek(Math.max(0, state.currentTime - seekStep))
-				break
-
-			case "ArrowRight":
-				event.preventDefault()
-				controls.seek(Math.min(state.duration, state.currentTime + seekStep))
-				break
-
-			case "ArrowUp":
-				event.preventDefault()
-				controls.setVolume(Math.min(1, state.volume + volumeStep))
-				break
-
-			case "ArrowDown":
-				event.preventDefault()
-				controls.setVolume(Math.max(0, state.volume - volumeStep))
-				break
-
-			case "Digit0":
-			case "Digit1":
-			case "Digit2":
-			case "Digit3":
-			case "Digit4":
-			case "Digit5":
-			case "Digit6":
-			case "Digit7":
-			case "Digit8":
-			case "Digit9":
-				event.preventDefault()
-				const digit = parseInt(event.code.replace("Digit", ""), 10)
-				const percentage = digit / 10
-				controls.seek(state.duration * percentage)
-				break
-
-			case "Home":
-				event.preventDefault()
-				controls.seek(0)
-				break
-
-			case "End":
-				event.preventDefault()
-				controls.seek(state.duration)
-				break
-
-			default:
-				// Don't prevent default for unhandled keys
-				break
-		}
-	}
-
-	useEffect(() => {
-		if (!enabled) return
-
-		document.addEventListener("keydown", handleKeyDown)
-		return () => {
-			document.removeEventListener("keydown", handleKeyDown)
-		}
-	}, [enabled, handleKeyDown])
-
-	return {
-		handleKeyDown
-	}
-}