{% extends "base.html" %}
{% block page_title %}RuTube · Залив{% endblock %}
{% block content %}

<div class="card" style="border-left:3px solid var(--accent);">
    <h2>🟣 RuTube — Залив видео</h2>
    <p class="card-hint">
        Отдельный модуль для RuTube. <b>v1 ездит на живых куках</b>: профиль должен быть
        <b>залогинен в RuTube вручную</b> (откройте профиль в антидетекте → войдите на rutube.ru).
        Залив идёт через <code>studio.rutube.ru</code> в видимом окне — первый прогон
        калибрует селекторы (в логи падают строки <code>rt.upload.probe</code>).
        Видео строго 1:1 (1 видео = 1 профиль), заголовок берётся случайно из списка.
    </p>
    <p class="card-hint" style="margin-top:6px; color:#A66BFF;">
        🎲 Уникализация применяется и к RuTube — она <b>общая</b>: настраивается один раз в
        разделе <b>YouTube → Залив</b> (карточка «Уникализация видео») и работает для обеих площадок.
    </p>
</div>

<div class="card">
    <h2>Профили <span class="pill" id="rt-prof-count">0 выбрано</span></h2>
    <div class="btn-row compact" style="margin-bottom:10px;">
        <button class="btn ghost" id="rt-prof-all">Выбрать все</button>
        <button class="btn ghost" id="rt-prof-none">Снять все</button>
        <button class="btn ghost" id="rt-prof-reload">↻ Обновить</button>
    </div>
    <div id="rt-prof-list" class="rt-prof-list" style="max-height:280px; overflow:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:6px;">
        <div class="empty-row">загружаем профили…</div>
    </div>
</div>

<div class="card">
    <h2>Видео / Названия / Теги / Описания</h2>
    <div class="btn-row compact" style="margin-bottom:8px;">
        <button class="btn" id="rt-pick-files">📁 Выбрать файлы</button>
        <button class="btn ghost" id="rt-pick-folder">🗂 Папка с видео</button>
        <span class="pill" id="rt-video-count">0 видео</span>
    </div>
    <div class="queue-grid" style="display:grid; grid-template-columns:1fr 1fr; gap:12px;">
        <label class="field">
            <b>Названия</b> <span class="pill" id="rt-titles-count">0</span>
            <textarea class="queue-input" id="rt-titles" placeholder="Одно название на строку — берётся случайно на каждое видео"></textarea>
        </label>
        <label class="field">
            <b>Теги</b>
            <textarea class="queue-input" id="rt-tags" placeholder="Один тег на строку"></textarea>
        </label>
    </div>
    <label class="field" style="margin-top:10px;">
        <b>Описания</b> <span class="card-hint" style="font-weight:normal">(разделяй пустой строкой; по кругу)</span>
        <textarea class="queue-input" id="rt-descs" placeholder="Описание 1&#10;&#10;Описание 2"></textarea>
    </label>
</div>

<div class="card">
    <h2>Настройки</h2>
    <label class="field">
        <span>Видимость</span>
        <select class="select" id="rt-visibility" style="max-width:220px">
            <option value="public">Все пользователи (публичное)</option>
            <option value="unlisted">По ссылке</option>
            <option value="private">Только я</option>
        </select>
    </label>
    <label class="field">
        <span>Потоки (параллельных заливов)</span>
        <div class="slider-row">
            <input type="range" min="1" max="10" step="1" value="1" id="rt-threads" data-pref="rutube_proliv.threads">
            <span class="pill" id="rt-threads-val">1</span>
        </div>
    </label>
    <label class="field check-field" title="Видимое окно профиля при заливе — нужно для калибровки селекторов RuTube. Сними когда всё стабильно.">
        <input type="checkbox" id="rt-show-browser" data-pref="rutube_proliv.show_browser" data-default="1" checked>
        <span>🖥 Показать браузер при заливе (видимое окно)</span>
    </label>
    <label class="field check-field">
        <input type="checkbox" id="rt-delete-after" data-pref="rutube_proliv.delete_after_upload" checked>
        <span>Удалять видео после публикации</span>
    </label>
</div>

<div class="card">
    <div class="btn-row">
        <button class="btn" id="rt-start">▶ Запустить залив RuTube</button>
        <button class="btn ghost" id="rt-stop">■ Стоп</button>
    </div>
    <pre id="rutube-log" class="log-stream" style="margin-top:12px; max-height:300px; overflow:auto;"></pre>
</div>

