Initial commit (v1.5.9)

views/partials/sidebar.ejs

@@ -0,0 +1,93 @@
+<nav class="sidebar" id="sidebar">
+    <script>
+        (function() {
+            if (localStorage.getItem('sidebar-collapsed') === 'true') {
+                document.getElementById('sidebar').classList.add('collapsed');
+            }
+        })();
+    </script>
+    <div class="brand">
+        <div class="brand-logo">
+            <img src="/images/logo_svg.svg" alt="Logo" class="brand-icon">
+            <span>Agora</span>
+        </div>
+        <button id="btn-sidebar-toggle" class="btn-sidebar-toggle" title="Réduire la barre latérale">
+            <i data-lucide="chevron-left" id="sidebar-toggle-icon"></i>
+        </button>
+    </div>
+    <ul class="nav-links">
+        <a href="/trending" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'trending' ? 'active' : '' %>" data-target="section-trending">
+                <i data-lucide="flame"></i>
+                <span>Tendances</span>
+            </li>
+        </a>
+        <a href="/recent" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'recent' ? 'active' : '' %>" data-target="section-recent">
+                <i data-lucide="clock"></i>
+                <span>Ajouts récents</span>
+            </li>
+        </a>
+        <a href="/search" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'search' ? 'active' : '' %>" data-target="section-search">
+                <i data-lucide="search"></i>
+                <span>Recherche</span>
+            </li>
+        </a>
+        <a href="/downloads" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'downloads' ? 'active' : '' %>" data-target="section-downloads">
+                <i data-lucide="download"></i>
+                <span>Téléchargements</span>
+            </li>
+        </a>
+        <a href="/manual" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'manual' ? 'active' : '' %>" data-target="section-manual">
+                <i data-lucide="plus-circle"></i>
+                <span>Ajout manuel</span>
+            </li>
+        </a>
+        <% if (typeof currentUser !== 'undefined' && currentUser && currentUser.role === 'admin') { %>
+        <a href="/settings" style="text-decoration: none; color: inherit;">
+            <li class="<%= page === 'settings' ? 'active' : '' %>" data-target="section-settings">
+                <i data-lucide="settings"></i>
+                <span>Paramètres</span>
+            </li>
+        </a>
+        <% } %>
+    </ul>
+    <div class="nav-footer">
+        <button id="btn-logout" class="btn-text">
+            <i data-lucide="log-out"></i>
+            <span>Déconnexion</span>
+        </button>
+    </div>
+</nav>
+
+<script>
+    document.addEventListener('DOMContentLoaded', () => {
+        const sidebar = document.getElementById('sidebar');
+        const toggleBtn = document.getElementById('btn-sidebar-toggle');
+        const toggleIcon = document.getElementById('sidebar-toggle-icon');
+        
+        if (!sidebar || !toggleBtn || !toggleIcon) return;
+        
+        const updateIcon = (isCollapsed) => {
+            toggleIcon.setAttribute('data-lucide', isCollapsed ? 'chevron-right' : 'chevron-left');
+            if (window.lucide) {
+                window.lucide.createIcons({ root: toggleBtn });
+            }
+        };
+
+        // Sync initial icon state
+        const isCollapsed = sidebar.classList.contains('collapsed');
+        updateIcon(isCollapsed);
+
+        toggleBtn.addEventListener('click', () => {
+            const willCollapse = !sidebar.classList.contains('collapsed');
+            sidebar.classList.toggle('collapsed', willCollapse);
+            localStorage.setItem('sidebar-collapsed', willCollapse ? 'true' : 'false');
+            updateIcon(willCollapse);
+        });
+    });
+</script>
+