Carregando arquivo - loading...

maikel · Fevereiro 18, 2008

Salve galera...

Seguinte, estou trabalhando com manuais de instruções aqui para os técnicos da minha empresa. Estes manuais são compostos por geralmente 15 páginas cada um e com várias imagens. Tenho um sistema de cadastro e faço o upload desse arquivo no formato *.mht onde cada file fica em média com 1,5 MB. Ao exibir o arquivo em uma poup-up dependendo da banda de internet do técnico, aparece a janela em branco enquanto o download do arquivo para exibição é feito, demorando as vezes até 1 minuto e o usuário acaba fechando a janela antes do tempo. Gostaria de colocar um script que verificasse quando o download foi concluído, ou seja, que fosse aparecer um "loading..." em algum lugar do poup-up enquanto o *.mht é carregado. Alguém tem algum script semelhante, sabe alguma forma de resolver esse problema... sugestões??

desde já agradeço pelo help.

Att

KaKarotto · Fevereiro 18, 2008

Vai depender um pouco de como está montando esse pop up cara....

Tem como postar o trecho do código que abre o pop up e faz o download?

Eu poderia falar algumas formas de se fazer isso, mas preciso saber como está fazendo para ver se é viável.

Akeleabraço

maikel · Fevereiro 18, 2008

Kakarotto, valeu ai pela ajuda.

Seguinte, pra chamar o poup-up uso simplesmente o método Window.Open...

meu código fica assim, onde monto o nome do arquivo em tempo de execução usando asp.net e atribuo a uma imagem no meu formulário:

<img src="image/botao_download.gif" width="14" height="14" border="0" onclick="java script:window.open('/instrucoes/arquivo.mht','instrucoes','WIDTH=700,HEIGHT=600,TOP=50,LEFT=50,scrollbars=yes');" style="cursor:pointer"/>

Dessa forma estou chamando o arquivo direto, mas se for necessário posso criar uma página específica e passar um parâmetro pela url e chamar depois o arquivo *.mht. Do jeito que estou fazendo tem como colocar esse script de loading?

Valeu

KaKarotto · Fevereiro 18, 2008

Não tem como porque está usando a janela para abrir o mht direto.

Eu vejo uma solução para isso, mas não sei se interessa para você.

E se utilizasse iframe? Tipo, você abre a nova janela numa página html onde existe um iframe centralizado e o iframe baixaria o mht.

Me parece que o mht é um arquivo de texto, estou certo?

No caso do loading, se utilizasse o iframe, poderia usar o evento onload para fazer o iframe aparecer. De início ele ficaria invisível e você poderia inserir uma imagem de loading no html.

Esse método é viável? Me tira uma dúvida, o mht é arquivo de texto?

Akeleabraço

maikel · Fevereiro 19, 2008

Mais uma vez, muito obrigado pela sua ajuda.

Em relação ao iFrame, até poderia ser, mas para este caso teria que montar uma nova estrutura que receberia o nome do arquivo *.mht que quero mostrar. Tenho vários arquivos salvos em uma pasta, e de acordo com a escolha do usuário, um deles é exibido.

Teria como através de um javascript obter um parametro que passo pela URL e buscar o arquivo desejado a ser mostrado no iFrame? Como ficaria nesse caso o script para mostrar o loading enquanto o arquivo *.mht é baixado do servidor para o browser?

Em relação ao *.mht é texto sim, texto com imagens. Faço os documentos no Word e em salvar como utilizo "Página da Web de Arquivo Único (*.mht)".

Nessa forma que estou utilizando agora, com Window.Open não teria como mostrar esse loading?

Att

KaKarotto · Fevereiro 20, 2008

maikel, esse mht aí eu não faço a menor idéia do que seja. Não segue padrão nenhum, então não sei como fazer o que deseja.

SE FOSSE HTML:

var janela=window.open("Teste.htm", "", "")
janela.document.body.innerHTML+="<img id='loading' src="Loading.gif" />
janela.onload=function(){

     janela.document.body.removeChild(
     document.getElementById('loading')
     )

}

Mas eu não sei como é esse seu arquivo. Eu ainda acho que deveria usar iframe. No seu caso seria algo assim:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>

</head>
<body>


<script type="text/javascript">
function rodaPOP(){
var janela=window.open("", "", "")

janela.document.write("<html><body></body></html>")
janela.document.write("<script>function loading(){document.body.removeChild(document.getElementById('loading'))}<\/script>")
janela.document.write("<center><iframe src='/instrucoes/arquivo.mht' onload='loading()' style='width:80%; height:500px'></iframe></center>")
janela.document.body.innerHTML+="<div id='loading'><h1>Carregando...</h1><img src='Loading.gif' /></div>"
}
</script>
<a href="#" onclick="rodaPOP()">Abre mht</a>

</body>
</html>

Bota pra rodar, veja se o iframe serve pro seu caso.

Veja, o relevante no meu código é a função rodaPOP(). Esta você colocaria na página onde chama o método window.open, onde você já tem o endereço do mht.

Abraço

maikel · Fevereiro 20, 2008

KaKarotto, achei bem interessante essa forma que você me passou...

mas vou enfrentar outro problema... eu monto todas as url's em tempo

de execução, dependendo da escolha do usuário um arquivo com nome

diferente será exibido, logo não poderei fixar <iframe src='/instrucoes/arquivo.mht'>

Tenho uma função aqui que recupera os valores passados pela URL, por exemplo: pagina.html?key=minha_instrucao.mht

Veja a função abaixo:

function getQueryString(key)
{
var url = new String(location.href);
var rxp = new RegExp('[?&]' + key + '{1}=[^&]*','gi');
var valor = new String('');

var res = new Array(rxp.exec(url));
var itm = new String('');
var pos=new Number(0);
if (res.length == 1)
{
itm = String(res[0]);
pos = itm.search(/[=]/);
valor = itm.slice(pos+1 );
}
return valor;
};

Meu problema agora é passar o resultado dessa função para o src do iframe... parece

ser bem simples, mas não estou conseguindo. Tem como fazer isto? Ou de qual outra

forma eu poderia passar o nome do arquivo para ser carregado no iframe?

Agradeço

KaKarotto · Fevereiro 20, 2008

É simples sim. Vou apenas modificar o código para fazer o que deseja:

janela.document.write("<center><iframe src="+getQueryString('key')+"onload='loading()' style='width:80%; height:500px'></iframe></center>")

Tá vendo aquele getQueryString dentro do iframe? É só isso.

Lembre-se que pode estilizar o iframe com Css para ele ficar mais bonito, mudando a borda e essas coisas...

Se tiver um endereço antes do código getQueryString, basta colocar antes da aspa e depois do src=. ex: src=instrucoes/arquivos/"+getQueryString('key')+ ...

Abraço

Entrar

Carregando arquivo - loading...

Pergunta

maikel

Link para o comentário

Compartilhar em outros sites

7 respostass a esta questão

Posts Recomendados

KaKarotto

Link para o comentário

Compartilhar em outros sites

maikel

Link para o comentário

Compartilhar em outros sites

KaKarotto

Link para o comentário

Compartilhar em outros sites

maikel

Link para o comentário

Compartilhar em outros sites

KaKarotto

Link para o comentário

Compartilhar em outros sites

maikel

Link para o comentário

Compartilhar em outros sites

KaKarotto

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades