Browse Source

Fix indentação da tela de painel

pull/3061/head
Cesar Carvalho 5 years ago
parent
commit
462bcc064e
  1. 475
      sapl/templates/painel/index.html

475
sapl/templates/painel/index.html

@ -124,62 +124,42 @@
{% endblock webpack_loader_chunks_js %}
<script type="text/javascript">
$(document).ready(function() {
// As constantes decisões sobre a existência ou não do horário de verão,
// assim como que data de início e termino do mesmo, fizeram com que fosse necessário
// substituir a chamada a Date() por um esquema mais elaborado, onde se
// recupera o offset do UTC (-3 GMT, no caso de Brasília) e seta-se
// manualmente. Esta informação vem do servidor, desta forma não ficamos
// na dependência da atualização de browser, pois tanto o Date() em JS
// quanto as libs python (django.utils.timezone, datetime, pytz, etc)
// lêem do tzdata, que precisa ser atualizado toda vez que o governo
// brasileiro modifica alguma coisa relacionada ao horário de verão.
// Recuperando essa informação do servidor só teremos que atualizar as
// libs tzdata (Linux) e pytz (Python) uma vez. Além disso, o uso da
// biblioteca moment.js é recomendada, pois ela trata data e hora
// melhor que o Date() do JS.
$("#date").append(moment().format("DD/MM/YY"));
var offset = parseFloat({{ utc_offset }});
//TODO: replace by a fancy jQuery clock
function checkTime(i) {
if (i<10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
function startTime() {
var today = moment.utc().utcOffset(offset).format("HH:mm:ss");
$("#relogio").text(today)
var t = setTimeout(function(){
startTime()
}, 500);
}
startTime();
function show_voto(voto) {
if (voto == "Sim"){
return '<font color="green"> Sim </font>'
}
else if (voto == "Não"){
return '<font color="red"> Não </font>'
}
return voto
}
//TODO: replace by a fancy jQuery clock
function checkTime(i) {
if (i<10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
function startTime(offset) {
var today = moment.utc().utcOffset(offset).format("HH:mm:ss");
$("#relogio").text(today)
var t = setTimeout(function(){
startTime()
}, 500);
}
function show_voto(voto) {
if (voto == "Sim"){
return '<font color="green"> Sim </font>'
}
else if (voto == "Não"){
return '<font color="red"> Não </font>'
}
return voto
}
function playAudioNumVezes(audio, times, ended) {
if (times <= 0) {
return;
return;
}
let played = 0;
audio.addEventListener("ended", function() {
played++;
if (played < times) {
audio.play();
} else if (ended) {
ended();
}
played++;
if (played < times) {
audio.play();
} else if (ended) {
ended();
}
});
audio.play();
}
@ -195,8 +175,26 @@
}
$(document).ready(function() {
//TODO: replace by a fancy jQuery clock
startTime();
// As constantes decisões sobre a existência ou não do horário de verão,
// assim como que data de início e termino do mesmo, fizeram com que fosse necessário
// substituir a chamada a Date() por um esquema mais elaborado, onde se
// recupera o offset do UTC (-3 GMT, no caso de Brasília) e seta-se
// manualmente. Esta informação vem do servidor, desta forma não ficamos
// na dependência da atualização de browser, pois tanto o Date() em JS
// quanto as libs python (django.utils.timezone, datetime, pytz, etc)
// lêem do tzdata, que precisa ser atualizado toda vez que o governo
// brasileiro modifica alguma coisa relacionada ao horário de verão.
// Recuperando essa informação do servidor só teremos que atualizar as
// libs tzdata (Linux) e pytz (Python) uma vez. Além disso, o uso da
// biblioteca moment.js é recomendada, pois ela trata data e hora
// melhor que o Date() do JS.
$("#date").append(moment().format("DD/MM/YY"));
var offset = parseFloat({{ utc_offset }});
startTime(offset);
var audioAlertFinish = document.getElementById("audio");
@ -238,203 +236,107 @@
(function poll() {
$.ajax({
url: "{% url 'sapl.painel:dados_painel' sessao_id %}",
type: "GET",
success: function(data) {
$("#sessao_plenaria").text(data["sessao_plenaria"])
$("#sessao_plenaria_data").text("Data Início: " + data["sessao_plenaria_data"])
$("#sessao_plenaria_hora_inicio").text("Hora Início: " + data["sessao_plenaria_hora_inicio"])
$("#sessao_solene_tema").text(data["tema_solene"])
if (data["status_painel"] == false) {
$("#message").text("PAINEL ENCONTRA-SE FECHADO");
} else {
$("#message").text("");
}
url: "{% url 'sapl.painel:dados_painel' sessao_id %}",
type: "GET",
success: function(data) {
$("#sessao_plenaria").text(data["sessao_plenaria"])
$("#sessao_plenaria_data").text("Data Início: " + data["sessao_plenaria_data"])
$("#sessao_plenaria_hora_inicio").text("Hora Início: " + data["sessao_plenaria_hora_inicio"])
$("#sessao_solene_tema").text(data["tema_solene"])
if (data["status_painel"] == false) {
$("#message").text("PAINEL ENCONTRA-SE FECHADO");
} else {
$("#message").text("");
}
if (data["sessao_solene"]){
$("#resultado_votacao_div").hide();
$("#obs_materia_div").hide();
$('#tema_solene_div').show();
}
if (data["sessao_solene"]){
$("#resultado_votacao_div").hide();
$("#obs_materia_div").hide();
$('#tema_solene_div').show();
}
if (data["brasao"] != null)
$("#logo-painel").attr("src", data["brasao"]);
var presentes = $("#parlamentares");
var votacao = $("#votacao");
var oradores = $("#orador")
$("#votacao").text('');
presentes.children().remove();
votacao.children().remove();
oradores.children().remove();
var oradores_list = data["oradores"];
var presentes_list = data["presentes"];
// Se painel está aberto
if (data["status_painel"]) {
presentes.append('<table id="parlamentares_list">');
$.each(presentes_list, function (index, parlamentar) {
// Parlamentar já votou?
if (parlamentar.voto){
// Se a votação já foi finalizada, mostra todos os votos
if (data['tipo_resultado'] && data['tipo_resultado'] != "Ainda não foi votada."){
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:white" >' +
if (data["brasao"] != null)
$("#logo-painel").attr("src", data["brasao"]);
var presentes = $("#parlamentares");
var votacao = $("#votacao");
var oradores = $("#orador")
$("#votacao").text('');
presentes.children().remove();
votacao.children().remove();
oradores.children().remove();
var oradores_list = data["oradores"];
var presentes_list = data["presentes"];
// Se painel está aberto
if (data["status_painel"]) {
presentes.append('<table id="parlamentares_list">');
$.each(presentes_list, function (index, parlamentar) {
// Parlamentar já votou?
if (parlamentar.voto){
// Se a votação já foi finalizada, mostra todos os votos
if (data['tipo_resultado'] && data['tipo_resultado'] != "Ainda não foi votada."){
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:white" >' +
parlamentar.nome +
'</td> <td style="padding-right:20px; color:white">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:white">'
+ show_voto(parlamentar.voto) + '</td></tr>');
}
// Senão verifica a configuração desejada
else{
{% if painel_config.mostrar_votos_antecedencia %}
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:yellow" >' +
parlamentar.nome +
'</td> <td style="padding-right:20px; color:white">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:white">'
'</td> <td style="padding-right:20px; color:yellow">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:yellow">'
+ show_voto(parlamentar.voto) + '</td></tr>');
}
// Senão verifica a configuração desejada
else{
{% if painel_config.mostrar_votos_antecedencia %}
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:yellow" >' +
parlamentar.nome +
'</td> <td style="padding-right:20px; color:yellow">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:yellow">'
+ show_voto(parlamentar.voto) + '</td></tr>');
{% else %}
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:yellow" >' +
parlamentar.nome +
'</td> <td style="padding-right:20px; color:yellow">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:yellow">'
+ '</td></tr>');
{% endif %}
}
} else{
$('#parlamentares_list').append('<tr> <td style="padding-right:20px">' +
parlamentar.nome +
'</td> <td style="padding-right:20px">' +
parlamentar.partido + '</td> <td style="padding-right:20px">'
+ show_voto(parlamentar.voto) + '</td></tr>')
{% else %}
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:yellow" >' +
parlamentar.nome +
'</td> <td style="padding-right:20px; color:yellow">' +
parlamentar.partido + '</td> <td style="padding-right:20px; color:yellow">'
+ '</td></tr>');
{% endif %}
}
});
presentes.append('</table>')
if (data["oradores"].length > 0){
$('#aparecer_oradores').show();
oradores.append('<table id="oradores_list">');
$.each(oradores_list, function (index, orador) {
$('#oradores_list').append('<tr><td style="padding-right:20px; color:white" >' +
orador.numero + 'º &nbsp' +
orador.nome +'</td></tr>')
});
oradores.append('</table>');
} else {
$('#aparecer_oradores').hide();
}
} else{
presentes.append('<span style="color:white" id="parlamentares_list">');
$('#parlamentares_list').append(
'<center>A listagem de parlamentares só aparecerá quando o painel estiver aberto.</center>')
presentes.append('</span>');
oradores.append('<span style="color:white" id="oradores_list">');
$('#oradores_list').append(
'<center>A listagem de oradores só aparecerá quando o painel estiver aberto.</center>')
oradores.append('</span>');
votacao.append('<span id="votacao">');
$("#votacao").append('<center>A votação só aparecerá quando o painel estiver aberto</center>');
votacao.append('</span>');
}
if(data["status_painel"]){
if (data['materia_legislativa_texto']){
var votacao = $("#votacao");
votacao.append("<li>Sim: " + data["numero_votos_sim"] + "</li>");
votacao.append("<li>Não: " + data["numero_votos_nao"] + "</li>");
votacao.append("<li>Abstenções: " + data["numero_abstencoes"] + "</li>");
votacao.append("<li>Presentes: " + data["num_presentes"] + "</li>");
votacao.append("<li>Total votos: " + data["total_votos"] + "</li>");
}
}
else{
$("#votacao").append('<center>Não há votação, pois não há nenhuma matéria aberta ou já votada.</center>');
$('#parlamentares_list').append('<tr> <td style="padding-right:20px">' +
parlamentar.nome +
'</td> <td style="padding-right:20px">' +
parlamentar.partido + '</td> <td style="padding-right:20px">'
+ show_voto(parlamentar.voto) + '</td></tr>')
}
}
// obtém todos os ids em uma lista e
// converte os dados do status dos cronômetros de dicionário para uma lista
var ids = [];
var status_cronometros = [];
for (var key in data['cronometros']) {
if (data['cronometros'].hasOwnProperty(key)) {
ids.push(key);
status_cronometros.push(data['cronometros'][key]);
}
}
});
// converte os dados de dicionário para uma lista
var duracao_cronometros = [];
for (let id of ids) {
duracao_cronometros.push(data['duracao_cronometros'][id]);
}
for(let i=0; i<status_cronometros.length; i++){
if (!cronometros_previous[i]){
cronometros_previous[i] = ''
}
presentes.append('</table>')
// se houve alteração de status
if (status_cronometros[i] != cronometros_previous[i]) {
if(status_cronometros[i] == 'reset'){
// é necessário recriar o cronômetro com o valor da duração original devido a limitações da API
$('#cronometro_' + ids[i]).runner({
autostart: false,
countdown: true,
startAt: parseInt(duracao_cronometros[i]) * 1000,
stopAt: 0,
milliseconds: false,
format: convertValueToDuration
}).on('runnerFinish', function(eventObject, info){
playAudioNumVezes(audioAlertFinish, num_vezes_toca_audio);
});
}
// ações de start e stop
else{
$('#cronometro_' + ids[i]).runner(status_cronometros[i]);
}
cronometros_previous[i] = status_cronometros[i];
}
// Dispara aviso prévio se estiver configurado
if($('#cronometro_' + ids[i]).runner('info').formattedTime == tempo_disparo_antecedencia
&& "{{ painel_config.disparo_cronometro }}" == "True" ){
audioAlertFinish.play();
}
if (data["oradores"].length > 0){
$('#aparecer_oradores').show();
oradores.append('<table id="oradores_list">');
$.each(oradores_list, function (index, orador) {
$('#oradores_list').append('<tr><td style="padding-right:20px; color:white" >' +
orador.numero + 'º &nbsp' +
orador.nome +'</td></tr>')
});
oradores.append('</table>');
} else {
$('#aparecer_oradores').hide();
}
if(data['sessao_finalizada']){
$("#obs_materia_div").hide();
$("#resultado_votacao_div").hide();
}
else if (data['materia_legislativa_texto']){
if (data["status_painel"] == true){
$("#materia_legislativa_texto").text(data["materia_legislativa_texto"]);
} else{
$("#materia_legislativa_texto").text('A Matéria em votação só aparecerá quando o painel estiver aberto');
}
if (data['materia_legislativa_texto']){
var votacao = $("#votacao");
votacao.append("<li>Sim: " + data["numero_votos_sim"] + "</li>");
votacao.append("<li>Não: " + data["numero_votos_nao"] + "</li>");
votacao.append("<li>Abstenções: " + data["numero_abstencoes"] + "</li>");
votacao.append("<li>Presentes: " + data["num_presentes"] + "</li>");
votacao.append("<li>Total votos: " + data["total_votos"] + "</li>");
}
else{
$("#materia_legislativa_texto").text('Não há nenhuma matéria votada ou para votação.');
$("#votacao").append('<center>Não há votação, pois não há nenhuma matéria aberta ou já votada.</center>');
}
if (data['observacao_materia'] && data["status_painel"] == true){
var texto = data['observacao_materia'];
if(texto.length > 151) {
$("#observacao_materia").text(texto.substr(0, 145).concat('(...)'));
} else{
$("#observacao_materia").text(texto);
}
} else{
$("#observacao_materia").text('');
}
if (data['tipo_resultado'] && data['status_painel'] == true){
if (data['tipo_resultado']){
if(data['tipo_votacao'] != 'Leitura' && !data['sessao_finalizada'] && !data["sessao_solene"]){
$("#resultado_votacao").css("color", "#45919D");
$("#mat_em_votacao").text("Matéria em Votação");
@ -447,7 +349,6 @@
$("#resultado_votacao").text(data["tipo_resultado"]);
var resultado_votacao_upper = $("#resultado_votacao").text().toUpperCase();
console.log(resultado_votacao_upper, data['tipo_resultado']);
if (resultado_votacao_upper.search("APROV") != -1){
$("#resultado_votacao").css("color", "green");
$("#mat_em_votacao").text("Matéria Votada");
@ -460,7 +361,25 @@
$("#mat_em_votacao").text("Matéria Lida");
}
}
else{
}
// Painel fechado
else{
presentes.append('<span style="color:white" id="parlamentares_list">');
$('#parlamentares_list').append(
'<center>A listagem de parlamentares só aparecerá quando o painel estiver aberto.</center>')
presentes.append('</span>');
oradores.append('<span style="color:white" id="oradores_list">');
$('#oradores_list').append(
'<center>A listagem de oradores só aparecerá quando o painel estiver aberto.</center>')
oradores.append('</span>');
votacao.append('<span id="votacao">');
$("#votacao").append('<center>A votação só aparecerá quando o painel estiver aberto</center>');
votacao.append('</span>');
if(!data['tipo_resultado']){
$("#resultado_votacao").text('');
if(data['tipo_votacao'] != 'Leitura')
$("#mat_em_votacao").text("Matéria em Votação");
@ -468,6 +387,88 @@
$("#mat_em_votacao").text("Matéria em Leitura");
}
}
}
// obtém todos os ids em uma lista e
// converte os dados do status dos cronômetros de dicionário para uma lista
var ids = [];
var status_cronometros = [];
for (var key in data['cronometros']) {
if (data['cronometros'].hasOwnProperty(key)) {
ids.push(key);
status_cronometros.push(data['cronometros'][key]);
}
}
// converte os dados de dicionário para uma lista
var duracao_cronometros = [];
for (let id of ids) {
duracao_cronometros.push(data['duracao_cronometros'][id]);
}
for(let i=0; i<status_cronometros.length; i++){
if (!cronometros_previous[i]){
cronometros_previous[i] = ''
}
// se houve alteração de status
if (status_cronometros[i] != cronometros_previous[i]) {
if(status_cronometros[i] == 'reset'){
// é necessário recriar o cronômetro com o valor da duração original devido a limitações da API
$('#cronometro_' + ids[i]).runner({
autostart: false,
countdown: true,
startAt: parseInt(duracao_cronometros[i]) * 1000,
stopAt: 0,
milliseconds: false,
format: convertValueToDuration
}).on('runnerFinish', function(eventObject, info){
playAudioNumVezes(audioAlertFinish, num_vezes_toca_audio);
});
}
// ações de start e stop
else{
$('#cronometro_' + ids[i]).runner(status_cronometros[i]);
}
cronometros_previous[i] = status_cronometros[i];
}
// Dispara aviso prévio se estiver configurado
if($('#cronometro_' + ids[i]).runner('info').formattedTime == tempo_disparo_antecedencia
&& "{{ painel_config.disparo_cronometro }}" == "True" ){
audioAlertFinish.play();
}
}
if(data['sessao_finalizada']){
$("#obs_materia_div").hide();
$("#resultado_votacao_div").hide();
}
else if (data['materia_legislativa_texto']){
if (data["status_painel"] == true){
$("#materia_legislativa_texto").text(data["materia_legislativa_texto"]);
}
else{
$("#materia_legislativa_texto").text('A Matéria em votação só aparecerá quando o painel estiver aberto');
}
}
else{
$("#materia_legislativa_texto").text('Não há nenhuma matéria votada ou para votação.');
}
if (data['observacao_materia'] && data["status_painel"] == true){
var texto = data['observacao_materia'];
if(texto.length > 151) {
$("#observacao_materia").text(texto.substr(0, 145).concat('(...)'));
}
else{
$("#observacao_materia").text(texto);
}
}
else{
$("#observacao_materia").text('');
}
},
error: function(err) {
console.error(err);

Loading…
Cancel
Save