AliceClass/_layouts/aulas.html

80 lines
2.3 KiB
HTML
Executable File

---
layout: default
lang: pt
---
<main>
<div class="page-aula">
<div class="detals-aula">
<div class="info-aula">
<h1 class="title">{{ page.title }}</h1>
<h2 class="aula-name">{{ page.software }} - {{ page.level }}</h2>
<h3 class="aula-name">{{ page.author }}</h3>
<h3 class="aula-name">{{ page.date | date: "%d/%m/%Y" }}</h3>
</div>
<div class="download">
{% assign aula_name = page.name | replace: '.md', '' %}
{% assign zip_file = 'aulas/' | append: aula_name | append: '.zip' %}
<a class="button" href="{{ site.baseurl }}{{ zip_file }}" download>
Download
</a>
<a class="button" id="etherpad" etherpad>
Etherpad
</a>
</div>
</div>
</div>
<div id="aula">
{% assign aula_slug = page.title %}
{% assign video_aula = '' | append: aula_slug | append: '.mp4' %}
<video controls class="aula-video">
<source src="{{ site.baseurl }}/videos/{{ page.user }}/dest/{{ video_aula }}" type="video/mp4">
Seu navegador não suporta o elemento de vídeo.
</video>
</div>
<div id="etherpad-container" style="display: none;">
<iframe
id="etherpad-iframe"
src="https://pad.alice.ufsj.edu.br/p/{{ page.title }}"
width="100%"
height="900px"
frameborder="0">
</iframe>
</div>
<div class="content-aula">
{{ page.description }}
</br>
</br>
<h2>Links relacionados:</h2>
{% for link in page.links %}
<li><a href="{{ link }}">{{ link }}</a></li>
{% endfor %}
</div>
</main>
<!-- -->
<script>
document.addEventListener("DOMContentLoaded", function () {
const etherpadButton = document.getElementById("etherpad"); // Botão
const aulaDiv = document.getElementById("aula"); // Div da aula
const etherpadContainer = document.getElementById("etherpad-container"); // Div do Etherpad
etherpadButton.addEventListener("click", function () {
if (aulaDiv.style.display === "none") {
// Se a aula estiver oculta, exibe a aula e oculta o Etherpad
aulaDiv.style.display = "block";
etherpadContainer.style.display = "none";
} else {
// Caso contrário, oculta a aula e exibe o Etherpad
aulaDiv.style.display = "none";
etherpadContainer.style.display = "block";
}
});
});
</script>