Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Solucionado (ver solução)

Como atualizar a interface do Electron no Timer? Não está atualizando :( Está tudo ok no debug porém não atualiza

Index.html

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Alura Timer - André</title>
</head>
<body>
    <section id="container">
        <div href="#" id="link-sobre">
            <img src="img/info_icon.svg" alt="botão de informações do aplicativo">
        </div>
        <h1 class="titulo">Alura Timer</h1>
        <div class="timer">
            <div class="relogio">
                <span class="tempo">0:10:23</span>
            </div>
            <div class="controles">
                <img src="img/btn-play.png" class="btn-play" alt="botão de start">
            </div>
            <div class="curso-container">
                Lógica-programação
            </div>
        </div>
    </section>
<script src="js/renderer.js"></script>
<script src="js/timer.js"></script>
</body>
</html>

Renderer.js

const { ipcRenderer } = require('electron');
const path = require('path');
const timer = require(path.resolve(__dirname, 'js/timer'));

document.querySelector("#link-sobre")
    .addEventListener('click', () => ipcRenderer.send('abrir-janela-sobre'));

let btnPlay = document.querySelector('.btn-play');
let tempo = document.querySelector('.tempo');

let imgs = ['img/btn-play.png','img/btn-stop.png'];
btnPlay.addEventListener('click', function(){
    imgs = imgs.reverse();
    timer.iniciar(tempo);
    btnPlay.src = imgs[0];    
});

Timer.js


const moment = require('moment');
let segundos;

module.exports = {
    iniciar(el){
        let tempo = moment.duration(el.textContext);
        segundos = tempo.asSeconds();
        setInterval(()=>{
            segundos++;
            el.textContext = this.segundoParaTempo(segundos);
        },1000);
    }, 
    segundoParaTempo(segundos){
        return moment().startOf('day').seconds(segundos).format('HH:mm:ss');
    }
}

Alguém pode ajudar?

1 resposta
solução

Achei o erro!!! Estou usando o textContext, sendo que o mesmo não existe... é textContent com 'n' e não 'x'...

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software