Browse Source

fix painel voto nao informado

pull/3814/head
RogerKoala 3 days ago
parent
commit
c2b2cd89a2
  1. 196
      frontend/src/__apps/painel/scss/painel.scss
  2. 17
      sapl/painel/views.py
  3. 567
      sapl/templates/painel/index.html

196
frontend/src/__apps/painel/scss/painel.scss

@ -1,43 +1,159 @@
:root {
--bg-dark: #121212;
--bg-panel: #1e1e1e;
--text-main: #e0e0e0;
--text-highlight: #4fa64d;
}
.painel-principal { body {
background: #1c1b1b; background-color: var(--bg-dark);
font-family: Verdana; color: var(--text-main);
font-size: x-large; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
.text-title { margin-bottom: 0;
color: #4fa64d; }
margin: 0.5rem;
font-weight: bold; .separador-vertical {
} border-right: 1px solid #333;
.text-subtitle { min-height: 100vh;
color: #459170; margin: 0;
font-weight: bold; }
}
.data-hora { .text-title {
font-size: 180%; color: var(--text-highlight);
} letter-spacing: 1px;
}
.text-value {
color: white; .text-subtitle {
} color: #81c784;
font-weight: 600;
.logo-painel { }
max-width: 100%;
} .parlamentares-grid {
.painels { display: grid;
flex-wrap: wrap; grid-template-columns: repeat(auto-fill, 190px);
} width: 100%;
.painel{ }
margin-top: 1rem;
table { .parlamentar-card {
width: 150px;
border-radius: 3px;
overflow: hidden;
position: relative;
}
.foto-container {
border-radius: 3px;
overflow: hidden;
height: 150px;
}
.parlamentar-card img {
width: 100%; width: 100%;
} height: 150px;
h2 { display: block;
margin-bottom: 0.5rem; object-fit: fill;
} }
#votacao, #oradores_list {
text-align: left; .parlamentar-card .nome {
display: inline-block; font-weight: bold;
margin-bottom: 1rem; font-size: 0.95rem;
} color: #fff;
} line-height: 1.1;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
margin-bottom: 2px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.parlamentar-card .partido {
font-size: 0.8rem;
color: #ddd;
font-weight: 600;
text-transform: uppercase;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}
.voto-faixa {
position: absolute;
width: 90px;
height: 90px;
top: -45px;
right: -45px;
transform: rotate(45deg);
display: flex;
align-items: flex-end;
justify-content: center;
color: #fff;
font-weight: 700;
box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.2);
z-index: 10;
line-height: 1;
}
.voto-faixa p {
transform: rotate(-45deg);
font-size: 2rem;
text-transform: uppercase;
}
.voto-sim .voto-faixa {
background-color: #27ae60;
}
.voto-nao .voto-faixa {
background-color: #c0392b;
}
.voto-abstencao .voto-faixa {
background-color: #f39c12;
}
.voto-informado .voto-faixa {
background-color: #d35400;
}
.voto-ausente .voto-faixa {
background-color: #7f8c8d;
}
.table-custom {
color: #ddd;
}
.table-custom tbody td {
padding: 8px;
font-size: 1.1rem;
}
.table-sim {
color: #27ae60;
}
.table-nao {
color: #c0392b;
}
.table-abstencao {
color: #f39c12;
}
.table-total {
color: #194BFA;
}
.logo-painel {
max-height: 150px;
width: auto;
}
#oradores_list tr td {
font-size: 1.2rem;
padding: 5px;
text-align: start;
}
.hora-brasao {
border-top: 1px solid #333;
} }

17
sapl/painel/views.py

