106 lines
3.5 KiB
PHP
106 lines
3.5 KiB
PHP
---
|
|
layout: dashboard
|
|
lang: pt
|
|
---
|
|
|
|
<div class="envArquivo">
|
|
<h1> Enviar Aula</h1>
|
|
|
|
<form action="/php/upload.php" method="post" enctype="multipart/form-data">
|
|
|
|
<div class="field-row">
|
|
<!-- Nome da Aula -->
|
|
<div class="field">
|
|
<label class="label" for="class_name">Nome da Aula</label>
|
|
<div class="control">
|
|
<input class="input" type="text" id="videoTitle" name="videoTitle" required>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Nível -->
|
|
<div class="field">
|
|
<label class="label" for="level">Nível</label>
|
|
<div class="control">
|
|
<div class="select">
|
|
<select id="level" name="level" required>
|
|
<option value="basico">Básico</option>
|
|
<option value="intermediario">Intermediário</option>
|
|
<option value="avancado">Avançado</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Descrição -->
|
|
<div class="field">
|
|
<label class="label" for="description">Descrição</label>
|
|
<div class="control">
|
|
<textarea class="textarea" id="videoDescription" name="videoDescription" rows="4" required></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Software Usado -->
|
|
<div class="field">
|
|
<label class="label" for="software">Software Usado</label>
|
|
<div class="control">
|
|
<input class="input" type="text" id="software" name="software" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<input type="file" name="fileToUpload" id="fileToUpload">
|
|
</div>
|
|
|
|
<!-- Barra de Progresso -->
|
|
<div class="field">
|
|
<progress id="progressBar" max="100" value="0" style="width: 100%; display: none;"></progress>
|
|
</div>
|
|
|
|
<!-- Botão de Enviar -->
|
|
<div class="field">
|
|
<div class="control">
|
|
<button class="button is-primary" name="submit" type="submit">Enviar</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById("submitButton").addEventListener("click", function () {
|
|
const form = document.getElementById("uploadForm");
|
|
const progressBar = document.getElementById("progressBar");
|
|
const fileInput = document.getElementById("fileToUpload");
|
|
|
|
// Mostra a barra de progresso
|
|
progressBar.style.display = "block";
|
|
|
|
// Cria o objeto FormData e adiciona os dados do formulário
|
|
const formData = new FormData(form);
|
|
|
|
// Configura o XMLHttpRequest
|
|
const xhr = new XMLHttpRequest();
|
|
xhr.open("POST", "/php/upload.php", true);
|
|
|
|
// Atualiza a barra de progresso com base no progresso do upload
|
|
xhr.upload.onprogress = function (event) {
|
|
if (event.lengthComputable) {
|
|
const percentComplete = (event.loaded / event.total) * 100;
|
|
progressBar.value = percentComplete;
|
|
}
|
|
};
|
|
|
|
// Finaliza a barra de progresso ao término do upload
|
|
xhr.onload = function () {
|
|
if (xhr.status === 200) {
|
|
alert("Upload concluído com sucesso!");
|
|
} else {
|
|
alert("Erro ao enviar o arquivo!");
|
|
}
|
|
progressBar.style.display = "none"; // Oculta a barra após o envio
|
|
};
|
|
|
|
// Envia os dados
|
|
xhr.send(formData);
|
|
});
|
|
</script> |