Aprendendo a usar o Krpano

Softwares disponíveis para publicar na internet, visualização no computador, formatos e conversão para impressão, papéis, tamanhos e tudo afim.
Avatar do usuário
Léo Carvalho
Mensagens: 36
Registrado em: 12 Mai 2012, 15:05
Localização: Prados
Contato:

Aprendendo a usar o Krpano

Mensagem por Léo Carvalho » 13 Jun 2012, 13:22

Olá Cartola! Tudo certo?

As duas últimas panorâmicas que você postou no site, ficaram muito boas, principalmente por causa da galeria de fotos.
Achei muito bom mesmo, tanto que tentei de tudo para colocar nas minhas. Infelizmente, não consegui nem a pau, tentei até não querer mais.
Acessei o site krpano.com, baixei os arquivos, fiz vários testes, mas não sou tão fera quanto você.
Procurei exaustivamente pela internet e não achei nenhum tutorial, nenhum passo a passo que eu pudesse entender e adaptar às minhas panorâmicas.
Fiz alguns testes com essa galeria: http://krpano.com/examples/10814/exampl ... llery.html
Eu até conseguir fazer algumas alterações nela, porém não conseguir adaptar nas minhas panorâmicas de jeito nenhum.
Não conseguir sobrepor uma a outra como você fez.
Estou aqui mais uma vez para pedir sua ajuda e sugerir que através desse novo tópico, você possa nos ensinar como fazer isso.
Um passo a passo, tutorial ou que você achar melhor.
Aguardo seu retorno.
Grande abraço e muito obrigado mais uma vez.
Léo Carvalho (www.pradosmg.com.br)

Avatar do usuário
cartola
Site Admin
Mensagens: 1228
Registrado em: 11 Mai 2012, 12:40
Localização: Rio de Janeiro
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por cartola » 14 Jun 2012, 10:36

Oi Léo, tudo tranquilo? E aí, quando chega a T3? :)

Cara, realmente eu tive que ralar por muitas horas pra conseguir fazer o esquema daquele álbum e não é simples nem fazer nem te passar. Como não vou ter tempo pra isso hoje nem amanhã, te adianto que usei esse plugin http://krpano.com/plugins/userplugins/a ... forkrpano/ que normalmente aponta pra outros panoramas, então mudei a ação dele na programação xml.

Você pode também tentar baixar meus xml's e tá tudo lá, é só copiar. Veja que eu não encapsulo as coisas num swf, então se você acessar meu index.html vai acessar os xml a partir dali e depois um se refere ao outro.

Me diz aí se conseguir, daí me poupa o esforço de estruturar a coisa pra te passar no fim-de-semana.

Eu ainda quero aprimorar várias coisas ali, principalmente tentar deixar de usar o plugin, que é em flash, e não funciona em dispositivos apple.

Abração!

Avatar do usuário
cartola
Site Admin
Mensagens: 1228
Registrado em: 11 Mai 2012, 12:40
Localização: Rio de Janeiro
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por cartola » 15 Jun 2012, 18:45

Fala Léo, blz?

Vou tentar te passar aqui sem nada muito estruturado, pois eu mesmo não tenho nada muito estruturado.

A programação do álbum está presente em alguns arquivos xml separados. Podia ser diferente, mas está assim.
  • Primeiro eu separo as imagens que vou querer no álbum, coloco todas num frame quadrado preto e salvo com 800x800 e também crio as miniaturas com 60x60 - faço isso via script com o Imagemagick num unix
  • coloco o plugin original numa pasta chamada gallery com os arquivos que vieram com ele (um monte)
  • Baixe os meus arquivos index.xml, galleryaction.xml e gallery.xml da mesma URL em que está um panorama desses com álbum
  • No index.xml
    • tem que alterar os números nos loops "for( set(i, 0), i LT XX" pelo número de imagens do álbum
    • em 'dec(imgAtual, 1, 0, NUM);' e em 'inc(imgAtual, 1, NUM, 0);' troque os números que estiverem em NUM pelo número de fotos - 1
    • Troque o trecho entre <image> e </image> pelo que veio no index.xml que o krpano gerou pra sua imagem panorâmica
  • No gallery.xml
    • Tem que ter um <pic> ... </pic> pra cada foto. Ali você aponta pras miniaturas (thumb) e pra ação que terá que ter o mesmo nome da ação no galleryaction.xml
  • No galleryaction.xml tem que ter um <plugin> pra cada foto e uma <action> correspondente pra cada uma. Tem que configurar os nomes apropriadamente.
  • É no <plugin> que você vai apontar pro nome da imagem grande que aparecerá