@ -15,6 +15,7 @@ from django.utils import timezone
from django.utils.translation import ugettext_lazy as _ from django.utils.translation import ugettext_lazy as _
from django.views.decorators.cache import never_cache from django.views.decorators.cache import never_cache
from sapl import settings
from sapl.base.models import AppConfig as ConfiguracoesAplicacao from sapl.base.models import AppConfig as ConfiguracoesAplicacao
from sapl.base.models import CasaLegislativa from sapl.base.models import CasaLegislativa
from sapl.crud.base import Crud from sapl.crud.base import Crud
@ -25,6 +26,7 @@ from sapl.sessao.models import (ExpedienteMateria, OradorExpediente, OrdemDia,
SessaoPlenaria, SessaoPlenariaPresenca, SessaoPlenaria, SessaoPlenariaPresenca,
VotoParlamentar, RegistroLeitura) VotoParlamentar, RegistroLeitura)
from sapl.utils import filiacao_data, get_client_ip, sort_lista_chave from sapl.utils import filiacao_data, get_client_ip, sort_lista_chave
from image_cropping.utils import get_backend
from .models import Cronometro from .models import Cronometro
@ -372,7 +374,6 @@ def get_presentes(pk, response, materia):
else: else:
presentes = SessaoPlenariaPresenca.objects.filter( presentes = SessaoPlenariaPresenca.objects.filter(
sessao_plenaria_id=pk) sessao_plenaria_id=pk)
sessao = SessaoPlenaria.objects.get(id=pk) sessao = SessaoPlenaria.objects.get(id=pk)
num_presentes = len(presentes) num_presentes = len(presentes)
data_sessao = sessao.data_inicio data_sessao = sessao.data_inicio
@ -399,11 +400,23 @@ def get_presentes(pk, response, materia):
partido = 'Sem Registro' partido = 'Sem Registro'
else: else:
partido = filiacao partido = filiacao
if p.parlamentar.fotografia:
thumbnail_url = get_backend().get_thumbnail_url(
p.parlamentar.fotografia,
{
'size': (128, 128),
'box': p.parlamentar.cropping,
'crop': True,
'detail': True,
}
)
else:
thumbnail_url = False
presentes_list.append( presentes_list.append(
{'id': p.id, {'id': p.id,
'parlamentar_id': p.parlamentar.id, 'parlamentar_id': p.parlamentar.id,
'nome': p.parlamentar.nome_parlamentar, 'nome': p.parlamentar.nome_parlamentar,
'fotografia':thumbnail_url,
'partido': partido, 'partido': partido,
'voto': '' 'voto': ''
}) })

567
sapl/templates/painel/index.html

