mirror of
https://gh-proxy.org/https://github.com/tiajinsha/JKVideo
synced 2026-07-07 23:18:38 +08:00
feat: integrate danmaku fetching and list in video detail page
This commit is contained in:
@@ -8,6 +8,9 @@ import { useLocalSearchParams, useRouter } from 'expo-router';
|
|||||||
import { Ionicons } from '@expo/vector-icons';
|
import { Ionicons } from '@expo/vector-icons';
|
||||||
import { VideoPlayer } from '../../components/VideoPlayer';
|
import { VideoPlayer } from '../../components/VideoPlayer';
|
||||||
import { CommentItem } from '../../components/CommentItem';
|
import { CommentItem } from '../../components/CommentItem';
|
||||||
|
import { getDanmaku } from '../../services/bilibili';
|
||||||
|
import { DanmakuItem } from '../../services/types';
|
||||||
|
import DanmakuList from '../../components/DanmakuList';
|
||||||
import { useVideoDetail } from '../../hooks/useVideoDetail';
|
import { useVideoDetail } from '../../hooks/useVideoDetail';
|
||||||
import { useComments } from '../../hooks/useComments';
|
import { useComments } from '../../hooks/useComments';
|
||||||
import { useVideoStore } from '../../store/videoStore';
|
import { useVideoStore } from '../../store/videoStore';
|
||||||
@@ -22,6 +25,9 @@ export default function VideoDetailScreen() {
|
|||||||
const { video, playData, loading: videoLoading, qualities, currentQn, changeQuality } = useVideoDetail(bvid as string);
|
const { video, playData, loading: videoLoading, qualities, currentQn, changeQuality } = useVideoDetail(bvid as string);
|
||||||
const { comments, loading: cmtLoading, load: loadComments } = useComments(video?.aid ?? 0);
|
const { comments, loading: cmtLoading, load: loadComments } = useComments(video?.aid ?? 0);
|
||||||
const [tab, setTab] = useState<Tab>('comments');
|
const [tab, setTab] = useState<Tab>('comments');
|
||||||
|
const [danmakus, setDanmakus] = useState<DanmakuItem[]>([]);
|
||||||
|
const [currentTime, setCurrentTime] = useState(0);
|
||||||
|
const [showDanmakuList, setShowDanmakuList] = useState(true);
|
||||||
const { setVideo, clearVideo } = useVideoStore();
|
const { setVideo, clearVideo } = useVideoStore();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -32,6 +38,11 @@ export default function VideoDetailScreen() {
|
|||||||
if (video?.aid) loadComments();
|
if (video?.aid) loadComments();
|
||||||
}, [video?.aid]);
|
}, [video?.aid]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!video?.cid) return;
|
||||||
|
getDanmaku(video.cid).then(setDanmakus);
|
||||||
|
}, [video?.cid]);
|
||||||
|
|
||||||
function handleMiniPlayer() {
|
function handleMiniPlayer() {
|
||||||
if (video) {
|
if (video) {
|
||||||
setVideo(bvid as string, video.title, video.pic);
|
setVideo(bvid as string, video.title, video.pic);
|
||||||
@@ -59,6 +70,15 @@ export default function VideoDetailScreen() {
|
|||||||
onMiniPlayer={handleMiniPlayer}
|
onMiniPlayer={handleMiniPlayer}
|
||||||
bvid={bvid as string}
|
bvid={bvid as string}
|
||||||
cid={video?.cid}
|
cid={video?.cid}
|
||||||
|
danmakus={danmakus}
|
||||||
|
onTimeUpdate={setCurrentTime}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<DanmakuList
|
||||||
|
danmakus={danmakus}
|
||||||
|
currentTime={currentTime}
|
||||||
|
visible={showDanmakuList}
|
||||||
|
onToggle={() => setShowDanmakuList(v => !v)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<ScrollView style={styles.scroll} showsVerticalScrollIndicator={false}>
|
<ScrollView style={styles.scroll} showsVerticalScrollIndicator={false}>
|
||||||
|
|||||||
Reference in New Issue
Block a user