Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

fbs777

Como ler um arquivo txt dentro de uma função e atualizar uma função a cada 1 seg.?

Por , em Javascript

Recommended Posts

fbs777    0

fbs777
Postado

Oi.

 

Eu tenho uma página html local que será usada apenas no meu pc (sem cliente/servidor) e preciso usar uma barra para indicar o quanto falta para chegar no número máximo definido, sendo que eu tenho um arquivo txt para eu colocar o número máximo e outro arquivo txt que um programa vai incrementando o número conforme necessário.

 

Eu achei esse script e ele já faz a parte de poder escolher o número máximo e o atual:

  

<!DOCTYPE html>
<!--
Created using JS Bin
http://jsbin.com

Copyright (c) 2017 by anonymous (http://jsbin.com/tohaqupuge/1/edit)

Released under the MIT license: http://jsbin.mit-license.org
-->
<meta name="robots" content="noindex">
<html>
<head>
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div id="wrapper">
    <div id="pb"></div>
  </div>
  <br>
  <button id="recreate" class="k-button">Re-create progressbar</button>
<script id="jsbin-javascript">
$(function(){
    createProgressBar(0, 100, 75);
});

$("#recreate").click(function(){
    $("#pb").data("kendoProgressBar").destroy();
    $("#wrapper").empty().append("<div id='pb'></div>");
    createProgressBar(100, 500, 220);
});

function createProgressBar(min, max, value) {
  $("#pb").kendoProgressBar({
    min: min,
    max: max,
    value: value
  });
}
</script>
</body>
</html>

Ele pode ser testado online: http://jsbin.com/sawatobewi/edit?html,js,output

 

O problema é que nesse código eu tenho que editar manualmente a linha     createProgressBar(0, 100, 75);  para mudar o número máximo (no caso 100) e o número atual (75).

Então eu preciso que no lugar do número 100 seja lido o conteúdo do arquivo numeromaximo.txt e no lugar do número 75 seja lido o conteúdo do arquivo numeroatual.txt

 

Em fóruns gringos vi um cara que queria ler o conteúdo de um arquivo txt mais ou menos desse jeito e disseram que não era possível quando o arquivo estiver numa máquina cliente, então ele resolveu renomeando a extensão de .txt para .js e chamou o arquivo de texto com um <script src="nomedoarquivo.js"></script>

Se for o caso eu posso renomear os arquivos para .js caso necessário.

 

Outra coisa é que esse código só atualiza o valor e a barra quando eu atualizo a página, mas eu preciso que o script atualize a barra a cada 1 segundo sem atualizar a página.

 

Se alguém souber como fazer essas 2 coisas eu agradeço.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Pita    53

Pita
Postado

Você vai precisar ler o arquivo usando o objeto FileReader

https://developer.mozilla.org/pt-BR/docs/Web/API/FileReader

 

Depois de ler o arquivo, você "joga" o valor em uma variável e ao invés de passar o valor fixo na função você usa o valor da variável

 

Para fazer o contador de tempo, você pode usar o objeto window.setInterval

https://www.w3schools.com/js/tryit.asp?filename=tryjs_setinterval2

https://www.w3schools.com/js/js_timing.asp

 

Aí acho que juntando tudo isso dá para fazer o que você quer

:D

Compartilhar este post

Link para o post
Compartilhar em outros sites

fbs777    0

fbs777
Postado

Obrigado, eu até tentei entender como funciona funções, objetos e variáveis tanto na documentação como em exemplos, mas não tô conseguindo adaptar exemplos dentro do script do 1º post.

 

Vendo alguns exemplos parece que dá pra fazer adicionando poucas linhas de código, porém não sou programador, o máximo que entendo é shell script, mas apesar do javascript ter vários comandos parecidos como for, while e vários outros, a forma de montar o script é completamente diferente do shell script, não estou tendo resultado algum.


Então eu agradeço se alguém conseguir modificar o script do 1º post com essas 2 funções:

 

1- Na linha  

 
createProgressBar(0, 100, 75);

alterar para ler o conteúdo do arquivo "numeromaximo.txt" no lugar de 100 e ler o conteúdo do arquivo "numeroatual.txt" no lugar de 75. Ambos os arquivos txt estão no mesmo diretório do arquivo html e contém apenas uma linha com um número pequeno, com cerca de 4 ou 5 dígitos.

 

2- Fazer um loop a cada 1 segundo para atualizar o resultado da barra a cada 1 segundo.

 

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito