@huyooo/file-explorer-preview 0.4.29 → 0.4.30

package/src/composables/useVideoInteraction.ts

@@ -0,0 +1,112 @@
+import { onUnmounted, ref, watch, type Ref } from 'vue';
+
+interface UseVideoInteractionOptions {
+  isPlaying: Ref<boolean>;
+  togglePlay: () => void;
+  toggleFullscreen: () => void;
+}
+
+const HIDE_DELAY = 2500;
+
+export function useVideoInteraction(options: UseVideoInteractionOptions) {
+  const showControls = ref(true);
+
+  let hideTimer: number | undefined;
+  let clickTimer: number | undefined;
+  let clickCount = 0;
+  let controlsActive = false;
+
+  function clearHideTimer() {
+    if (hideTimer === undefined) return;
+    clearTimeout(hideTimer);
+    hideTimer = undefined;
+  }
+
+  function startHideTimer() {
+    clearHideTimer();
+    if (!options.isPlaying.value || controlsActive) return;
+
+    hideTimer = window.setTimeout(() => {
+      showControls.value = false;
+    }, HIDE_DELAY);
+  }
+
+  function revealControls() {
+    showControls.value = true;
+    startHideTimer();
+  }
+
+  function handleMouseMove() {
+    revealControls();
+  }
+
+  function handleMouseLeave() {
+    if (!options.isPlaying.value || controlsActive) return;
+    clearHideTimer();
+    showControls.value = false;
+  }
+
+  function handleControlsInteractionStart() {
+    controlsActive = true;
+    clearHideTimer();
+    showControls.value = true;
+  }
+
+  function handleControlsInteractionEnd() {
+    controlsActive = false;
+    startHideTimer();
+  }
+
+  function handleVideoClick() {
+    clickCount += 1;
+    if (clickCount !== 1) return;
+
+    clickTimer = window.setTimeout(() => {
+      if (clickCount === 1) {
+        options.togglePlay();
+      }
+      clickCount = 0;
+      clickTimer = undefined;
+    }, 200);
+  }
+
+  function handleVideoDoubleClick() {
+    if (clickTimer !== undefined) {
+      clearTimeout(clickTimer);
+      clickTimer = undefined;
+    }
+    clickCount = 0;
+    options.toggleFullscreen();
+  }
+
+  watch(
+    () => options.isPlaying.value,
+    (playing) => {
+      if (playing) {
+        startHideTimer();
+        return;
+      }
+
+      clearHideTimer();
+      showControls.value = true;
+    },
+  );
+
+  onUnmounted(() => {
+    clearHideTimer();
+    if (clickTimer !== undefined) {
+      clearTimeout(clickTimer);
+    }
+  });
+
+  return {
+    showControls,
+    revealControls,
+    handleMouseMove,
+    handleMouseLeave,
+    handleControlsInteractionStart,
+    handleControlsInteractionEnd,
+    handleVideoClick,
+    handleVideoDoubleClick,
+  };
+}

package/src/index.ts

@@ -0,0 +1,3 @@
+export { default as MediaPreviewPage } from './MediaPreviewPage.vue';
+export type { PreviewMediaPreferences } from './types/previewMediaPreferences';
+export { DEFAULT_PREVIEW_MEDIA_PREFERENCES } from './types/previewMediaPreferences';

package/src/types/electron.d.ts

@@ -0,0 +1,16 @@
+/** Electron API 类型定义 */
+export interface ElectronAPI {
+  minimizeWindow: () => void;
+  toggleMaximizeWindow: () => void;
+  closeWindow: () => void;
+  hideWindow?: () => void;
+  showWindow?: () => void;
+  onMaximizeChange: (callback: (isMaximized: boolean) => void) => () => void;
+}
+
+declare global {
+  interface Window {
+    electronAPI?: ElectronAPI;
+  }
+}
+

package/src/types/previewMediaPreferences.ts

@@ -0,0 +1,21 @@
+/**
+ * 媒体预览偏好
+ *
+ * 与宿主应用（如 SuperX）的 preferences 对齐，
+ * 通过 props 传入，未传入时使用默认值。
+ */
+export interface PreviewMediaPreferences {
+  imageFitMode: 'fit' | 'actual';
+  volume: number;
+  muted: boolean;
+  playbackRate: number;
+  loop?: boolean;
+}
+
+export const DEFAULT_PREVIEW_MEDIA_PREFERENCES: PreviewMediaPreferences = {
+  imageFitMode: 'fit',
+  volume: 1,
+  muted: false,
+  playbackRate: 1,
+  loop: false,
+};

