alteropen/streamyfin
1
0
Fork 0
mirror of https://github.com/streamyfin/streamyfin.git synced 2026-06-18 20:00:25 +01:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

fix: show more info in debug component

Browse Source
This commit is contained in:
Fredrik Burmester
2024-10-11 22:24:23 +02:00
parent cab5693ced
commit 091a8ff6c3
1 changed files with 74 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
app/(auth)/(tabs)/(home)/index.tsx
View File

@@ -4,10 +4,11 @@ import { VlcPlayerView } from "@/modules/vlc-player";
import { import {
PlaybackStatePayload, PlaybackStatePayload,
ProgressUpdatePayload, ProgressUpdatePayload,
TrackInfo,
VlcPlayerViewRef, VlcPlayerViewRef,
} from "@/modules/vlc-player/src/VlcPlayer.types"; } from "@/modules/vlc-player/src/VlcPlayer.types";
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { Button, ScrollView, View } from "react-native"; import { Button, ScrollView, TouchableOpacity, View } from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context"; import { useSafeAreaInsets } from "react-native-safe-area-context";
export default function index() { export default function index() {
@@ -70,7 +71,11 @@ export default function index() {
progressUpdateInterval={2000} progressUpdateInterval={2000}
onVideoStateChange={onPlaybackStateChanged} onVideoStateChange={onPlaybackStateChanged}
/> />
<VideoDebugInfo playbackState={playbackState} progress={progress} /> <VideoDebugInfo
playbackState={playbackState}
progress={progress}
playerRef={videoRef}
/>
</View> </View>
<Button <Button
title="pause" title="pause"
@@ -97,24 +102,70 @@ export default function index() {
const VideoDebugInfo: React.FC<{ const VideoDebugInfo: React.FC<{
playbackState: PlaybackStatePayload["nativeEvent"] | null; playbackState: PlaybackStatePayload["nativeEvent"] | null;
progress: ProgressUpdatePayload["nativeEvent"] | null; progress: ProgressUpdatePayload["nativeEvent"] | null;
}> = ({ playbackState, progress }) => ( playerRef: React.RefObject<VlcPlayerViewRef>;
<View className="p-2.5 bg-black mt-2.5"> }> = ({ playbackState, progress, playerRef }) => {
<Text className="font-bold">Playback State:</Text> const [audioTracks, setAudioTracks] = useState<TrackInfo[] | null>(null);
{playbackState && ( const [subtitleTracks, setSubtitleTracks] = useState<TrackInfo[] | null>(
<> null
<Text>Type: {playbackState.type}</Text> );
<Text>Current Time: {playbackState.currentTime}</Text>
<Text>Duration: {playbackState.duration}</Text> useEffect(() => {
<Text>Is Buffering: {playbackState.isBuffering ? "Yes" : "No"}</Text> const fetchTracks = async () => {
<Text>Target: {playbackState.target}</Text> if (playerRef.current) {
</> const audio = await playerRef.current.getAudioTracks();
)} const subtitles = await playerRef.current.getSubtitleTracks();
<Text className="font-bold mt-2.5">Progress:</Text> setAudioTracks(audio);
{progress && ( setSubtitleTracks(subtitles);
<> }
<Text>Current Time: {progress.currentTime}</Text> };
<Text>Duration: {progress.duration.toFixed(2)}</Text>
</> fetchTracks();
)} }, [playerRef]);
</View>
); return (
<View className="p-2.5 bg-black mt-2.5">
<Text className="font-bold">Playback State:</Text>
{playbackState && (
<>
<Text>Type: {playbackState.type}</Text>
<Text>Current Time: {playbackState.currentTime}</Text>
<Text>Duration: {playbackState.duration}</Text>
<Text>Is Buffering: {playbackState.isBuffering ? "Yes" : "No"}</Text>
<Text>Target: {playbackState.target}</Text>
</>
)}
<Text className="font-bold mt-2.5">Progress:</Text>
{progress && (
<>
<Text>Current Time: {progress.currentTime}</Text>
<Text>Duration: {progress.duration.toFixed(2)}</Text>
</>
)}
<Text className="font-bold mt-2.5">Audio Tracks:</Text>
{audioTracks &&
audioTracks.map((track) => (
<Text key={track.index}>
{track.name} (Index: {track.index})
</Text>
))}
<Text className="font-bold mt-2.5">Subtitle Tracks:</Text>
{subtitleTracks &&
subtitleTracks.map((track) => (
<Text key={track.index}>
{track.name} (Index: {track.index})
</Text>
))}
<TouchableOpacity
className="mt-2.5 bg-blue-500 p-2 rounded"
onPress={() => {
if (playerRef.current) {
playerRef.current.getAudioTracks().then(setAudioTracks);
playerRef.current.getSubtitleTracks().then(setSubtitleTracks);
}
}}
>
<Text className="text-white text-center">Refresh Tracks</Text>
</TouchableOpacity>
</View>
);
};