Skip to content

Commit

Permalink
Create index_backup.html
Browse files Browse the repository at this point in the history
  • Loading branch information
samiwinho committed Nov 30, 2023
1 parent b5ffd0a commit a545153
Showing 1 changed file with 202 additions and 0 deletions.
202 changes: 202 additions & 0 deletions index_backup.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,202 @@
<!DOCTYPE html>
<html>
<head>
<title>Programa Mensal</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" />
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
</head>
<style>

* {
-webkit-font-smoothing: antialiased!important;
font-smoothing: antialiased!important;
font-family: 'Roboto', sans-serif;
margin: 0;
padding: 0;
}

body {
background-color: #5b3c88;
color: white;
height: 100vh;
width: 100vw;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

h1 {
text-align: center;
padding: 0px;
font-size: 3rem;
}

h2 {
text-align: center;
padding-bottom: 20px;
font-style: italic;
padding-top: 30px;
margin-bottom: 5vh;
font-weight: lighter;
font-size: 1.5rem;
}

h3 {
padding: 5px;
color: black;
font-size: 16px;
}

.flex1 {
display: flex;
justify-content: center;
align-items: center;
}

i {
color: #5b3c88;
font-size: 16px;
}

span {
color: white;
font-size: 16px;
background-color: #626262;
padding: 5px;
border-radius: 5px;
text-align: center;
margin: 1rem;
}

.caixa {
background: white;
display: flex;
flex-direction: column;
justify-content: start;
align-items: start;
padding: 16px 32px;
border-radius: 16px;
-webkit-box-shadow:0px 0px 100px 20px rgba(35,39,46,0.5);
-moz-box-shadow: 0px 0px 100px 20px rgba(35,39,46,0.5);
box-shadow: 0px 0px 100px 20px rgba(35,39,46,0.5);
margin: 2rem;
}

</style>

<body>

<h1>Programação da Semana</h1>
<h2 id="datahoje"></h2>

<div class="caixa">
<div class="flex1">
<span class="material-symbols-outlined">desktop_windows</span>
<h3>Vídeo:</h3>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
</div>

<div class="flex1">
<span class="material-symbols-outlined">instant_mix</span>
<h3>Som:</h3>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
</div>

<div class="flex1">
<span class="material-symbols-outlined" style="font-weight: regular;">podium</span>
<h3>Palco:</h3>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
</div>

<div class="flex1">
<span class="material-symbols-outlined">mic_double</span>
<h3>Micros:</h3>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
<div style="font-weight: lighter; border-left: #c3c3c3 1px solid; width: 1px; height: 50%; margin-left: 5px; margin-right: 5px;"></div>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
</div>

<div class="flex1" style="border-top: #c3c3c3 1px solid; width: 100%; justify-content: start!important;">
<span class="material-symbols-outlined" style="background-color: #c48430;">videocam</span>
<h3>Transmissão Broadcasting:</h3>
<h3 class="semanaInfo" style="font-weight: lighter;"></h3>
</div>


</div>

<script>

Date.prototype.getWeekNumber = function () {
var d = new Date(Date.UTC(this.getFullYear(), this.getMonth(), this.getDate()));
var dayNum = d.getUTCDay() || 7;
d.setUTCDate(d.getUTCDate() + 4 - dayNum);
var yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));
return Math.ceil(((d - yearStart) / 86400000 + 1) / 7);
};

var dataAtual = new Date();
var semanaEmVigor = 'semana' + dataAtual.getWeekNumber();



// Determine a semana em vigor (pode ser baseado na data atual)
//var dataAtual = new Date();
//var semanaEmVigor = 'semana' + (Math.ceil(dataAtual.getDate() / 7));

// Formatar a data em português
var dataFormatada = dataAtual.toLocaleDateString('pt-PT', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });

// Exibir a data na página
document.getElementById('datahoje').textContent = dataFormatada;



// Carregue os dados do programa a partir do arquivo JSON
fetch('https://samiwinho.github.io/dados-programacao/dados-programacao.json')
.then(response => response.json())
.then(programaData => {

// Exiba as informações da semana em vigor
if (programaData[semanaEmVigor]) {
var semanaInfoDivs = document.querySelectorAll('.semanaInfo');

for (var i = 0; i < programaData[semanaEmVigor].length; i++) {
semanaInfoDivs[i].textContent = programaData[semanaEmVigor][i];
}

// Verifique se há texto para Transmissão Broadcasting e mostre a div apenas se houver texto
var transmissaoBroadcastingDiv = document.querySelector('.flex1[style="border-top: #c3c3c3 1px solid; width: 100%; justify-content: start!important;"]');
var textoTransmissaoBroadcasting = programaData[semanaEmVigor][programaData[semanaEmVigor].length - 1];
if (textoTransmissaoBroadcasting) {
transmissaoBroadcastingDiv.style.display = 'flex';
} else {
transmissaoBroadcastingDiv.style.display = 'none';
}
} else {
document.querySelectorAll('.semanaInfo').textContent = "Sem informações para esta semana.";
}
})
.catch(error => {
console.error("Erro ao carregar os dados do programa: " + error);
});

</script>

</body>
</html>

0 comments on commit a545153

Please sign in to comment.