package/src/utils/subtitle.ts

@@ -0,0 +1,328 @@
+/**
+ * 字幕解析工具
+ * 支持 SRT、VTT、ASS/SSA 格式
+ */
+
+/** 字幕条目 */
+export interface SubtitleCue {
+  /** 开始时间（秒） */
+  start: number;
+  /** 结束时间（秒） */
+  end: number;
+  /** 字幕文本（可包含多行） */
+  text: string;
+}
+
+/** 字幕轨道 */
+export interface SubtitleTrack {
+  /** 轨道标签（如语言名称） */
+  label: string;
+  /** 语言代码 */
+  language?: string;
+  /** 字幕条目 */
+  cues: SubtitleCue[];
+}
+
+/**
+ * 解析时间字符串为秒数
+ * 支持格式：
+ * - SRT: 00:00:00,000
+ * - VTT: 00:00:00.000 或 00:00.000
+ * - ASS: 0:00:00.00
+ */
+function parseTime(timeStr: string): number {
+  // 统一处理分隔符
+  const normalized = timeStr.trim().replace(',', '.');
+  
+  // 匹配时间格式
+  const match = normalized.match(/^(?:(\d+):)?(\d+):(\d+(?:\.\d+)?)$/);
+  if (!match) return 0;
+  
+  const hours = match[1] ? parseInt(match[1], 10) : 0;
+  const minutes = parseInt(match[2], 10);
+  const seconds = parseFloat(match[3]);
+  
+  return hours * 3600 + minutes * 60 + seconds;
+}
+
+/**
+ * 解析 SRT 格式字幕
+ * 格式：
+ * 1
+ * 00:00:01,000 --> 00:00:04,000
+ * 字幕文本
+ */
+export function parseSRT(content: string): SubtitleCue[] {
+  const cues: SubtitleCue[] = [];
+  const blocks = content.trim().split(/\n\s*\n/);
+  
+  for (const block of blocks) {
+    const lines = block.trim().split('\n');
+    if (lines.length < 2) continue;
+    
+    // 跳过序号行，找时间行
+    let timeLineIndex = 0;
+    if (!/-->/.test(lines[0])) {
+      timeLineIndex = 1;
+    }
+    
+    const timeLine = lines[timeLineIndex];
+    const timeMatch = timeLine.match(/(\d+:\d+:\d+[,\.]\d+)\s*-->\s*(\d+:\d+:\d+[,\.]\d+)/);
+    if (!timeMatch) continue;
+    
+    const start = parseTime(timeMatch[1]);
+    const end = parseTime(timeMatch[2]);
+    const text = lines.slice(timeLineIndex + 1).join('\n').trim();
+    
+    if (text) {
+      cues.push({ start, end, text });
+    }
+  }
+  
+  return cues;
+}
+
+/**
+ * 解析 VTT 格式字幕
+ * 格式：
+ * WEBVTT
+ * 
+ * 00:00:01.000 --> 00:00:04.000
+ * 字幕文本
+ */
+export function parseVTT(content: string): SubtitleCue[] {
+  const cues: SubtitleCue[] = [];
+  
+  // 移除 WEBVTT 头部和注释
+  const lines = content.split('\n');
+  let i = 0;
+  
+  // 跳过头部
+  while (i < lines.length && !lines[i].includes('-->')) {
+    i++;
+  }
+  
+  // 解析字幕块
+  while (i < lines.length) {
+    const line = lines[i].trim();
+    
+    // 查找时间行
+    const timeMatch = line.match(/(\d+:?\d+:\d+\.\d+)\s*-->\s*(\d+:?\d+:\d+\.\d+)/);
+    if (timeMatch) {
+      const start = parseTime(timeMatch[1]);
+      const end = parseTime(timeMatch[2]);
+      
+      // 收集文本行
+      const textLines: string[] = [];
+      i++;
+      while (i < lines.length && lines[i].trim() !== '' && !lines[i].includes('-->')) {
+        textLines.push(lines[i].trim());
+        i++;
+      }
+      
+      const text = textLines.join('\n');
+      if (text) {
+        cues.push({ start, end, text });
+      }
+    } else {
+      i++;
+    }
+  }
+  
+  return cues;
+}
+
+/**
+ * 解析 ASS/SSA 格式字幕
+ * 格式：
+ * [Events]
+ * Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
+ * Dialogue: 0,0:00:01.00,0:00:04.00,Default,,0,0,0,,字幕文本
+ */
+export function parseASS(content: string): SubtitleCue[] {
+  const cues: SubtitleCue[] = [];
+  const lines = content.split('\n');
+  
+  let inEvents = false;
+  let formatParts: string[] = [];
+  let textIndex = -1;
+  let startIndex = -1;
+  let endIndex = -1;
+  
+  for (const line of lines) {
+    const trimmed = line.trim();
+    
+    // 检查是否进入 Events 部分
+    if (trimmed.toLowerCase() === '[events]') {
+      inEvents = true;
+      continue;
+    }
+    
+    // 检查是否离开 Events 部分
+    if (trimmed.startsWith('[') && trimmed.endsWith(']')) {
+      inEvents = false;
+      continue;
+    }
+    
+    if (!inEvents) continue;
+    
+    // 解析 Format 行
+    if (trimmed.toLowerCase().startsWith('format:')) {
+      const formatStr = trimmed.substring(7).trim();
+      formatParts = formatStr.split(',').map(s => s.trim().toLowerCase());
+      textIndex = formatParts.indexOf('text');
+      startIndex = formatParts.indexOf('start');
+      endIndex = formatParts.indexOf('end');
+      continue;
+    }
+    
+    // 解析 Dialogue 行
+    if (trimmed.toLowerCase().startsWith('dialogue:')) {
+      const dialogueStr = trimmed.substring(9).trim();
+      
+      // 按逗号分割，但 Text 部分可能包含逗号
+      const parts: string[] = [];
+      let current = '';
+      let partCount = 0;
+      
+      for (let i = 0; i < dialogueStr.length; i++) {
+        const char = dialogueStr[i];
+        
+        if (char === ',' && partCount < formatParts.length - 1) {
+          parts.push(current.trim());
+          current = '';
+          partCount++;
+        } else {
+          current += char;
+        }
+      }
+      parts.push(current.trim());
+      
+      if (startIndex >= 0 && endIndex >= 0 && textIndex >= 0) {
+        const start = parseTime(parts[startIndex] || '0');
+        const end = parseTime(parts[endIndex] || '0');
+        let text = parts[textIndex] || '';
+        
+        // 移除 ASS 样式标签
+        text = text
+          .replace(/\{[^}]*\}/g, '') // 移除 {} 包裹的标签
+          .replace(/\\N/g, '\n')     // 换行符
+          .replace(/\\n/g, '\n')
+          .replace(/\\h/g, ' ')      // 硬空格
+          .trim();
+        
+        if (text) {
+          cues.push({ start, end, text });
+        }
+      }
+    }
+  }
+  
+  // 按开始时间排序
+  cues.sort((a, b) => a.start - b.start);
+  
+  return cues;
+}
+
+/**
+ * 检测字幕格式
+ */
+export function detectSubtitleFormat(content: string): 'srt' | 'vtt' | 'ass' | 'unknown' {
+  const trimmed = content.trim();
+  
+  if (trimmed.startsWith('WEBVTT')) {
+    return 'vtt';
+  }
+  
+  if (trimmed.includes('[Script Info]') || trimmed.includes('[Events]')) {
+    return 'ass';
+  }
+  
+  // SRT 通常以数字开头
+  if (/^\d+\s*\n/.test(trimmed)) {
+    return 'srt';
+  }
+  
+  return 'unknown';
+}
+
+/**
+ * 自动解析字幕（根据内容自动检测格式）
+ */
+export function parseSubtitle(content: string): SubtitleCue[] {
+  const format = detectSubtitleFormat(content);
+  
+  switch (format) {
+    case 'srt':
+      return parseSRT(content);
+    case 'vtt':
+      return parseVTT(content);
+    case 'ass':
+      return parseASS(content);
+    default:
+      // 尝试按 SRT 解析
+      return parseSRT(content);
+  }
+}
+
+/**
+ * 根据文件扩展名解析字幕
+ */
+export function parseSubtitleByExtension(content: string, extension: string): SubtitleCue[] {
+  const ext = extension.toLowerCase().replace('.', '');
+  
+  switch (ext) {
+    case 'srt':
+      return parseSRT(content);
+    case 'vtt':
+    case 'webvtt':
+      return parseVTT(content);
+    case 'ass':
+    case 'ssa':
+      return parseASS(content);
+    default:
+      return parseSubtitle(content);
+  }
+}
+
+/**
+ * 获取当前时间对应的字幕
+ */
+export function getCurrentCue(cues: SubtitleCue[], currentTime: number): SubtitleCue | null {
+  for (const cue of cues) {
+    if (currentTime >= cue.start && currentTime <= cue.end) {
+      return cue;
+    }
+  }
+  return null;
+}
+
+/**
+ * 从文件名推断字幕语言
+ */
+export function inferLanguageFromFilename(filename: string): { label: string; language: string } {
+  const name = filename.toLowerCase();
+  
+  const languagePatterns: Array<{ pattern: RegExp; label: string; language: string }> = [
+    { pattern: /\.zh[-_]?(cn|hans?)?\./, label: '简体中文', language: 'zh-CN' },
+    { pattern: /\.zh[-_]?(tw|hant?)\./, label: '繁體中文', language: 'zh-TW' },
+    { pattern: /\.chs?\./, label: '简体中文', language: 'zh-CN' },
+    { pattern: /\.cht?\./, label: '繁體中文', language: 'zh-TW' },
+    { pattern: /\.chinese\./, label: '中文', language: 'zh' },
+    { pattern: /\.en(g(lish)?)?\./, label: 'English', language: 'en' },
+    { pattern: /\.ja(p(anese)?)?\./, label: '日本語', language: 'ja' },
+    { pattern: /\.ko(r(ean)?)?\./, label: '한국어', language: 'ko' },
+    { pattern: /\.fr(ench)?\./, label: 'Français', language: 'fr' },
+    { pattern: /\.de(utsch)?\./, label: 'Deutsch', language: 'de' },
+    { pattern: /\.es(panol)?\./, label: 'Español', language: 'es' },
+  ];
+  
+  for (const { pattern, label, language } of languagePatterns) {
+    if (pattern.test(name)) {
+      return { label, language };
+    }
+  }
+  
+  return { label: '字幕', language: '' };
+}
+

