From 101f499d7ce186ee12716b3ba452b24f24a5a5fb Mon Sep 17 00:00:00 2001 From: eribeiro Date: Mon, 12 Jul 2021 18:12:06 -0300 Subject: [PATCH 01/18] Melhorias em Painel --- frontend/src/__apps/painel/main.js | 53 +++++++++++++ sapl/templates/painel/index.html | 123 +++++++++++++---------------- 2 files changed, 110 insertions(+), 66 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index fdf4e5dbd..6c7d53b5d 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -1 +1,54 @@ import './scss/painel.scss' +import Vue from 'vue' +import axios from 'axios' + +axios.defaults.xsrfCookieName = 'csrftoken' +axios.defaults.xsrfHeaderName = 'X-CSRFToken' + +const v = new Vue({ // eslint-disable-line + delimiters: ['[[', ']]'], + el: '#app-painel', + data () { + return { + message: 'Hello VueJUS', // TODO: remove when porting to VueJS is done + polling: null, + painel_aberto: false, + sessao_plenaria: '', + sessao_plenaria_data: '', + sessao_plenaria_hora_inicio: '', + brasao: '', + sessao_solene: false, + sessao_solene_tema: '' + } + }, + methods: { + fetchData () { + // TODO: how to get no hardcoded URL? + $.get('/painel/704/dados', function (response) { + this.brasao = response.brasao + this.painel_aberto = response.status_painel + this.sessao_plenaria = response.sessao_plenaria + this.sessao_plenaria_data = 'Data Início: ' + response.sessao_plenaria_data + this.sessao_plenaria_hora_inicio = 'Hora Início: ' + response.sessao_plenaria_hora_inicio + this.sessao_solene = response.sessao_solene + this.sessao_solene_tema = response.sessao_solene_tema + }.bind(this)) + }, + pollData () { + this.fetchData() + + this.polling = setInterval(() => { + console.info('Fetching data from backend') + this.fetchData() + }, 5000) + } + }, + beforeDestroy () { + console.info('Destroying polling.') + clearInterval(this.polling) + }, + created () { + console.info('Start polling data...') + this.pollData() + } +}) diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index 1cb2e2c83..ad30a11f3 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -35,28 +35,29 @@ +
-

+

[[ sessao_plenaria ]]

-
+
- + [[ sessao_plenaria_data ]]
- + [[ sessao_plenaria_hora_inicio ]]
-
+
- + Brasão
-

+

PAINEL ENCONTRA-SE FECHADO

@@ -64,19 +65,32 @@

-
-
-

Parlamentares

- +
+

Parlamentares

+
+ +
+
+ +
A listagem de parlamentares só aparecerá quando o painel estiver aberto.
+ +
-

Oradores

- +

Oradores

+
+ +
+
+ +
A listagem de oradores só aparecerá quando o painel estiver aberto.
+ +
@@ -88,30 +102,42 @@

Cronômetros

Considerações Finais:
- -
-

Resultado

- -

+
+
+

Tema da Sessão Solene

+ [[ sessao_solene_tema ]] +
- -
-

Matéria em Votação

- -
- -
- -
- -

+
{% block webpack_loader_js %} @@ -249,25 +275,6 @@

Tema da Sessão Solene

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["brasao"] != null) - $("#logo-painel").attr("src", data["brasao"]); var presentes = $("#parlamentares"); var votacao = $("#votacao"); @@ -313,21 +320,6 @@

Tema da Sessão Solene

$('#aparecer_oradores').hide(); } } - else{ - presentes.append(''); - $('#parlamentares_list').append( - '
A listagem de parlamentares só aparecerá quando o painel estiver aberto.
') - presentes.append(''); - - oradores.append(''); - $('#oradores_list').append( - '
A listagem de oradores só aparecerá quando o painel estiver aberto.
') - oradores.append(''); - - votacao.append(''); - $("#votacao").append('
A votação só aparecerá quando o painel estiver aberto
'); - votacao.append(''); - } if(data["status_painel"]){ if (data['materia_legislativa_texto']){ @@ -489,7 +481,6 @@

Tema da Sessão Solene

`${parlamentar.partido} ` + `${parlamentar.voto} `) } - From f2c84eda4cb37c6dd3ca245f9118444449be983d Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Tue, 13 Jul 2021 10:19:40 -0300 Subject: [PATCH 02/18] Desabilitado polling na funcao principal --- sapl/templates/painel/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index ad30a11f3..c02ba9bae 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -461,7 +461,7 @@

