4 Commits

Author SHA1 Message Date
2bad23da3a Add configurable shuffle depth for copy order
ShuffleDepth in DiskProfile controls how files are selected:
  -1 = no shuffle (preserve source order)
   0 = all files in random order
   N = group files by folder at depth N from /media, shuffle groups,
       copy entire group before moving to next

Exposed in disk profile UI as a select with level descriptions.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-21 21:30:55 +03:00
0a17d11bd1 Revert to Docker-only source paths, fix config validation, improve transcoding info
- handlers_sources.go: revert to relative paths rooted at /media (remove standalone absolute-path mode)
- settings.html: remove manual path input, restore auto-loading source tree from /media
- config.go: remove filesystem existence checks from Validate() — paths may be temporarily unavailable
- transcoder.go: always specify fps in ffmpeg args when MaxFPS is set, preserving source fps if lower than limit
- copier.go: include source codec/format and target codec/format in transcoding task message

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-21 21:28:28 +03:00
e885e49647 Show disk profile panel via Settings button
Profile panel is now hidden by default; a gear Settings button in
the disk card toggles it open/closed. Reduces visual clutter for
the common case when no profile changes are needed.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-21 21:09:52 +03:00
70d301f78f Remove native folder picker, use text input instead
Native OS dialog (zenity/AppleScript/PowerShell) fails on Linux with
"native folder picker is not supported on this platform". Replaced:
- dashboard: removed the "+" button, users type mount path manually
- settings: replaced "Add source folder" native dialog with inline
  text input field

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-21 21:08:00 +03:00
9 changed files with 181 additions and 246 deletions

View File

@@ -230,6 +230,7 @@ func triggerAutoCopy(cp *copier.Copier, cfg *config.Config, info disk.DiskInfo)
opts.ReserveFreeGB = p.ReserveFreeGB
opts.FileSelectMode = config.FileSelectMode(p.FileSelectMode)
opts.Transcode = p.Transcode
opts.ShuffleDepth = p.ShuffleDepth
if p.OverwriteMode != "" {
opts.OverwriteMode = config.OverwriteMode(p.OverwriteMode)
}

View File

