{audioTracks.map((track) => (
@@ -234,7 +235,7 @@ export const SettingsMenu: React.FC = ({
- Çözünürlük
+ {translations.quality}
{qualities.map((quality) => {
diff --git a/src/constants/strings.ts b/src/constants/strings.ts
new file mode 100644
index 0000000..f819bdd
--- /dev/null
+++ b/src/constants/strings.ts
@@ -0,0 +1,11 @@
+export const STRINGS = {
+ SETTINGS: 'Settings',
+ QUALITY: 'Quality',
+ SPEED: 'Speed',
+ SUBTITLES: 'Subtitles',
+ AUDIO: 'Audio',
+ AUTO: 'Auto',
+ OFF: 'Off',
+ DEFAULT: 'Default',
+ LEVEL: 'Level',
+} as const
diff --git a/src/contexts/PlayerContext.tsx b/src/contexts/PlayerContext.tsx
index bdd6cec..62ec1f6 100644
--- a/src/contexts/PlayerContext.tsx
+++ b/src/contexts/PlayerContext.tsx
@@ -1,5 +1,7 @@
import React, { createContext, useContext, useRef, useState, useCallback } from 'react'
import type { PlayerContextValue, VideoState, UIState, PlayerSettings, AudioTrack } from '../types'
+import type { Translations } from '../i18n'
+import { getTranslations, detectBrowserLanguage } from '../i18n'
type SelectedQuality = PlayerSettings['quality']
type SelectedSubtitle = PlayerSettings['subtitle']
@@ -7,6 +9,7 @@ type SelectedSubtitle = PlayerSettings['subtitle']
interface PlayerContextType extends PlayerContextValue {
setVideoState: React.Dispatch
>
setUIState: React.Dispatch>
+ translations: Translations
}
const PlayerContext = createContext(null)
@@ -25,6 +28,7 @@ interface PlayerProviderProps {
initialVolume?: number
initialMuted?: boolean
initialPlaybackRate?: number
+ language?: string
}
export const PlayerProvider: React.FC = ({
@@ -32,10 +36,14 @@ export const PlayerProvider: React.FC = ({
initialVolume = 1,
initialMuted = false,
initialPlaybackRate = 1,
+ language,
}) => {
const videoRef = useRef(null)
const containerRef = useRef(null)
+ // Get translations based on language prop or browser language
+ const translations = getTranslations(language || detectBrowserLanguage())
+
const [videoState, setVideoState] = useState({
playing: false,
currentTime: 0,
@@ -169,6 +177,7 @@ export const PlayerProvider: React.FC = ({
containerRef,
setVideoState,
setUIState,
+ translations,
play,
pause,
togglePlay,
diff --git a/src/i18n/index.ts b/src/i18n/index.ts
new file mode 100644
index 0000000..655cab0
--- /dev/null
+++ b/src/i18n/index.ts
@@ -0,0 +1,69 @@
+/**
+ * Simple i18n system for video player
+ */
+
+export interface Translations {
+ noSubtitlesAvailable: string;
+ subtitles: string;
+ off: string;
+ auto: string;
+ quality: string;
+ speed: string;
+ normal: string;
+ default: string;
+ audioTrack: string;
+ settings: string;
+ level: string;
+}
+
+export const translations: Record = {
+ en: {
+ noSubtitlesAvailable: 'No subtitles available',
+ subtitles: 'Subtitles',
+ off: 'Off',
+ auto: 'Auto',
+ quality: 'Quality',
+ speed: 'Speed',
+ normal: 'Normal',
+ default: 'Default',
+ audioTrack: 'Audio Track',
+ settings: 'Settings',
+ level: "Level",
+ },
+ tr: {
+ noSubtitlesAvailable: 'Altyazı mevcut değil',
+ subtitles: 'Altyazı',
+ off: 'Kapalı',
+ auto: 'Otomatik',
+ quality: 'Kalite',
+ speed: 'Hız',
+ normal: 'Normal',
+ default: 'Varsayılan',
+ audioTrack: 'Ses',
+ settings: 'Ayarlar',
+ level: "Seviye",
+ },
+};
+
+export const getTranslations = (language: string = 'en'): Translations => {
+ // Try exact match first
+ if (translations[language]) {
+ return translations[language];
+ }
+
+ // Try language code without region (e.g., "en" from "en-US")
+ const languageCode = language.split('-')[0];
+ if (translations[languageCode]) {
+ return translations[languageCode];
+ }
+
+ // Default to English
+ return translations.en;
+};
+
+export const detectBrowserLanguage = (): string => {
+ if (typeof navigator !== 'undefined') {
+ return navigator.language || 'en';
+ }
+ return 'en';
+};
diff --git a/src/icons/index.tsx b/src/icons/index.tsx
index 12c23d9..eaa40e7 100644
--- a/src/icons/index.tsx
+++ b/src/icons/index.tsx
@@ -6,251 +6,118 @@ export interface IconProps {
color?: string
}
-export const PlayIcon: React.FC = ({ size = 24, className = '', color = 'currentColor' }) => (
-