JotaChina/mmpSearch
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

resolvendo dependencias dos projetos

Browse Source
This commit is contained in:
JotaChina committed 2025-12-08 17:23:09 -03:00
1 parent ba29296201
commit 71fcba3387
7 files changed
+365367 -348937
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

pages/enviaProjeto.md
+177 -70
View File
@@ -11,12 +11,10 @@ permalink: /envie_seu_projeto/
<div class="container">
<br />
<!-- 1. MENU DE ABAS (Padrão) -->
<div class="tabs is-centered is-boxed is-medium mb-6">
{% include sidebar.html %}
</div>
<!-- 2. CABEÇALHO -->
<div class="columns is-centered">
<div class="column is-8 has-text-centered">
<h1 class="title is-3 has-text-grey-dark mb-3">
@@ -30,14 +28,12 @@ permalink: /envie_seu_projeto/
</div>
</div>
<!-- 3. FORMULÁRIO DE UPLOAD -->
<div class="columns is-centered">
<div class="column is-8">
<div class="box p-5" style="background-color: #f0f8ff; border: 1px solid #cfe8fc; border-radius: 12px;">
<form id="upload-project-form">
<!-- ÁREA DE ARQUIVO (DROPZONE) -->
<div class="field mb-5">
<label class="label has-text-grey-dark">Arquivo do Projeto (LMMS)</label>
<div class="file-upload-wrapper" id="drop-zone">
@@ -51,7 +47,6 @@ permalink: /envie_seu_projeto/
</div>
</div>
<!-- INFORMAÇÕES BÁSICAS -->
<div class="columns">
<div class="column is-6">
<div class="field">
@@ -110,7 +105,6 @@ permalink: /envie_seu_projeto/
</div>
</div>
<!-- PREVIEW DE ÁUDIO (OPCIONAL) -->
<div class="field mb-5">
<label class="label has-text-grey-dark">Preview de Áudio (Opcional)</label>
<div class="file has-name is-fullwidth">
@@ -132,7 +126,6 @@ permalink: /envie_seu_projeto/
<p class="help">Envie um .mp3 ou .wav para que as pessoas possam ouvir antes de baixar.</p>
</div>
<!-- BOTÃO DE ENVIO -->
<div class="field mt-5">
<div class="control">
<button type="submit" class="button is-info is-fullwidth is-medium shadow-sm" id="submit-btn">
@@ -153,7 +146,6 @@ permalink: /envie_seu_projeto/
</div>
</main>
<!-- MODAL DE SUCESSO -->
<div id="success-modal" class="modal">
<div class="modal-background"></div>
<div class="modal-card">
@@ -175,6 +167,50 @@ permalink: /envie_seu_projeto/
</div>
</div>
<div id="resolve-modal" class="modal">
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head has-background-warning-light">
<p class="modal-card-title has-text-warning-dark">Atenção: Arquivos Faltando</p>
<button class="delete" aria-label="close"></button>
</header>
<section class="modal-card-body p-5">
<div class="notification is-warning is-light">
<span class="icon"><i class="fa-solid fa-triangle-exclamation"></i></span>
<strong>Seu projeto usa samples externos!</strong>
<p class="mt-2">Para que o projeto funcione para todos, precisamos dos seguintes arquivos:</p>
</div>
<div class="box">
<ul id="missing-files-list" style="list-style: disc; margin-left: 20px; color: #d63031;">
</ul>
</div>
<form id="resolve-form">
<input type="hidden" name="project_file" id="hidden-project-name">
<div class="field">
<label class="label">Envie os arquivos listados acima:</label>
<div class="file has-name is-fullwidth is-warning">
<label class="file-label">
<input class="file-input" type="file" name="sample_files" multiple required>
<span class="file-cta">
<span class="file-icon"><i class="fa-solid fa-upload"></i></span>
<span class="file-label">Selecionar Samples...</span>
</span>
<span class="file-name" id="resolve-file-name">Nenhum selecionado</span>
</label>
</div>
</div>
<button type="submit" class="button is-warning is-fullwidth mt-4" id="resolve-btn">
Enviar Arquivos e Finalizar
</button>
</form>
</section>
</div>
</div>
<style>
/* Estilo do Dropzone */
.file-upload-wrapper {
@@ -216,105 +252,176 @@ permalink: /envie_seu_projeto/
<script>
document.addEventListener('DOMContentLoaded', () => {
// 1. Lógica do Dropzone (Visual)
// --- ELEMENTOS GERAIS ---
const dropZone = document.getElementById('drop-zone');
const fileInput = document.getElementById('project_file');
const fileNameDisplay = document.getElementById('file-name-display');
const dragTextTitle = dropZone.querySelector('.title');
// --- MODAIS ---
const successModal = document.getElementById('success-modal');
const resolveModal = document.getElementById('resolve-modal');
const closeBtns = document.querySelectorAll('.delete, #close-success-modal, .modal-background');
// Efeito visual ao arrastar
['dragenter', 'dragover'].forEach(eventName => {
dropZone.addEventListener(eventName, (e) => {
e.preventDefault();
dropZone.classList.add('dragover');
});
});
['dragleave', 'drop'].forEach(eventName => {
dropZone.addEventListener(eventName, (e) => {
dropZone.classList.remove('dragover');
});
});
// --- FORMULÁRIOS ---
const mainForm = document.getElementById('upload-project-form');
const resolveForm = document.getElementById('resolve-form');
const submitBtn = document.getElementById('submit-btn');
const resolveBtn = document.getElementById('resolve-btn');
// 1. VISUAL DO DROPZONE
['dragenter', 'dragover'].forEach(evt => dropZone.addEventListener(evt, (e) => {
e.preventDefault(); dropZone.classList.add('dragover');
}));
['dragleave', 'drop'].forEach(evt => dropZone.addEventListener(evt, (e) => {
dropZone.classList.remove('dragover');
}));
// Mostrar nome do arquivo selecionado
fileInput.addEventListener('change', () => {
if (fileInput.files.length > 0) {
const name = fileInput.files[0].name;
fileNameDisplay.textContent = name;
fileNameDisplay.textContent = fileInput.files[0].name;
fileNameDisplay.classList.remove('is-hidden');
dragTextTitle.textContent = "Arquivo Selecionado!";
dragTextTitle.textContent = "Arquivo Pronto!";
dropZone.style.borderColor = "#4caf50";
dropZone.style.backgroundColor = "#f0fff4";
}
});
// 2. Lógica do Input de Áudio (padrão Bulma)
const audioInput = document.querySelector('.file-input');
const audioName = document.querySelector('.file-name');
if(audioInput) {
audioInput.addEventListener('change', () => {
if (audioInput.files.length > 0) {
audioName.textContent = audioInput.files[0].name;
// 2. INPUT DE ÁUDIO & RESOLVE (Nomes de arquivo)
document.querySelectorAll('.file-input').forEach(input => {
input.addEventListener('change', () => {
if (input.files.length > 0) {
const nameContainer = input.parentElement.querySelector('.file-name');
if (nameContainer) {
nameContainer.textContent = input.files.length > 1
? `${input.files.length} arquivos selecionados`
: input.files[0].name;
}
}
});
}
});
// 3. Simulação de Envio (Modal)
const form = document.getElementById('upload-project-form');
const modal = document.getElementById('success-modal');
const submitBtn = document.getElementById('submit-btn');
const closeBtns = document.querySelectorAll('.delete, #close-success-modal, .modal-background');
// 3. FUNÇÃO DE FECHAR MODAIS
closeBtns.forEach(btn => {
btn.addEventListener('click', () => {
successModal.classList.remove('is-active');
resolveModal.classList.remove('is-active');
document.documentElement.classList.remove('is-clipped');
});
});
form.addEventListener('submit', async (e) => {
// ============================================================
// 4. SUBMISSÃO PRINCIPAL (PROJETO)
// ============================================================
mainForm.addEventListener('submit', async (e) => {
e.preventDefault();
submitBtn.classList.add('is-loading');
const formData = new FormData(form);
const formData = new FormData(mainForm);
try {
// APONTA PARA O SEU SERVIDOR PYTHON
// Se estiver rodando localmente, geralmente é localhost:5000
// Se for no servidor de produção, coloque o IP ou domínio correto
// Rota principal de upload
const response = await fetch('https://alice.ufsj.edu.br:33002/api/upload', {
method: 'POST',
body: formData
});
// Parseamos o JSON independente do status para ler mensagens
const result = await response.json();
if (response.ok) {
// Sucesso!
submitBtn.classList.remove('is-loading');
// Atualiza a mensagem do modal se quiser
const modalTitle = modal.querySelector('.title');
modalTitle.textContent = "Projeto Processado!";
modal.classList.add('is-active');
document.documentElement.classList.add('is-clipped');
form.reset();
document.getElementById('file-name-display').classList.add('is-hidden');
document.querySelector('.drag-text .title').textContent = "Arraste e solte o arquivo aqui";
document.getElementById('drop-zone').style.borderColor = "#3273dc";
document.getElementById('drop-zone').style.backgroundColor = "#fff";
submitBtn.classList.remove('is-loading');
if (response.status === 200) {
// SUCESSO TOTAL (Status 200)
mostrarSucesso();
mainForm.reset();
resetDropzone();
} else if (response.status === 202) {
// SUCESSO PARCIAL (Status 202 - Faltam Samples)
mostrarResolveModal(result);
} else {
alert('Erro: ' + (result.error || 'Falha desconhecida'));
submitBtn.classList.remove('is-loading');
// ERRO (400, 500)
alert('Erro: ' + (result.error || 'Ocorreu um erro desconhecido.'));
}
} catch (error) {
console.error('Erro:', error);
alert('Erro de conexão com o servidor de processamento.');
alert('Erro de conexão com o servidor.');
submitBtn.classList.remove('is-loading');
}
});
// Fechar Modal
closeBtns.forEach(btn => {
btn.addEventListener('click', () => {
modal.classList.remove('is-active');
document.documentElement.classList.remove('is-clipped');
});
// ============================================================
// 5. SUBMISSÃO DE RESOLUÇÃO (SAMPLES FALTANDO)
// ============================================================
resolveForm.addEventListener('submit', async (e) => {
e.preventDefault();
resolveBtn.classList.add('is-loading');
const formData = new FormData(resolveForm);
try {
// Rota de resolução (envio dos samples faltantes)
const response = await fetch('https://alice.ufsj.edu.br:33002/api/upload/resolve', {
method: 'POST',
body: formData
});
const result = await response.json();
resolveBtn.classList.remove('is-loading');
if (response.ok) {
// Agora sim, tudo certo!
resolveModal.classList.remove('is-active');
mostrarSucesso();
mainForm.reset();
resetDropzone();
} else {
alert('Erro ao enviar samples: ' + (result.error || 'Erro desconhecido'));
}
} catch (error) {
console.error(error);
alert('Erro ao enviar samples.');
resolveBtn.classList.remove('is-loading');
}
});
// --- FUNÇÕES AUXILIARES ---
function mostrarSucesso() {
successModal.classList.add('is-active');
document.documentElement.classList.add('is-clipped');
}
function mostrarResolveModal(data) {
// 1. Preenche o input hidden com o nome do projeto (retornado pelo backend)
document.getElementById('hidden-project-name').value = data.project_file;
// 2. Preenche a lista visual de arquivos faltando
const list = document.getElementById('missing-files-list');
list.innerHTML = ''; // Limpa lista anterior
if (data.missing_files && data.missing_files.length > 0) {
data.missing_files.forEach(file => {
const li = document.createElement('li');
li.textContent = file;
list.appendChild(li);
});
}
// 3. Abre o modal
resolveModal.classList.add('is-active');
document.documentElement.classList.add('is-clipped');
}
function resetDropzone() {
fileNameDisplay.classList.add('is-hidden');
dragTextTitle.textContent = "Arraste e solte o arquivo aqui";
dropZone.style.borderColor = "#3273dc";
dropZone.style.backgroundColor = "#fff";
}
});
</script>
</script>