<?php
require_once __DIR__ . '/../manual/manual_render.php';

$manualMeta = enrepManualMeta();
$manualSections = enrepManualSections();
$manualPdfUrl = ROOT_URL . '/includes/manual/manual_pdf.php?tenant=' . urlencode((string)TENANT_URL);
?>
<style>
<?= enrepManualCss() ?>
</style>

<div class="manual-page mt-n5 mt-md-0">
    <div class="manual-toolbar">
        <h2 class="manual-page-title mb-0"><?= enrepManualEscape((string)$manualMeta['title']) ?></h2>
        <a href="<?= htmlspecialchars($manualPdfUrl, ENT_QUOTES, 'UTF-8') ?>" class="btn btn-info btn-sm" target="_blank"
            data-mdb-tooltip-init data-mdb-placement="bottom" data-mdb-trigger="hover" title="Download manual as PDF">
            <i class="fad fa-file-pdf"></i> Download PDF
        </a>
    </div>

    <div class="manual-shell">
        <?= enrepManualSidebarHtml($manualSections) ?>
        <div class="manual-content-card">
            <div id="manualContent" class="manual-content"></div>
        </div>
    </div>
    <?= enrepManualTemplateHtml($manualSections) ?>
</div>

<script>
document.getElementById('navBox').innerHTML = '<li class="breadcrumb-item active">Manual</li>';

(function initManualPage() {
    const content = document.getElementById('manualContent');
    const links = Array.from(document.querySelectorAll('[data-manual-section]'));
    if (!content || !links.length) return;

    const loadSection = (sectionId) => {
        const safeId = String(sectionId || 'welcome');
        const template = document.getElementById('manual-template-' + safeId) || document.getElementById('manual-template-welcome');
        if (!template) return;

        content.innerHTML = template.innerHTML;
        links.forEach((link) => {
            link.classList.toggle('active', link.getAttribute('data-manual-section') === safeId);
        });
    };

    links.forEach((link) => {
        link.addEventListener('click', function () {
            loadSection(this.getAttribute('data-manual-section'));
        });
    });

    loadSection('welcome');
})();
</script>