Eu boto o nome original dos arquivos e coloco um nome com numeração nas ações e nos plugins, como vai poder notar. Fiz um script em shell pra fazer essas coisas a partir de templates, então embora esteja aparentemente pouco prático e está realmente pouco estruturado, eu gero a galeria rodando um comando, mas tem que ter um unix... tem um aí?

Abraços, Cartola!



O index.xml

Avatar do usuário
Léo Carvalho
Mensagens: 36
Registrado em: 12 Mai 2012, 15:05
Localização: Prados
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por Léo Carvalho » 15 Jun 2012, 20:14

Olá. Por aqui tudo certo! E com você?
Olha só; muito obrigado pela resposta, mas isso é para profissional, não dá para mim.
Sei muito de informática, mas sei tanto de programação.
Entendo de html, javascript, css e outras coisas, mas nada a nível muito aprofundado.
Como já te disse, nunca tive um professor, aprendi minha vida toda sozinho, pela internet.
Muita coisa não consegui aprender e na minha cidade e região, não existem cursos bons.
Unix eu nunca mexi na vida, nem sei para que serve (acho que é um sistema operacional né!?)
Valeu! Mais uma vez obrigado pelo tempo dispensado.
Grande abraço e ótimo fim de semana.
Léo Carvalho (www.pradosmg.com.br)

Avatar do usuário
cartola
Site Admin
Mensagens: 1228
Registrado em: 11 Mai 2012, 12:40
Localização: Rio de Janeiro
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por cartola » 16 Jun 2012, 10:30

Falaê Léo,

não aprendeu tudo online? Então, aprende mais essa por aqui! rs

O comentário sobre unix foi só um comentário, isso aí vc vai fazer num editor de texto simples. É só copiar e colar, só que é muita coisa, daí parece complexo, mas é só trabalhoso. Vou botar a coisa mais mastigada, mas gostaria que em homenagem a esse meu esforço você tentasse uma última vez por aí, blz? Se quiser uma dica de editor pra windows, gosto do Notepad++, que vai deixar os comandos coloridos, facilitando a verificação de erros.

Não mastiguei muito antes por dois motivos, achar que você, como um possível programador, ia se virar, e por falta de tempo pra fazer um passo-a-passo mais simples. Mas veja só, hoje é um lindo sábado ensolarado, praia rolado... como a rapazeada aqui em casa está toda dormindo, vou caprichar numa receita de bolo pra isso!

