hookehuyr

refactor(useVideoPlayer): 添加注释并重新组织视频播放器逻辑

为视频播放器逻辑添加清晰的注释标记
重新组织代码结构使其更易读
...@@ -44,11 +44,13 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) { ...@@ -44,11 +44,13 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) {
44 return (props.videoUrl || "").trim(); 44 return (props.videoUrl || "").trim();
45 }); 45 });
46 46
47 + // 3. HLS 支持判断
47 const isM3U8 = computed(() => { 48 const isM3U8 = computed(() => {
48 const url = videoUrlValue.value.toLowerCase(); 49 const url = videoUrlValue.value.toLowerCase();
49 return url.includes('.m3u8'); 50 return url.includes('.m3u8');
50 }); 51 });
51 52
53 + // 4. 视频类型判断
52 const getVideoMimeType = (url) => { 54 const getVideoMimeType = (url) => {
53 const urlText = (url || "").toLowerCase(); 55 const urlText = (url || "").toLowerCase();
54 if (urlText.includes(".m3u8")) return "application/x-mpegURL"; 56 if (urlText.includes(".m3u8")) return "application/x-mpegURL";
...@@ -57,6 +59,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) { ...@@ -57,6 +59,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) {
57 return ""; 59 return "";
58 }; 60 };
59 61
62 + // 5. 视频源配置
60 const videoSources = computed(() => { 63 const videoSources = computed(() => {
61 const type = getVideoMimeType(videoUrlValue.value); 64 const type = getVideoMimeType(videoUrlValue.value);
62 if (type) { 65 if (type) {
...@@ -65,7 +68,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) { ...@@ -65,7 +68,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) {
65 return [{ src: videoUrlValue.value }]; 68 return [{ src: videoUrlValue.value }];
66 }); 69 });
67 70
68 - // 3. 错误处理逻辑 71 + // 6. 错误处理逻辑
69 const formatBytes = (bytes) => { 72 const formatBytes = (bytes) => {
70 const size = Number(bytes) || 0; 73 const size = Number(bytes) || 0;
71 if (!size) return ""; 74 if (!size) return "";
...@@ -156,6 +159,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) { ...@@ -156,6 +159,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) {
156 } 159 }
157 }; 160 };
158 161
162 + // 7. 错误处理逻辑
159 const handleError = (code, message = '') => { 163 const handleError = (code, message = '') => {
160 showErrorOverlay.value = true; 164 showErrorOverlay.value = true;
161 switch (code) { 165 switch (code) {
...@@ -281,6 +285,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) { ...@@ -281,6 +285,7 @@ export function useVideoPlayer(props, emit, videoRef, nativeVideoRef) {
281 ...props.options, 285 ...props.options,
282 })); 286 }));
283 287
288 + // 8. Video.js 挂载处理
284 const handleVideoJsMounted = (payload) => { 289 const handleVideoJsMounted = (payload) => {
285 state.value = payload.state; 290 state.value = payload.state;
286 player.value = payload.player; 291 player.value = payload.player;
......