Resultado

console.error(err); }, dataType: "json", - complete: setTimeout(function() {poll()}, 500), + complete: null, // setTimeout(function() {poll()}, 500), timeout: 20000 // TODO: decrease }) })(); From 6d5af39d50b311746e7422ecea4c69993af6834e Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Tue, 13 Jul 2021 10:56:00 -0300 Subject: [PATCH 03/18] Alteracoes na listagem de parlamentar --- frontend/src/__apps/painel/main.js | 6 ++++-- sapl/templates/painel/index.html | 20 +++++++++++++++++++- 2 files changed, 23 insertions(+), 3 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index 6c7d53b5d..9b647b582 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -18,7 +18,8 @@ const v = new Vue({ // eslint-disable-line sessao_plenaria_hora_inicio: '', brasao: '', sessao_solene: false, - sessao_solene_tema: '' + sessao_solene_tema: '', + presentes:[] } }, methods: { @@ -32,6 +33,7 @@ const v = new Vue({ // eslint-disable-line this.sessao_plenaria_hora_inicio = 'Hora Início: ' + response.sessao_plenaria_hora_inicio this.sessao_solene = response.sessao_solene this.sessao_solene_tema = response.sessao_solene_tema + this.presentes = response.presentes }.bind(this)) }, pollData () { @@ -40,7 +42,7 @@ const v = new Vue({ // eslint-disable-line this.polling = setInterval(() => { console.info('Fetching data from backend') this.fetchData() - }, 5000) + }, 500) } }, beforeDestroy () { diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index c02ba9bae..f86e54ca0 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -71,7 +71,25 @@

PAINEL ENCONTRA-SE FECHADO

Parlamentares