<script>
(function(){
    const $ = (id) => document.getElementById(id);
    let videoPaths = [];

    // ---- profiles ----
    function selectedIds(){
        return Array.from(document.querySelectorAll('#rt-prof-list input[type=checkbox]:checked')).map(c => c.value);
    }
    function refreshProfCount(){
        const n = selectedIds().length;
        const el = $('rt-prof-count'); if (el) el.textContent = n + ' выбрано';
    }
    function renderProfiles(list){
        const box = $('rt-prof-list');
        if (!box) return;
        if (!list.length){ box.innerHTML = '<div class="empty-row">нет профилей в антидетекте</div>'; return; }
        box.innerHTML = list.map(p => {
            const name = (p.name || p.id || '').toString();
            return '<label class="field check-field" style="margin:0;padding:4px 6px;">' +
                   '<input type="checkbox" value="' + p.id + '">' +
                   '<span style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">' + name + '</span></label>';
        }).join('');
        box.querySelectorAll('input[type=checkbox]').forEach(c => c.addEventListener('change', refreshProfCount));
        refreshProfCount();
    }
    function loadProfiles(){
        const box = $('rt-prof-list');
        if (box) box.innerHTML = '<div class="empty-row">загружаем профили…</div>';
        fetch('/api/adapters/{{ active_adapter }}/profiles').then(r => r.json()).then(d => {
            renderProfiles((d && d.ok && d.profiles) || []);
        }).catch(() => { if (box) box.innerHTML = '<div class="empty-row">ошибка загрузки профилей</div>'; });
    }
    $('rt-prof-all') && $('rt-prof-all').addEventListener('click', () => {
        document.querySelectorAll('#rt-prof-list input[type=checkbox]').forEach(c => c.checked = true); refreshProfCount();
    });
    $('rt-prof-none') && $('rt-prof-none').addEventListener('click', () => {
        document.querySelectorAll('#rt-prof-list input[type=checkbox]').forEach(c => c.checked = false); refreshProfCount();
    });
    $('rt-prof-reload') && $('rt-prof-reload').addEventListener('click', loadProfiles);

    // ---- native video picker (reuses platform-agnostic endpoint) ----
    function setVideoCount(){ const el=$('rt-video-count'); if(el) el.textContent = videoPaths.length + ' видео'; }
    $('rt-pick-files') && $('rt-pick-files').addEventListener('click', () => {
        fetch('/api/proliv/pick-videos', {method:'POST'}).then(r=>r.json()).then(d=>{
            if (d && d.ok && d.paths && d.paths.length){ videoPaths = d.paths.slice(); setVideoCount(); }
        }).catch(()=>{});
    });
    $('rt-pick-folder') && $('rt-pick-folder').addEventListener('click', () => {
        fetch('/api/proliv/pick-folder', {method:'POST'}).then(r=>r.json()).then(d=>{
            if (d && d.ok && d.paths && d.paths.length){ videoPaths = d.paths.slice(); setVideoCount(); }
        }).catch(()=>{});
    });

    // ---- titles count + persistence (reuses /api/settings whitelist) ----
    const titlesArea = $('rt-titles');
    function updTitlesCount(){ const el=$('rt-titles-count'); if(el && titlesArea) el.textContent = (titlesArea.value||'').split(/\n+/).filter(s=>s.trim()).length; }
    if (titlesArea){
        fetch('/api/settings').then(r=>r.json()).then(d=>{
            const saved = d && d.settings && d.settings['rutube_proliv.titles_saved'];
            if (saved && !titlesArea.value.trim()){ titlesArea.value = saved; }
            updTitlesCount();
        }).catch(()=>{});
        let _t; titlesArea.addEventListener('input', () => {
            updTitlesCount();
            clearTimeout(_t); _t = setTimeout(() => {
                fetch('/api/settings', {method:'POST', headers:{'Content-Type':'application/json'},
                    body: JSON.stringify({'rutube_proliv.titles_saved': titlesArea.value})}).catch(()=>{});
            }, 400);
        });
    }
    const thr = $('rt-threads'); if (thr) thr.addEventListener('input', () => { const v=$('rt-threads-val'); if(v) v.textContent = thr.value; });

    // ---- start / stop ----
    function logLine(t){ const el=$('rutube-log'); if(el){ el.textContent += t + '\n'; el.scrollTop = el.scrollHeight; } }
    const splitLines = (id) => ($(id).value || '').split(/\n+/).map(s=>s.trim()).filter(Boolean);

    $('rt-start') && $('rt-start').addEventListener('click', () => {
        const ids = selectedIds();
        const titles = splitLines('rt-titles');
        const descs = ($('rt-descs').value || '').split(/\n\s*\n+/).map(s=>s.trim()).filter(Boolean);
        if (!ids.length){ window.EmberToast && window.EmberToast('Выберите хотя бы один профиль','err'); return; }
        if (!videoPaths.length){ window.EmberToast && window.EmberToast('Выберите видеофайлы','err'); return; }
        if (!titles.length){ window.EmberToast && window.EmberToast('Заполните названия','err'); return; }
        const body = {
            profile_ids: ids,
            video_paths: videoPaths.slice(),
            titles: titles,
            tags: splitLines('rt-tags'),
            descriptions: descs,
            visibility: $('rt-visibility').value,
            threads: parseInt($('rt-threads').value || '1', 10),
        };
        fetch('/api/rutube/proliv/start', {method:'POST', headers:{'Content-Type':'application/json'}, body: JSON.stringify(body)})
            .then(r=>r.json()).then(d=>{
                if (d.ok){
                    window.EmberToast && window.EmberToast('RuTube: поставлено ' + d.queued + ' профилей × ' + d.videos + ' видео','ok');
                    logLine('▶ Очередь RuTube поставлена: ' + d.queued + ' профилей.');
                    if (window.EmberRunnerLog) window.EmberRunnerLog.attachTo('rutube-log');
                } else {
                    window.EmberToast && window.EmberToast(d.error || 'Ошибка','err');
                    logLine('✖ ' + (d.error || 'Ошибка'));
                }
            }).catch(e => logLine('✖ сеть: ' + (e && e.message || e)));
    });
    $('rt-stop') && $('rt-stop').addEventListener('click', () => {
        fetch('/api/rutube/proliv/stop', {method:'POST'}).then(r=>r.json()).then(d=>{
            logLine('■ Стоп. Отменено в очереди: ' + (d.cancelled || 0));
        }).catch(()=>{});
    });

    loadProfiles();
})();
</script>
{% endblock %}