Ma/LunaTV
1
0
Fork 0
mirror of https://github.com/MoonTechLab/LunaTV.git synced 2026-02-15 04:14:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: show episode titles

Browse Source
This commit is contained in:
shinya
2025-08-17 18:55:22 +08:00
parent 0351c6f68d
commit c0d53ee5dd
2 changed files with 38 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/components/EpisodeSelector.tsx
View File

@@ -312,10 +312,9 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
<div
onClick={() => setActiveTab('episodes')}
className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium
${
activeTab === 'episodes'
? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
${activeTab === 'episodes'
? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
}
`.trim()}
>
@@ -325,10 +324,9 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
<div
onClick={handleSourceTabClick}
className={`flex-1 py-3 px-6 text-center cursor-pointer transition-all duration-200 font-medium
${
activeTab === 'sources'
? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
${activeTab === 'sources'
? 'text-green-600 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 bg-black/5 dark:bg-white/5 dark:text-gray-300 dark:hover:text-green-400 hover:bg-black/3 dark:hover:bg-white/3'
}
`.trim()}
>
@@ -353,10 +351,9 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
}}
onClick={() => handleCategoryClick(idx)}
className={`w-20 relative py-2 text-sm font-medium transition-colors whitespace-nowrap flex-shrink-0 text-center
${
isActive
? 'text-green-500 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 dark:text-gray-300 dark:hover:text-green-400'
${isActive
? 'text-green-500 dark:text-green-400'
: 'text-gray-700 hover:text-green-600 dark:text-gray-300 dark:hover:text-green-400'
}
`.trim()}
>
@@ -408,10 +405,9 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
key={episodeNumber}
onClick={() => handleEpisodeClick(episodeNumber - 1)}
className={`h-10 min-w-10 px-3 py-2 flex items-center justify-center text-sm font-medium rounded-md transition-all duration-200 whitespace-nowrap font-mono
${
isActive
? 'bg-green-500 text-white shadow-lg shadow-green-500/25 dark:bg-green-600'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300 hover:scale-105 dark:bg-white/10 dark:text-gray-300 dark:hover:bg-white/20'
${isActive
? 'bg-green-500 text-white shadow-lg shadow-green-500/25 dark:bg-green-600'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300 hover:scale-105 dark:bg-white/10 dark:text-gray-300 dark:hover:bg-white/20'
}`.trim()}
>
{(() => {
@@ -419,8 +415,8 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
if (!title) {
return episodeNumber;
}
// 如果匹配"第X集"格式，提取中间的数字
const match = title.match(/第(\d+)集/);
// 如果匹配"第X集"、"第X话"、"X集"、"X话"格式，提取中间的数字
const match = title.match(/(?:第)?(\d+)(?:集|话)/);
if (match) {
return match[1];
}
@@ -496,11 +492,10 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
!isCurrentSource && handleSourceClick(source)
}
className={`flex items-start gap-3 px-2 py-3 rounded-lg transition-all select-none duration-200 relative
${
isCurrentSource
? 'bg-green-500/10 dark:bg-green-500/20 border-green-500/30 border'
: 'hover:bg-gray-200/50 dark:hover:bg-white/10 hover:scale-[1.02] cursor-pointer'
}`.trim()}
${isCurrentSource
? 'bg-green-500/10 dark:bg-green-500/20 border-green-500/30 border'
: 'hover:bg-gray-200/50 dark:hover:bg-white/10 hover:scale-[1.02] cursor-pointer'
}`.trim()}
>
{/* 封面 */}
<div className='flex-shrink-0 w-12 h-20 bg-gray-300 dark:bg-gray-600 rounded overflow-hidden'>
@@ -555,8 +550,8 @@ const EpisodeSelector: React.FC<EpisodeSelectorProps> = ({
const textColorClasses = isUltraHigh
? 'text-purple-600 dark:text-purple-400'
: isHigh
? 'text-green-600 dark:text-green-400'
: 'text-yellow-600 dark:text-yellow-400';
? 'text-green-600 dark:text-green-400'
: 'text-yellow-600 dark:text-yellow-400';
return (
<div