- + + + + + + + + + + + + + + +
ParlamentarPartidoAtivo?
+ [[ parlamentar.nome]] + + [[ parlamentar.partido ]] +
From 173b6c7a1d74009a8bcedbc7b1f0dc9e220916e8 Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Tue, 13 Jul 2021 11:50:14 -0300 Subject: [PATCH 04/18] Alteracoes na cor de palramentares --- frontend/src/__apps/painel/main.js | 26 ++++++++++++++++++++--- sapl/templates/painel/index.html | 33 +++++++++++++++--------------- 2 files changed, 40 insertions(+), 19 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index 9b647b582..9f654eb23 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -12,17 +12,35 @@ const v = new Vue({ // eslint-disable-line return { message: 'Hello VueJUS', // TODO: remove when porting to VueJS is done polling: null, - painel_aberto: false, + painel_aberto: true, sessao_plenaria: '', sessao_plenaria_data: '', sessao_plenaria_hora_inicio: '', brasao: '', sessao_solene: false, sessao_solene_tema: '', - presentes:[] + presentes: [], + oradores: [] } }, methods: { + + atribuiColor (parlamentares) { + return parlamentares.map(parlamentar => { + var color = 'white' + if (parlamentar.voto === 'Voto Informado') { + color = 'yellow' + } else { + if (parlamentar.voto === 'Sim') { + color = 'green' + } else if (parlamentar.voto === 'Não') { + color = 'red' + } + } + parlamentar.color = color + console.info(parlamentares) + }) + }, fetchData () { // TODO: how to get no hardcoded URL? $.get('/painel/704/dados', function (response) { @@ -33,7 +51,9 @@ const v = new Vue({ // eslint-disable-line this.sessao_plenaria_hora_inicio = 'Hora Início: ' + response.sessao_plenaria_hora_inicio this.sessao_solene = response.sessao_solene this.sessao_solene_tema = response.sessao_solene_tema - this.presentes = response.presentes + this.presentes = this.atribuiColor(response.presentes) + console.info(this.presentes) + this.oradores = response.oradores }.bind(this)) }, pollData () { diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index f86e54ca0..b6240ff9b 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -71,22 +71,15 @@

PAINEL ENCONTRA-SE FECHADO

Parlamentares

- - +
+ - - - - - - - - - + +
ParlamentarPartidoAtivo?
- [[ parlamentar.nome]] - - [[ parlamentar.partido ]] - + [[ p.nome]] + + [[ p.partido ]] +
@@ -102,7 +95,15 @@

Parlamentares

Oradores

- + + + + + + +
+ [[ o.numero]]º  [[o.nome]] +
From 5d4f775347a0b34ef7ab1ecfbef453c70563ce96 Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Tue, 13 Jul 2021 11:50:14 -0300 Subject: [PATCH 05/18] Alteracoes na cor de palramentares --- frontend/src/__apps/painel/main.js | 25 ++++++++++++++++++++-- sapl/templates/painel/index.html | 33 +++++++++++++++--------------- 2 files changed, 40 insertions(+), 18 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index 9b647b582..dbf140a64 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -12,17 +12,32 @@ const v = new Vue({ // eslint-disable-line return { message: 'Hello VueJUS', // TODO: remove when porting to VueJS is done polling: null, - painel_aberto: false, + painel_aberto: true, sessao_plenaria: '', sessao_plenaria_data: '', sessao_plenaria_hora_inicio: '', brasao: '', sessao_solene: false, sessao_solene_tema: '', - presentes:[] + presentes: [], + oradores: [] } }, methods: { + + atribuiColor (parlamentar) { + var color = 'white' + if (parlamentar.voto === 'Voto Informado') { + color = 'yellow' + } else { + if (parlamentar.voto === 'Sim') { + color = 'green' + } else if (parlamentar.voto === 'Não') { + color = 'red' + } + } + parlamentar.color = color + }, fetchData () { // TODO: how to get no hardcoded URL? $.get('/painel/704/dados', function (response) { @@ -33,7 +48,13 @@ const v = new Vue({ // eslint-disable-line this.sessao_plenaria_hora_inicio = 'Hora Início: ' + response.sessao_plenaria_hora_inicio this.sessao_solene = response.sessao_solene this.sessao_solene_tema = response.sessao_solene_tema + this.presentes = response.presentes + this.presentes.forEach(parlamentar => { + this.atribuiColor(parlamentar) + }) + + this.oradores = response.oradores }.bind(this)) }, pollData () { diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index f86e54ca0..b6240ff9b 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -71,22 +71,15 @@

PAINEL ENCONTRA-SE FECHADO

Parlamentares

- - +
+ - - - - - - - - - + +
ParlamentarPartidoAtivo?
- [[ parlamentar.nome]] - - [[ parlamentar.partido ]] - + [[ p.nome]] + + [[ p.partido ]] +
@@ -102,7 +95,15 @@

Parlamentares

Oradores

- + + + + + + +
+ [[ o.numero]]º  [[o.nome]] +
From 30c6aa5923faa37158a73474b14f2ec2a43e8f30 Mon Sep 17 00:00:00 2001 From: eribeiro Date: Tue, 13 Jul 2021 13:22:56 -0300 Subject: [PATCH 06/18] WIP --- frontend/src/__apps/painel/main.js | 20 ++++++++++++-- sapl/templates/painel/index.html | 42 ++++++++++++------------------ 2 files changed, 34 insertions(+), 28 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index dbf140a64..7e0555adc 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -20,7 +20,14 @@ const v = new Vue({ // eslint-disable-line sessao_solene: false, sessao_solene_tema: '', presentes: [], - oradores: [] + oradores: [], + has_votos: false, + materia_legislativa_texto: '', + numero_votos_sim: '', + numero_votos_nao: '', + numero_abstencoes: '', + num_presentes: '', + total_votos: '' } }, methods: { @@ -29,12 +36,14 @@ const v = new Vue({ // eslint-disable-line var color = 'white' if (parlamentar.voto === 'Voto Informado') { color = 'yellow' + this.has_votos = false } else { if (parlamentar.voto === 'Sim') { color = 'green' } else if (parlamentar.voto === 'Não') { color = 'red' } + this.has_votos = true } parlamentar.color = color }, @@ -55,6 +64,13 @@ const v = new Vue({ // eslint-disable-line }) this.oradores = response.oradores + + this.materia_legislativa_texto = response.materia_legislativa_texto + this.numero_votos_sim = response.numero_votos_sim + this.numero_votos_sim = response.numero_votos_sim + this.numero_abstencoes = response.numero_abstencoes + this.num_presentes = response.num_presentes + this.total_votos = response.total_votos }.bind(this)) }, pollData () { @@ -63,7 +79,7 @@ const v = new Vue({ // eslint-disable-line this.polling = setInterval(() => { console.info('Fetching data from backend') this.fetchData() - }, 500) + }, 1000) } }, beforeDestroy () { diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index b91aa130d..80c8d1b42 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -21,7 +21,6 @@ {% render_bundle 'painel' 'css' %} {% endblock webpack_loader_css %} - - - -
- - -
- Logo - -
-
-

- {% if nome %}{{ nome }}{% else %}{% trans 'Câmara/Assembléia não configurada'%}{% endif %} -

-
- -
-

[[ sessao_plenaria ]]

-
-
-
- [[ sessao_plenaria_data ]] -
-
- [[ sessao_plenaria_hora_inicio ]] + + + + + + {% block head_title %}{% trans 'SAPL - Sistema de Apoio ao Processo Legislativo' %}{% endblock %} + + {% block webpack_loader_css %} + {% render_chunk_vendors 'css' %} + {% render_bundle 'global' 'css' %} + {% render_bundle 'painel' 'css' %} + {% endblock webpack_loader_css %} + + + + +
+ + +
+ Logo +
+ +
+

[[ sessao_plenaria ]]

+
+ +
+
+ [[ sessao_plenaria_data ]] +
+
+ [[ sessao_plenaria_hora_inicio ]] +
-
- -
-

PAINEL ENCONTRA-SE FECHADO

-
-
-
-
-
+
+

PAINEL ENCONTRA-SE FECHADO

+
+ +
+
+
+
-
-
-
-
-
-

Parlamentares

-
- +
+
+
+
+
+

Parlamentares

+
+
- - + - - - + -
- [[ p.nome]] +
+ [[p.nome]] - [[ p.partido ]] + + [[p.partido]] - [[p.voto]] + + [[p.voto]]
-
-
+ +
+
-
A listagem de parlamentares só aparecerá quando o painel estiver aberto.
+
A listagem de parlamentares só aparecerá quando o painel estiver aberto.
 +
-
-
-
-
-

Oradores

-
- - - - - - -
- [[ o.numero]]º  [[o.nome]] -
-
-
+
+
+
+

Oradores

+
+ + + + + + +
+ [[ o.numero]]º  [[o.nome]] +
+
+
A listagem de oradores só aparecerá quando o painel estiver aberto.
 +
-
-
-
-
-
-

Cronômetros

-
- Discurso:
- Aparte:
- Questão de Ordem:
- Considerações Finais: -
-
-
-
-

Tema da Sessão Solene

- [[ sessao_solene_tema ]] +
+
+
+
+

Cronômetros

+
+ Discurso:
+ Aparte:
+ Questão de Ordem:
+ Considerações Finais: +
-
-
-
-
-

Resultado

-
- -
  • Sim: [[ numero_votos_sim ]]
    • -
  • Não: [[ numero_votos_nao ]]
    • -
  • Abstenções: [[ numero_abstencoes ]]
    • -
  • Presentes: [[ num_presentes ]]
    • -
  • Total votos: [[ total_votos ]]
    • -     -

    [[ tipo_resultado ]]

    -
    -
    -
    Não há votação, pois não há nenhuma matéria aberta ou já votada.
    -
    -
    -
    -
    -

    [[ mat_em_votacao ]]

    -
    - [[ materia_legislativa_texto ]] -
    - [[ materia_legislativa_ementa ]] -
    - [[ observacao_materia ]] -
    -
    - Não há nenhuma matéria votada ou para votação. -
    -
    -
    -
    - A Matéria em votação só aparecerá quando o painel estiver aberto -
    +
    +
    +

    Tema da Sessão Solene

    + [[ sessao_solene_tema ]] +
    -
    -
    -

    Resultado

    - -

    A votação só aparecerá quando o painel estiver aberto

    -     -
    +
    +
    +
    +

    Resultado

    +
    + +
  • Sim: [[ numero_votos_sim ]]
    • +
  • Não: [[ numero_votos_nao ]]
    • +
  • Abstenções: [[ numero_abstencoes ]]
    • +
  • Presentes: [[ num_presentes ]]
    • +
  • Total votos: [[ total_votos ]]
    • +     +

    [[ tipo_resultado ]]

    +
    +
    +
    Não há votação, pois não há nenhuma matéria aberta ou já votada.
    +
    +
    +
    +
    +

    [[ mat_em_votacao ]]

    +
    + [[ materia_legislativa_texto ]] +
    + [[ materia_legislativa_ementa ]] +
    + [[ observacao_materia ]] +
    +
    + Não há nenhuma matéria votada ou para votação. +
    +
    +
    +
    + A Matéria em votação só aparecerá quando o painel estiver aberto +
    -
    -
    - - - {% block webpack_loader_js %} - {% render_chunk_vendors 'js' %} - {% render_bundle 'global' 'js' %} - {% render_bundle 'painel' 'js' %} - {% endblock webpack_loader_js %} +
    +
    +

    Resultado

    + +

    A votação só aparecerá quando o painel estiver aberto

    +     +
    +
    +
    +
    +
    + - {% block webpack_loader_chunks_js %} - {% endblock webpack_loader_chunks_js %} + {% block webpack_loader_js %} + {% render_chunk_vendors 'js' %} + {% render_bundle 'global' 'js' %} + {% render_bundle 'painel' 'js' %} + {% endblock webpack_loader_js %} - - - + + \ No newline at end of file From 541506439d416f4fd2fd34349d53fde3246e05eb Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Thu, 26 Aug 2021 11:45:26 -0300 Subject: [PATCH 17/18] Iniciado os cronometros em VueJS --- frontend/src/__apps/painel/main.js | 45 ++++++++++++++++++++++++++++++ sapl/templates/painel/index.html | 6 ++-- 2 files changed, 48 insertions(+), 3 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index b06d64b5e..ea6ed1dbf 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -5,6 +5,11 @@ import axios from 'axios' axios.defaults.xsrfCookieName = 'csrftoken' axios.defaults.xsrfHeaderName = 'X-CSRFToken' +// Variaveis dos cronometros +var timeBegan = null +var running = false +var timeExpected = null + const v = new Vue({ // eslint-disable-line delimiters: ['[[', ']]'], el: '#app-painel', @@ -17,6 +22,7 @@ const v = new Vue({ // eslint-disable-line sessao_plenaria_data: '', sessao_plenaria_hora_inicio: '', brasao: '', + cronometro: '00:10:00', sessao_solene: false, sessao_solene_tema: '', presentes: [], @@ -129,6 +135,45 @@ const v = new Vue({ // eslint-disable-line this.mat_em_votacao = this.msgMateria() }.bind(this)) }, + stop: function stop () { + running = false + timeBegan = null + timeExpected = null + + clearInterval(this.clockRunning) + this.cronometro = '00:10:00' + }, + clockRunning () { + if (running) { + var currentTime = new Date() + var timeRemaining = new Date(timeExpected - currentTime) + + if (timeRemaining > 0) { + this.cronometro = '00:' + timeRemaining.getMinutes().toLocaleString('en-US', { minimumIntegerDigits: 2, useGrouping: false }) + + ':' + timeRemaining.getSeconds().toLocaleString('en-US', { minimumIntegerDigits: 2, useGrouping: false }) + } else { + this.cronometro.style.color = 'red' + this.stop() + } + } else { + this.stop() + } + }, + start: function startStopWatch (time) { + time *= 60 + if (running) return + + if (timeBegan === null) { + timeBegan = new Date() + timeExpected = timeBegan + timeExpected.setSeconds(timeExpected.getSeconds() + time) + } + + this.started = setInterval(() => { + this.clockRunning() + }, 100) + running = true + }, pollData () { this.fetchData() diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index c5bc219ea..fc4638709 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -59,7 +59,7 @@

    PAINEL ENCONTRA-SE FECHADO
    -
    +

    @@ -120,7 +120,7 @@

    Oradores

    Cronômetros

    - Discurso:
    + Discurso: [[ cronometro ]]
    Aparte:
    Questão de Ordem:
    Considerações Finais: @@ -135,7 +135,7 @@

    Tema da Sessão Solene

    -

    Resultado

    +

    Resultado

  • Sim: [[ numero_votos_sim ]]
    • From bb1de80a88b1973c4898c148c74b971fb3962295 Mon Sep 17 00:00:00 2001 From: AlGouvea Date: Tue, 31 Aug 2021 13:02:16 -0300 Subject: [PATCH 18/18] Cronometros do painel convertidos para VueJS --- frontend/src/__apps/painel/main.js | 141 ++++++++++++++++----- sapl/painel/views.py | 20 ++- sapl/templates/painel/index.html | 197 +++-------------------------- 3 files changed, 144 insertions(+), 214 deletions(-) diff --git a/frontend/src/__apps/painel/main.js b/frontend/src/__apps/painel/main.js index ea6ed1dbf..2328573fa 100644 --- a/frontend/src/__apps/painel/main.js +++ b/frontend/src/__apps/painel/main.js @@ -6,9 +6,11 @@ axios.defaults.xsrfCookieName = 'csrftoken' axios.defaults.xsrfHeaderName = 'X-CSRFToken' // Variaveis dos cronometros -var timeBegan = null -var running = false -var timeExpected = null +var crono = 0 +var time = null +var timeEnd = null +var audioAlertFinish = document.getElementById('audio') +var cronometroStart = [] const v = new Vue({ // eslint-disable-line delimiters: ['[[', ']]'], @@ -22,7 +24,10 @@ const v = new Vue({ // eslint-disable-line sessao_plenaria_data: '', sessao_plenaria_hora_inicio: '', brasao: '', - cronometro: '00:10:00', + cronometro_discurso: '', + cronometro_aparte: '', + cronometro_ordem: '', + cronometro_consideracoes: '', sessao_solene: false, sessao_solene_tema: '', presentes: [], @@ -39,7 +44,8 @@ const v = new Vue({ // eslint-disable-line mat_em_votacao: '', resultado_votacao_css: '', tipo_resultado: '', - tipo_votacao: '' + tipo_votacao: '', + running: 0 } }, methods: { @@ -97,7 +103,6 @@ const v = new Vue({ // eslint-disable-line converterUrl (url) { url = url.slice(-(url.length - url.lastIndexOf('/'))) url = '/painel' + url + '/dados' - console.log(url) return url }, fetchData () { @@ -133,46 +138,114 @@ const v = new Vue({ // eslint-disable-line this.tipo_resultado = response.tipo_resultado this.tipo_votacao = response.tipo_votacao this.mat_em_votacao = this.msgMateria() + + // Cronometros + cronometroStart[0] = response.cronometro_discurso + cronometroStart[1] = response.cronometro_aparte + cronometroStart[2] = response.cronometro_ordem + cronometroStart[3] = response.cronometro_consideracoes + + if (time === null) { + // Pegar data atual + this.cronometro_discurso = new Date() + this.cronometro_aparte = this.cronometro_discurso + this.cronometro_ordem = this.cronometro_discurso + this.cronometro_consideracoes = this.cronometro_discurso + + // Setar cada Cronometro + var temp = new Date() + temp.setSeconds(this.cronometro_discurso.getSeconds() + cronometroStart[0]) + var res = new Date(temp - this.cronometro_discurso) + this.cronometro_discurso = this.formatTime(res) + + temp = new Date() + temp.setSeconds(this.cronometro_aparte.getSeconds() + cronometroStart[1]) + res = new Date(temp - this.cronometro_aparte) + this.cronometro_aparte = this.formatTime(res) + + temp = new Date() + temp.setSeconds(this.cronometro_ordem.getSeconds() + cronometroStart[2]) + res = new Date(temp - this.cronometro_ordem) + this.cronometro_ordem = this.formatTime(res) + + temp = new Date() + temp.setSeconds(this.cronometro_consideracoes.getSeconds() + cronometroStart[3]) + res = new Date(temp - this.cronometro_consideracoes) + this.cronometro_consideracoes = this.formatTime(res) + } }.bind(this)) }, - stop: function stop () { - running = false - timeBegan = null - timeExpected = null + formatTime (time) { + var tempo = '00:' + time.getMinutes().toLocaleString('en-US', { + minimumIntegerDigits: 2, + useGrouping: false + }) + ':' + time.getSeconds().toLocaleString('en-US', { + minimumIntegerDigits: 2, + useGrouping: false + }) + return tempo + }, + stop: function stop (crono) { + if (crono === 5) { + audioAlertFinish.play() + } - clearInterval(this.clockRunning) - this.cronometro = '00:10:00' + this.running = 0 + clearInterval(this.started) + this.stopped = setInterval(() => { + this.timeStopped() + }, 100) + }, + timeStopped () { + timeEnd.setMilliseconds(timeEnd.getMilliseconds() + 100) }, - clockRunning () { - if (running) { - var currentTime = new Date() - var timeRemaining = new Date(timeExpected - currentTime) - - if (timeRemaining > 0) { - this.cronometro = '00:' + timeRemaining.getMinutes().toLocaleString('en-US', { minimumIntegerDigits: 2, useGrouping: false }) + - ':' + timeRemaining.getSeconds().toLocaleString('en-US', { minimumIntegerDigits: 2, useGrouping: false }) + reset: function reset () { + this.running = 0 + time = null + clearInterval(this.started) + clearInterval(this.stopped) + }, + clockRunning (crono) { + var now = new Date() + time = new Date(timeEnd - now) + + // Definir propriamento o tempo + time.setHours(timeEnd.getHours() - now.getHours()) + + if (timeEnd > now) { + if (crono === 1) { + this.cronometro_discurso = this.formatTime(time) + } else if (crono === 2) { + this.cronometro_aparte = this.formatTime(time) + } else if (crono === 3) { + this.cronometro_ordem = this.formatTime(time) } else { - this.cronometro.style.color = 'red' - this.stop() + this.cronometro_consideracoes = this.formatTime(time) } } else { - this.stop() + audioAlertFinish.play() + this.alert = setTimeout(() => { + this.reset() + }, 5000) } }, - start: function startStopWatch (time) { - time *= 60 - if (running) return - - if (timeBegan === null) { - timeBegan = new Date() - timeExpected = timeBegan - timeExpected.setSeconds(timeExpected.getSeconds() + time) + start: function startStopWatch (temp_crono) { + if (this.running !== 0) return + + crono = temp_crono + if (time === null) { + time = cronometroStart[crono - 1] + console.log(time) + timeEnd = new Date() + timeEnd.setSeconds(timeEnd.getSeconds() + time) + } else { + clearInterval(this.stopped) } + this.running = crono this.started = setInterval(() => { - this.clockRunning() + this.clockRunning(crono) }, 100) - running = true }, pollData () { this.fetchData() @@ -180,7 +253,7 @@ const v = new Vue({ // eslint-disable-line this.polling = setInterval(() => { console.info('Fetching data from backend') this.fetchData() - }, 5000) + }, 100) } }, beforeDestroy () { diff --git a/sapl/painel/views.py b/sapl/painel/views.py index 75f5a1b97..6718683cd 100644 --- a/sapl/painel/views.py +++ b/sapl/painel/views.py @@ -352,6 +352,18 @@ def get_cronometro_status(request, name): cronometro = '' return cronometro +def get_cronometro_value(request, name): + if name == 'discurso': + result = ConfiguracoesAplicacao.objects.first().cronometro_discurso + if name == 'aparte': + result = ConfiguracoesAplicacao.objects.first().cronometro_aparte + if name == 'ordem': + result = ConfiguracoesAplicacao.objects.first().cronometro_ordem + if name == 'consideracoes': + result = ConfiguracoesAplicacao.objects.first().cronometro_consideracoes + + return result.total_seconds() + def get_materia_aberta(pk): return OrdemDia.objects.filter( @@ -558,10 +570,10 @@ def get_dados_painel(request, pk): 'sessao_solene': sessao.tipo.nome == "Solene", 'sessao_finalizada': sessao.finalizada, 'tema_solene': sessao.tema_solene, - 'cronometro_aparte': get_cronometro_status(request, 'aparte'), - 'cronometro_discurso': get_cronometro_status(request, 'discurso'), - 'cronometro_ordem': get_cronometro_status(request, 'ordem'), - 'cronometro_consideracoes': get_cronometro_status(request, 'consideracoes'), + 'cronometro_aparte': get_cronometro_value(request, 'aparte'), + 'cronometro_discurso': get_cronometro_value(request, 'discurso'), + 'cronometro_ordem': get_cronometro_value(request, 'ordem'), + 'cronometro_consideracoes': get_cronometro_value(request, 'consideracoes'), 'status_painel': sessao.painel_aberto, 'brasao': brasao } diff --git a/sapl/templates/painel/index.html b/sapl/templates/painel/index.html index fc4638709..35f8f3430 100644 --- a/sapl/templates/painel/index.html +++ b/sapl/templates/painel/index.html @@ -1,5 +1,6 @@ {% load i18n %} {% load common_tags %} +{% load staticfiles %} {% load render_bundle from webpack_loader %} {% load webpack_static from webpack_loader %} @@ -120,10 +121,25 @@

    Oradores

    Cronômetros

    - Discurso: [[ cronometro ]]
    - Aparte:
    - Questão de Ordem:
    - Considerações Finais: + Discurso:[[ cronometro_discurso ]] + + +
    + + Aparte:[[ cronometro_aparte ]] + + +
    + + Questão de Ordem: [[ cronometro_ordem ]] + + +
    + + Considerações Finais: [[ cronometro_consideracoes ]] + + +
    @@ -132,7 +148,7 @@

    Tema da Sessão Solene

    [[ sessao_solene_tema ]]
    -
    +

    Resultado

    @@ -210,177 +226,6 @@

    A votação só aparecerá quando o painel estiver aberto

    $("#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(); - - var audioAlertFinish = document.getElementById("audio"); - - $('#cronometro_discurso').runner({ - autostart: false, - countdown: true, - startAt: {{ 'discurso'|cronometro_to_seconds }} * 1000, - stopAt: 0, - milliseconds: false, - format: function(value) { - let h = Math.floor((value/1000) / 3600); - 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(); - }); - - $('#cronometro_aparte').runner({ - autostart: false, - countdown: true, - startAt: {{ 'aparte'|cronometro_to_seconds }} * 1000, - stopAt: 0, - milliseconds: false, - format: function(value) { - let h = Math.floor((value/1000) / 3600); - 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(); - }); - - $('#cronometro_ordem').runner({ - autostart: false, - countdown: true, - startAt: {{ 'ordem'|cronometro_to_seconds }} * 1000, - stopAt: 0, - milliseconds: false, - format: function(value) { - let h = Math.floor((value/1000) / 3600); - 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(); - }); - - $('#cronometro_consideracoes').runner({ - autostart: false, - countdown: true, - startAt: {{ 'consideracoes'|cronometro_to_seconds }} * 1000, - stopAt: 0, - milliseconds: false, - format: function(value) { - let h = Math.floor((value/1000) / 3600); - 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(); - }); - - var discurso_previous; - var ordem_previous; - var aparte_previous; - var consideracoes_previous; - - var counter = 1; - (function poll() { - $.ajax({ - url: "{% url 'sapl.painel:dados_painel' sessao_id %}", - type: "GET", - success: function(data) { - - var discurso_current = data["cronometro_discurso"]; - if (!discurso_previous){ - discurso_previous = '' - } - - if (discurso_current != discurso_previous) { - $('#cronometro_discurso').runner(discurso_current); - discurso_previous = discurso_current; - } - - var aparte_current = data["cronometro_aparte"]; - if (!aparte_previous){ - aparte_previous = '' - } - - if (aparte_current != aparte_previous) { - $('#cronometro_aparte').runner(aparte_current); - aparte_previous = aparte_current; - } - - var ordem_current = data["cronometro_ordem"]; - if (!ordem_previous){ - ordem_previous = '' - } - - if (ordem_current != ordem_previous) { - $('#cronometro_ordem').runner(ordem_current); - ordem_previous = ordem_current; - } - - var consideracoes_current = data["cronometro_consideracoes"]; - if (!consideracoes_previous){ - consideracoes_previous = '' - } - - if (consideracoes_current != consideracoes_previous) { - $('#cronometro_consideracoes').runner(consideracoes_current); - consideracoes_previous = consideracoes_current; - } - - if($('#cronometro_discurso').runner('info').formattedTime == "00:00:30") { - audioAlertFinish.play(); - } - - if($('#cronometro_aparte').runner('info').formattedTime == "00:00:30") { - audioAlertFinish.play(); - } - - if($('#cronometro_ordem').runner('info').formattedTime == "00:00:30") { - audioAlertFinish.play(); - } - - if($('#cronometro_consideracoes').runner('info').formattedTime == "00:00:30") { - audioAlertFinish.play(); - } - }, - error: function(err) { - console.error(err); - }, - dataType: "json", - complete: null, // setTimeout(function() {poll()}, 500), - timeout: 20000 // TODO: decrease }) - })(); - }); \ No newline at end of file