Indicador de Progresso
O indicador de progresso é um badge opcional que aparece ao lado da barra e informa ao leitor exatamente onde ele está — em porcentagem, em tempo restante, ou nos dois.
Todas as opções
| Opção | Valores | Padrão |
|---|---|---|
| Tipo | Nenhum / Porcentagem / Tempo restante / Os dois | Nenhum |
| Posição | Dentro da barra / Esquerda / Direita | Dentro da barra |
| Tamanho do texto | Auto / 8 – 32 px | Auto |
| Cor do texto | Auto (contraste) / Cor fixa | Auto |
| Velocidade de leitura | 100 – 400 ppm | 200 |
| Formato de tempo | Somente minutos / Minutos + segundos | Minutos |
| Prefixo | Qualquer texto (ex. Ainda ) | — |
| Sufixo | Qualquer texto (ex. restantes) | — |
A cor de texto "Auto" escolhe automaticamente preto ou branco de acordo com a cor da barra, para que o texto permaneça sempre legível, mesmo se você mudar a barra para uma cor clara ou escura.
O Prefixo e o Sufixo permitem construir textos naturais como Ainda 2 min restantes ou Lido: 45% sem tocar em nenhum template.
Cálculo do tempo restante
Quando o tipo de indicador inclui Tempo restante, o ReadNinja usa o número de palavras do artigo e a velocidade de leitura configurada para estimar o que ainda falta ler.
// Fórmula usada internamente
const remainingSeconds = (wordCount * (1 - progress / 100)) / wpm * 60
wordCount— número total de palavras na área de conteúdo.progress— progresso de leitura atual, de 0 a 100.wpm— a configuração Velocidade de leitura, em palavras por minuto.
Exemplo prático
Considere um artigo de 800 palavras com a velocidade de leitura padrão de 200 ppm. O leitor percorreu 50% do artigo:
remainingSeconds = (800 * (1 - 50/100)) / 200 * 60
= (800 * 0.5) / 200 * 60
= 400 / 200 * 60
= 2 * 60
= 120 segundos
Com o formato padrão Somente minutos, o badge exibe 2 min. Com Minutos + segundos, exibe 2:00.
Reduzir a velocidade de leitura para 150 ppm no mesmo artigo ao mesmo nível de progresso exibiria 2:40 (160 segundos). Aumentar para 300 ppm exibiria 1:20 (80 segundos).