mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-03-11 17:45:38 +00:00
feat: implement AniSkip support in video player
This commit is contained in:
paregi12
parent
3d5a9ebf42
commit
3de2fb4809
5 changed files with 232 additions and 67 deletions
2
package-lock.json
generated
2
package-lock.json
generated
|
|
@ -100,7 +100,7 @@
|
|||
"babel-plugin-transform-remove-console": "^6.9.4",
|
||||
"patch-package": "^8.0.1",
|
||||
"react-native-svg-transformer": "^1.5.0",
|
||||
"typescript": "^5.3.3",
|
||||
"typescript": "^5.9.3",
|
||||
"xcode": "^3.0.1"
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -100,7 +100,7 @@
|
|||
"babel-plugin-transform-remove-console": "^6.9.4",
|
||||
"patch-package": "^8.0.1",
|
||||
"react-native-svg-transformer": "^1.5.0",
|
||||
"typescript": "^5.3.3",
|
||||
"typescript": "^5.9.3",
|
||||
"xcode": "^3.0.1"
|
||||
},
|
||||
"private": true
|
||||
|
|
|
|||
|
|
@ -943,6 +943,8 @@ const AndroidVideoPlayer: React.FC = () => {
|
|||
type={type || 'movie'}
|
||||
season={season}
|
||||
episode={episode}
|
||||
malId={(metadata as any)?.mal_id || (metadata as any)?.external_ids?.mal_id}
|
||||
kitsuId={id?.startsWith('kitsu:') ? id.split(':')[1] : undefined}
|
||||
currentTime={playerState.currentTime}
|
||||
onSkip={(endTime) => controlsHook.seekToTime(endTime)}
|
||||
controlsVisible={playerState.showControls}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import Animated, {
|
|||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { MaterialIcons } from '@expo/vector-icons';
|
||||
import { BlurView } from 'expo-blur';
|
||||
import { introService, IntroTimestamps } from '../../../services/introService';
|
||||
import { introService, SkipInterval, SkipType } from '../../../services/introService';
|
||||
import { useTheme } from '../../../contexts/ThemeContext';
|
||||
import { logger } from '../../../utils/logger';
|
||||
|
||||
|
|
@ -19,6 +19,8 @@ interface SkipIntroButtonProps {
|
|||
type: 'movie' | 'series' | string;
|
||||
season?: number;
|
||||
episode?: number;
|
||||
malId?: string;
|
||||
kitsuId?: string;
|
||||
currentTime: number;
|
||||
onSkip: (endTime: number) => void;
|
||||
controlsVisible?: boolean;
|
||||
|
|
@ -30,6 +32,8 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
type,
|
||||
season,
|
||||
episode,
|
||||
malId,
|
||||
kitsuId,
|
||||
currentTime,
|
||||
onSkip,
|
||||
controlsVisible = false,
|
||||
|
|
@ -37,10 +41,15 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
}) => {
|
||||
const { currentTheme } = useTheme();
|
||||
const insets = useSafeAreaInsets();
|
||||
const [introData, setIntroData] = useState<IntroTimestamps | null>(null);
|
||||
|
||||
// State
|
||||
const [skipIntervals, setSkipIntervals] = useState<SkipInterval[]>([]);
|
||||
const [currentInterval, setCurrentInterval] = useState<SkipInterval | null>(null);
|
||||
const [isVisible, setIsVisible] = useState(false);
|
||||
const [hasSkipped, setHasSkipped] = useState(false);
|
||||
const [hasSkippedCurrent, setHasSkippedCurrent] = useState(false);
|
||||
const [autoHidden, setAutoHidden] = useState(false);
|
||||
|
||||
// Refs
|
||||
const fetchedRef = useRef(false);
|
||||
const lastEpisodeRef = useRef<string>('');
|
||||
const autoHideTimerRef = useRef<NodeJS.Timeout | null>(null);
|
||||
|
|
@ -50,14 +59,13 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
const scale = useSharedValue(0.8);
|
||||
const translateY = useSharedValue(0);
|
||||
|
||||
// Fetch intro data when episode changes
|
||||
// Fetch skip data when episode changes
|
||||
useEffect(() => {
|
||||
const episodeKey = `${imdbId}-${season}-${episode}`;
|
||||
const episodeKey = `${imdbId}-${season}-${episode}-${malId}-${kitsuId}`;
|
||||
|
||||
// Skip if not a series or missing required data
|
||||
if (type !== 'series' || !imdbId || !season || !episode) {
|
||||
logger.log(`[SkipIntroButton] Skipping fetch - type: ${type}, imdbId: ${imdbId}, season: ${season}, episode: ${episode}`);
|
||||
setIntroData(null);
|
||||
// Skip if not a series or missing required data (though MAL/Kitsu ID might be enough for some cases, usually need season/ep)
|
||||
if (type !== 'series' || (!imdbId && !malId && !kitsuId) || !season || !episode) {
|
||||
setSkipIntervals([]);
|
||||
fetchedRef.current = false;
|
||||
return;
|
||||
}
|
||||
|
|
@ -69,45 +77,76 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
|
||||
lastEpisodeRef.current = episodeKey;
|
||||
fetchedRef.current = true;
|
||||
setHasSkipped(false);
|
||||
setHasSkippedCurrent(false);
|
||||
setAutoHidden(false);
|
||||
setSkipIntervals([]);
|
||||
|
||||
const fetchIntroData = async () => {
|
||||
logger.log(`[SkipIntroButton] Fetching intro data for ${imdbId} S${season}E${episode}...`);
|
||||
const fetchSkipData = async () => {
|
||||
logger.log(`[SkipIntroButton] Fetching skip data for S${season}E${episode} (IMDB: ${imdbId}, MAL: ${malId}, Kitsu: ${kitsuId})...`);
|
||||
try {
|
||||
const data = await introService.getIntroTimestamps(imdbId, season, episode);
|
||||
setIntroData(data);
|
||||
const intervals = await introService.getSkipTimes(imdbId, season, episode, malId, kitsuId);
|
||||
setSkipIntervals(intervals);
|
||||
|
||||
if (data) {
|
||||
logger.log(`[SkipIntroButton] ✓ Found intro: ${data.start_sec}s - ${data.end_sec}s (confidence: ${data.confidence})`);
|
||||
if (intervals.length > 0) {
|
||||
logger.log(`[SkipIntroButton] ✓ Found ${intervals.length} skip intervals:`, intervals);
|
||||
} else {
|
||||
logger.log(`[SkipIntroButton] ✗ No intro data available for this episode`);
|
||||
logger.log(`[SkipIntroButton] ✗ No skip data available for this episode`);
|
||||
}
|
||||
} catch (error) {
|
||||
logger.error('[SkipIntroButton] Error fetching intro data:', error);
|
||||
setIntroData(null);
|
||||
logger.error('[SkipIntroButton] Error fetching skip data:', error);
|
||||
setSkipIntervals([]);
|
||||
}
|
||||
};
|
||||
|
||||
fetchIntroData();
|
||||
}, [imdbId, type, season, episode]);
|
||||
fetchSkipData();
|
||||
}, [imdbId, type, season, episode, malId, kitsuId]);
|
||||
|
||||
// Determine if button should show based on current playback position
|
||||
// Determine active interval based on current playback position
|
||||
useEffect(() => {
|
||||
if (skipIntervals.length === 0) {
|
||||
setCurrentInterval(null);
|
||||
return;
|
||||
}
|
||||
|
||||
// Find an interval that contains the current time
|
||||
const active = skipIntervals.find(
|
||||
interval => currentTime >= interval.startTime && currentTime < (interval.endTime - 0.5)
|
||||
);
|
||||
|
||||
if (active) {
|
||||
// If we found a new active interval that is different from the previous one
|
||||
if (!currentInterval ||
|
||||
active.startTime !== currentInterval.startTime ||
|
||||
active.type !== currentInterval.type) {
|
||||
logger.log(`[SkipIntroButton] Entering interval: ${active.type} (${active.startTime}-${active.endTime})`);
|
||||
setCurrentInterval(active);
|
||||
setHasSkippedCurrent(false); // Reset skipped state for new interval
|
||||
setAutoHidden(false); // Reset auto-hide for new interval
|
||||
}
|
||||
} else {
|
||||
// No active interval
|
||||
if (currentInterval) {
|
||||
logger.log('[SkipIntroButton] Exiting interval');
|
||||
setCurrentInterval(null);
|
||||
}
|
||||
}
|
||||
}, [currentTime, skipIntervals]);
|
||||
|
||||
// Determine if button should show
|
||||
const shouldShowButton = useCallback(() => {
|
||||
if (!introData || hasSkipped) return false;
|
||||
// Show when within intro range, with a small buffer at the end
|
||||
const inIntroRange = currentTime >= introData.start_sec && currentTime < (introData.end_sec - 0.5);
|
||||
if (!currentInterval || hasSkippedCurrent) return false;
|
||||
|
||||
// If auto-hidden, only show when controls are visible
|
||||
if (autoHidden && !controlsVisible) return false;
|
||||
return inIntroRange;
|
||||
}, [introData, currentTime, hasSkipped, autoHidden, controlsVisible]);
|
||||
|
||||
return true;
|
||||
}, [currentInterval, hasSkippedCurrent, autoHidden, controlsVisible]);
|
||||
|
||||
// Handle visibility animations
|
||||
useEffect(() => {
|
||||
const shouldShow = shouldShowButton();
|
||||
|
||||
if (shouldShow && !isVisible) {
|
||||
logger.log(`[SkipIntroButton] Showing button - currentTime: ${currentTime.toFixed(1)}s, intro: ${introData?.start_sec}s - ${introData?.end_sec}s`);
|
||||
setIsVisible(true);
|
||||
opacity.value = withTiming(1, { duration: 300, easing: Easing.out(Easing.cubic) });
|
||||
scale.value = withSpring(1, { damping: 15, stiffness: 150 });
|
||||
|
|
@ -115,8 +154,7 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
// Start 15-second auto-hide timer
|
||||
if (autoHideTimerRef.current) clearTimeout(autoHideTimerRef.current);
|
||||
autoHideTimerRef.current = setTimeout(() => {
|
||||
if (!hasSkipped) {
|
||||
logger.log('[SkipIntroButton] Auto-hiding after 15 seconds');
|
||||
if (!hasSkippedCurrent) {
|
||||
setAutoHidden(true);
|
||||
opacity.value = withTiming(0, { duration: 200 });
|
||||
scale.value = withTiming(0.8, { duration: 200 });
|
||||
|
|
@ -124,25 +162,20 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
}
|
||||
}, 15000);
|
||||
} else if (!shouldShow && isVisible) {
|
||||
logger.log(`[SkipIntroButton] Hiding button - currentTime: ${currentTime.toFixed(1)}s, hasSkipped: ${hasSkipped}`);
|
||||
if (autoHideTimerRef.current) clearTimeout(autoHideTimerRef.current);
|
||||
opacity.value = withTiming(0, { duration: 200 });
|
||||
scale.value = withTiming(0.8, { duration: 200 });
|
||||
// Delay hiding to allow animation to complete
|
||||
setTimeout(() => setIsVisible(false), 250);
|
||||
}
|
||||
}, [shouldShowButton, isVisible]);
|
||||
}, [shouldShowButton, isVisible, hasSkippedCurrent]);
|
||||
|
||||
// Re-show when controls become visible (if still in intro range and was auto-hidden)
|
||||
// Re-show when controls become visible (if still in interval and was auto-hidden)
|
||||
useEffect(() => {
|
||||
if (controlsVisible && autoHidden && introData && !hasSkipped) {
|
||||
const inIntroRange = currentTime >= introData.start_sec && currentTime < (introData.end_sec - 0.5);
|
||||
if (inIntroRange) {
|
||||
logger.log('[SkipIntroButton] Re-showing button because controls became visible');
|
||||
setAutoHidden(false);
|
||||
}
|
||||
if (controlsVisible && autoHidden && currentInterval && !hasSkippedCurrent) {
|
||||
setAutoHidden(false);
|
||||
}
|
||||
}, [controlsVisible, autoHidden, introData, hasSkipped, currentTime]);
|
||||
}, [controlsVisible, autoHidden, currentInterval, hasSkippedCurrent]);
|
||||
|
||||
// Cleanup timer on unmount
|
||||
useEffect(() => {
|
||||
|
|
@ -162,12 +195,32 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
|
||||
// Handle skip action
|
||||
const handleSkip = useCallback(() => {
|
||||
if (!introData) return;
|
||||
if (!currentInterval) return;
|
||||
|
||||
logger.log(`[SkipIntroButton] User pressed Skip Intro - seeking to ${introData.end_sec}s (from ${currentTime.toFixed(1)}s)`);
|
||||
setHasSkipped(true);
|
||||
onSkip(introData.end_sec);
|
||||
}, [introData, onSkip, currentTime]);
|
||||
logger.log(`[SkipIntroButton] User pressed Skip - seeking to ${currentInterval.endTime}s`);
|
||||
setHasSkippedCurrent(true);
|
||||
onSkip(currentInterval.endTime);
|
||||
}, [currentInterval, onSkip]);
|
||||
|
||||
// Get display text based on skip type
|
||||
const getButtonText = () => {
|
||||
if (!currentInterval) return 'Skip';
|
||||
|
||||
switch (currentInterval.type) {
|
||||
case 'op':
|
||||
case 'mixed-op':
|
||||
case 'intro':
|
||||
return 'Skip Intro';
|
||||
case 'ed':
|
||||
case 'mixed-ed':
|
||||
case 'outro':
|
||||
return 'Skip Ending';
|
||||
case 'recap':
|
||||
return 'Skip Recap';
|
||||
default:
|
||||
return 'Skip';
|
||||
}
|
||||
};
|
||||
|
||||
// Animated styles
|
||||
const containerStyle = useAnimatedStyle(() => ({
|
||||
|
|
@ -175,8 +228,8 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
transform: [{ scale: scale.value }, { translateY: translateY.value }],
|
||||
}));
|
||||
|
||||
// Don't render if not visible or no intro data
|
||||
if (!isVisible || !introData) {
|
||||
// Don't render if not visible (and animation complete)
|
||||
if (!isVisible && opacity.value === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
|
|
@ -208,7 +261,7 @@ export const SkipIntroButton: React.FC<SkipIntroButtonProps> = ({
|
|||
color="#FFFFFF"
|
||||
style={styles.icon}
|
||||
/>
|
||||
<Text style={styles.text}>Skip Intro</Text>
|
||||
<Text style={styles.text}>{getButtonText()}</Text>
|
||||
<Animated.View
|
||||
style={[
|
||||
styles.accentBar,
|
||||
|
|
|
|||
|
|
@ -6,7 +6,19 @@ import { logger } from '../utils/logger';
|
|||
* API Documentation: https://api.introdb.app
|
||||
*/
|
||||
|
||||
const API_BASE_URL = process.env.EXPO_PUBLIC_INTRODB_API_URL;
|
||||
const INTRODB_API_URL = process.env.EXPO_PUBLIC_INTRODB_API_URL;
|
||||
const ANISKIP_API_URL = 'https://api.aniskip.com/v2';
|
||||
const KITSU_API_URL = 'https://kitsu.io/api/edge';
|
||||
|
||||
export type SkipType = 'op' | 'ed' | 'recap' | 'intro' | 'outro' | 'mixed-op' | 'mixed-ed';
|
||||
|
||||
export interface SkipInterval {
|
||||
startTime: number;
|
||||
endTime: number;
|
||||
type: SkipType;
|
||||
provider: 'introdb' | 'aniskip';
|
||||
skipId?: string;
|
||||
}
|
||||
|
||||
export interface IntroTimestamps {
|
||||
imdb_id: string;
|
||||
|
|
@ -19,20 +31,48 @@ export interface IntroTimestamps {
|
|||
confidence: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetches intro timestamps for a TV show episode
|
||||
* @param imdbId - IMDB ID of the show (e.g., tt0903747 for Breaking Bad)
|
||||
* @param season - Season number (1-indexed)
|
||||
* @param episode - Episode number (1-indexed)
|
||||
* @returns Intro timestamps or null if not found
|
||||
*/
|
||||
export async function getIntroTimestamps(
|
||||
imdbId: string,
|
||||
season: number,
|
||||
episode: number
|
||||
): Promise<IntroTimestamps | null> {
|
||||
async function getMalIdFromKitsu(kitsuId: string): Promise<string | null> {
|
||||
try {
|
||||
const response = await axios.get<IntroTimestamps>(`${API_BASE_URL}/intro`, {
|
||||
const response = await axios.get(`${KITSU_API_URL}/anime/${kitsuId}/mappings`);
|
||||
const data = response.data;
|
||||
if (data && data.data) {
|
||||
const malMapping = data.data.find((m: any) => m.attributes.externalSite === 'myanimelist/anime');
|
||||
if (malMapping) {
|
||||
return malMapping.attributes.externalId;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
logger.warn('[IntroService] Failed to fetch MAL ID from Kitsu:', error);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
async function fetchFromAniSkip(malId: string, episode: number): Promise<SkipInterval[]> {
|
||||
try {
|
||||
// Fetch OP, ED, and Recap
|
||||
const url = `${ANISKIP_API_URL}/skip-times/${malId}/${episode}?types[]=op&types[]=ed&types[]=recap&types[]=mixed-op&types[]=mixed-ed`;
|
||||
const response = await axios.get(url);
|
||||
|
||||
if (response.data.found && response.data.results) {
|
||||
return response.data.results.map((res: any) => ({
|
||||
startTime: res.interval.startTime,
|
||||
endTime: res.interval.endTime,
|
||||
type: res.skipType,
|
||||
provider: 'aniskip',
|
||||
skipId: res.skipId
|
||||
}));
|
||||
}
|
||||
} catch (error) {
|
||||
if (axios.isAxiosError(error) && error.response?.status !== 404) {
|
||||
logger.error('[IntroService] Error fetching AniSkip:', error);
|
||||
}
|
||||
}
|
||||
return [];
|
||||
}
|
||||
|
||||
async function fetchFromIntroDb(imdbId: string, season: number, episode: number): Promise<SkipInterval[]> {
|
||||
try {
|
||||
const response = await axios.get<IntroTimestamps>(`${INTRODB_API_URL}/intro`, {
|
||||
params: {
|
||||
imdb_id: imdbId,
|
||||
season,
|
||||
|
|
@ -47,21 +87,91 @@ export async function getIntroTimestamps(
|
|||
confidence: response.data.confidence,
|
||||
});
|
||||
|
||||
return response.data;
|
||||
return [{
|
||||
startTime: response.data.start_sec,
|
||||
endTime: response.data.end_sec,
|
||||
type: 'intro',
|
||||
provider: 'introdb'
|
||||
}];
|
||||
} catch (error: any) {
|
||||
if (axios.isAxiosError(error) && error.response?.status === 404) {
|
||||
// No intro data available for this episode - this is expected
|
||||
logger.log(`[IntroService] No intro data for ${imdbId} S${season}E${episode}`);
|
||||
return null;
|
||||
return [];
|
||||
}
|
||||
|
||||
logger.error('[IntroService] Error fetching intro timestamps:', error?.message || error);
|
||||
return null;
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetches skip intervals (intro, outro, recap) from available providers
|
||||
*/
|
||||
export async function getSkipTimes(
|
||||
imdbId: string | undefined,
|
||||
season: number,
|
||||
episode: number,
|
||||
malId?: string,
|
||||
kitsuId?: string
|
||||
): Promise<SkipInterval[]> {
|
||||
// 1. Try AniSkip (Anime) if we have MAL ID or Kitsu ID
|
||||
let finalMalId = malId;
|
||||
|
||||
// If we have Kitsu ID but no MAL ID, try to resolve it
|
||||
if (!finalMalId && kitsuId) {
|
||||
logger.log(`[IntroService] Resolving MAL ID from Kitsu ID: ${kitsuId}`);
|
||||
finalMalId = await getMalIdFromKitsu(kitsuId) || undefined;
|
||||
}
|
||||
|
||||
if (finalMalId) {
|
||||
logger.log(`[IntroService] Fetching AniSkip for MAL ID: ${finalMalId} Ep: ${episode}`);
|
||||
const aniSkipIntervals = await fetchFromAniSkip(finalMalId, episode);
|
||||
if (aniSkipIntervals.length > 0) {
|
||||
logger.log(`[IntroService] Found ${aniSkipIntervals.length} skip intervals from AniSkip`);
|
||||
return aniSkipIntervals;
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Try IntroDB (TV Shows) as fallback or for non-anime
|
||||
if (imdbId) {
|
||||
const introDbIntervals = await fetchFromIntroDb(imdbId, season, episode);
|
||||
if (introDbIntervals.length > 0) {
|
||||
return introDbIntervals;
|
||||
}
|
||||
}
|
||||
|
||||
return [];
|
||||
}
|
||||
|
||||
/**
|
||||
* Legacy function for backward compatibility
|
||||
* Fetches intro timestamps for a TV show episode
|
||||
*/
|
||||
export async function getIntroTimestamps(
|
||||
imdbId: string,
|
||||
season: number,
|
||||
episode: number
|
||||
): Promise<IntroTimestamps | null> {
|
||||
const intervals = await fetchFromIntroDb(imdbId, season, episode);
|
||||
if (intervals.length > 0) {
|
||||
return {
|
||||
imdb_id: imdbId,
|
||||
season,
|
||||
episode,
|
||||
start_sec: intervals[0].startTime,
|
||||
end_sec: intervals[0].endTime,
|
||||
start_ms: intervals[0].startTime * 1000,
|
||||
end_ms: intervals[0].endTime * 1000,
|
||||
confidence: 1.0
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export const introService = {
|
||||
getIntroTimestamps,
|
||||
getSkipTimes
|
||||
};
|
||||
|
||||
export default introService;
|
||||
|
|
|
|||
Loading…
Reference in a new issue