package/src/utils/time.ts

@@ -0,0 +1,33 @@
+/**
+ * 格式化秒数为时间字符串
+ * 分钟、秒始终两位补零，小时按需显示（支持三位数如 100:00:00）
+ * @param seconds - 秒数
+ * @param forceHours - 是否强制显示小时（用于与总时长对齐宽度）
+ * @returns 格式化后的时间字符串，如 "08:43"、"1:02:34"、"100:00:00"
+ */
+export function formatTime(seconds: number, forceHours = false): string {
+  if (seconds == null || !Number.isFinite(seconds) || seconds < 0) {
+    throw new Error(`formatTime 要求有效秒数，收到: ${seconds}`);
+  }
+
+  const h = Math.floor(seconds / 3600);
+  const m = Math.floor((seconds % 3600) / 60);
+  const s = Math.floor(seconds % 60);
+  const mm = String(m).padStart(2, '0');
+  const ss = String(s).padStart(2, '0');
+
+  if (h > 0 || forceHours) {
+    return `${h}:${mm}:${ss}`;
+  }
+  return `${mm}:${ss}`;
+}
+
+/**
+ * 格式化时间显示（当前时间 / 总时长）
+ * 与 formatTime 一致：总时长≥1小时时双方均按 H:MM:SS 显示
+ */
+export function formatTimeDisplay(currentTime: number, duration: number): string {
+  const forceHours = Number.isFinite(duration) && duration >= 3600;
+  return `${formatTime(currentTime, forceHours)} / ${formatTime(duration, forceHours)}`;
+}
+

package/src/vite-env.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue';
+  const component: DefineComponent<object, object, unknown>;
+  export default component;
+}
+