@therealtinhtute/baroiplayer 1.0.8 → 1.2.0

package/src/components/variants/minimal/SimpleMinimalPlayer.tsx

@@ -1,18 +1,19 @@
 "use client"
 
-import { useState, useEffect, useRef, useCallback } from "react"
-import { cn } from "../../../lib/utils"
-import { useVideoPlayer } from "../../../hooks/useVideoPlayer"
+import { useCallback, useEffect, useRef, useState } from "react"
+import "../../../styles/minimal-player.css"
 import { useEnhancedSubtitles } from "../../../hooks/useEnhancedSubtitles"
-import { useMediaControls } from "../../../hooks/useMediaControls"
 import { useKeyboardShortcuts } from "../../../hooks/useKeyboardShortcuts"
+import { useMediaControls } from "../../../hooks/useMediaControls"
 import { useScreenshot } from "../../../hooks/useScreenshot"
-import { VideoElement } from "./components/VideoElement"
-import { SubtitleDisplay } from "./components/SubtitleDisplay"
+import { useVideoPlayer } from "../../../hooks/useVideoPlayer"
+import { cn } from "../../../lib/utils"
+import { CustomLoading, LoadingPresets, LoadingState } from "../../LoadingState"
+import type { LoadingStateProps } from "../../LoadingState"
 import { CenterPlayButton } from "./components/CenterPlayButton"
 import { ControlBar } from "./components/ControlBar"
-import { LoadingState, CustomLoading, LoadingPresets } from "../../LoadingState"
-import type { LoadingStateProps } from "../../LoadingState"
+import { SubtitleDisplay } from "./components/SubtitleDisplay"
+import { VideoElement } from "./components/VideoElement"
 
 export interface SimpleMinimalPlayerProps {
 	src: string
@@ -86,11 +87,11 @@ export function SimpleMinimalPlayer(props: SimpleMinimalPlayerProps) {
 
 	// Change playback rate
 	const changePlaybackRate = (rate: number) => {
-    		if (!videoRef.current) return
-    		videoRef.current.playbackRate = rate
-    		setPlaybackRate(rate)
-    		setShowSettings(false)
-    	}
+		if (!videoRef.current) return
+		videoRef.current.playbackRate = rate
+		setPlaybackRate(rate)
+		setShowSettings(false)
+	}
 
 	// Keyboard shortcuts
 	useKeyboardShortcuts({
@@ -107,8 +108,7 @@ export function SimpleMinimalPlayer(props: SimpleMinimalPlayerProps) {
 			style={{ overflow: "hidden" }}
 			onMouseMove={handleMouseMove}
 			onMouseEnter={handleMouseEnter}
-			onMouseLeave={handleMouseLeave}
-		>
+			onMouseLeave={handleMouseLeave}>
 			<VideoElement
 				videoRef={videoRef}
 				src={src}
@@ -119,10 +119,7 @@ export function SimpleMinimalPlayer(props: SimpleMinimalPlayerProps) {
 				onTogglePlay={videoControls.togglePlay}
 			/>
 
-			<SubtitleDisplay
-				subtitlesEnabled={subtitlesEnabled}
-				subtitleText={currentSubtitle}
-			/>
+			<SubtitleDisplay subtitlesEnabled={subtitlesEnabled} subtitleText={currentSubtitle} />
 
 			{/* Show center play button only when not loading */}
 			{!videoState.isLoading && (
@@ -171,39 +168,39 @@ export function SimpleMinimalPlayer(props: SimpleMinimalPlayerProps) {
 			{showLoadingState && (
 				<>
 					{/* Initial loading */}
-					{videoState.isLoading && !videoState.isSeeking && !videoState.isBuffering && (
-						LoadingComponent ? (
+					{videoState.isLoading &&
+						!videoState.isSeeking &&
+						!videoState.isBuffering &&
+						(LoadingComponent ? (
 							<CustomLoading context="initial">
 								<LoadingComponent context="initial" />
 							</CustomLoading>
 						) : (
 							<LoadingPresets.Initial {...loadingProps} />
-						)
-					)}
+						))}
 
 					{/* Seeking */}
-					{videoState.isSeeking && (
-						LoadingComponent ? (
+					{videoState.isSeeking &&
+						(LoadingComponent ? (
 							<CustomLoading context="seeking">
 								<LoadingComponent context="seeking" />
 							</CustomLoading>
 						) : (
 							<LoadingPresets.Seeking {...loadingProps} />
-						)
-					)}
+						))}
 
 					{/* Buffering */}
-					{videoState.isBuffering && !videoState.isSeeking && (
-						LoadingComponent ? (
+					{videoState.isBuffering &&
+						!videoState.isSeeking &&
+						(LoadingComponent ? (
 							<CustomLoading context="buffering">
 								<LoadingComponent context="buffering" />
 							</CustomLoading>
 						) : (
 							<LoadingPresets.Buffering {...loadingProps} />
-						)
-					)}
+						))}
 				</>
 			)}
 		</div>
 	)
-}
+}

package/src/components/variants/minimal/components/CenterPlayButton.tsx

@@ -19,4 +19,4 @@ export const CenterPlayButton = function CenterPlayButton({
 			{PlayIcon && <PlayIcon size={60} />}
 		</div>
 	)
-}
+}

package/src/components/variants/minimal/components/ControlBar.tsx

@@ -1,11 +1,11 @@
 import React, { memo } from "react"
+import type { BufferedRange } from "../../../../hooks/useVideoPlayer"
 import { cn } from "../../../../lib/utils"
-import { SeekBar } from "./SeekBar"
 import { PlaybackControls } from "./PlaybackControls"
-import { VolumeControl } from "./VolumeControl"
-import { TimeDisplay } from "./TimeDisplay"
 import { RightControls } from "./RightControls"
-import type { BufferedRange } from "../../../../hooks/useVideoPlayer"
+import { SeekBar } from "./SeekBar"
+import { TimeDisplay } from "./TimeDisplay"
+import { VolumeControl } from "./VolumeControl"
 
 interface ControlBarProps {
 	controlsVisible: boolean
@@ -88,8 +88,7 @@ export const ControlBar = function ControlBar({
 				"absolute right-0 bottom-0 left-0 z-40",
 				"px-6 py-3 transition-all duration-200",
 				controlsVisible ? "minimal-controls-visible" : "minimal-controls-hidden"
-			)}
-		>
+			)}>
 			<SeekBar
 				currentTime={currentTime}
 				duration={duration}
@@ -117,10 +116,7 @@ export const ControlBar = function ControlBar({
 						orientation={volumeOrientation}
 					/>
 
-					<TimeDisplay
-						currentTime={currentTime}
-						duration={duration}
-					/>
+					<TimeDisplay currentTime={currentTime} duration={duration} />
 				</div>
 
 				<RightControls
@@ -143,4 +139,4 @@ export const ControlBar = function ControlBar({
 			</div>
 		</div>
 	)
-}
+}