Vamos lá então, não tema!!! Ontem ouvi a história de um cego que se graduou, acho que é um desafio maior!!!
  • Crie sua panorâmica e crie sua publicação com o krpano, gerando um arquivo chamado index.xml como a configuração principal (não adianta gerar um swf consolidado)
    • Pra isso eu uso o kmakemultires, que vem com o krpano-tools, sobre uma imagem equirretangular nomeada como index.jpg
    • Pra coisa ficar mais organizada faça isso numa pasta vazia, só com o index.jpg nela
    • No windows o krpano-tools é uma série de arquivos .bat, então tem lá um kmakemultires.bat
    • Abra um windows explorer e arraste o index.jpg sobre o kmakemultires.bat e ele fará todo o resto
    • Imagino que se alguém usa linux ou Mac vai saber se virar quanto a isso
  • Baixe o arquivo anexo e descompacte onde criou os arquivos do krpano.
    arquivos_modelo.zip
    (39.5 KiB) Baixado 664 vezes
  • Coloque os arquivos defaultskin.xml e buttons.png dentro da pasta skin criada pelo kmakemultires, substituindo os que lá estiverem. Se preferir salve os originais em outra pasta ao invés de sobrescrevê-los.
  • Prepare suas imagens
    • Coloque cada uma sobre um fundo preto quadrado e converta-as para 800x800 com esse fundo
    • Dê a elas os nomes imagem0.jpg, imagem1.jpg, imagem2.jpg, imagem3.jpg ... e as coloque numa pasta chamada "galeria", dentro da pasta onde estamos trabalhando
    • Inicie a numeração pelo 0
    • De cada quadrado desses crie também uma miniatura com 60x60 com os nomes thumb-imagem0.jpg, thumb-imagem1.jpg, thumb-imagem2.jpg, ...
  • No arquivo gallery.xml
    • Acrescente ao final do arquivo um trecho como este abaixo correspondente a cada imagem

      Código: Selecionar todos

      <pic>
              <thumb>galeria/thumb-imagemXX.jpg</thumb>
              <panoToLoadXml>thumbXXaction</panoToLoadXml>
              <about>Texto</about>
      </pic>
    • Troque em cada trecho desses o XX pelo número correspondente à imagem
    • Em todas essas substituições tenha cuidado pra não botar um espaço onde não tem e não coloque números tipo 00, 01, 02, use apenas os algarismos significativos pois a programação feita está baseada nisso e espera algo assim: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, ...
    • Troque em cada trecho desses o "Texto" pelo que quiser que aparece ao passar o mouse sobre a miniatura. Eu tenho deixado isso em branco. Se quiser deixar em branco também basta apagar o "Texto". Vai ficar então algo assim:

      Código: Selecionar todos

      <pic>
              <thumb>galeria/thumb-imagem0.jpg</thumb>
              <panoToLoadXml>thumb0action</panoToLoadXml>
              <about>Texto para a imagem0</about>
      </pic>
      <pic>
              <thumb>galeria/thumb-imagem1.jpg</thumb>
              <panoToLoadXml>thumb1action</panoToLoadXml>
              <about>Texto para a imagem1</about>
      </pic>
      <pic>
              <thumb>galeria/thumb-imagem2.jpg</thumb>
              <panoToLoadXml>thumb2action</panoToLoadXml>
              <about>Texto para a imagem2</about>
      </pic>
    • Quando acabar esses trechos, feche o arquivo com o comando:

      Código: Selecionar todos

      </images>
    • Pode salvar e sair desse arquivo que essa etapa acabou
  • Abra agora o galleryaction.xml
    • A partir do final dele acrescente um trecho como o abaixo correspondente a cada imagem

      Código: Selecionar todos

              <action name="thumbXXaction">
                      action(hideimages);
                      set(plugin[imageXX].visible, true);
                      set(plugin[frame].visible, true);
                      set(plugin[setad].visible, true);
                      set(plugin[setae].visible, true);
                      set(imgAtual, XX);
              </action>
      
    • Troque todos os XX para cada trecho pelo número da imagem, iniciando na imagem zero como sempre
    • Finalizada a inclusão dos trechos acima, um pra cada imagem, comece agora, ainda no mesmo arquivo, a colocar os trechos abaixo, novamente um pra cada imagem

      Código: Selecionar todos

              <plugin name="imageXX" url="galeria/imagemXX.jpg" visible="false"
                      enabled="true" capture="true" zorder="0" alpha="1"
                      blendmode="normal" smoothing="true" align="center"
                      x="0" y="-20" scale="1" onclick="action(hideimages);"
              />
      
    • Como sempre, troque os XX pelo número da imagem, iniciando na zero
    • Quando terminar isso tudo insira no final do arquivo o comando:

      Código: Selecionar todos

      </krpano>
    • Pode então salvar e fechar esse arquivo
  • Vamos agora ao arquivo index.xml. Vamos na prática criar um novo a partir de 3 arquivos que estão no anexo: index.xml_1, index.xml_audio e index.xml_2
  • Sugiro usar como base o index.xml_1, então abra ele no editor de texto
  • Em outro editor de texto (ou numa nova aba do Notepad++ se o estiver usando) abra o seu arquivo index.xml, o que foi gerado para a sua foto panorâmica
  • Encontre o trecho entre os comandos <image> e </image> pois precisaremos copiá-lo. Eis um exemplo desse trecho onde criei uma publicação com multi-resolução usando o kmakemultires do krpano-tools.

    Código: Selecionar todos

            <image type="CUBE" multires="true" tilesize="955" progressive="false">
                    <level tiledimagewidth="3820" tiledimageheight="3820">
                            <cube url="index.tiles/l3_%s_%0v_%0h.jpg" />
                    </level>
                    <level tiledimagewidth="1910" tiledimageheight="1910">
                            <cube url="index.tiles/l2_%s_%0v_%0h.jpg" />
                    </level>
                    <level tiledimagewidth="955" tiledimageheight="955">
                            <cube url="index.tiles/l1_%s_%0v_%0h.jpg" />
                    </level>
                    <mobile>
                            <cube url="index.tiles/mobile_%s.jpg" />
                    </mobile>
                    <tablet>
                            <cube url="index.tiles/tablet_%s.jpg" />
                    </tablet>
            </image>
    
  • Encontrado o trecho, copie do index.xml e cole no final do index.xml_1
  • Se for usar algum áudio
    • copie o arquivo index.xml_audio pro final do atual index.xml_1, já editado com o trecho das imagens
    • Pode fazer isso, por exemplo, abrindo ele em outro editor (ou outra aba do Notepad++), copiando ele todo e colando no final do index.xml_1
    • Seu áudio deve se chamar audio.mp3 e deve ser colocado aí na pasta onde está trabalhando.
    • Se não for usar áudio de fundo pode não só pular o passo anterior como também apagar os arquivos soundinterface.swf e soundinterface.js
  • Seguindo na edição do index.xml_1, acrescente ao final dele agora o index.xml_2 dos modelos que baixou
  • No trecho que acabou de incluir encontre as ocorrências de __TOP1__ e __TOP2__, são duas de cada
  • Substitua __TOP2__ pelo número total de fotos que colocou no álbum. Por exemplo, se colocou imagem0.jpg, imagem1.jpg e imagem2.jpg então __TOP2__ deve ser 3, pois são 3 imagens.
  • Substitua __TOP1__ pelo número total de fotos menos 1. No exemplo acima __TOP1__ deveria ser então igual a 2
  • Feito isso está, finalmente, tudo pronto em termos de edição
  • Salve o arquivo index.xml_1 e feche todos os arquivos abertos em editores
  • Renomeie seu index.xml original para um outro nome qualquer, tipo temporario.xml
  • Renomeie então o index.xml_1 para index.xml
