feat(ui): mail.ru linkleri için eşleştirme ve isim düzenlemesi eklendi

- Dosya eşleştirme arayüzü bağımsız `MatchModal` bileşenine taşındı
- `Files.svelte` ve `Transfers.svelte` yeni bileşen kullanılarak güncellendi
- Mail.ru indirmeleri için dizi adı, sezon ve bölüm eşleştirme özelliği eklendi
- `POST /api/mailru/match` endpointi ile metadata eşleştirme backend desteği sağlandı
- Dosya isimleri "DiziAdi.S01E01.mp4" formatında kaydedilmeye başlandı
This commit is contained in:
2026-01-26 21:22:15 +03:00
parent 0b99fce5a9
commit 52bd325dc6
5 changed files with 1010 additions and 543 deletions

View File

@@ -0,0 +1,611 @@
<script>
export let show = false;
export let headerTitle = "Eşlemeyi Düzelt";
export let fileLabel = "Dosya";
export let fileName = "";
export let sizeText = "";
export let titleLabel = "Film Adı";
export let yearLabel = "Yıl";
export let titlePlaceholder = "";
export let yearPlaceholder = "YYYY";
export let showYearInput = true;
export let titleValue = "";
export let yearValue = "";
export let searching = false;
export let results = [];
export let showEmpty = false;
export let emptyText = "Aramanla eşleşen öğe bulunamadı";
export let applyingId = null;
export let onClose = () => {};
export let onTitleInput = () => {};
export let onYearInput = () => {};
export let onSelect = () => {};
</script>
{#if show}
<div class="match-overlay" on:click={onClose}>
<div class="match-overlay-content" on:click|stopPropagation>
<button class="match-close" on:click={onClose} aria-label="Kapat">
<i class="fa-solid fa-xmark"></i>
</button>
<div class="match-header">
<h3 class="match-title">
<i class="fa-solid fa-wand-magic-sparkles"></i>
{headerTitle}
</h3>
<div class="match-subtitle">
{#if fileName}
<span class="match-location" title={fileName}>
<i class="fa-solid fa-file"></i>
<span class="location-text">{fileLabel}: {fileName}</span>
</span>
{/if}
{#if fileName && sizeText}
<span class="match-separator">|</span>
{/if}
{#if sizeText}
<span class="match-size">
<i class="fa-solid fa-database"></i>
{sizeText}
</span>
{/if}
</div>
</div>
<div class="match-body">
<div class="match-inputs">
<div class="input-group title-input">
<label for="match-title">{titleLabel}</label>
<input
id="match-title"
type="text"
bind:value={titleValue}
on:input={onTitleInput}
placeholder={titlePlaceholder}
/>
</div>
{#if showYearInput}
<div class="input-group year-input">
<label for="match-year">{yearLabel}</label>
<input
id="match-year"
type="text"
bind:value={yearValue}
on:input={onYearInput}
placeholder={yearPlaceholder}
maxlength="4"
/>
</div>
{/if}
</div>
<div class="match-divider"></div>
{#if searching}
<div class="search-loading">
<i class="fa-solid fa-spinner fa-spin"></i>
Aranıyor...
</div>
{:else if results.length > 0}
<div class="search-results">
{#each results as result}
<div
class="result-item"
class:applying={applyingId === result.id}
on:click={() => onSelect(result)}
>
<div class="result-poster">
{#if result.poster}
<img src={result.poster} alt={result.title} loading="lazy" />
{:else}
<div class="result-poster-placeholder">
<i class="fa-regular fa-image"></i>
</div>
{/if}
</div>
<div class="result-info">
<div class="result-title">{result.title}</div>
<div class="result-meta">
{#if result.year}
<span class="result-year">
<i class="fa-solid fa-calendar-days"></i>
{result.year}
</span>
{/if}
{#if result.runtime}
<span class="result-separator"></span>
<span class="result-runtime">
<i class="fa-solid fa-clock"></i>
{result.runtime} dk
</span>
{/if}
{#if result.status}
<span class="result-separator"></span>
<span class="result-status">
<i class="fa-solid fa-signal"></i>
{result.status}
</span>
{/if}
</div>
{#if result.genres && result.genres.length > 0}
<div class="result-genres">
{result.genres.slice(0, 3).join(", ")}
</div>
{/if}
{#if result.cast && result.cast.length > 0}
<div class="result-cast">
<i class="fa-solid fa-user"></i>
{result.cast.join(", ")}
</div>
{/if}
{#if result.overview}
<div class="result-overview">{result.overview}</div>
{/if}
</div>
{#if $$slots.resultActions}
<div class="result-actions" on:click|stopPropagation>
<slot name="resultActions" {result} />
</div>
{/if}
</div>
{/each}
</div>
{:else if showEmpty}
<div class="search-empty">{emptyText}</div>
{/if}
</div>
</div>
</div>
{/if}
<style>
.match-overlay {
position: fixed;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 5000;
background: rgba(10, 10, 10, 0.28);
backdrop-filter: blur(4px);
padding: 56px 32px;
}
.match-overlay-content {
position: relative;
width: min(60vw, 1100px);
max-height: 60vh;
border-radius: 18px;
background: rgba(12, 12, 12, 0.92);
box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
display: flex;
flex-direction: column;
}
.match-close {
position: absolute;
top: 16px;
right: 20px;
background: rgba(0, 0, 0, 0.55);
color: #fafafa;
border: none;
width: 42px;
height: 42px;
border-radius: 50%;
cursor: pointer;
font-size: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease;
z-index: 1;
}
.match-close:hover {
background: rgba(0, 0, 0, 0.85);
}
.match-header {
padding: 32px 48px 24px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.match-title {
margin: 0 0 12px 0;
font-size: 26px;
font-weight: 600;
color: #fafafa;
display: flex;
align-items: center;
gap: 12px;
}
.match-title i {
color: #f5b333;
font-size: 24px;
}
.match-subtitle {
display: flex;
align-items: center;
gap: 12px;
font-size: 14px;
color: #c7c7c7;
flex-wrap: wrap;
}
.match-location {
display: inline-flex;
align-items: center;
gap: 6px;
max-width: 60%;
overflow: hidden;
}
.match-location .location-text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.match-size {
display: inline-flex;
align-items: center;
gap: 6px;
flex-shrink: 0;
}
.match-location i,
.match-size i {
color: #8d8d8d;
font-size: 13px;
}
.match-separator {
color: #7a7a7a;
}
.match-body {
padding: 28px 48px 36px;
color: #f5f5f5;
overflow-y: auto;
max-height: calc(60vh - 120px);
}
.match-body::-webkit-scrollbar {
width: 8px;
}
.match-body::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.match-body::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.5);
border-radius: 4px;
backdrop-filter: blur(4px);
}
.match-body::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.7);
}
.match-inputs {
display: flex;
gap: 16px;
margin-bottom: 24px;
}
.input-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.input-group.title-input {
flex: 3;
}
.input-group.year-input {
flex: 1;
}
.input-group label {
font-size: 13px;
font-weight: 500;
color: #c7c7c7;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.input-group input {
padding: 12px 16px;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.08);
color: #f5f5f5;
font-size: 15px;
outline: none;
transition: border-color 0.2s ease, background 0.2s ease;
}
.input-group input:focus {
border-color: rgba(245, 179, 51, 0.5);
background: rgba(255, 255, 255, 0.12);
}
.input-group input::placeholder {
color: #7a7a7a;
}
.match-divider {
height: 1px;
background: rgba(255, 255, 255, 0.1);
margin: 0 0 24px 0;
}
.search-loading {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 40px 20px;
color: #c7c7c7;
font-size: 15px;
}
.search-loading i {
font-size: 20px;
color: #f5b333;
}
.search-results {
display: flex;
flex-direction: column;
gap: 12px;
}
.result-item {
display: flex;
gap: 16px;
padding: 12px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.05);
cursor: pointer;
transition: all 0.2s ease;
border: 1px solid transparent;
}
.result-item:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(245, 179, 51, 0.3);
transform: translateY(-2px);
}
.result-item.applying {
opacity: 0.6;
pointer-events: none;
position: relative;
}
.result-item.applying::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 20px;
height: 20px;
border: 2px solid rgba(245, 179, 51, 0.3);
border-top: 2px solid #f5b333;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: translate(-50%, -50%) rotate(0deg); }
100% { transform: translate(-50%, -50%) rotate(360deg); }
}
.result-poster {
width: 80px;
height: 120px;
flex-shrink: 0;
border-radius: 8px;
overflow: hidden;
background: rgba(255, 255, 255, 0.08);
display: flex;
align-items: center;
justify-content: center;
}
.result-poster img {
width: 100%;
height: 100%;
object-fit: cover;
}
.result-poster-placeholder {
color: #7a7a7a;
font-size: 24px;
}
.result-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 6px;
min-width: 0;
}
.result-title {
font-size: 16px;
font-weight: 600;
color: #fafafa;
}
.result-meta {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
color: #c7c7c7;
flex-wrap: wrap;
margin-bottom: 4px;
}
.result-separator {
color: #7a7a7a;
}
.result-year,
.result-runtime,
.result-status {
color: #c7c7c7;
display: inline-flex;
align-items: center;
gap: 4px;
}
.result-year i,
.result-runtime i,
.result-status i {
font-size: 13px;
color: #8d8d8d;
}
.result-genres {
font-size: 12px;
color: #8d8d8d;
text-transform: uppercase;
letter-spacing: 0.3px;
margin-bottom: 4px;
}
.result-cast {
font-size: 12px;
color: #9f9f9f;
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 6px;
}
.result-cast i {
color: #ffc107;
font-size: 11px;
}
.result-overview {
font-size: 13px;
color: #9f9f9f;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
margin-top: 4px;
}
.result-actions {
display: flex;
flex-direction: column;
gap: 8px;
margin-left: auto;
width: 160px;
align-items: flex-start;
}
.result-actions label {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto;
row-gap: 6px;
font-size: 12px;
color: #c7c7c7;
text-transform: uppercase;
letter-spacing: 0.4px;
width: 100%;
align-items: flex-start;
}
.result-actions select {
display: block;
margin: 0;
align-self: flex-start;
padding: 8px 10px;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.08);
color: #f5f5f5;
font-size: 13px;
outline: none;
width: 44.5px;
min-width: 44.5px;
max-width: 44.5px;
box-sizing: border-box;
}
:global(.match-modal-select) {
width: 44.5px;
min-width: 44.5px;
max-width: 44.5px;
box-sizing: border-box;
}
@media (max-width: 768px) {
.match-overlay {
padding: 32px 16px;
}
.match-overlay-content {
width: 96vw;
}
.match-header {
padding: 28px 32px 20px;
}
.match-title {
font-size: 22px;
}
.match-body {
padding: 24px 32px 32px;
}
}
@media (max-width: 560px) {
.result-item {
flex-direction: column;
}
.result-actions {
flex-direction: row;
justify-content: flex-start;
}
}
@media (max-width: 480px) {
.match-header {
padding: 24px 24px 18px;
}
.match-body {
padding: 20px 24px 28px;
}
.match-inputs {
flex-direction: column;
gap: 16px;
}
.input-group.title-input,
.input-group.year-input {
flex: 1;
}
}
</style>

View File

@@ -1,5 +1,6 @@
<script> <script>
import { onMount, tick } from "svelte"; import { onMount, tick } from "svelte";
import MatchModal from "../components/MatchModal.svelte";
import { API, apiFetch, moveEntry, renameFolder, copyEntry } from "../utils/api.js"; import { API, apiFetch, moveEntry, renameFolder, copyEntry } from "../utils/api.js";
import { cleanFileName, extractTitleAndYear } from "../utils/filename.js"; import { cleanFileName, extractTitleAndYear } from "../utils/filename.js";
import { refreshMovieCount } from "../stores/movieStore.js"; import { refreshMovieCount } from "../stores/movieStore.js";
@@ -96,6 +97,20 @@
}; };
} }
function displayFileName(entry) {
if (!entry?.name) return "";
if (entry.isDirectory) {
const dirLabel = entry.displayName || entry.name;
return cleanFileName(dirLabel);
}
const baseName = entry.name.split("/").pop() || "";
const withoutExt = baseName.replace(/\.[^.]+$/, "");
if (/S\d{1,2}xE\d{1,2}/i.test(withoutExt)) {
return withoutExt;
}
return cleanFileName(entry.name);
}
function buildDirectoryEntries(fileList) { function buildDirectoryEntries(fileList) {
const directories = new Map(); const directories = new Map();
@@ -2134,9 +2149,9 @@
{:else} {:else}
<div <div
class="folder-name" class="folder-name"
title={cleanFileName(entry.displayName)} title={displayFileName(entry)}
> >
{cleanFileName(entry.displayName)} {displayFileName(entry)}
</div> </div>
{/if} {/if}
</div> </div>
@@ -2154,8 +2169,8 @@
</div> </div>
{/if} {/if}
<div class="info"> <div class="info">
<div class="name" title={cleanFileName(entry.name)}> <div class="name" title={displayFileName(entry)}>
{cleanFileName(entry.name)} {displayFileName(entry)}
</div> </div>
<div class="size"> <div class="size">
{#if entry.progressText} {#if entry.progressText}
@@ -2666,127 +2681,27 @@
</div> </div>
{/if} {/if}
{#if showMatchModal && matchingFile} <MatchModal
<!-- svelte-ignore a11y-click-events-have-key-events --> show={showMatchModal && !!matchingFile}
<!-- svelte-ignore a11y-no-static-element-interactions --> headerTitle="Eşlemeyi Düzelt"
<div class="match-overlay" on:click={closeMatchModal}> fileLabel="Dosya"
<!-- svelte-ignore a11y-click-events-have-key-events --> fileName={matchingFile ? matchingFile.name.split("/").pop() : ""}
<!-- svelte-ignore a11y-no-static-element-interactions --> sizeText={matchingFile ? formatSize(matchingFile.size) : ""}
<div class="match-overlay-content" on:click|stopPropagation> titleLabel={matchType === "series" ? "Dizi Adı" : "Film Adı"}
<button class="match-close" on:click={closeMatchModal} aria-label="Kapat"> yearLabel="Yıl"
<i class="fa-solid fa-xmark"></i> titlePlaceholder={matchType === "series" ? "Dizi adını girin" : "Film adını girin"}
</button> showYearInput={true}
bind:titleValue={matchTitle}
<div class="match-header"> bind:yearValue={matchYear}
<h3 class="match-title"> searching={searching}
<i class="fa-solid fa-wand-magic-sparkles"></i> results={searchResults}
Eşlemeyi Düzelt showEmpty={false}
</h3> applyingId={applyingResultId}
<div class="match-subtitle"> onClose={closeMatchModal}
<span class="match-location" title={matchingFile.name}> onTitleInput={handleSearchInput}
<i class="fa-solid fa-file"></i> onYearInput={handleSearchInput}
<span class="location-text">Dosya: {matchingFile.name.split('/').pop()}</span> onSelect={selectMatchResult}
</span> />
<span class="match-separator">|</span>
<span class="match-size">
<i class="fa-solid fa-database"></i>
{formatSize(matchingFile.size)}
</span>
</div>
</div>
<div class="match-body">
<div class="match-inputs">
<div class="input-group title-input">
<label for="match-title">{matchType === "series" ? "Dizi Adı" : "Film Adı"}</label>
<input
id="match-title"
type="text"
bind:value={matchTitle}
on:input={handleSearchInput}
placeholder={matchType === "series" ? "Dizi adını girin" : "Film adını girin"}
/>
</div>
<div class="input-group year-input">
<label for="match-year">Yıl</label>
<input
id="match-year"
type="text"
bind:value={matchYear}
on:input={handleSearchInput}
placeholder="YYYY"
maxlength="4"
/>
</div>
</div>
<div class="match-divider"></div>
{#if searching}
<div class="search-loading">
<i class="fa-solid fa-spinner fa-spin"></i>
Aranıyor...
</div>
{:else if searchResults.length > 0}
<div class="search-results">
{#each searchResults as result}
<!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div class="result-item" class:applying={applyingResultId === result.id} on:click={() => selectMatchResult(result)}>
<div class="result-poster">
{#if result.poster}
<img src={result.poster} alt={result.title} loading="lazy" />
{:else}
<div class="result-poster-placeholder">
<i class="fa-regular fa-image"></i>
</div>
{/if}
</div>
<div class="result-info">
<div class="result-title">{result.title}</div>
<div class="result-meta">
{#if result.year}
<span class="result-year">
<i class="fa-solid fa-calendar-days"></i>
{result.year}
</span>
{/if}
{#if result.runtime}
<span class="result-separator"></span>
<span class="result-runtime">
<i class="fa-solid fa-clock"></i>
{result.runtime} dk
</span>
{/if}
{#if result.status}
<span class="result-separator"></span>
<span class="result-status">
<i class="fa-solid fa-signal"></i>
{result.status}
</span>
{/if}
</div>
{#if result.genres && result.genres.length > 0}
<div class="result-genres">{result.genres.slice(0, 3).join(", ")}</div>
{/if}
{#if result.cast && result.cast.length > 0}
<div class="result-cast">
<i class="fa-solid fa-user"></i>
{result.cast.join(", ")}
</div>
{/if}
{#if result.overview}
<div class="result-overview">{result.overview}</div>
{/if}
</div>
</div>
{/each}
</div>
{/if}
</div>
</div>
</div>
{/if}
<style> <style>
:root { :root {
@@ -4011,396 +3926,4 @@
margin: 0; margin: 0;
} }
/* Eşleştirme Modal Stilleri */
.match-overlay {
position: fixed;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 5000;
background: rgba(10, 10, 10, 0.28);
backdrop-filter: blur(4px);
padding: 56px 32px;
}
.match-overlay-content {
position: relative;
width: min(60vw, 1100px);
max-height: 60vh;
border-radius: 18px;
background: rgba(12, 12, 12, 0.92);
box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
display: flex;
flex-direction: column;
}
.match-close {
position: absolute;
top: 16px;
right: 20px;
background: rgba(0, 0, 0, 0.55);
color: #fafafa;
border: none;
width: 42px;
height: 42px;
border-radius: 50%;
cursor: pointer;
font-size: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease;
z-index: 1;
}
.match-close:hover {
background: rgba(0, 0, 0, 0.85);
}
.match-header {
padding: 32px 48px 24px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.match-title {
margin: 0 0 12px 0;
font-size: 26px;
font-weight: 600;
color: #fafafa;
display: flex;
align-items: center;
gap: 12px;
}
.match-title i {
color: #f5b333;
font-size: 24px;
}
.match-subtitle {
display: flex;
align-items: center;
gap: 12px;
font-size: 14px;
color: #c7c7c7;
flex-wrap: wrap;
}
.match-location {
display: inline-flex;
align-items: center;
gap: 6px;
max-width: 60%;
overflow: hidden;
}
.match-location .location-text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.match-size {
display: inline-flex;
align-items: center;
gap: 6px;
flex-shrink: 0;
}
.match-location i,
.match-size i {
color: #8d8d8d;
font-size: 13px;
}
.match-separator {
color: #7a7a7a;
}
.match-body {
padding: 28px 48px 36px;
color: #f5f5f5;
overflow-y: auto;
max-height: calc(60vh - 120px);
}
.match-body::-webkit-scrollbar {
width: 8px;
}
.match-body::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.match-body::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.5);
border-radius: 4px;
backdrop-filter: blur(4px);
}
.match-body::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.7);
}
.match-inputs {
display: flex;
gap: 16px;
margin-bottom: 24px;
}
.input-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.input-group.title-input {
flex: 3;
}
.input-group.year-input {
flex: 1;
}
.input-group label {
font-size: 13px;
font-weight: 500;
color: #c7c7c7;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.input-group input {
padding: 12px 16px;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.08);
color: #f5f5f5;
font-size: 15px;
outline: none;
transition: border-color 0.2s ease, background 0.2s ease;
}
.input-group input:focus {
border-color: rgba(245, 179, 51, 0.5);
background: rgba(255, 255, 255, 0.12);
}
.input-group input::placeholder {
color: #7a7a7a;
}
.match-divider {
height: 1px;
background: rgba(255, 255, 255, 0.1);
margin: 0 0 24px 0;
}
.search-loading {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 40px 20px;
color: #c7c7c7;
font-size: 15px;
}
.search-loading i {
font-size: 20px;
color: #f5b333;
}
.search-results {
display: flex;
flex-direction: column;
gap: 12px;
}
.result-item {
display: flex;
gap: 16px;
padding: 12px;
border-radius: 10px;
background: rgba(255, 255, 255, 0.05);
cursor: pointer;
transition: all 0.2s ease;
border: 1px solid transparent;
}
.result-item:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(245, 179, 51, 0.3);
transform: translateY(-2px);
}
.result-item.applying {
opacity: 0.6;
pointer-events: none;
position: relative;
}
.result-item.applying::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 20px;
height: 20px;
border: 2px solid rgba(245, 179, 51, 0.3);
border-top: 2px solid #f5b333;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: translate(-50%, -50%) rotate(0deg); }
100% { transform: translate(-50%, -50%) rotate(360deg); }
}
.result-poster {
width: 80px;
height: 120px;
flex-shrink: 0;
border-radius: 8px;
overflow: hidden;
background: rgba(255, 255, 255, 0.08);
display: flex;
align-items: center;
justify-content: center;
}
.result-poster img {
width: 100%;
height: 100%;
object-fit: cover;
}
.result-poster-placeholder {
color: #7a7a7a;
font-size: 24px;
}
.result-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 6px;
min-width: 0;
}
.result-title {
font-size: 16px;
font-weight: 600;
color: #fafafa;
}
.result-meta {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
color: #c7c7c7;
flex-wrap: wrap;
margin-bottom: 4px;
}
.result-separator {
color: #7a7a7a;
}
.result-year,
.result-runtime,
.result-status {
color: #c7c7c7;
display: inline-flex;
align-items: center;
gap: 4px;
}
.result-year i,
.result-runtime i,
.result-status i {
font-size: 13px;
color: #8d8d8d;
}
.result-genres {
font-size: 12px;
color: #8d8d8d;
text-transform: uppercase;
letter-spacing: 0.3px;
margin-bottom: 4px;
}
.result-cast {
font-size: 12px;
color: #9f9f9f;
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 6px;
}
.result-cast i {
color: #ffc107;
font-size: 11px;
}
.result-overview {
font-size: 13px;
color: #9f9f9f;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
margin-top: 4px;
}
@media (max-width: 768px) {
.match-overlay {
padding: 32px 16px;
}
.match-overlay-content {
width: 96vw;
}
.match-header {
padding: 28px 32px 20px;
}
.match-title {
font-size: 22px;
}
.match-body {
padding: 24px 32px 32px;
}
}
@media (max-width: 480px) {
.match-header {
padding: 24px 24px 18px;
}
.match-body {
padding: 20px 24px 28px;
}
.match-inputs {
flex-direction: column;
gap: 16px;
}
.input-group.title-input,
.input-group.year-input {
flex: 1;
}
}
</style> </style>

View File

@@ -1,5 +1,6 @@
<script> <script>
import { onMount } from "svelte"; import { onMount } from "svelte";
import MatchModal from "../components/MatchModal.svelte";
import { API, apiFetch, getAccessToken, withToken } from "../utils/api.js"; // ✅ apiFetch eklendi import { API, apiFetch, getAccessToken, withToken } from "../utils/api.js"; // ✅ apiFetch eklendi
let torrents = []; let torrents = [];
@@ -16,6 +17,19 @@
let subtitleLang = "en"; let subtitleLang = "en";
let subtitleLabel = "Custom Subtitles"; let subtitleLabel = "Custom Subtitles";
let showMailruMatchModal = false;
let mailruMatchQuery = "";
let mailruMatchYear = "";
let mailruMatchResults = [];
let mailruSearching = false;
let mailruSearchTimer;
let mailruApplyingId = null;
let activeMailruJob = null;
let activeMailruMenu = null;
const mailruSelections = new Map();
const mailruSeasonOptions = Array.from({ length: 20 }, (_, i) => i + 1);
const mailruEpisodeOptions = Array.from({ length: 200 }, (_, i) => i + 1);
// Player kontrolleri // Player kontrolleri
let videoEl; let videoEl;
let isPlaying = false; let isPlaying = false;
@@ -150,7 +164,13 @@
alert(data?.error || "Mail.ru indirmesi başlatılamadı"); alert(data?.error || "Mail.ru indirmesi başlatılamadı");
return; return;
} }
const data = await resp.json().catch(() => null);
await list(); await list();
const jobId = data?.jobId;
const job = jobId ? torrents.find((t) => t.infoHash === jobId) : null;
if (job) {
openMailruMatchModal(job);
}
return; return;
} }
alert( alert(
@@ -229,6 +249,100 @@
totalDownloadSpeed = torrents.reduce((sum, t) => sum + (t.downloadSpeed || 0), 0); totalDownloadSpeed = torrents.reduce((sum, t) => sum + (t.downloadSpeed || 0), 0);
} }
function toggleMailruMenu(infoHash) {
activeMailruMenu = activeMailruMenu === infoHash ? null : infoHash;
}
function openMailruMatchModal(job) {
if (!job) return;
activeMailruJob = job;
mailruMatchQuery = "";
mailruMatchYear = "";
mailruMatchResults = [];
mailruSearching = false;
mailruSelections.clear();
showMailruMatchModal = true;
}
function closeMailruMatchModal() {
showMailruMatchModal = false;
activeMailruJob = null;
mailruMatchQuery = "";
mailruMatchYear = "";
mailruMatchResults = [];
mailruSearching = false;
mailruSelections.clear();
}
async function searchMailruSeries() {
const query = mailruMatchQuery.trim();
if (!query) return;
mailruSearching = true;
mailruMatchResults = [];
try {
const params = new URLSearchParams({
query,
type: "series"
});
if (mailruMatchYear.trim()) {
params.set("year", mailruMatchYear.trim());
}
const resp = await apiFetch(`/api/search/metadata?${params.toString()}`);
if (resp.ok) {
const data = await resp.json();
mailruMatchResults = data.results || [];
}
} catch (err) {
console.warn("Mail.ru eşleştirme araması başarısız:", err);
} finally {
mailruSearching = false;
}
}
function handleMailruMatchInput() {
clearTimeout(mailruSearchTimer);
mailruSearchTimer = setTimeout(() => {
searchMailruSeries();
}, 500);
}
function getMailruSelection(resultId) {
return mailruSelections.get(resultId) || { season: 1, episode: 1 };
}
function setMailruSelection(resultId, field, value) {
const prev = getMailruSelection(resultId);
const nextValue = Number(value) || 1;
mailruSelections.set(resultId, { ...prev, [field]: nextValue });
}
async function applyMailruMatch(result) {
if (!activeMailruJob || !result) return;
if (mailruApplyingId) return;
mailruApplyingId = result.id;
const selection = getMailruSelection(result.id);
const jobId = activeMailruJob.infoHash;
// Modalı hemen kapat, indirmeyi arka planda başlat
closeMailruMatchModal();
const resp = await apiFetch("/api/mailru/match", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
jobId,
metadata: result,
season: selection.season,
episode: selection.episode
})
});
if (!resp.ok) {
const data = await resp.json().catch(() => null);
alert(data?.error || "Eşleştirme başarısız oldu.");
mailruApplyingId = null;
return;
}
mailruApplyingId = null;
}
async function toggleSingleTorrent(hash) { async function toggleSingleTorrent(hash) {
const torrent = torrents.find(t => t.infoHash === hash); const torrent = torrents.find(t => t.infoHash === hash);
if (!torrent) return; if (!torrent) return;
@@ -494,9 +608,14 @@
slider.value = volume; slider.value = volume;
slider.style.setProperty("--fill", slider.value * 100); slider.style.setProperty("--fill", slider.value * 100);
} }
const handleDocClick = () => {
activeMailruMenu = null;
};
document.addEventListener("click", handleDocClick);
window.addEventListener("keydown", onEsc); window.addEventListener("keydown", onEsc);
return () => { return () => {
window.removeEventListener("keydown", onEsc); window.removeEventListener("keydown", onEsc);
document.removeEventListener("click", handleDocClick);
if (ws) ws.close(); if (ws) ws.close();
if (pollTimer) clearInterval(pollTimer); if (pollTimer) clearInterval(pollTimer);
}; };
@@ -576,7 +695,13 @@
on:drop={handleDrop} on:drop={handleDrop}
> >
{#each torrents as t (t.infoHash)} {#each torrents as t (t.infoHash)}
<div class="torrent" on:click={() => openModal(t)}> <div
class="torrent"
on:click={() => {
if (t.type === "mailru" && t.status === "awaiting_match") return;
openModal(t);
}}
>
{#if t.thumbnail} {#if t.thumbnail}
<img <img
src={withToken(`${API}${t.thumbnail}`)} src={withToken(`${API}${t.thumbnail}`)}
@@ -621,6 +746,30 @@
{/if} {/if}
</button> </button>
{/if} {/if}
{#if t.type === "mailru" && t.status === "awaiting_match"}
<div class="more-menu" on:click|stopPropagation>
<button
class="more-btn"
on:click|stopPropagation={() => toggleMailruMenu(t.infoHash)}
title="Aksiyonlar"
>
...
</button>
{#if activeMailruMenu === t.infoHash}
<div class="more-dropdown">
<button
class="more-item"
on:click|stopPropagation={() => {
openMailruMatchModal(t);
activeMailruMenu = null;
}}
>
Eşleştir
</button>
</div>
{/if}
</div>
{/if}
<button <button
class="remove-btn" class="remove-btn"
on:click|stopPropagation={() => removeTorrent(t.infoHash)} on:click|stopPropagation={() => removeTorrent(t.infoHash)}
@@ -663,7 +812,9 @@
</div> </div>
<div class="progress-text"> <div class="progress-text">
{#if (t.progress || 0) < 1} {#if t.type === "mailru" && t.status === "awaiting_match"}
Eşleştirme bekleniyor
{:else if (t.progress || 0) < 1}
{(t.progress * 100).toFixed(1)}% • {(t.progress * 100).toFixed(1)}% •
{t.downloaded ? (t.downloaded / 1e6).toFixed(1) : 0} MB • {t.downloaded ? (t.downloaded / 1e6).toFixed(1) : 0} MB •
{formatSpeed(t.downloadSpeed)} {formatSpeed(t.downloadSpeed)}
@@ -692,6 +843,56 @@
{/if} {/if}
</section> </section>
<MatchModal
show={showMailruMatchModal}
headerTitle="Eşlemeyi Düzelt"
fileLabel="Dosya"
fileName={activeMailruJob?.url || ""}
sizeText=""
titleLabel="Dizi Adı"
yearLabel="Yıl"
titlePlaceholder="Anime adını girin"
showYearInput={true}
bind:titleValue={mailruMatchQuery}
bind:yearValue={mailruMatchYear}
searching={mailruSearching}
results={mailruMatchResults}
showEmpty={!mailruSearching && mailruMatchResults.length === 0 && mailruMatchQuery.trim().length > 0}
emptyText="Sonuç bulunamadı"
applyingId={null}
onClose={closeMailruMatchModal}
onTitleInput={handleMailruMatchInput}
onYearInput={handleMailruMatchInput}
onSelect={applyMailruMatch}
>
<svelte:fragment slot="resultActions" let:result>
<label>
Season
<select
class="match-modal-select"
value={getMailruSelection(result.id).season}
on:change={(e) => setMailruSelection(result.id, "season", e.target.value)}
>
{#each mailruSeasonOptions as option}
<option value={option}>{option}</option>
{/each}
</select>
</label>
<label>
Episode
<select
class="match-modal-select"
value={getMailruSelection(result.id).episode}
on:change={(e) => setMailruSelection(result.id, "episode", e.target.value)}
>
{#each mailruEpisodeOptions as option}
<option value={option}>{option}</option>
{/each}
</select>
</label>
</svelte:fragment>
</MatchModal>
{#if showModal && selectedVideo} {#if showModal && selectedVideo}
<div class="modal-overlay" on:click={closeModal}> <div class="modal-overlay" on:click={closeModal}>
<!-- 🟢 Global Close Button (Files.svelte ile aynı) --> <!-- 🟢 Global Close Button (Files.svelte ile aynı) -->
@@ -1259,4 +1460,45 @@
font-size: 9px; font-size: 9px;
} }
} }
.more-menu {
position: relative;
display: inline-flex;
}
.more-btn {
border: 1px solid #ddd;
background: #f8f9fa;
color: #333;
border-radius: 6px;
padding: 4px 8px;
font-size: 12px;
cursor: pointer;
}
.more-dropdown {
position: absolute;
right: 0;
top: 28px;
background: #fff;
border: 1px solid #e4e4e4;
border-radius: 8px;
box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
z-index: 10;
min-width: 120px;
}
.more-item {
width: 100%;
text-align: left;
padding: 8px 10px;
background: transparent;
border: none;
cursor: pointer;
font-size: 12px;
}
.more-item:hover {
background: #f1f5f9;
}
</style> </style>

View File

@@ -9,4 +9,6 @@ srt
txt txt
vtt vtt
info.json info.json
.trash .trash
.aria2
mail_ru_gereksiz_dosya.png

View File

@@ -1188,6 +1188,29 @@ function sanitizeFileName(name) {
return replaced || "mailru_video.mp4"; return replaced || "mailru_video.mp4";
} }
function formatMailRuSeriesFilename(title, season, episode) {
const rawTitle = String(title || "").trim();
const parts = rawTitle
.replace(/[\\/:*?"<>|]+/g, "")
.replace(/[\s._-]+/g, " ")
.replace(/\s+/g, " ")
.trim()
.split(" ")
.filter(Boolean);
const titled = parts
.map((word) => {
if (!word) return "";
return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
})
.filter(Boolean)
.join(".");
const safeTitle = titled || "Anime";
const seasonNum = Number(season) || 1;
const episodeNum = Number(episode) || 1;
const code = `S${String(seasonNum).padStart(2, "0")}xE${String(episodeNum).padStart(2, "0")}`;
return sanitizeFileName(`${safeTitle}.${code}.mp4`);
}
async function resolveMailRuDirectUrl(rawUrl) { async function resolveMailRuDirectUrl(rawUrl) {
const normalized = normalizeMailRuUrl(rawUrl); const normalized = normalizeMailRuUrl(rawUrl);
if (!normalized) return null; if (!normalized) return null;
@@ -1411,11 +1434,11 @@ function finalizeMailRuJob(job, exitCode) {
job.progress = 1; job.progress = 1;
job.state = "completed"; job.state = "completed";
job.error = null; job.error = null;
const relPath = path const relPath = job.savePath === DOWNLOAD_DIR
.join(job.folderId, job.fileName) ? String(job.fileName || "")
.replace(/\\/g, "/"); : path.join(job.folderId || "", job.fileName || "").replace(/\\/g, "/");
attachMailRuThumbnail(job, filePath, relPath); attachMailRuThumbnail(job, filePath, relPath);
broadcastFileUpdate(job.folderId); broadcastFileUpdate(relPath || "downloads");
scheduleSnapshotBroadcast(); scheduleSnapshotBroadcast();
broadcastDiskSpace(); broadcastDiskSpace();
console.log(`✅ Mail.ru indirmesi tamamlandı: ${job.title}`); console.log(`✅ Mail.ru indirmesi tamamlandı: ${job.title}`);
@@ -1493,13 +1516,13 @@ function launchMailRuJob(job) {
async function startMailRuDownload(url) { async function startMailRuDownload(url) {
const normalized = normalizeMailRuUrl(url); const normalized = normalizeMailRuUrl(url);
if (!normalized) return null; if (!normalized) return null;
const folderId = `mailru_${Date.now().toString(36)}`; const folderId = null;
const savePath = path.join(DOWNLOAD_DIR, folderId); const savePath = DOWNLOAD_DIR;
fs.mkdirSync(savePath, { recursive: true });
const jobId = `mailru_${Date.now().toString(36)}`;
const job = { const job = {
id: folderId, id: jobId,
infoHash: folderId, infoHash: jobId,
type: "mailru", type: "mailru",
url: normalized, url: normalized,
directUrl: null, directUrl: null,
@@ -1508,7 +1531,7 @@ async function startMailRuDownload(url) {
added: Date.now(), added: Date.now(),
title: null, title: null,
fileName: null, fileName: null,
state: "resolving", state: "awaiting_match",
progress: 0, progress: 0,
downloaded: 0, downloaded: 0,
totalBytes: 0, totalBytes: 0,
@@ -1518,24 +1541,35 @@ async function startMailRuDownload(url) {
thumbnail: null, thumbnail: null,
process: null, process: null,
error: null, error: null,
debug: { binary: null, args: null, logs: [] } debug: { binary: null, args: null, logs: [] },
match: null
}; };
mailruJobs.set(job.id, job); mailruJobs.set(job.id, job);
scheduleSnapshotBroadcast(); scheduleSnapshotBroadcast();
console.log(`▶️ Mail.ru indirmesi başlatıldı: ${job.url}`); console.log(`▶️ Mail.ru indirimi eşleştirme bekliyor: ${job.url}`);
return job;
}
async function beginMailRuDownload(job) {
if (!job || job.state !== "awaiting_match") return false;
job.state = "resolving";
scheduleSnapshotBroadcast();
try { try {
const directUrl = await resolveMailRuDirectUrl(normalized); const directUrl = await resolveMailRuDirectUrl(job.url);
if (!directUrl) { if (!directUrl) {
throw new Error("Mail.ru video URL'si çözümlenemedi"); throw new Error("Mail.ru video URL'si çözümlenemedi");
} }
job.directUrl = directUrl; job.directUrl = directUrl;
const urlObj = new URL(directUrl); if (!job.fileName) {
const filename = sanitizeFileName(path.basename(urlObj.pathname)); const urlObj = new URL(directUrl);
job.fileName = filename || `mailru_${Date.now()}.mp4`; const filename = sanitizeFileName(path.basename(urlObj.pathname));
job.fileName = filename || `mailru_${Date.now()}.mp4`;
}
job.title = job.fileName; job.title = job.fileName;
job.state = "downloading"; job.state = "downloading";
scheduleSnapshotBroadcast();
try { try {
const headResp = await fetch(directUrl, { method: "HEAD" }); const headResp = await fetch(directUrl, { method: "HEAD" });
const length = Number(headResp.headers.get("content-length")) || 0; const length = Number(headResp.headers.get("content-length")) || 0;
@@ -1568,13 +1602,13 @@ async function startMailRuDownload(url) {
} }
startMailRuProgressPolling(job); startMailRuProgressPolling(job);
launchMailRuJob(job); launchMailRuJob(job);
return true;
} catch (err) { } catch (err) {
job.state = "error"; job.state = "error";
job.error = err?.message || "Mail.ru indirimi başlatılamadı"; job.error = err?.message || "Mail.ru indirimi başlatılamadı";
scheduleSnapshotBroadcast(); scheduleSnapshotBroadcast();
return false;
} }
return job;
} }
function findYoutubeInfoJson(savePath) { function findYoutubeInfoJson(savePath) {
@@ -1737,10 +1771,18 @@ function removeMailRuJob(jobId, { removeFiles = true } = {}) {
} }
mailruJobs.delete(jobId); mailruJobs.delete(jobId);
let filesRemoved = false; let filesRemoved = false;
if (removeFiles && job.savePath && fs.existsSync(job.savePath)) { if (removeFiles) {
try { try {
fs.rmSync(job.savePath, { recursive: true, force: true }); if (job.savePath === DOWNLOAD_DIR && job.fileName) {
filesRemoved = true; const filePath = path.join(job.savePath, job.fileName);
if (fs.existsSync(filePath)) {
fs.rmSync(filePath, { force: true });
filesRemoved = true;
}
} else if (job.savePath && fs.existsSync(job.savePath)) {
fs.rmSync(job.savePath, { recursive: true, force: true });
filesRemoved = true;
}
} catch (err) { } catch (err) {
console.warn("Mail.ru dosyası silinemedi:", err.message); console.warn("Mail.ru dosyası silinemedi:", err.message);
} }
@@ -5746,7 +5788,7 @@ app.delete("/api/file", requireAuth, (req, res) => {
const isDirectory = stats.isDirectory(); const isDirectory = stats.isDirectory();
const relWithinRoot = safePath.split(/[\\/]/).slice(1).join("/"); const relWithinRoot = safePath.split(/[\\/]/).slice(1).join("/");
let trashEntry = null; let trashEntry = null;
if (folderId && rootDir) { if (folderId && rootDir && fs.existsSync(rootDir) && fs.statSync(rootDir).isDirectory()) {
const infoBeforeDelete = readInfoForRoot(folderId); const infoBeforeDelete = readInfoForRoot(folderId);
mediaFlags = detectMediaFlagsForPath( mediaFlags = detectMediaFlagsForPath(
infoBeforeDelete, infoBeforeDelete,
@@ -5757,7 +5799,7 @@ app.delete("/api/file", requireAuth, (req, res) => {
mediaFlags = { movies: false, tv: false }; mediaFlags = { movies: false, tv: false };
} }
if (folderId && rootDir) { if (folderId && rootDir && fs.existsSync(rootDir) && fs.statSync(rootDir).isDirectory()) {
trashEntry = addTrashEntry(folderId, { trashEntry = addTrashEntry(folderId, {
path: relWithinRoot, path: relWithinRoot,
originalPath: safePath, originalPath: safePath,
@@ -6737,6 +6779,53 @@ app.post("/api/mailru/download", requireAuth, async (req, res) => {
} }
}); });
app.post("/api/mailru/match", requireAuth, async (req, res) => {
try {
const { jobId, metadata, season, episode } = req.body || {};
if (!jobId || !metadata) {
return res.status(400).json({ ok: false, error: "jobId ve metadata gerekli." });
}
const job = mailruJobs.get(jobId);
if (!job) {
return res.status(404).json({ ok: false, error: "Mail.ru işi bulunamadı." });
}
if (job.state !== "awaiting_match") {
if (job.match && job.fileName) {
return res.json({
ok: true,
jobId: job.id,
fileName: job.fileName,
alreadyMatched: true
});
}
return res.status(400).json({ ok: false, error: "Mail.ru işi eşleştirme beklemiyor." });
}
const safeSeason = Number(season) || 1;
const safeEpisode = Number(episode) || 1;
const title = metadata.title || metadata.name || "Anime";
job.match = {
id: metadata.id || null,
title,
season: safeSeason,
episode: safeEpisode,
matchedAt: Date.now()
};
job.fileName = formatMailRuSeriesFilename(title, safeSeason, safeEpisode);
job.title = job.fileName;
const started = await beginMailRuDownload(job);
if (!started) {
return res.status(500).json({ ok: false, error: job.error || "Mail.ru indirimi başlatılamadı." });
}
console.log(`✅ Mail.ru eşleştirme tamamlandı: ${job.fileName}`);
res.json({ ok: true, jobId: job.id, fileName: job.fileName });
} catch (err) {
res.status(500).json({
ok: false,
error: err?.message || "Mail.ru eşleştirme başarısız oldu."
});
}
});
// --- 🎫 YouTube cookies yönetimi --- // --- 🎫 YouTube cookies yönetimi ---
app.get("/api/youtube/cookies", requireAuth, (req, res) => { app.get("/api/youtube/cookies", requireAuth, (req, res) => {
try { try {