teste login
Deploy / Deploy (push) Successful in 1m54s Details

This commit is contained in:
JotaChina 2025-12-09 18:16:53 -03:00
parent 036aaef3b0
commit 95ef732d31
3 changed files with 68 additions and 60 deletions

View File

@ -22,7 +22,7 @@ permalink: /envie_seu_projeto/
Enviar Projeto Enviar Projeto
</h1> </h1>
<p class="subtitle is-6 has-text-grey"> <p class="subtitle is-6 has-text-grey">
Contribua com a comunidade! Envie seus arquivos <code>.mmp</code> ou <code>.mmpz</code> para que outros possam estudar e remixar. Contribua com a comunidade! Envie seus arquivos <code>.mmp</code> ou <code>.mmpz</code>.
</p> </p>
<div style="width: 60px; height: 4px; background-color: #3273dc; margin: 1rem auto; border-radius: 2px;"></div> <div style="width: 60px; height: 4px; background-color: #3273dc; margin: 1rem auto; border-radius: 2px;"></div>
</div> </div>
@ -31,7 +31,24 @@ permalink: /envie_seu_projeto/
<div class="columns is-centered"> <div class="columns is-centered">
<div class="column is-8"> <div class="column is-8">
<div class="box p-5" style="background-color: #f0f8ff; border: 1px solid #cfe8fc; border-radius: 12px;"> <div id="auth-loading" class="box has-text-centered p-6">
<span class="icon is-large has-text-info mb-3"><i class="fa-solid fa-circle-notch fa-spin fa-3x"></i></span>
<p class="subtitle is-5">Verificando permissões...</p>
</div>
<div id="login-warning" class="box has-text-centered p-6 is-hidden" style="background-color: #fffdf5; border: 1px solid #ffe08a;">
<span class="icon is-large has-text-warning mb-3"><i class="fa-solid fa-lock fa-3x"></i></span>
<h3 class="title is-4 has-text-grey-dark">Login Necessário</h3>
<p class="mb-5">Você precisa estar logado para enviar projetos e samples para a comunidade.</p>
<div class="buttons is-centered">
<a href="/login/" class="button is-info is-medium">
<span class="icon"><i class="fa-solid fa-right-to-bracket"></i></span>
<span>Fazer Login / Cadastrar</span>
</a>
</div>
</div>
<div id="upload-content" class="box p-5 is-hidden" style="background-color: #f0f8ff; border: 1px solid #cfe8fc; border-radius: 12px;">
<form id="upload-project-form"> <form id="upload-project-form">
<div class="field mb-5"> <div class="field mb-5">
@ -137,7 +154,6 @@ permalink: /envie_seu_projeto/
</form> </form>
</div> </div>
</div> </div>
</div> </div>
@ -212,7 +228,6 @@ permalink: /envie_seu_projeto/
</div> </div>
<style> <style>
/* Estilo do Dropzone */
.file-upload-wrapper { .file-upload-wrapper {
position: relative; position: relative;
width: 100%; width: 100%;
@ -240,10 +255,8 @@ permalink: /envie_seu_projeto/
cursor: pointer; cursor: pointer;
} }
.drag-text { .drag-text {
pointer-events: none; /* Deixa o clique passar para o input */ pointer-events: none;
} }
/* Inputs customizados */
.input:focus, .textarea:focus { .input:focus, .textarea:focus {
border-color: #3273dc; border-color: #3273dc;
box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25);
@ -251,25 +264,47 @@ permalink: /envie_seu_projeto/
</style> </style>
<script> <script>
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', async () => {
// --- ELEMENTOS GERAIS --- // --- VERIFICAÇÃO DE LOGIN (NOVO) ---
const loadingDiv = document.getElementById('auth-loading');
const warningDiv = document.getElementById('login-warning');
const contentDiv = document.getElementById('upload-content');
try {
// Usa caminho relativo graças ao Apache Proxy
const authRes = await fetch('/api/check_auth');
const authData = await authRes.json();
loadingDiv.classList.add('is-hidden');
if (authData.logged_in) {
// Se logado: Mostra o formulário
contentDiv.classList.remove('is-hidden');
} else {
// Se não logado: Mostra aviso
warningDiv.classList.remove('is-hidden');
}
} catch (e) {
console.error("Erro ao verificar auth:", e);
loadingDiv.innerHTML = "<p class='has-text-danger'>Erro ao conectar com servidor.</p>";
}
// ------------------------------------
const dropZone = document.getElementById('drop-zone'); const dropZone = document.getElementById('drop-zone');
const fileInput = document.getElementById('project_file'); const fileInput = document.getElementById('project_file');
const fileNameDisplay = document.getElementById('file-name-display'); const fileNameDisplay = document.getElementById('file-name-display');
const dragTextTitle = dropZone.querySelector('.title'); const dragTextTitle = dropZone.querySelector('.title');
// --- MODAIS ---
const successModal = document.getElementById('success-modal'); const successModal = document.getElementById('success-modal');
const resolveModal = document.getElementById('resolve-modal'); const resolveModal = document.getElementById('resolve-modal');
const closeBtns = document.querySelectorAll('.delete, #close-success-modal, .modal-background'); const closeBtns = document.querySelectorAll('.delete, #close-success-modal, .modal-background');
// --- FORMULÁRIOS ---
const mainForm = document.getElementById('upload-project-form'); const mainForm = document.getElementById('upload-project-form');
const resolveForm = document.getElementById('resolve-form'); const resolveForm = document.getElementById('resolve-form');
const submitBtn = document.getElementById('submit-btn'); const submitBtn = document.getElementById('submit-btn');
const resolveBtn = document.getElementById('resolve-btn'); const resolveBtn = document.getElementById('resolve-btn');
// 1. VISUAL DO DROPZONE // Visual do Dropzone
['dragenter', 'dragover'].forEach(evt => dropZone.addEventListener(evt, (e) => { ['dragenter', 'dragover'].forEach(evt => dropZone.addEventListener(evt, (e) => {
e.preventDefault(); dropZone.classList.add('dragover'); e.preventDefault(); dropZone.classList.add('dragover');
})); }));
@ -287,7 +322,6 @@ document.addEventListener('DOMContentLoaded', () => {
} }
}); });
// 2. INPUT DE ÁUDIO & RESOLVE (Nomes de arquivo)
document.querySelectorAll('.file-input').forEach(input => { document.querySelectorAll('.file-input').forEach(input => {
input.addEventListener('change', () => { input.addEventListener('change', () => {
if (input.files.length > 0) { if (input.files.length > 0) {
@ -301,7 +335,6 @@ document.addEventListener('DOMContentLoaded', () => {
}); });
}); });
// 3. FUNÇÃO DE FECHAR MODAIS
closeBtns.forEach(btn => { closeBtns.forEach(btn => {
btn.addEventListener('click', () => { btn.addEventListener('click', () => {
successModal.classList.remove('is-active'); successModal.classList.remove('is-active');
@ -310,9 +343,7 @@ document.addEventListener('DOMContentLoaded', () => {
}); });
}); });
// ============================================================ // SUBMISSÃO PRINCIPAL
// 4. SUBMISSÃO PRINCIPAL (PROJETO)
// ============================================================
mainForm.addEventListener('submit', async (e) => { mainForm.addEventListener('submit', async (e) => {
e.preventDefault(); e.preventDefault();
submitBtn.classList.add('is-loading'); submitBtn.classList.add('is-loading');
@ -320,30 +351,23 @@ document.addEventListener('DOMContentLoaded', () => {
const formData = new FormData(mainForm); const formData = new FormData(mainForm);
try { try {
// Rota principal de upload // FIX: Usando caminho relativo (/api/upload) em vez da porta 33002
const response = await fetch('https://alice.ufsj.edu.br:33002/api/upload', { const response = await fetch('/api/upload', {
method: 'POST', method: 'POST',
body: formData body: formData
}); });
// Parseamos o JSON independente do status para ler mensagens
const result = await response.json(); const result = await response.json();
submitBtn.classList.remove('is-loading'); submitBtn.classList.remove('is-loading');
if (response.status === 200) { if (response.status === 200) {
// SUCESSO TOTAL (Status 200)
mostrarSucesso(); mostrarSucesso();
mainForm.reset(); mainForm.reset();
resetDropzone(); resetDropzone();
} else if (response.status === 202) { } else if (response.status === 202) {
// SUCESSO PARCIAL (Status 202 - Faltam Samples)
mostrarResolveModal(result); mostrarResolveModal(result);
} else { } else {
// ERRO (400, 500) alert('Erro: ' + (result.error || result.message || 'Ocorreu um erro desconhecido.'));
alert('Erro: ' + (result.error || 'Ocorreu um erro desconhecido.'));
} }
} catch (error) { } catch (error) {
@ -353,9 +377,7 @@ document.addEventListener('DOMContentLoaded', () => {
} }
}); });
// ============================================================ // SUBMISSÃO RESOLVE
// 5. SUBMISSÃO DE RESOLUÇÃO (SAMPLES FALTANDO)
// ============================================================
resolveForm.addEventListener('submit', async (e) => { resolveForm.addEventListener('submit', async (e) => {
e.preventDefault(); e.preventDefault();
resolveBtn.classList.add('is-loading'); resolveBtn.classList.add('is-loading');
@ -363,8 +385,8 @@ document.addEventListener('DOMContentLoaded', () => {
const formData = new FormData(resolveForm); const formData = new FormData(resolveForm);
try { try {
// Rota de resolução (envio dos samples faltantes) // FIX: Usando caminho relativo
const response = await fetch('https://alice.ufsj.edu.br:33002/api/upload/resolve', { const response = await fetch('/api/upload/resolve', {
method: 'POST', method: 'POST',
body: formData body: formData
}); });
@ -373,7 +395,6 @@ document.addEventListener('DOMContentLoaded', () => {
resolveBtn.classList.remove('is-loading'); resolveBtn.classList.remove('is-loading');
if (response.ok) { if (response.ok) {
// Agora sim, tudo certo!
resolveModal.classList.remove('is-active'); resolveModal.classList.remove('is-active');
mostrarSucesso(); mostrarSucesso();
mainForm.reset(); mainForm.reset();
@ -389,84 +410,67 @@ document.addEventListener('DOMContentLoaded', () => {
} }
}); });
// --- FUNÇÕES AUXILIARES ---
function mostrarSucesso() { function mostrarSucesso() {
successModal.classList.add('is-active'); successModal.classList.add('is-active');
document.documentElement.classList.add('is-clipped'); document.documentElement.classList.add('is-clipped');
} }
// --- FUNÇÃO PARA GERAR A TABELA DE UPLOAD ---
function mostrarResolveModal(data) { function mostrarResolveModal(data) {
// 1. Configurações iniciais
document.getElementById('hidden-project-name').value = data.project_file; document.getElementById('hidden-project-name').value = data.project_file;
const tbody = document.getElementById('missing-files-table-body'); const tbody = document.getElementById('missing-files-table-body');
tbody.innerHTML = ''; // Limpa tabela tbody.innerHTML = '';
const resolveBtn = document.getElementById('resolve-btn'); const resolveBtn = document.getElementById('resolve-btn');
resolveBtn.disabled = true; // Começa desabilitado até preencher tudo resolveBtn.disabled = true;
// Controle de validação
let totalFiles = data.missing_files.length; let totalFiles = data.missing_files.length;
let filledFiles = 0; let filledFiles = 0;
// 2. Gera uma linha para cada arquivo faltante
data.missing_files.forEach((originalName, index) => { data.missing_files.forEach((originalName, index) => {
const tr = document.createElement('tr'); const tr = document.createElement('tr');
// Coluna 1: Nome do arquivo
const tdName = document.createElement('td'); const tdName = document.createElement('td');
tdName.style.verticalAlign = "middle"; tdName.style.verticalAlign = "middle";
tdName.innerHTML = `<span class="has-text-grey-dark is-family-code">${originalName}</span>`; tdName.innerHTML = `<span class="has-text-grey-dark is-family-code">${originalName}</span>`;
// Coluna 2: Ícone de Status
const tdStatus = document.createElement('td'); const tdStatus = document.createElement('td');
tdStatus.style.verticalAlign = "middle"; tdStatus.style.verticalAlign = "middle";
tdStatus.style.textAlign = "center"; tdStatus.style.textAlign = "center";
tdStatus.innerHTML = `<span class="icon has-text-grey-light status-icon"><i class="fa-solid fa-circle-xmark"></i></span>`; tdStatus.innerHTML = `<span class="icon has-text-grey-light status-icon"><i class="fa-solid fa-circle-xmark"></i></span>`;
// Coluna 3: Botão de Upload
const tdAction = document.createElement('td'); const tdAction = document.createElement('td');
tdAction.style.textAlign = "right"; tdAction.style.textAlign = "right";
// Cria o input file invisível
// O 'name' do input é o NOME ORIGINAL DO ARQUIVO. O Backend usará isso para mapear.
const fileInput = document.createElement('input'); const fileInput = document.createElement('input');
fileInput.type = 'file'; fileInput.type = 'file';
fileInput.name = originalName; // <--- O PULO DO GATO fileInput.name = originalName;
fileInput.style.display = 'none'; fileInput.style.display = 'none';
fileInput.accept = ".wav, .mp3, .ogg, .flac, .ds"; fileInput.accept = ".wav, .mp3, .ogg, .flac, .ds";
// Botão bonito que aciona o input
const uploadLabel = document.createElement('label'); const uploadLabel = document.createElement('label');
uploadLabel.className = 'button is-small is-info is-outlined'; uploadLabel.className = 'button is-small is-info is-outlined';
uploadLabel.innerHTML = `<span class="icon"><i class="fa-solid fa-upload"></i></span>`; uploadLabel.innerHTML = `<span class="icon"><i class="fa-solid fa-upload"></i></span>`;
// Evento: Ao clicar no botão, abre o seletor de arquivo
uploadLabel.addEventListener('click', (e) => { uploadLabel.addEventListener('click', (e) => {
e.preventDefault(); // Evita submit e.preventDefault();
fileInput.click(); fileInput.click();
}); });
// Evento: Quando o usuário seleciona um arquivo
fileInput.addEventListener('change', () => { fileInput.addEventListener('change', () => {
if (fileInput.files.length > 0) { if (fileInput.files.length > 0) {
// Muda visual para sucesso
uploadLabel.className = 'button is-small is-success'; uploadLabel.className = 'button is-small is-success';
uploadLabel.innerHTML = `<span class="icon"><i class="fa-solid fa-rotate"></i></span>`; // Ícone de trocar uploadLabel.innerHTML = `<span class="icon"><i class="fa-solid fa-rotate"></i></span>`;
const icon = tdStatus.querySelector('.status-icon'); const icon = tdStatus.querySelector('.status-icon');
icon.innerHTML = `<i class="fa-solid fa-circle-check"></i>`; icon.innerHTML = `<i class="fa-solid fa-circle-check"></i>`;
icon.classList.remove('has-text-grey-light'); icon.classList.remove('has-text-grey-light');
icon.classList.add('has-text-success'); icon.classList.add('has-text-success');
// Lógica de validação (simples)
if (!fileInput.dataset.filled) { if (!fileInput.dataset.filled) {
fileInput.dataset.filled = "true"; fileInput.dataset.filled = "true";
filledFiles++; filledFiles++;
} }
// Se todos foram preenchidos, habilita o botão final
if (filledFiles >= totalFiles) { if (filledFiles >= totalFiles) {
resolveBtn.disabled = false; resolveBtn.disabled = false;
resolveBtn.classList.remove('is-outlined'); resolveBtn.classList.remove('is-outlined');
@ -483,7 +487,6 @@ document.addEventListener('DOMContentLoaded', () => {
tbody.appendChild(tr); tbody.appendChild(tr);
}); });
// 3. Exibe o modal
document.getElementById('resolve-modal').classList.add('is-active'); document.getElementById('resolve-modal').classList.add('is-active');
document.documentElement.classList.add('is-clipped'); document.documentElement.classList.add('is-clipped');
} }

View File

@ -413,6 +413,11 @@ def upload_sample_standalone():
return jsonify({'error': 'Erro no arquivo'}), 400 return jsonify({'error': 'Erro no arquivo'}), 400
if __name__ == "__main__": if __name__ == "__main__":
context = (CERT_PATH, KEY_PATH) if os.path.exists(CERT_PATH) else "adhoc" # Se estiver rodando atrás do Apache, NÃO use ssl_context.
# Escuta em 0.0.0.0 # O Apache já cuida do SSL (https://alice.ufsj.edu.br).
app.run(host="0.0.0.0", port=33002, ssl_context=context, debug=True) # O Flask deve rodar em HTTP puro localmente.
print("Iniciando servidor na porta 33002 (HTTP Mode)...")
app.run(host="0.0.0.0", port=33002, debug=True)
# Removi o ssl_context=context para facilitar o proxy reverso

BIN
users.db

Binary file not shown.