Viu, moleza!!! São uma série grande de operações básicas que até meu sobrinho faz! kkkk

Enfim, imagino que isso possa servir pra você e pra outros também. Claro que pode ter alguma falha no que te passei aí, então faça assim, teste e se der erro, ao invés de tentar ver onde está o erro, me diga quantas imagens usou e me passe seu index.xml que eu gero os arquivos pra você pra você comparar.

Grande abraço, Cartola!

Waldiney Silva
Mensagens: 4
Registrado em: 16 Jul 2012, 15:05
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por Waldiney Silva » 17 Jul 2012, 15:45

Ola Cartola
Eu segui o tutorial, e tive alguns problemas

Um erro que aconteceu, é o seguinte, aparece a galeria, no rodapé, mas quando eu clico na foto, ela amplia na tela, mas depois não fecha.

Ai segue outros erros.

INFO: krpano 1.0.8.14 (build 2012-03-16)
INFO: Flashplayer WIN 11.3.300.265 PlugIn
WARNING: not local trusted - ExternalInterface disabled!
WARNING: unknown action: fazvetor
ERROR: download of "clique-arraste.png" failed

O que pode ser feito para resolver?, desde já agradeço.

Avatar do usuário
cartola
Site Admin
Mensagens: 1228
Registrado em: 11 Mai 2012, 12:40
Localização: Rio de Janeiro
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por cartola » 19 Jul 2012, 17:22