@ -1,20 +1,18 @@
{% load i18n %} {% load i18n %}
{% load common_tags %} {% load common_tags %}
{% load render_bundle from webpack_loader %} {% load render_bundle from webpack_loader %}
{% load webpack_static from webpack_loader %} {% load webpack_static from webpack_loader %}
<!DOCTYPE HTML> <!DOCTYPE HTML>
<!--[if IE 8]> <html class="no-js lt-ie9" lang="pt-br"> <![endif]-->
<!--[if gt IE 8]><!-->
<html lang="pt-br"> <html lang="pt-br">
<!--<![endif]-->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- TODO: does it need this head_title here? -->
<title>{% block head_title %}{% trans 'SAPL - Sistema de Apoio ao Processo Legislativo' %}{% endblock %}</title> <title>{% block head_title %}{% trans 'SAPL - Sistema de Apoio ao Processo Legislativo' %}{% endblock %}</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
{% block webpack_loader_css %} {% block webpack_loader_css %}
{% render_chunk_vendors 'css' %} {% render_chunk_vendors 'css' %}
{% render_bundle 'global' 'css' %} {% render_bundle 'global' 'css' %}
@ -22,242 +20,189 @@
{% endblock webpack_loader_css %} {% endblock webpack_loader_css %}
<style type="text/css"> </head>
html, body {
max-width: 100%; <body class="min-vh-100 d-flex flex-column p-2">
overflow-x: hidden;
}
@media screen {
ul, li {
list-style-type: none;
}
}
</style>
</head>
<body class="painel-principal">
<audio type="hidden" id="audio" src="{% webpack_static 'audio/ring.mp3' %}"></audio> <audio type="hidden" id="audio" src="{% webpack_static 'audio/ring.mp3' %}"></audio>
<div class="d-flex justify-content-center"> <div class="container-fluid">
<h1 id="sessao_plenaria" class="title text-title"></h1> <div class="row g-3">
</div>
<div class="row "> <div class="col-md-9 separador-vertical pe-4">
<div class="col text-center"> <div class="painel p-3 h-100 d-flex flex-column">
<span id="sessao_plenaria_data" class="text-value"></span> <h1 id="sessao_plenaria" class="text-title fw-bold text-uppercase"></h1>
<div id="parlamentares">
</div> </div>
<div class="col text-center">
<span id="sessao_plenaria_hora_inicio" class="text-value"></span>
</div> </div>
</div> </div>
<div class="row justify-content-center"> <div class="col-md-3 d-flex flex-column gap-3">
<div class="col-1">
<img src="" id="logo-painel" class="logo-painel" alt=""/>
</div>
</div>
<div class="row justify-content-center"> <div class="painel p-3 d-flex flex-column" id="obs_materia_div">
<h2 class="text-danger"><span id="message"></span></h2> <div class="flex-grow-1">
</div> <h2 id="mat_em_votacao" class="text-subtitle text-center mb-3 pb-1">Matéria em Votação</h2>
<span id="materia_legislativa_texto" class="fs-4 text-white d-block mb-1"></span>
<span id="materia_legislativa_ementa" class="fs-6 fst-italic opacity-75 text-white"></span>
<div class="row"> <div class="mt-2 text-warning" style="font-size: 0.9rem;">
<div class="col text-center"><span class="text-value data-hora" id="date"></span></div> <span id="observacao_materia"></span>
<div class="col text-center"><span class="text-value data-hora" id="relogio"></span></div>
</div> </div>
<div id="resultado_votacao" class="text-title mt-auto text-center d-block fs-2"></div>
<div class="">
<div class="d-flex justify-content-start">
<div class="col-md-4">
<div class="text-center painel">
<h2 class="text-subtitle">Parlamentares</h2>
<span id="parlamentares" class="text-value text-center"></span>
</div> </div>
</div> </div>
<div class="d-flex col-md-8 painels">
<div class="col-md-6 text-center painel" id="aparecer_oradores"> <div class="text-center painel" id="aparecer_oradores">
<h2 class="text-subtitle">Oradores</h2> <h4 class="text-subtitle">Oradores</h4>
<span id="orador"></span> <div id="orador"></div>
</div> </div>
<div class="col-md-6 text-left painel"> <div class="painel d-flex flex-column">
<div class="d-flex align-items-left justify-content-left mb-2"> <div id="box_cronometros" class="w-100">
<h2 class="text-subtitle mb-0">Cronômetros</h2> <h4 class="text-center text-subtitle mb-3">Cronômetro</h4>
<button class="btn btn-sm btn-secondary ms-2" onclick="changeFontSize('box_cronometros', -1)"> <div class="d-flex align-items-center justify-content-center" style="height: 80px;">
A- <table class="table-custom w-100 mb-0">
</button> <tbody>
<button class="btn btn-sm btn-secondary ms-2" onclick="changeFontSize('box_cronometros', 1)"> <tr id="row_discurso">
A+ <td class="fs-3">Discurso</td>
</button> <td class="text-end"><span id="cronometro_discurso"
class="fw-bold font-monospace fs-1">00:00:00</span></td>
</tr>
<tr id="row_aparte" style="display: none;">
<td class="fs-3 text-warning">Aparte</td>
<td class="text-end"><span id="cronometro_aparte"
class="fw-bold font-monospace fs-1 text-warning">00:00:00</span></td>
</tr>
<tr id="row_ordem" style="display: none;">
<td class="fs-3 text-info">Questão de Ordem</td>
<td class="text-end"><span id="cronometro_ordem"
class="fw-bold font-monospace fs-1 text-info">00:00:00</span></td>
</tr>
<tr id="row_consideracoes" style="display: none;">
<td class="fs-3">Consid. Finais</td>
<td class="text-end"><span id="cronometro_consideracoes"
class="fw-bold font-monospace fs-1">00:00:00</span></td>
</tr>
</tbody>
</table>
</div> </div>
<div class="text-value" id="box_cronometros">
Discurso: <span id="cronometro_discurso"></span><br>
Aparte: <span id="cronometro_aparte"></span><br>
Questão de Ordem: <span id="cronometro_ordem"></span><br>
Considerações Finais: <span id="cronometro_consideracoes"></span>
</div> </div>
</div> </div>
<div class="col-md-6 text-left painel" id="resultado_votacao_div"> <div class="painel p-3 d-flex flex-column" id="resultado_votacao_div">
<div class="d-flex align-items-left justify-content-left mb-2"> <div id="box_votacao" class="w-100">
<h2 class="text-subtitle mb-0">Resultado</h2> <table class="table-custom w-100 mb-0" id="tabela_resultados">
<button class="btn btn-sm btn-secondary ms-2" onclick="changeFontSize('box_votacao', -1)"> <tbody id="votacao"></tbody>
A- </table>
</button>
<button class="btn btn-sm btn-secondary ms-2" onclick="changeFontSize('box_votacao', 1)">
A+
</button>
</div>
<div id="box_votacao">
<span id="votacao" class="text-value"></span>
<span id="resultado_votacao" lass="text-title"></span>
</div> </div>
</div> </div>
<div class="col-md-6 text-center painel" id="obs_materia_div"> <div class="painel position-relative bottom-0 hora-brasao">
<h2 class="text-subtitle" id="mat_em_votacao">Matéria em Votação</h2> <div class="row justify-content-center align-items-center">
<span id="materia_legislativa_texto" class="text-value"></span> <div class="col-4 text-center" id="logo-container">
<br> <img src="" id="logo-painel" class="logo-painel" alt="Brasão" />
<span id="materia_legislativa_ementa" class="text-value"></span>
<br>
<span id="observacao_materia" class="text-value"></span>
</div> </div>
<div class="col-4 text-center" id="relogio-container">
<div class="col-md-6 text-center painel" id="tema_solene_div" style="display: none"> <span class="fs-1 fw-bold" id="relogio"></span>
<h2 class="text-subtitle">Tema da Sessão Solene</h2>
<span id="sessao_solene_tema" class="text-value"></span>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
</body>
{% block webpack_loader_js %}
{% render_chunk_vendors 'js' %}
{% render_bundle 'global' 'js' %}
{% render_bundle 'painel' 'js' %}
{% endblock webpack_loader_js %}
{% block webpack_loader_chunks_js %}
{% 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.
//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;
}
const utcOffset = {{ utc_offset }};
const serverEpochMs = {{ server_epoch_ms }};
const pageLoadedAtMs = performance.now();
function startTime() {
const elapsedMs = performance.now() - pageLoadedAtMs;
const now = moment </body>
.utc(serverEpochMs + elapsedMs)
.utcOffset(utcOffset); {% block webpack_loader_js %}
{% render_chunk_vendors 'js' %}
{% render_bundle 'global' 'js' %}
{% render_bundle 'painel' 'js' %}
{% endblock webpack_loader_js %}
{% block webpack_loader_chunks_js %}
{% endblock webpack_loader_chunks_js %}
<script type="text/javascript">
$("#date").text(now.format("DD/MM/YY")); $(document).ready(function () {
$("#relogio").text(now.format("HH:mm:ss"));
$("#date").append(moment().format("DD/MM/YY"));
var offset = parseFloat({{ utc_offset }});
var isPolling = false;
var cronometroVisivel = '#row_discurso';
function checkTime(i) {
if (i < 10) { i = "0" + i };
return i;
}
function startTime() {
var today = moment.utc().utcOffset(offset).format("HH:mm:ss");
$("#relogio").text(today)
setTimeout(startTime, 500); setTimeout(startTime, 500);
} }
startTime(); startTime();
var audioAlertFinish = document.getElementById("audio"); var audioAlertFinish = document.getElementById("audio");
$('#cronometro_discurso').runner({ // Função para formatar o tempo do cronômetro
autostart: false, function formatCronometro(value) {
countdown: true, let h = Math.floor((value / 1000) / 3600);
startAt: {{ 'discurso'|cronometro_to_seconds }} * 1000,
stopAt: 0,
milliseconds: false,
format: function(value) {
let h = Math.floor((value/1000) / 3600);
h = checkTime(h); h = checkTime(h);
let m = Math.floor((value/1000) % 3600 / 60); let m = Math.floor((value / 1000) % 3600 / 60);
m = checkTime(m); m = checkTime(m);
let s = Math.floor((value/1000) % 3600 % 60); let s = Math.floor((value / 1000) % 3600 % 60);
s = checkTime(s); s = checkTime(s);
return h.toString() + ":" + m.toString() + ":" + s.toString(); return h.toString() + ":" + m.toString() + ":" + s.toString();
} }
}).on('runnerFinish', function(eventObject, info){
// Inicializar os cronômetros
$('#cronometro_discurso').runner({
autostart: false,
countdown: true,
startAt: {{ 'discurso'| cronometro_to_seconds }} * 1000,
stopAt: 0,
milliseconds: false,
format: formatCronometro
}).on('runnerFinish', function () {
audioAlertFinish.play(); audioAlertFinish.play();
}); });
$('#cronometro_aparte').runner({ $('#cronometro_aparte').runner({
autostart: false, autostart: false,
countdown: true, countdown: true,
startAt: {{ 'aparte'|cronometro_to_seconds }} * 1000, startAt: {{ 'aparte'| cronometro_to_seconds }} * 1000,
stopAt: 0, stopAt: 0,
milliseconds: false, milliseconds: false,
format: function(value) { format: formatCronometro
let h = Math.floor((value/1000) / 3600); }).on('runnerFinish', function () {
h = checkTime(h);
let m = Math.floor((value/1000) % 3600 / 60);
m = checkTime(m);
let s = Math.floor((value/1000) % 3600 % 60);
s = checkTime(s);
return h.toString() + ":" + m.toString() + ":" + s.toString();
}
}).on('runnerFinish', function(eventObject, info){
audioAlertFinish.play(); audioAlertFinish.play();
}); });
$('#cronometro_ordem').runner({ $('#cronometro_ordem').runner({
autostart: false, autostart: false,
countdown: true, countdown: true,
startAt: {{ 'ordem'|cronometro_to_seconds }} * 1000, startAt: {{ 'ordem'| cronometro_to_seconds }} * 1000,
stopAt: 0, stopAt: 0,
milliseconds: false, milliseconds: false,
format: function(value) { format: formatCronometro
let h = Math.floor((value/1000) / 3600); }).on('runnerFinish', function () {
h = checkTime(h);
let m = Math.floor((value/1000) % 3600 / 60);
m = checkTime(m);
let s = Math.floor((value/1000) % 3600 % 60);
s = checkTime(s);
return h.toString() + ":" + m.toString() + ":" + s.toString();
}
}).on('runnerFinish', function(eventObject, info){
audioAlertFinish.play(); audioAlertFinish.play();
}); });
$('#cronometro_consideracoes').runner({ $('#cronometro_consideracoes').runner({
autostart: false, autostart: false,
countdown: true, countdown: true,
startAt: {{ 'consideracoes'|cronometro_to_seconds }} * 1000, startAt: {{ 'consideracoes'| cronometro_to_seconds }} * 1000,
stopAt: 0, stopAt: 0,
milliseconds: false, milliseconds: false,
format: function(value) { format: formatCronometro
let h = Math.floor((value/1000) / 3600); }).on('runnerFinish', function () {
h = checkTime(h);
let m = Math.floor((value/1000) % 3600 / 60);
m = checkTime(m);
let s = Math.floor((value/1000) % 3600 % 60);
s = checkTime(s);
return h.toString() + ":" + m.toString() + ":" + s.toString();
}
}).on('runnerFinish', function(eventObject, info){
audioAlertFinish.play(); audioAlertFinish.play();
}); });
@ -266,24 +211,16 @@
var aparte_previous; var aparte_previous;
var consideracoes_previous; var consideracoes_previous;
const POLL_INTERVAL_MS = function poll() {
window.location.hostname === "localhost" ? 2000 : 500; // Evitar múltiplas chamadas simultâneas
if (isPolling) return;
isPolling = true;
var counter = 1;
(function poll() {
$.ajax({ $.ajax({
url: "{% url 'sapl.painel:dados_painel' sessao_id %}", url: "{% url 'sapl.painel:dados_painel' sessao_id %}",
type: "GET", type: "GET",
dataType: "json", success: function (data) {
complete: function() {
setTimeout(poll, POLL_INTERVAL_MS);
},
timeout: 20000, // TODO: decrease
success: function(data) {
$("#sessao_plenaria").text(data["sessao_plenaria"]) $("#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) { if (data["status_painel"] == false) {
$("#message").text("PAINEL ENCONTRA-SE FECHADO"); $("#message").text("PAINEL ENCONTRA-SE FECHADO");
} }
@ -291,21 +228,30 @@
$("#message").text(""); $("#message").text("");
} }
if (data["sessao_solene"]){ if (data["sessao_solene"]) {
$("#resultado_votacao_div").hide(); $("#resultado_votacao_div").hide();
$("#obs_materia_div").hide(); $("#obs_materia_div").hide();
$('#tema_solene_div').show(); $('#tema_solene_div').show();
} }
if (data["brasao"] != null) if (data["brasao"] != null) {
$("#logo-painel").attr("src", data["brasao"]); $("#logo-painel").attr("src", data["brasao"]);
$("#logo-container").show();
$("#relogio-container")
.removeClass("col-12 mt-5")
.addClass("col-4");
} else {
$("#logo-container").hide();
$("#relogio-container")
.removeClass("col-4")
.addClass("col-12 mt-5");
}
var presentes = $("#parlamentares"); var presentes = $("#parlamentares");
var votacao = $("#votacao"); var votacao = $("#votacao");
var oradores = $("#orador") var oradores = $("#orador")
$("#votacao").text(''); $("#votacao").empty();
presentes.children().remove(); presentes.children().remove();
votacao.children().remove();
oradores.children().remove(); oradores.children().remove();
var oradores_list = data["oradores"]; var oradores_list = data["oradores"];
@ -313,31 +259,73 @@
if (data["status_painel"] == true) { if (data["status_painel"] == true) {
mostrar_voto = data["mostrar_voto"]; mostrar_voto = data["mostrar_voto"];
presentes.append('<table id="parlamentares_list">');
presentes.append('<div class="container-fluid" id="parlamentares_container">');
presentes.append('<div class="parlamentares-grid" id="parlamentares_row">');
var votoSim = 0;
var votoNao = 0;
var votoAbster = 0;
$.each(presentes_list, function (index, parlamentar) { $.each(presentes_list, function (index, parlamentar) {
var votoClass = '';
var votoText = '';
if (parlamentar.voto == 'Sim') {
votoClass = 'voto-sim';
votoText = 'S';
votoSim += 1;
} else if (parlamentar.voto == 'Não') {
votoClass = 'voto-nao';
votoText = 'N';
votoNao += 1
} else if (parlamentar.voto == 'Abstenção') {
votoClass = 'voto-abstencao';
votoText = 'A';
votoAbster += 1
} else if (parlamentar.voto == 'Voto Informado' && mostrar_voto == false) {
votoClass = 'voto-informado';
votoText = 'I';
} else if (parlamentar.voto) {
votoText = parlamentar.voto;
}
if (parlamentar.fotografia) {
fotografia = parlamentar.fotografia
} else {
fotografia = "{% webpack_static 'img/avatar.png' %}"
}
var cardHtml = `
<div class="parlamentar-card mt-3 ${votoClass}">
<div class="voto-faixa">
<p>
${votoText}
</p>
</div>
<div class="foto-container">
<img src="${fotografia}" alt="${parlamentar.nome}">
</div>
if (parlamentar.voto == 'Voto Informado' && mostrar_voto == false){ <div class="mt-2 text-center">
$('#parlamentares_list').append('<tr><td style="padding-right:20px; color:yellow" >' + <div class="nome">${parlamentar.nome}</div>
parlamentar.nome + <div class="partido">${parlamentar.partido}</div>
'</td> <td style="padding-right:20px; color:yellow">' + </div>
parlamentar.partido + '</td> <td style="padding-right:20px; color:yellow">' </div>
+ '</td></tr>') `;
}
else{
$('#parlamentares_list').append(show_voto(parlamentar))
}
$('#parlamentares_row').append(cardHtml);
}); });
presentes.append('</table>')
if (data["oradores"].length > 0){ presentes.append('</div>');
presentes.append('</div>');
if (data["oradores"].length > 0) {
$('#aparecer_oradores').show(); $('#aparecer_oradores').show();
oradores.append('<table id="oradores_list">'); oradores.append('<table id="oradores_list">');
$.each(oradores_list, function (index, orador) { $.each(oradores_list, function (index, orador) {
$('#oradores_list').append('<tr><td style="padding-right:20px; color:white" >' + $('#oradores_list').append('<tr><td style="padding-right:20px; color:white" >' +
orador.numero + 'º &nbsp' + orador.numero + 'º - ' +
orador.nome +'</td></tr>') orador.nome + '</td></tr>')
}); });
oradores.append('</table>'); oradores.append('</table>');
} }
@ -345,40 +333,40 @@
$('#aparecer_oradores').hide(); $('#aparecer_oradores').hide();
} }
} }
else{ else {
presentes.append('<span style="color:white" id="parlamentares_list">'); presentes.append('<span class="text-white" id="parlamentares_list">');
$('#parlamentares_list').append( $('#parlamentares_list').append(
'<center>A listagem de parlamentares só aparecerá quando o painel estiver aberto.</center>') '<center>A listagem de parlamentares só aparecerá quando o painel estiver aberto.</center>')
presentes.append('</span>'); presentes.append('</span>');
oradores.append('<span style="color:white" id="oradores_list">'); oradores.append('<span class="text-white" id="oradores_list">');
$('#oradores_list').append( $('#oradores_list').append(
'<center>A listagem de oradores só aparecerá quando o painel estiver aberto.</center>') '<center>A listagem de oradores só aparecerá quando o painel estiver aberto.</center>')
oradores.append('</span>'); oradores.append('</span>');
votacao.append('<span id="votacao">'); votacao.append('<tr><td colspan="2" class="text-center">A votação só aparecerá quando o painel estiver aberto</td></tr>');
$("#votacao").append('<center>A votação só aparecerá quando o painel estiver aberto</center>');
votacao.append('</span>');
} }
if(data["status_painel"]){ if (data["status_painel"]) {
if (data['materia_legislativa_texto']){ if (data['materia_legislativa_texto']) {
var votacao = $("#votacao"); var votacao = $("#votacao");
var total_votos = votoSim + votoNao + votoAbster
votacao.append("<li>Sim: " + data["numero_votos_sim"] + "</li>"); votacao.append("<tr><td>Presentes</td><td>" + data["num_presentes"] + "</td></tr>");
votacao.append("<li>Não: " + data["numero_votos_nao"] + "</li>"); votacao.append("<tr><td>Sim</td><td class='table-sim'>" + votoSim + "</td></tr>");
votacao.append("<li>Abstenções: " + data["numero_abstencoes"] + "</li>"); votacao.append("<tr><td>Não</td><td class='table-nao'>" + votoNao + "</td></tr>");
votacao.append("<li>Presentes: " + data["num_presentes"] + "</li>"); votacao.append("<tr><td>Abstenções</td><td class='table-abstencao'>" + votoAbster + "</td></tr>");
votacao.append("<li>Total votos: " + data["total_votos"] + "</li>"); votacao.append("<tr><td><strong>Total votos</strong></td><td class='table-total'><strong>" + total_votos + "</strong></td></tr>");
} }
else{ else {
$("#votacao").append('<center>Não há votação, pois não há nenhuma matéria aberta ou já votada.</center>'); votacao.append('<tr><td colspan="2" class="text-center">Não há votação, pois não há nenhuma matéria aberta ou já votada.</td></tr>');
} }
} }
// Gerenciar cronômetros
var discurso_current = data["cronometro_discurso"]; var discurso_current = data["cronometro_discurso"];
if (!discurso_previous){ if (!discurso_previous) {
discurso_previous = '' discurso_previous = '';
} }
if (discurso_current != discurso_previous) { if (discurso_current != discurso_previous) {
@ -387,8 +375,8 @@
} }
var aparte_current = data["cronometro_aparte"]; var aparte_current = data["cronometro_aparte"];
if (!aparte_previous){ if (!aparte_previous) {
aparte_previous = '' aparte_previous = '';
} }
if (aparte_current != aparte_previous) { if (aparte_current != aparte_previous) {
@ -397,8 +385,8 @@
} }
var ordem_current = data["cronometro_ordem"]; var ordem_current = data["cronometro_ordem"];
if (!ordem_previous){ if (!ordem_previous) {
ordem_previous = '' ordem_previous = '';
} }
if (ordem_current != ordem_previous) { if (ordem_current != ordem_previous) {
@ -407,8 +395,8 @@
} }
var consideracoes_current = data["cronometro_consideracoes"]; var consideracoes_current = data["cronometro_consideracoes"];
if (!consideracoes_previous){ if (!consideracoes_previous) {
consideracoes_previous = '' consideracoes_previous = '';
} }
if (consideracoes_current != consideracoes_previous) { if (consideracoes_current != consideracoes_previous) {
@ -416,117 +404,134 @@
consideracoes_previous = consideracoes_current; consideracoes_previous = consideracoes_current;
} }
if($('#cronometro_discurso').runner('info').formattedTime == "00:00:30") { var discursoRunning = $('#cronometro_discurso').runner('info').running;
var ordemRunning = $('#cronometro_ordem').runner('info').running;
var aparteRunning = $('#cronometro_aparte').runner('info').running;
var consideracoesRunning = $('#cronometro_consideracoes').runner('info').running;
if (ordemRunning) {
cronometroVisivel = '#row_ordem';
} else if (aparteRunning) {
cronometroVisivel = '#row_aparte';
} else if (consideracoesRunning) {
cronometroVisivel = '#row_consideracoes';
} else if (discursoRunning) {
cronometroVisivel = '#row_discurso';
}
var todosCronometros = ['#row_discurso', '#row_aparte', '#row_ordem', '#row_consideracoes'];
$.each(todosCronometros, function (index, id) {
if (id === cronometroVisivel) {
$(id).show();
} else {
$(id).hide();
}
});
if ($('#cronometro_discurso').runner('info').formattedTime == "00:00:30") {
audioAlertFinish.play(); audioAlertFinish.play();
} }
if($('#cronometro_aparte').runner('info').formattedTime == "00:00:30") { if ($('#cronometro_aparte').runner('info').formattedTime == "00:00:30") {
audioAlertFinish.play(); audioAlertFinish.play();
} }
if($('#cronometro_ordem').runner('info').formattedTime == "00:00:30") { if ($('#cronometro_ordem').runner('info').formattedTime == "00:00:30") {
audioAlertFinish.play(); audioAlertFinish.play();
} }
if($('#cronometro_consideracoes').runner('info').formattedTime == "00:00:30") { if ($('#cronometro_consideracoes').runner('info').formattedTime == "00:00:30") {
audioAlertFinish.play(); audioAlertFinish.play();
} }
if(data['sessao_finalizada']){ if (data['sessao_finalizada']) {
$("#obs_materia_div").hide(); $("#obs_materia_div").hide();
$("#resultado_votacao_div").hide(); $("#resultado_votacao_div").hide();
} }
else if (data['materia_legislativa_texto']){ else if (data['materia_legislativa_texto']) {
if (data["status_painel"] == true){ if (data["status_painel"] == true) {
$("#materia_legislativa_texto").text(data["materia_legislativa_texto"]); $("#materia_legislativa_texto").text(data["materia_legislativa_texto"]);
texto = data['materia_legislativa_ementa']
if (texto.length > 151) {
$("#materia_legislativa_ementa").text(texto.substr(0, 145).concat('...'));
}
else {
$("#materia_legislativa_ementa").text(data["materia_legislativa_ementa"]); $("#materia_legislativa_ementa").text(data["materia_legislativa_ementa"]);
} }
else{ }
else {
$("#materia_legislativa_texto").text('A Matéria em votação só aparecerá quando o painel estiver aberto'); $("#materia_legislativa_texto").text('A Matéria em votação só aparecerá quando o painel estiver aberto');
} }
} }
else{ else {
$("#materia_legislativa_texto").text('Não há nenhuma matéria votada ou para votação.'); $("#materia_legislativa_texto").text('Não há nenhuma matéria votada ou para votação.');
} }
if (data['observacao_materia'] && data["status_painel"] == true){ if (data['observacao_materia'] && data["status_painel"] == true) {
var texto = data['observacao_materia']; var texto = data['observacao_materia'];
if(texto.length > 151) { if (texto.length > 151) {
$("#observacao_materia").text(texto.substr(0, 145).concat('(...)')); $("#observacao_materia").text(texto.substr(0, 145).concat('(...)'));
} }
else{ else {
$("#observacao_materia").text(texto); $("#observacao_materia").text(texto);
} }
} }
else{ else {
$("#observacao_materia").text(''); $("#observacao_materia").text('');
} }
if (data['tipo_resultado'] && data['status_painel'] == true){ if (data['tipo_resultado'] && data['status_painel'] == true) {
if(data['tipo_votacao'] != 'Leitura' && !data['sessao_finalizada'] && !data["sessao_solene"]){ if (data['tipo_votacao'] != 'Leitura' && !data['sessao_finalizada'] && !data["sessao_solene"]) {
$("#resultado_votacao").css("color", "#45919D"); $("#resultado_votacao").css("color", "#45919D");
$("#mat_em_votacao").text("Matéria em Votação"); $("#mat_em_votacao").text("Matéria em Votação");
$("#resultado_votacao_div").show(); $("#resultado_votacao_div").show();
} }
else{ else {
$("#resultado_votacao_div").hide(); $("#resultado_votacao_div").hide();
$("#mat_em_votacao").text("Matéria em Leitura"); $("#mat_em_votacao").text("Matéria em Leitura");
} }
console.log(data["tipo_resultado"], data['tipo_votacao']);
$("#resultado_votacao").text(data["tipo_resultado"]); $("#resultado_votacao").text(data["tipo_resultado"]);
var resultado_votacao_upper = $("#resultado_votacao").text().toUpperCase(); var resultado_votacao_upper = $("#resultado_votacao").text().toUpperCase();
console.log(resultado_votacao_upper, data['tipo_resultado']); if (resultado_votacao_upper.search("APROV") != -1) {
if (resultado_votacao_upper.search("APROV") != -1){
$("#resultado_votacao").css("color", "#7CFC00"); $("#resultado_votacao").css("color", "#7CFC00");
$("#mat_em_votacao").text("Matéria Votada"); $("#mat_em_votacao").text("Matéria Votada");
} }
else if (resultado_votacao_upper.search("REJEIT") != -1){ else if (resultado_votacao_upper.search("REJEIT") != -1) {
$("#resultado_votacao").css("color", "red"); $("#resultado_votacao").css("color", "red");
$("#mat_em_votacao").text("Matéria Votada"); $("#mat_em_votacao").text("Matéria Votada");
} }
else if (resultado_votacao_upper.search("LIDA") != -1){ else if (resultado_votacao_upper.search("LIDA") != -1) {
$("#mat_em_votacao").text("Matéria Lida"); $("#mat_em_votacao").text("Matéria Lida");
} }
} }
else{ else {
$("#resultado_votacao").text(''); $("#resultado_votacao").text('');
if(data['tipo_votacao'] != 'Leitura') if (data['tipo_votacao'] != 'Leitura')
$("#mat_em_votacao").text("Matéria em Votação"); $("#mat_em_votacao").text("Matéria em Votação");
else{ else {
$("#mat_em_votacao").text("Matéria em Leitura"); $("#mat_em_votacao").text("Matéria em Leitura");
} }
} }
}, },
error: function(err) { error: function (xhr, status, error) {
console.error(err); console.error("Erro no polling:", error);
} },
}) complete: function () {
})(); isPolling = false;
setTimeout(poll, 500);
},
timeout: 20000
}); });
function show_voto(parlamentar) {
color = 'white'
if (parlamentar.voto == "Sim"){
color = 'green'
}
else if (parlamentar.voto == "Não"){
color = 'red'
} }
return ('<tr> <td style="padding-right:20px">' + // Iniciar polling
`<font color="`+color+`">${parlamentar.nome}</font> </td> <td style="padding-right:20px">` + poll();
`<font color="`+color+`">${parlamentar.partido}</font> </td> <td style="padding-right:20px">` +
`<font color="`+color+`">${parlamentar.voto}</font> </td></tr>`)
}
function changeFontSize(elementId, increment) { });
let element = document.getElementById(elementId);
if (element) {
let currentSize = parseFloat(window.getComputedStyle(element, null).getPropertyValue('font-size'));
element.style.fontSize = (currentSize + increment) + 'px';
}
}
</script> </script>
</html>
</html>
Loading…
Cancel
Save