@@ -26,6 +26,7 @@ func (s *Server) copyOptions(cfg *config.Config, diskInfo disk.DiskInfo, overwri
opts.ReserveFreeGB = p.ReserveFreeGB
opts.FileSelectMode = config.FileSelectMode(p.FileSelectMode)
opts.Transcode = p.Transcode
opts.ShuffleDepth = p.ShuffleDepth
} else {
opts.DestFolder = cfg.DestFolder
opts.ReserveFreeGB = cfg.ReserveFreeGB

View File

@@ -3,6 +3,7 @@ package api
import (
"errors"
"net/http"
"net/url"
"os"
"path/filepath"
"sort"
@@ -10,19 +11,20 @@ import (
)
func (s *Server) handleSources(w http.ResponseWriter, r *http.Request) {
absPath, err := normalizeSourcePathQuery(r.URL.Query().Get("path"))
relPath, err := normalizeSourcePath(r.URL.Query().Get("path"))
if err != nil {
jsonErr(w, http.StatusBadRequest, err.Error())
return
}
if absPath == "" {
jsonOK(w, map[string]any{"path": "", "items": []map[string]string{}})
return
absPath := s.deps.Config.MediaPath
if relPath != "" {
absPath = filepath.Join(absPath, relPath)
}
entries, err := os.ReadDir(absPath)
if err != nil {
jsonOK(w, map[string]any{"path": absPath, "items": []map[string]string{}})
jsonOK(w, map[string]any{"path": relPath, "items": []map[string]string{}})
return
}
@@ -36,10 +38,13 @@ func (s *Server) handleSources(w http.ResponseWriter, r *http.Request) {
if !e.IsDir() || strings.HasPrefix(e.Name(), ".") {
continue
}
childPath := filepath.Join(absPath, e.Name())
childPath := e.Name()
if relPath != "" {
childPath = filepath.Join(relPath, childPath)
}
items = append(items, item{
Name: e.Name(),
Path: childPath,
Path: filepath.ToSlash(childPath),
})
}
@@ -48,18 +53,26 @@ func (s *Server) handleSources(w http.ResponseWriter, r *http.Request) {
})
jsonOK(w, map[string]any{
"path": absPath,
"path": relPath,
"items": items,
})
}
func normalizeSourcePathQuery(raw string) (string, error) {
func normalizeSourcePath(raw string) (string, error) {
raw, _ = url.QueryUnescape(raw)
raw = strings.TrimSpace(raw)
raw = filepath.ToSlash(raw)
raw = strings.TrimPrefix(raw, "/")
if raw == "" || raw == "." {
return "", nil
}
clean := filepath.Clean(raw)
if !filepath.IsAbs(clean) {
clean = filepath.ToSlash(clean)
if clean == "." {
return "", nil
}
if clean == ".." || strings.HasPrefix(clean, "../") {
return "", errors.New("invalid source path")
}
return clean, nil

View File

@@ -116,25 +116,7 @@ func Save(path string, cfg *Config) error {
func (c *Config) Validate() error {
c.MediaPath = NormalizeMediaPath(c.MediaPath)
if c.MediaPath != "" {
info, err := os.Stat(c.MediaPath)
if err != nil {
return errors.New("media_path is not accessible")
}
if !info.IsDir() {
return errors.New("media_path must be a directory")
}
}
c.Sources = NormalizeSources(c.Sources, c.MediaPath)
for _, source := range c.Sources {
info, err := os.Stat(source.Path)
if err != nil {
return errors.New("source path is not accessible: " + source.Path)
}
if !info.IsDir() {
return errors.New("source path must be a directory: " + source.Path)
}
}
if c.ReserveFreeGB < 0 {
return errors.New("reserve_free_gb must be >= 0")
}

View File

@@ -33,6 +33,8 @@ type Options struct {
OverwriteMode config.OverwriteMode
FileSelectMode config.FileSelectMode
Transcode *disk.TranscodeProfile // nil = не транскодировать
// ShuffleDepth: -1=выкл, 0=файлы вразнобой, 1+=группировка по папке на глубине N
ShuffleDepth int
}
type Copier struct {
@@ -254,8 +256,7 @@ func (c *Copier) run(ctx context.Context, taskID string, opts Options, database
return
}
// случайный порядок — выбираем что копировать до начала копирования
rand.Shuffle(len(files), func(i, j int) { files[i], files[j] = files[j], files[i] })
files = applyShuffleDepth(files, opts.ShuffleDepth)
_, free, err := disk.DiskUsage(opts.MountPath)
if err != nil {
@@ -392,9 +393,15 @@ func (c *Copier) processVideo(ctx context.Context, taskID string, database *db.D
ext := transcoder.OutputExt(profile.OutputFormat)
dstTranscoded := strings.TrimSuffix(dst, filepath.Ext(dst)) + ext
srcFPS := fmt.Sprintf("%.2f", info.FPS)
msg := fmt.Sprintf("Transcoding %s (%s/%dch/%sfps → %s/%s/%dfps %s)",
filepath.Base(src),
info.Codec, info.AudioChannels, srcFPS,
profile.VideoCodec, profile.AudioCodec, profile.MaxFPS, profile.OutputFormat,
)
c.tasks.Update(taskID, func(t *task.Task) {
t.Phase = task.PhaseTranscoding
t.Message = "Transcoding " + filepath.Base(src)
t.Message = msg
})
if t, ok := c.tasks.Get(taskID); ok {
_ = database.UpdateTask(*t)
@@ -717,3 +724,52 @@ func copyFile(ctx context.Context, src, dst string) error {
}
return nil
}
// applyShuffleDepth упорядочивает файлы по заданной глубине шафлера.
// depth < 0 → оригинальный порядок (без шафла)
// depth == 0 → все файлы перемешиваются случайно
// depth >= 1 → файлы группируются по папке на уровне depth от корня /media,
// группы перемешиваются, внутри каждой группы порядок сохраняется.
func applyShuffleDepth(files []fileEntry, depth int) []fileEntry {
if depth < 0 || len(files) == 0 {
return files
}
if depth == 0 {
rand.Shuffle(len(files), func(i, j int) { files[i], files[j] = files[j], files[i] })
return files
}
type group struct {
key string
files []fileEntry
}
groupMap := make(map[string]*group, 64)
var order []string
for _, f := range files {
key := folderKeyAtDepth(f.relPath, depth)
if _, ok := groupMap[key]; !ok {
groupMap[key] = &group{key: key}
order = append(order, key)
}
groupMap[key].files = append(groupMap[key].files, f)
}
rand.Shuffle(len(order), func(i, j int) { order[i], order[j] = order[j], order[i] })
result := make([]fileEntry, 0, len(files))
for _, key := range order {
result = append(result, groupMap[key].files...)
}
return result
}
// folderKeyAtDepth возвращает путь к папке глубины depth из relPath.
// relPath вида "anime/Naruto/Season1/ep01.mkv", depth=2 → "anime/Naruto"
func folderKeyAtDepth(relPath string, depth int) string {
relPath = filepath.ToSlash(relPath)
parts := strings.Split(relPath, "/")
maxDepth := len(parts) - 1 // последний элемент — имя файла
if depth >= maxDepth {
depth = maxDepth
}
return strings.Join(parts[:depth], "/")
}

View File

@@ -12,6 +12,8 @@ type DiskProfile struct {
FileSelectMode string `json:"file_select_mode"`
ReserveFreeGB float64 `json:"reserve_free_gb"`
AutoCopy bool `json:"auto_copy"`
// ShuffleDepth: -1=выкл, 0=файлы вразнобой, 1+=папки на глубине N от корня /media
ShuffleDepth int `json:"shuffle_depth"`
// nil = не транскодировать видео
Transcode *TranscodeProfile `json:"transcode,omitempty"`
@@ -66,5 +68,6 @@ func DefaultProfile() *DiskProfile {
FileSelectMode: "new",
ReserveFreeGB: 2.0,
AutoCopy: false,
ShuffleDepth: -1,
}
}

View File

@@ -97,8 +97,14 @@ func buildArgs(opts Options) []string {
if maxH := maxHeight(p.MaxResolution); maxH > 0 {
filters = append(filters, fmt.Sprintf("scale=-2:min(%d\\,ih)", maxH))
}
if p.MaxFPS > 0 && src.FPS > float64(p.MaxFPS)+0.01 {
filters = append(filters, fmt.Sprintf("fps=%d", p.MaxFPS))
if p.MaxFPS > 0 {
targetFPS := p.MaxFPS
if src.FPS > 0 && src.FPS < float64(targetFPS) {
// Источник медленнее лимита — сохраняем исходный FPS
filters = append(filters, fmt.Sprintf("fps=%.3f", src.FPS))
} else {
filters = append(filters, fmt.Sprintf("fps=%d", targetFPS))
}
}
if len(filters) > 0 {
args = append(args, "-vf", strings.Join(filters, ","))

View File

@@ -5,7 +5,6 @@
<div class="panel-body">
<div class="path-input-row">
<input class="form-input" type="text" id="mountPath" placeholder="/Volumes/JUKEBOX or E:\\">
<button type="button" class="button-primary" onclick="pickMountPath()">+</button>
<button type="button" class="button-secondary" onclick="refreshSelectedDisk()">Refresh</button>
</div>
<div class="form-hint">Choose the directory where the removable disk is mounted. The app works with one selected disk at a time in standalone mode.</div>
@@ -131,6 +130,7 @@ function renderDisk() {
<button class="button-danger" data-action="start-copy" data-mode="replace" ${activeTask ? 'disabled' : ''}>Replace media</button>
<button class="button-primary" data-action="start-copy" data-mode="add" ${activeTask ? 'disabled' : ''}>Add media</button>
<button class="button-danger ${activeTask ? '' : 'hidden'}" data-action="cancel-copy">Cancel</button>
<button class="button-secondary" data-action="disk-settings" style="margin-left:auto">⚙ Settings</button>
` : ''}
${isForeign ? `
<button class="button-secondary" data-action="init-disk">Initialize disk</button>
@@ -193,7 +193,7 @@ function renderProfile(disk) {
`;
return `
<section class="panel" id="profilePanel">
<section class="panel" id="profilePanel" style="display:none">
<h2>Профиль диска</h2>
<div class="panel-body">
<h3>Параметры копирования</h3>
@@ -209,6 +209,11 @@ function renderProfile(disk) {
<label>Выбор файлов</label>
${sel('file_select_mode', p.file_select_mode || 'new', [['new','Только новые'],['all','Все подходящие']])}
</div>
<div class="form-group">
<label>Порядок копирования</label>
${sel('shuffle_depth', String(p.shuffle_depth ?? -1), [['-1','По порядку (без перемешивания)'],['0','Случайный порядок файлов'],['1','Случайная папка 1-го уровня (жанр)'],['2','Случайная папка 2-го уровня (сериал)'],['3','Случайная папка 3-го уровня (сезон)']])}
<span class="form-hint">Уровень задаёт глубину вложения: все файлы выбранной папки копируются целиком.</span>
</div>
<div class="form-group">
<label>Резерв свободного места (ГБ)</label>
<input class="form-input" type="number" id="prof_reserve_free_gb" value="${p.reserve_free_gb ?? 2}" min="0" step="0.5">
@@ -245,6 +250,7 @@ async function saveProfile(mountPath) {
file_select_mode: g('prof_file_select_mode')?.value || 'new',
reserve_free_gb: parseFloat(g('prof_reserve_free_gb')?.value || '2') || 0,
auto_copy: g('prof_auto_copy')?.checked || false,
shuffle_depth: parseInt(g('prof_shuffle_depth')?.value ?? '-1', 10),
};
if (transcodeEnabled) {
@@ -290,27 +296,6 @@ function startTaskPoll(taskID) {
pollTask(taskID);
}
async function pickFolder() {
const response = await fetch('/api/system/pick-folder', { method: 'POST' });
const payload = await response.json();
if (!response.ok) {
throw new Error(payload.error || 'Failed to choose folder');
}
return payload.path || '';
}
async function pickMountPath() {
try {
const path = await pickFolder();
if (!path) return;
document.getElementById('mountPath').value = path;
localStorage.setItem('jukebox.selectedMountPath', path);
await refreshSelectedDisk();
} catch (error) {
toast(error.message || 'Failed to choose folder', 'error');
}
}
async function refreshSelectedDisk() {
const mountPath = document.getElementById('mountPath').value.trim();
if (!mountPath) {
@@ -428,6 +413,13 @@ document.getElementById('diskState').addEventListener('click', (event) => {
if (action === 'start-copy') startCopy(button.dataset.mode || 'add');
if (action === 'cancel-copy') cancelCopy();
if (action === 'init-disk') initDisk();
if (action === 'disk-settings') {
const panel = document.getElementById('profilePanel');
if (!panel) return;
const open = panel.style.display !== 'none';
panel.style.display = open ? 'none' : '';
button.textContent = open ? '⚙ Settings' : '⚙ Settings ✕';
}
});
const savedMountPath = localStorage.getItem('jukebox.selectedMountPath');

View File

@@ -4,17 +4,16 @@
<section class="panel">
<h2>Copy Sources</h2>
<div class="panel-body">
<div class="form-hint">Add one or more root folders with source files. After that, expand each root and enable or disable individual nested folders with checkboxes.</div>
</div>
<div class="btn-row">
<button type="button" class="button-primary" onclick="addSourceRoot()">Add source folder</button>
<button type="button" class="button-secondary button-sm" onclick="reloadAllSourceTrees()">Refresh trees</button>
<div class="form-hint">Select top-level folders or expand branches and choose individual nested directories.</div>
</div>
<div class="source-list">
<div class="source-tree" id="sourceTree">
<div class="text-muted source-tree-empty">No source folders added yet.</div>
<div class="text-muted source-tree-empty">Loading...</div>
</div>
</div>
<div class="btn-row">
<button type="button" class="button-secondary button-sm" onclick="reloadSourceTree()">Refresh list</button>
</div>
</section>
<section class="panel">
@@ -36,16 +35,11 @@
<span class="form-hint">The new-only mode skips files already copied to this disk, even if they were later removed.</span>
</div>
<div class="form-group">
<label class="form-label" for="allowedFilesMode">Allowed file types</label>
<select class="form-select" id="allowedFilesMode" style="width:auto;max-width:420px" onchange="updateAllowedFilesModeUI()">
<option value="media_types">Audio, video, photo</option>
<option value="extensions">Custom extensions list</option>
</select>
</div>
<div class="form-group" id="mediaTypesGroup">
<label class="form-label">Built-in media types</label>
<div style="display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap">
<label class="form-label" style="margin:0">Allowed file types</label>
<button type="button" class="button-secondary button-sm" id="editAllowedFilesButton" onclick="toggleAllowedFilesEditor()">Edit list</button>
</div>
<div style="display:grid;gap:8px">
<label style="display:flex;align-items:flex-start;gap:8px;cursor:pointer">
<input type="checkbox" id="mediaTypeAudio" style="width:15px;height:15px;accent-color:var(--accent)">
@@ -73,7 +67,10 @@
</div>
<div class="form-group" id="extensionsGroup" style="display:none">
<label class="form-label" for="allowedExtensions">Allowed extensions</label>
<div style="display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap">
<label class="form-label" for="allowedExtensions" style="margin:0">Allowed extensions</label>
<button type="button" class="button-secondary button-sm" onclick="toggleAllowedFilesEditor()">Use media types</button>
</div>
<textarea class="form-input" id="allowedExtensions" rows="5" placeholder=".mp3, .flac, .mp4"></textarea>
<span class="form-hint">One extension per line or separated by commas. You can write <code>mp3</code> or <code>.mp3</code>.</span>
</div>
@@ -125,8 +122,8 @@ const builtInMediaTypes = {
video: ['.3gp', '.avi', '.m2ts', '.m4v', '.mkv', '.mov', '.mp4', '.mpeg', '.mpg', '.mts', '.ts', '.webm', '.wmv'],
photo: ['.bmp', '.gif', '.heic', '.heif', '.jpeg', '.jpg', '.png', '.tif', '.tiff', '.webp'],
};
let sourceRoots = [];
let sourceConfig = {};
let allowedFilesMode = 'media_types';
function escapeHTML(value) {
return String(value || '').replace(/[&<>"']/g, (char) => ({
@@ -138,43 +135,13 @@ function escapeHTML(value) {
}[char]));
}
function pathSegments(path) {
return String(path || '').split(/[\\/]+/).filter(Boolean);
}
function nodeName(path) {
const parts = pathSegments(path);
return parts.length ? parts[parts.length - 1] : path;
}
function normalizeComparePath(path) {
return String(path || '').replace(/\\/g, '/').replace(/\/+$/, '').toLowerCase();
}
function isSamePath(a, b) {
return normalizeComparePath(a) === normalizeComparePath(b);
}
function isPathWithin(base, candidate) {
const baseNorm = normalizeComparePath(base);
const candidateNorm = normalizeComparePath(candidate);
return candidateNorm === baseNorm || candidateNorm.startsWith(baseNorm + '/');
function pathDepth(path) {
return path ? path.split('/').length : 0;
}
function parentPath(path) {
const value = String(path || '').replace(/[\\/]+$/, '');
const slash = Math.max(value.lastIndexOf('/'), value.lastIndexOf('\\'));
if (slash < 0) return '';
if (slash === 2 && /^[A-Za-z]:/.test(value)) return value.slice(0, slash + 1);
if (slash === 0) return value.slice(0, 1);
return value.slice(0, slash);
}
function relativeDepth(root, path) {
if (isSamePath(root, path)) return 0;
const rootParts = pathSegments(root);
const pathParts = pathSegments(path);
return Math.max(0, pathParts.length - rootParts.length);
if (!path || !path.includes('/')) return '';
return path.slice(0, path.lastIndexOf('/'));
}
function effectiveSourceState(path) {
@@ -183,45 +150,37 @@ function effectiveSourceState(path) {
if (Object.prototype.hasOwnProperty.call(sourceConfig, current)) {
return sourceConfig[current];
}
current = parentPath(current);
if (!current) return true;
current = parentPath(current);
}
}
function collectSourcesForSave() {
const items = [];
const seen = new Set();
const roots = sourceTree.get('') || [];
sourceRoots.forEach((root) => {
items.push({ path: root, enabled: effectiveSourceState(root), root: true });
seen.add(normalizeComparePath(root));
});
for (const item of roots) {
items.push({ path: item.path, enabled: effectiveSourceState(item.path) });
seen.add(item.path);
}
Object.entries(sourceConfig).forEach(([path, enabled]) => {
const key = normalizeComparePath(path);
if (seen.has(key)) return;
items.push({ path, enabled, root: false });
if (seen.has(path)) return;
items.push({ path, enabled });
});
return items.sort((a, b) => a.path.localeCompare(b.path));
}
async function pickFolder() {
const response = await fetch('/api/system/pick-folder', { method: 'POST' });
const payload = await response.json();
if (!response.ok) {
throw new Error(payload.error || 'Failed to choose folder');
}
return payload.path || '';
}
async function loadSourceChildren(path) {
if (!path || loadingNodes.has(path)) return;
async function loadSourceChildren(path = '') {
if (loadingNodes.has(path)) return;
loadingNodes.add(path);
renderSources();
try {
const response = await fetch('/api/sources?path=' + encodeURIComponent(path));
const query = path ? '?path=' + encodeURIComponent(path) : '';
const response = await fetch('/api/sources' + query);
if (!response.ok) return;
const payload = await response.json();
sourceTree.set(path, payload.items || []);
@@ -246,59 +205,15 @@ function toggleSource(path, checked) {
renderSources();
}
function removeRoot(path) {
sourceRoots = sourceRoots.filter((root) => !isSamePath(root, path));
sourceTree.delete(path);
expandedNodes.delete(path);
loadingNodes.delete(path);
Object.keys(sourceConfig).forEach((key) => {
if (isPathWithin(path, key)) {
delete sourceConfig[key];
}
});
renderSources();
}
async function addSourceRoot() {
try {
const path = await pickFolder();
if (!path) return;
if (sourceRoots.some((root) => isSamePath(root, path))) {
toast('This source folder is already added', 'error');
return;
}
sourceRoots.push(path);
sourceRoots.sort((a, b) => a.localeCompare(b));
sourceConfig[path] = true;
expandedNodes.add(path);
await loadSourceChildren(path);
} catch (error) {
toast(error.message || 'Failed to choose folder', 'error');
}
}
async function reloadAllSourceTrees() {
const roots = [...sourceRoots];
sourceTree.clear();
for (const root of roots) {
if (expandedNodes.has(root)) {
await loadSourceChildren(root);
}
}
renderSources();
}
function renderSourceNodes(root, parentPathValue) {
const items = sourceTree.get(parentPathValue) || [];
function renderSourceNodes(parent = '') {
const items = sourceTree.get(parent) || [];
return items.map((item) => {
const checked = effectiveSourceState(item.path);
const expanded = expandedNodes.has(item.path);
const childrenKnown = sourceTree.has(item.path);
const children = childrenKnown ? sourceTree.get(item.path) : [];
const hasChildren = !childrenKnown || children.length > 0;
const pad = 16 + (relativeDepth(root, item.path) + 1) * 20;
const pad = 16 + pathDepth(item.path) * 20;
return `
<div class="source-node">
@@ -313,11 +228,11 @@ function renderSourceNodes(root, parentPathValue) {
<input class="source-check" type="checkbox" data-action="toggle-check" data-path="${escapeHTML(item.path)}" ${checked ? 'checked' : ''}>
<div class="source-label">
<span class="source-item-name">${escapeHTML(item.name)}</span>
<span class="source-item-path">${escapeHTML(item.path)}</span>
<span class="source-item-path">/media/${escapeHTML(item.path)}</span>
</div>
</div>
${expanded && loadingNodes.has(item.path) ? '<div class="source-loading">Loading...</div>' : ''}
${expanded && childrenKnown && children.length ? `<div class="source-children">${renderSourceNodes(root, item.path)}</div>` : ''}
${expanded && childrenKnown && children.length ? `<div class="source-children">${renderSourceNodes(item.path)}</div>` : ''}
</div>
`;
}).join('');
@@ -325,54 +240,24 @@ function renderSourceNodes(root, parentPathValue) {
function renderSources() {
const el = document.getElementById('sourceTree');
if (!sourceRoots.length) {
el.innerHTML = '<div class="text-muted source-tree-empty">No source folders added yet.</div>';
const roots = sourceTree.get('');
if (loadingNodes.has('') && !roots) {
el.innerHTML = '<div class="text-muted source-tree-empty">Loading...</div>';
return;
}
if (!roots || !roots.length) {
el.innerHTML = '<div class="text-muted source-tree-empty">No folders found in /media.</div>';
return;
}
el.innerHTML = sourceRoots.map((root) => {
const checked = effectiveSourceState(root);
const expanded = expandedNodes.has(root);
const childrenKnown = sourceTree.has(root);
const children = childrenKnown ? sourceTree.get(root) : [];
const hasChildren = !childrenKnown || children.length > 0;
return `
<div class="source-root-card">
<div class="source-row source-root-row">
<button
type="button"
class="source-toggle ${hasChildren ? '' : 'source-toggle-empty'}"
data-action="toggle-expand"
data-path="${escapeHTML(root)}"
${hasChildren ? '' : 'tabindex="-1" aria-hidden="true"'}
>${expanded ? '▾' : '▸'}</button>
<input class="source-check" type="checkbox" data-action="toggle-check" data-path="${escapeHTML(root)}" ${checked ? 'checked' : ''}>
<div class="source-label">
<div class="source-root-title">
<span class="source-item-name">${escapeHTML(nodeName(root))}</span>
<span class="source-root-badge">Root</span>
</div>
<span class="source-item-path">${escapeHTML(root)}</span>
</div>
<button type="button" class="button-secondary button-sm" data-action="remove-root" data-path="${escapeHTML(root)}">Remove</button>
</div>
${expanded && loadingNodes.has(root) ? '<div class="source-loading">Loading...</div>' : ''}
${expanded && childrenKnown && children.length ? `<div class="source-children">${renderSourceNodes(root, root)}</div>` : ''}
</div>
`;
}).join('');
el.innerHTML = renderSourceNodes('');
}
function deriveRootsFromSources(sources) {
const explicitRoots = sources.filter((source) => source.root).map((source) => source.path);
if (explicitRoots.length) {
return explicitRoots;
}
return sources
.map((source) => source.path)
.filter((path, index, all) => !all.some((other, otherIndex) => otherIndex !== index && isPathWithin(other, path) && !isSamePath(other, path)));
async function reloadSourceTree() {
sourceTree.clear();
expandedNodes.clear();
await loadSourceChildren('');
}
function defaultAllowedExtensions() {
@@ -410,9 +295,13 @@ function selectedMediaTypes() {
}
function updateAllowedFilesModeUI() {
const mode = document.getElementById('allowedFilesMode').value || 'media_types';
document.getElementById('mediaTypesGroup').style.display = mode === 'media_types' ? '' : 'none';
document.getElementById('extensionsGroup').style.display = mode === 'extensions' ? '' : 'none';
document.getElementById('mediaTypesGroup').style.display = allowedFilesMode === 'media_types' ? '' : 'none';
document.getElementById('extensionsGroup').style.display = allowedFilesMode === 'extensions' ? '' : 'none';
}
function toggleAllowedFilesEditor() {
allowedFilesMode = allowedFilesMode === 'extensions' ? 'media_types' : 'extensions';
updateAllowedFilesModeUI();
}
function renderMediaTypeHints() {
@@ -429,9 +318,9 @@ async function loadSettings() {
document.getElementById('reserveGB').value = cfg.reserve_free_gb ?? 2;
document.getElementById('destFolder').value = cfg.dest_folder || 'media';
document.getElementById('fileSelectMode').value = cfg.file_select_mode || 'new';
document.getElementById('allowedFilesMode').value = cfg.allowed_files_mode || 'media_types';
document.getElementById('overwriteMode').value = cfg.overwrite_mode || 'skip';
document.getElementById('autoCopy').checked = !!cfg.auto_copy;
allowedFilesMode = cfg.allowed_files_mode || 'media_types';
document.getElementById('mediaTypeAudio').checked = (cfg.enabled_media_types || ['audio', 'video']).includes('audio');
document.getElementById('mediaTypeVideo').checked = (cfg.enabled_media_types || ['audio', 'video']).includes('video');
document.getElementById('mediaTypePhoto').checked = (cfg.enabled_media_types || []).includes('photo');
@@ -442,10 +331,7 @@ async function loadSettings() {
(cfg.sources || []).forEach((source) => {
sourceConfig[source.path] = !!source.enabled;
});
sourceRoots = deriveRootsFromSources(cfg.sources || []).sort((a, b) => a.localeCompare(b));
expandedNodes.clear();
sourceTree.clear();
await reloadAllSourceTrees();
renderSources();
} catch (error) {}
}
@@ -453,15 +339,15 @@ async function saveSettings(event) {
event.preventDefault();
const body = {
reserve_free_gb: parseFloat(document.getElementById('reserveGB').value) || 2,
dest_folder: document.getElementById('destFolder').value.trim() || 'media',
file_select_mode: document.getElementById('fileSelectMode').value,
allowed_files_mode: document.getElementById('allowedFilesMode').value,
reserve_free_gb: parseFloat(document.getElementById('reserveGB').value) || 2,
dest_folder: document.getElementById('destFolder').value.trim() || 'media',
file_select_mode: document.getElementById('fileSelectMode').value,
allowed_files_mode: allowedFilesMode,
enabled_media_types: selectedMediaTypes(),
allowed_extensions: parseExtensionsInput(document.getElementById('allowedExtensions').value),
overwrite_mode: document.getElementById('overwriteMode').value,
auto_copy: document.getElementById('autoCopy').checked,
sources: collectSourcesForSave(),
overwrite_mode: document.getElementById('overwriteMode').value,
auto_copy: document.getElementById('autoCopy').checked,
sources: collectSourcesForSave(),
};
try {
@@ -483,22 +369,16 @@ async function saveSettings(event) {
}
document.getElementById('sourceTree').addEventListener('click', async (event) => {
const button = event.target.closest('button[data-action]');
const button = event.target.closest('[data-action="toggle-expand"]');
if (!button) return;
const action = button.dataset.action;
const path = button.dataset.path;
if (action === 'toggle-expand') {
if (expandedNodes.has(path)) {
expandedNodes.delete(path);
renderSources();
return;
}
await ensureExpanded(path);
}
if (action === 'remove-root') {
removeRoot(path);
if (expandedNodes.has(path)) {
expandedNodes.delete(path);
renderSources();
return;
}
await ensureExpanded(path);
});
document.getElementById('sourceTree').addEventListener('change', (event) => {
@@ -509,5 +389,6 @@ document.getElementById('sourceTree').addEventListener('change', (event) => {
renderMediaTypeHints();
loadSettings();
loadSourceChildren('');
</script>
{{end}}