<?php
declare(strict_types=1);
require_once __DIR__ . '/../includes/bootstrap.php';
$dashboardPage  = 'documents';
$dashboardTitle = dbnToolsT('dash_title_document', dbnToolsCurrentLanguage());
$dashboardLead  = '';
require_once __DIR__ . '/../includes/layout_dashboard.php';

$docId = (int)($_GET['id'] ?? 0);
?>
<div id="docViewRoot" data-doc-id="<?= $docId ?>">
    <p class="dash-loading" id="docLoadingMsg"></p>
</div>

<script>
(function () {
    'use strict';
    const I18N  = window.DBN_I18N || {};
    const root  = document.getElementById('docViewRoot');
    const docId = parseInt(root.dataset.docId, 10);
    const api   = window.DBN_DASHBOARD.apiBase;
    const loc   = I18N.locale || 'en-GB';

    const loadMsg = document.getElementById('docLoadingMsg');
    if (loadMsg) loadMsg.textContent = I18N.loading || 'Loading…';

    if (!docId) {
        root.innerHTML = '<div class="dash-error">' + (I18N.missing_doc_id || 'Missing document ID.') + '</div>';
        return;
    }

    function safe(s) { return String(s ?? '').replace(/[&<>"]/g, c => ({ '&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;' }[c])); }
    function fmtDate(s) {
        if (!s) return '—';
        try { return new Date(s.replace(' ', 'T') + 'Z').toLocaleString(loc, { dateStyle:'medium', timeStyle:'short' }); }
        catch (_) { return s; }
    }
    function fmtNum(n) { return n == null ? '—' : Number(n).toLocaleString(loc); }
    function statusPill(status) {
        const cls = { ready:'dash-status--ready', pending:'dash-status--pending', processing:'dash-status--processing', error:'dash-status--error' }[status] || 'dash-status--pending';
        const lbl = {
            ready: I18N.status_ready || 'Ready', pending: I18N.status_pending || 'Pending',
            processing: I18N.status_processing || 'Processing', error: I18N.status_error || 'Error',
        }[status] || status;
        return '<span class="dash-status ' + cls + '">' + lbl + '</span>';
    }

    fetch(api + '/documents.php?action=get&id=' + docId, { credentials: 'same-origin' })
        .then(r => r.json())
        .then(data => {
            if (!data.ok) throw new Error(data.error?.message || (I18N.doc_not_found || 'Document not found'));
            render(data.document, data.chunks || []);
        })
        .catch(err => {
            root.innerHTML = '<div class="dash-error">' + safe(err.message)
                + '</div><p><a href="/dashboard/documents.php" class="dash-btn">← ' + (I18N.back || 'Back') + '</a></p>';
        });

    function render(doc, chunks) {
        const back    = I18N.back    || '← Back';
        const delBtn  = I18N.delete_btn || 'Delete';
        const html =
            '<section class="dash-card">'
            + '<div class="dash-doc-head">'
            +   '<div>'
            +     '<h2>' + safe(doc.title) + '</h2>'
            +     '<p class="dash-doc-meta">' + statusPill(doc.status)
            +       ' · ' + fmtNum(doc.word_count) + ' ' + (I18N.words || 'words')
            +       ' · ' + fmtNum(doc.chunk_count) + ' ' + (I18N.passages_label || 'passages')
            +       ' · ' + (I18N.added_at || 'added') + ' ' + fmtDate(doc.created_at) + '</p>'
            +     (doc.tags ? '<p class="dash-doc-meta">' + (I18N.tags_label || 'Tags:') + ' ' + safe(doc.tags) + '</p>' : '')
            +     (doc.source_url ? '<p class="dash-doc-meta"><a href="' + safe(doc.source_url) + '" target="_blank" rel="noopener">' + (I18N.source_url_label || 'Original source ↗') + '</a></p>' : '')
            +   '</div>'
            +   '<div>'
            +     '<a href="/dashboard/documents.php" class="dash-btn">' + back + '</a> '
            +     '<button class="dash-btn dash-btn--danger" id="docDelete">' + delBtn + '</button>'
            +   '</div>'
            + '</div>'

            + '<nav class="dash-tabs dms-tabs" role="tablist">'
            +   '<button class="dash-tab dms-tab is-active" data-tab="preview" role="tab">' + (I18N.tab_preview || 'Preview') + '</button>'
            +   '<button class="dash-tab dms-tab" data-tab="chunks" role="tab">' + (I18N.tab_chunks || 'Passages') + '<span class="dms-tab__pill">' + fmtNum(doc.chunk_count) + '</span></button>'
            +   '<button class="dash-tab dms-tab" data-tab="related" role="tab">' + (I18N.tab_related || 'Related') + '</button>'
            +   '<button class="dash-tab dms-tab" data-tab="versions" role="tab">Versions<span class="dms-tab__pill">v' + (doc.current_version || 1) + '</span></button>'
            +   '<button class="dash-tab dms-tab" data-tab="permissions" role="tab">Access</button>'
            +   '<button class="dash-tab dms-tab" data-tab="edit" role="tab">' + (I18N.tab_edit || 'Edit') + '</button>'
            + '</nav>'

            + '<div class="dash-tab-panel dms-tab-panel is-active" data-panel="preview">'
            +   renderPreviewPanel(doc)
            + '</div>'

            + '<div class="dash-tab-panel" data-panel="chunks">'
            +   (chunks.length
                    ? chunks.map(c =>
                        '<article class="dash-chunk">'
                        + (c.section_title ? '<p class="dash-chunk__section">' + safe(c.section_title) + '</p>' : '')
                        + safe(c.content) + '</article>').join('')
                    : '<div class="dash-empty">' + (I18N.no_chunks || 'No passages indexed yet.') + '</div>')
            + '</div>'

            + '<div class="dash-tab-panel dms-tab-panel" data-panel="related">'
            +   '<div class="dash-loading" id="relatedLoading">' + (I18N.loading_related || 'Loading related authorities from the graph…') + '</div>'
            +   '<div class="dash-related" id="relatedList" hidden></div>'
            + '</div>'

            + '<div class="dash-tab-panel dms-tab-panel" data-panel="versions">'
            +   '<div class="dms-loading" id="versionsLoading">Loading versions…</div>'
            +   '<div id="versionsList" hidden></div>'
            + '</div>'

            + '<div class="dash-tab-panel dms-tab-panel" data-panel="permissions">'
            +   '<div class="dms-loading" id="permLoading">Loading access info…</div>'
            +   '<div id="permPanel" hidden></div>'
            + '</div>'

            + '<div class="dash-tab-panel dms-tab-panel" data-panel="edit">'
            +   '<form id="docEditForm" style="display:grid; gap:0.85rem; max-width:560px;">'
            +     '<label>' + (I18N.field_title || 'Title') + '<input name="title" value="' + safe(doc.title) + '" style="width:100%;padding:0.5rem;border:1px solid var(--dbn-line);border-radius:8px;"></label>'
            +     '<label>' + (I18N.field_category || 'Category') + '<input name="category" value="' + safe(doc.category || '') + '" style="width:100%;padding:0.5rem;border:1px solid var(--dbn-line);border-radius:8px;"></label>'
            +     '<label>' + (I18N.field_tags || 'Tags (comma-separated)') + '<input name="tags" value="' + safe(doc.tags || '') + '" style="width:100%;padding:0.5rem;border:1px solid var(--dbn-line);border-radius:8px;"></label>'
            +     '<label>' + (I18N.field_lang || 'Language') + '<input name="language" value="' + safe(doc.language || 'no') + '" maxlength="10" style="width:120px;padding:0.5rem;border:1px solid var(--dbn-line);border-radius:8px;"></label>'
            +     '<label>' + (I18N.field_author || 'Author') + '<input name="author" value="' + safe(doc.author || '') + '" style="width:100%;padding:0.5rem;border:1px solid var(--dbn-line);border-radius:8px;"></label>'
            +     '<button type="submit" class="dash-btn dash-btn--primary" style="justify-self:start;">' + (I18N.save_changes || 'Save changes') + '</button>'
            +     '<span id="docEditStatus" style="color:rgba(22,19,15,0.6);font-size:0.85rem;"></span>'
            +   '</form>'
            + '</div>'

            + '</section>';

        root.innerHTML = html;
        window._dmsCurrentDoc = doc;
        wireTabs();
        wireDelete();
        wireEdit();
    }

    function renderPreviewPanel(doc) {
        const ext = (doc.original_filename || '').split('.').pop().toLowerCase();
        const previewUrl = api + '/preview.php?id=' + doc.id;
        if (doc.has_storage && ext === 'pdf') {
            return '<iframe class="dms-preview-frame" src="' + previewUrl + '" title="PDF preview"></iframe>';
        }
        if (doc.has_storage && ['png','jpg','jpeg','webp','gif'].indexOf(ext) >= 0) {
            return '<div style="text-align:center;padding:12px"><img src="' + previewUrl + '" style="max-width:100%;max-height:70vh;border-radius:10px;border:1px solid var(--dms-stroke)"></div>';
        }
        if (doc.has_storage && ['mp3','wav','m4a','ogg','flac','webm'].indexOf(ext) >= 0) {
            return '<audio class="dms-preview-audio" controls src="' + previewUrl + '"></audio>'
                 + '<details><summary>Transcript</summary><div class="dash-preview">' + safe(doc.content || '') + '</div></details>';
        }
        if (doc.has_storage && ext === 'docx') {
            return '<div id="docxPreview" class="dms-preview-frame" style="padding:16px;overflow:auto;background:#fff"></div>'
                 + '<script src="https://cdn.jsdelivr.net/npm/mammoth@1.6.0/mammoth.browser.min.js"><' + '/script>'
                 + '<script>setTimeout(function(){fetch("' + previewUrl + '",{credentials:"same-origin"}).then(r=>r.arrayBuffer()).then(buf=>mammoth.convertToHtml({arrayBuffer:buf})).then(res=>{document.getElementById("docxPreview").innerHTML=res.value;}).catch(e=>{document.getElementById("docxPreview").textContent="Preview failed: "+e.message;});},10);<' + '/script>';
        }
        // Fallback: text preview from extracted content
        return '<div class="dash-preview">' + safe(doc.content || (I18N.content_empty || '(empty)')) + '</div>'
             + (doc.has_storage ? '<p style="margin-top:8px"><a href="' + previewUrl + '&download=1" class="dash-btn">⬇ Download original</a></p>' : '');
    }

    let versionsLoaded = false;
    function loadVersions() {
        if (versionsLoaded) return;
        versionsLoaded = true;
        const wrap = document.getElementById('versionsList');
        const loading = document.getElementById('versionsLoading');
        fetch(api + '/document-versions.php?action=list&document_id=' + docId, { credentials: 'same-origin' })
            .then(r => r.json())
            .then(data => {
                loading.hidden = true; wrap.hidden = false;
                const versions = data.versions || [];
                const cur = window._dmsCurrentDoc || {};
                let html = '<div class="dms-version dms-version--current">'
                    + '<div class="dms-version__num">v' + (cur.current_version || 1) + '</div>'
                    + '<div><div class="dms-version__title">' + safe(cur.title) + '</div>'
                    + '<div class="dms-version__meta">Current · ' + fmtDate(cur.updated_at || cur.created_at) + '</div></div>'
                    + '<div class="dms-version__actions"></div></div>';
                if (!versions.length) {
                    html += '<div class="dash-empty">No previous versions.</div>';
                } else {
                    html += versions.map(v =>
                        '<div class="dms-version">'
                        + '<div class="dms-version__num">v' + v.version_number + '</div>'
                        + '<div><div class="dms-version__title">' + safe(v.title) + '</div>'
                        + '<div class="dms-version__meta">' + fmtDate(v.created_at)
                        + (v.uploaded_email ? ' · ' + safe(v.uploaded_email) : '')
                        + (v.notes ? ' · ' + safe(v.notes) : '') + '</div></div>'
                        + '<div class="dms-version__actions">'
                        + '<button class="dash-btn" data-restore="' + v.id + '">Restore</button> '
                        + '<button class="dash-btn dash-btn--danger" data-del-ver="' + v.id + '">✕</button>'
                        + '</div></div>'
                    ).join('');
                }
                wrap.innerHTML = html;
                wrap.querySelectorAll('[data-restore]').forEach(b => b.addEventListener('click', () => restoreVersion(Number(b.dataset.restore))));
                wrap.querySelectorAll('[data-del-ver]').forEach(b => b.addEventListener('click', () => deleteVersion(Number(b.dataset['delVer']))));
            }).catch(e => { loading.textContent = 'Error: ' + e.message; });
    }
    function restoreVersion(vid) {
        if (!confirm('Restore this version? Current version will be archived first.')) return;
        fetch(api + '/document-versions.php?action=restore', {
            method:'POST', credentials:'same-origin',
            headers:{'Content-Type':'application/json'},
            body: JSON.stringify({ document_id: docId, version_id: vid })
        }).then(r => r.json()).then(d => {
            if (!d.ok) throw new Error(d.message || 'Restore failed');
            location.reload();
        }).catch(e => alert(e.message));
    }
    function deleteVersion(vid) {
        if (!confirm('Delete this version permanently?')) return;
        fetch(api + '/document-versions.php?action=delete', {
            method:'POST', credentials:'same-origin',
            headers:{'Content-Type':'application/json'},
            body: JSON.stringify({ version_id: vid })
        }).then(r => r.json()).then(d => { versionsLoaded = false; loadVersions(); })
          .catch(e => alert(e.message));
    }

    let permLoaded = false;
    function loadPermissions() {
        if (permLoaded) return;
        permLoaded = true;
        const loading = document.getElementById('permLoading');
        const wrap = document.getElementById('permPanel');
        fetch(api + '/documents.php?action=get&id=' + docId, { credentials: 'same-origin' })
            .then(r => r.json()).then(d => {
                loading.hidden = true; wrap.hidden = false;
                const p = d.permissions || {};
                const fid = (d.document && d.document.folder_id) || null;
                let html = '<div class="dms-diag"><div class="dms-diag__row"><div class="dms-diag__label">Read</div><div></div><div>' + (p.can_read ? '<span class="dms-diag__status dms-diag__status--ok">allowed</span>' : '<span class="dms-diag__status dms-diag__status--err">denied</span>') + '</div></div>'
                    + '<div class="dms-diag__row"><div class="dms-diag__label">Write</div><div></div><div>' + (p.can_write ? '<span class="dms-diag__status dms-diag__status--ok">allowed</span>' : '<span class="dms-diag__status dms-diag__status--warn">read-only</span>') + '</div></div>'
                    + '<div class="dms-diag__row"><div class="dms-diag__label">Manage folder</div><div></div><div>' + (p.can_manage ? '<span class="dms-diag__status dms-diag__status--ok">allowed</span>' : '<span class="dms-diag__status dms-diag__status--warn">no</span>') + '</div></div></div>';
                if (fid) {
                    html += '<p style="margin-top:12px"><a class="dash-btn" href="/dashboard/folders.php#' + fid + '">Manage access on parent folder →</a></p>';
                } else {
                    html += '<p style="margin-top:12px;color:rgba(22,19,15,0.6)">This document is unassigned — move it into a folder to use folder ACLs.</p>';
                }
                wrap.innerHTML = html;
            }).catch(e => { loading.textContent = 'Error: ' + e.message; });
    }

    function wireTabs() {
        const tabs = root.querySelectorAll('.dash-tab');
        const panels = root.querySelectorAll('.dash-tab-panel');
        tabs.forEach(t => t.addEventListener('click', () => {
            tabs.forEach(x => x.classList.remove('is-active'));
            panels.forEach(p => p.classList.remove('is-active'));
            t.classList.add('is-active');
            const panel = root.querySelector('[data-panel="' + t.dataset.tab + '"]');
            if (panel) panel.classList.add('is-active');
            if (t.dataset.tab === 'related') loadRelated();
            if (t.dataset.tab === 'versions') loadVersions();
            if (t.dataset.tab === 'permissions') loadPermissions();
        }));
    }

    let relatedLoaded = false;
    function loadRelated() {
        if (relatedLoaded) return;
        relatedLoaded = true;
        const list    = document.getElementById('relatedList');
        const loading = document.getElementById('relatedLoading');
        fetch(api + '/graph.php?action=cites&doc_id=' + docId, { credentials: 'same-origin' })
            .then(r => r.json())
            .then(data => {
                loading.hidden = true;
                list.hidden = false;
                const items = data.results || [];
                if (!items.length) {
                    list.innerHTML = '<div class="dash-empty">' + (I18N.no_citations || 'No known citations in the graph database yet.') + '</div>';
                    return;
                }
                list.innerHTML = items.map(it =>
                    '<div class="dash-related__edge">'
                    + '<span class="dash-related__rel">' + safe(it.rel_type || '—') + '</span>'
                    + '<span class="dash-related__title">' + safe(it.title || it.ref || 'Unknown') + '</span>'
                    + '</div>').join('');
            })
            .catch(_ => {
                loading.hidden = true;
                list.hidden = false;
                list.innerHTML = '<div class="dash-empty">' + (I18N.graph_unavailable || 'Graph database is not available right now.') + '</div>';
            });
    }

    function wireDelete() {
        const btn = document.getElementById('docDelete');
        if (!btn) return;
        btn.addEventListener('click', () => {
            if (!confirm('Move to trash? You can restore within 30 days.')) return;
            btn.disabled = true;
            fetch(api + '/documents.php?action=delete', {
                method: 'POST', credentials: 'same-origin',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ ids: [docId] }),
            })
            .then(r => r.json())
            .then(data => {
                if (!data.ok) throw new Error(data.error?.message || 'Delete failed');
                location.href = '/dashboard/documents.php';
            })
            .catch(err => { alert(err.message); btn.disabled = false; });
        });
    }

    function wireEdit() {
        const form   = document.getElementById('docEditForm');
        const status = document.getElementById('docEditStatus');
        if (!form) return;
        form.addEventListener('submit', (e) => {
            e.preventDefault();
            const payload = { id: docId };
            ['title', 'category', 'tags', 'language', 'author'].forEach(name => {
                const el = form.elements[name];
                if (el) payload[name] = el.value;
            });
            status.textContent = I18N.saving || 'Saving…';
            fetch(api + '/documents.php?action=update', {
                method: 'POST', credentials: 'same-origin',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify(payload),
            })
            .then(r => r.json())
            .then(data => {
                if (!data.ok) throw new Error(data.error?.message || 'Save failed');
                const tmpl = I18N.saved_at || 'Saved {time}';
                status.textContent = tmpl.replace('{time}', new Date().toLocaleTimeString(loc));
            })
            .catch(err => status.textContent = err.message);
        });
    }
})();
</script>

<?php require_once __DIR__ . '/../includes/layout_dashboard_footer.php'; ?>
