wisecolt/dupe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: wisecolt:987c6986930586f031083e860fff41efe97935a8
Branches Tags
wisecolt:main wisecolt:rclone wisecolt:ph
..
compare: wisecolt:1bad4f7256bc2dd0b4f1f7b726620fc20253a919
Branches Tags
wisecolt:rclone wisecolt:main wisecolt:ph

2 Commits
987c698693 ... 1bad4f7256

Author SHA1 Message Date
wisecolt
1bad4f7256 feat(ui): mini oynatıcıya video önizlemesi ekle 
Parça çalınırken video akışı mevcutsa küçük resim yerine video öğesi gösterilir. Video konumu, oynatma zamanı ile senkronize edilir.
 2026-01-19 17:37:06 +03:00
wisecolt
d27a4637b0 feat(ui): sayfa başlığını du.pe olarak güncelle 2026-01-19 17:36:15 +03:00
2 changed files with 38 additions and 3 deletions
Expand all files Collapse all files

2
client/index.html
View File

@@ -10,7 +10,7 @@
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<title>wise-dupe</title>
<title>du.pe</title>
</head>
<body>
<div id="app"></div>

39
client/src/components/MiniPlayer.svelte
View File

@@ -1,8 +1,10 @@
<script>
import { musicPlayer, togglePlay, playNext, playPrevious, stopPlayback } from "../stores/musicPlayerStore.js";
import { API } from "../utils/api.js";
import { API, withToken } from "../utils/api.js";
import { cleanFileName } from "../utils/filename.js";
let videoEl = null;
function thumbnailURL(item) {
if (!item?.thumbnail) return null;
const token = localStorage.getItem("token");
@@ -27,6 +29,25 @@
if (item?.tracker === "youtube" || item?.thumbnail) return "YouTube";
return "Music";
}
function videoStreamURL(item) {
if (!item?.infoHash) return null;
const index = item.fileIndex || 0;
return withToken(`${API}/stream/${item.infoHash}?index=${index}`);
}
$: if (videoEl && $musicPlayer.currentTrack && $musicPlayer.isPlaying) {
const target = $musicPlayer.currentTime || 0;
if (Number.isFinite(target) && Math.abs(videoEl.currentTime - target) > 0.6) {
videoEl.currentTime = target;
}
}
$: if (videoEl && $musicPlayer.isPlaying) {
videoEl.play().catch(() => undefined);
} else if (videoEl) {
videoEl.pause();
}
</script>
{#if $musicPlayer.currentTrack}
@@ -50,7 +71,15 @@
</div>
<div class="mini-cover">
{#if thumbnailURL($musicPlayer.currentTrack)}
{#if $musicPlayer.isPlaying && videoStreamURL($musicPlayer.currentTrack)}
<video
bind:this={videoEl}
src={videoStreamURL($musicPlayer.currentTrack)}
muted
playsinline
preload="metadata"
></video>
{:else if thumbnailURL($musicPlayer.currentTrack)}
<img
src={thumbnailURL($musicPlayer.currentTrack)}
alt={$musicPlayer.currentTrack.title}
@@ -172,6 +201,12 @@
object-fit: cover;
}
.mini-cover video {
width: 100%;
height: 100%;
object-fit: cover;
}
.mini-cover-placeholder {
color: rgba(255, 255, 255, 0.45);
font-size: 40px;