Oi Waldiney,

um dos erros ali é fácil e não causa o problema da imagem não fechar. É o erro do download da imagem clique-arraste.png. Você pode ou criar uma imagem vazia com esse nome e botar aí no diretório com as coisas ou apagar as linhas que definem o plugin com essa imagem no arquivo de configuração.

O outro erro, que diz que não conheçe a ação "fazvetor" é o que não está deixando a imagem fechar, eu acho. O problema é que estou em meio a uma viagem de férias e isso está no meu computador em casa. Além de estar no meio da correria da viagem, mal parando no hotel. Não sei se lembro bem, mas acho que no final das contas não usei essa ação "fazvetor". Pode tentar eliminar a chamada pra ela ou ver onde a ação está criada, se em algum arquivo que mencionei ela está criada.

Se realmente não conseguir me fale, pois volto ao Brasil dia 23 e depois então olhar isso com mais calma.

Um abraço, Cartola.

Avatar do usuário
cartola
Site Admin
Mensagens: 1228
Registrado em: 11 Mai 2012, 12:40
Localização: Rio de Janeiro
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por cartola » 25 Jul 2012, 07:31

Oi Waldiney,

andei tentando ver qual seria o seu problema, mas ainda não cheguei a uma conclusão. Estou com uma suspeita, mas preciso de um retorno seu. Acho que você deve estar acessando o arquivo localmente em seu computador, sem usar um servidor web. Se estiver fazendo isso provavelmente tem que alterar a configuração do flash do seu navegador pra que o plugin em flash possa acessar os arquivos no seu disco.

Isso é uma medida de segurança padrão no flash. Imagine se um plugin flash pudesse, por padrão, acessar arquivos do seu disco. Ao acessar qualquer site um plugin malicioso poderia acessar seus arquivos e obter informações sigilosas, até mesmo senhas do seu micro.

Pra configurar você tem que ir nessa página do site da adobe (fabricante do flash) e depois:
  • Clique em "Como eu chego até o Gerenciador de configurações?"
  • Clique em seguida em "Painel Configurações de segurança global"
  • Vai aparecer uma página com um plugin flash para configurar seu flash. Vá na terceira aba (ou a que tem um cadeado)
  • Vai mudar a tela do plugin, dando opção pra escolher locais de onde confiar em plugins. Escolha a pasta de onde quer acessar o arquivo do panorama.
  • Talvez uma opção melhor seja escolher uma pasta acima de onde criará outras pastas para outros panoramas, se pretender fazer isso mais vezes, senão vai precisar adicionar pastas aí toda hora.
Depois nos diga se foi isso mesmo, se funcionou.

Abs, Cartola.

Waldiney Silva
Mensagens: 4
Registrado em: 16 Jul 2012, 15:05
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por Waldiney Silva » 25 Jul 2012, 09:55

Ola Cartola, fiz a configuração conforme descrita e funcionou sim,
muito obrigado pela atenção, valeu mesmo.

Waldiney Silva
Mensagens: 4
Registrado em: 16 Jul 2012, 15:05
Contato:

Re: Aprendendo a usar o Krpano

Mensagem por Waldiney Silva » 17 Jul 2013, 14:15

Ola Cartola

Volto ao fórum depois de algum tempo.
Estou com problema para fazer o zoom funciona no scroll do mouse, já peguei vários exemplos, mas com nenhum consegui, por isso agradeceria muito se puder me ajudar.

Responder