teste login

_includes/sidebar.html

@@ -1,41 +1,104 @@
+{% include modal_login.html %}
+
 <ul>
   <li>
-    <a href="{{ '/projetos/' | relative_url }}"
+    <a href="{{ '/projetos/' | relative_url }}">
-      ><span class="icon is-small"><i class="fa-solid fa-folder-open"></i></span
+      <span class="icon is-small"><i class="fa-solid fa-folder-open"></i></span>
-      ><span>Projetos</span></a
+      <span>Projetos</span>
-    >
+    </a>
   </li>
+  
   <li>
-    <a href="{{ '/samples/' | relative_url }}"
+    <a href="{{ '/samples/' | relative_url }}">
-      ><span class="icon is-small"><i class="fa-solid fa-plus-circle"></i></span
+      <span class="icon is-small"><i class="fa-solid fa-music"></i></span>
-      ><span>Samples</span></a
+      <span>Samples</span>
-    >
+    </a>
   </li>
+  
   <li>
-    <a href="{{ '/beats/' | relative_url }}"
+    <a href="{{ '/beats/' | relative_url }}">
-      ><span class="icon is-small"><i class="fa-solid fa-headphones"></i></span
+      <span class="icon is-small"><i class="fa-solid fa-headphones"></i></span>
-      ><span>Beats</span></a
+      <span>Beats</span>
-    >
+    </a>
-  </li>
-  <li class="is-active">
-    <a href="{{ '/buscas/' | relative_url }}"
-      ><span class="icon is-small"
-        ><i class="fa-solid fa-magnifying-glass"></i></span
-      ><span>Buscas</span></a
-    >
   </li>
+  
   <li>
-    <a href="{{ './creation.html' | relative_url }}" class="has-text-primary"
+    <a href="{{ '/buscas/' | relative_url }}">
-      ><span class="icon is-small"><i class="fa-solid fa-plus-circle"></i></span
+      <span class="icon is-small"><i class="fa-solid fa-magnifying-glass"></i></span>
-      ><span>Crie seu projeto</span></a
+      <span>Buscas</span>
-    >
+    </a>
   </li>
+  
   <li>
-    <a
+    <a href="{{ '/creation.html' | relative_url }}" class="has-text-primary">
-      href="{{ '/envie_seu_projeto/' | relative_url }}"
+      <span class="icon is-small"><i class="fa-solid fa-wand-magic-sparkles"></i></span>
-      class="has-text-primary"
+      <span>Crie seu projeto</span>
-      ><span class="icon is-small"><i class="fa-solid fa-plus-circle"></i></span
+    </a>
-      ><span>Envie seu projeto</span></a
-    >
   </li>
+  
+  <li>
+    <a href="{{ '/envie_seu_projeto/' | relative_url }}" class="has-text-primary">
+      <span class="icon is-small"><i class="fa-solid fa-cloud-arrow-up"></i></span>
+      <span>Envie seu projeto</span>
+    </a>
+  </li>
+
+  <li id="sidebar-btn-login">
+    <a href="#" class="has-text-info js-trigger-login">
+      <span class="icon is-small"><i class="fa-solid fa-right-to-bracket"></i></span>
+      <span>Entrar</span>
+    </a>
+  </li>
+
+  <li id="sidebar-btn-logout" class="is-hidden">
+    <a href="#" id="action-sidebar-logout" class="has-text-danger">
+      <span class="icon is-small"><i class="fa-solid fa-right-from-bracket"></i></span>
+      <span>Sair</span>
+    </a>
+  </li>
+
 </ul>
+
+<script>
+document.addEventListener('DOMContentLoaded', async () => {
+    const loginLi = document.getElementById('sidebar-btn-login');
+    const logoutLi = document.getElementById('sidebar-btn-logout');
+    const logoutAction = document.getElementById('action-sidebar-logout');
+
+    try {
+        // Verifica status no servidor
+        const res = await fetch('/api/check_auth');
+        const data = await res.json();
+
+        if (data.logged_in) {
+            // Se logado: Esconde Login, Mostra Logout
+            if(loginLi) loginLi.classList.add('is-hidden');
+            if(logoutLi) logoutLi.classList.remove('is-hidden');
+        } else {
+            // Se visitante: Mostra Login, Esconde Logout
+            if(loginLi) loginLi.classList.remove('is-hidden');
+            if(logoutLi) logoutLi.classList.add('is-hidden');
+        }
+    } catch (e) {
+        console.error("Erro sidebar auth:", e);
+    }
+
+    // Lógica do botão Sair
+    if (logoutAction) {
+        logoutAction.addEventListener('click', async (e) => {
+            e.preventDefault();
+            // Adiciona loading visual (opcional)
+            logoutAction.classList.add('is-loading'); 
+            
+            try {
+                await fetch('/api/logout', { method: 'POST' });
+                // Recarrega a página para resetar o estado visual
+                window.location.reload();
+            } catch (error) {
+                alert("Erro ao sair.");
+                logoutAction.classList.remove('is-loading');
+            }
+        });
+    }
+});
+</script>

pages/beats.md

@@ -6,8 +6,7 @@ permalink: /beats/
 
 <main class="main-content">
   <div class="publication">
-
+  {% include modal_login.html %}
-  teste teste teste
 
     <div class="container">
       <br />

pages/bpm.md

@@ -10,6 +10,7 @@ permalink: /bpm/
   <div class="publication">
     <div class="container">
       <br />
+  {% include modal_login.html %}
 
       <div class="tabs is-centered is-boxed is-medium mb-6">
         {% include sidebar.html %}

pages/buscas.md

@@ -9,6 +9,7 @@ permalink: /buscas/
   <div class="publication">
 
     <div class="container">
+  {% include modal_login.html %}
         <br>
         <div class="tabs is-centered is-boxed is-medium mb-6">
             {% include sidebar.html %}

pages/instruments.md

@@ -10,6 +10,7 @@ permalink: /instruments/
   <div class="publication">
 
     <div class="container">
+  {% include modal_login.html %}
       <br />
 
       <div class="tabs is-centered is-boxed is-medium mb-6">

pages/pattern.md

@@ -10,6 +10,7 @@ permalink: /pattern/
   <div class="publication">
     <div class="container">
       <br />
+  {% include modal_login.html %}
 
       <div class="tabs is-centered is-boxed is-medium mb-6">
         {% include sidebar.html %}

pages/plugin.md

@@ -10,6 +10,7 @@ permalink: /plugin/
   <div class="publication">
     <div class="container">
       <br />
+  {% include modal_login.html %}
 
       <div class="tabs is-centered is-boxed is-medium mb-6">
         {% include sidebar.html %}

pages/projetos.md

@@ -7,6 +7,7 @@ permalink: /projetos/
 <div class="publication">
   <div class="container">
     <br />
+  {% include modal_login.html %}
 
     <div class="tabs is-centered is-boxed is-medium mb-6">
       {% include sidebar.html %}

pages/sample.md

@@ -10,6 +10,7 @@ permalink: /sample/
   <div class="publication">
 
     <div class="container">
+  {% include modal_login.html %}
       <br />
 
       <div class="tabs is-centered is-boxed is-medium mb-6">