Previsão do Tempo com a API do Google Weather

No tutorial anterior vimos como inserir o teclado virtual do Google em seu site. Hoje vamos aprender mais um pouco com as inovações do Google, só que dessa vez vamos ver a API do Google Weather, que permite a você colocar a previsão do tempo em seu site de uma maneira bem simples, usando PHP e XML, além do bom e velho HTML.

Por | @jonathanlamimkt Programação

No tutorial anterior vimos como inserir o teclado virtual do Google em seu site. Hoje vamos aprender mais um pouco com as inovações do Google, só que dessa vez vamos ver a API do Google Weather, que permite a você colocar a previsão do tempo em seu site de uma maneira bem simples, usando PHP e XML, além do bom e velho HTML e CSS (para estilizar a página).

Nesse tutorial serão utilizados 3 arquivos, que podem ser baixados ao final dessa página.

index.php
Arquivo onde está a exibição da previsão do tempo.

previsao.class.php
Arquivo com a classe e os métodos utilizados para gerar a previsão.

previsao.xml
Arquivo utilizado para que seja possível ver os resultados sem uma conexão com a internet, sendo utilizado nesse artigo somente para facilitar a compreensão e visualização dos resultados caso não se tenha uma conexão com a internet.

Antes de começar a explicar/ensinar a codificação de cada um dos arquivos citados acima, vamos entender primeiro como funciona a API e o que é preciso enviar a ela para que se tenha o retorno dos dados necessários.

Quando solicitamos ao Google Weather a uma previsão do tempo, ele busca essas informações com base em 4 parâmetros, que são: cidade, estado, país e idioma, onde no nosso caso o idioma utilizado deve ser pt-br, cidade e estado devem ser escritos por extenso e o país escrito por extenso e em inglês, no caso Brazil.

Essa solicitação é enviada para o Google através de uma URL, que tem o seguinte formato:

Base: http://www.google.com/ig/api?weather=cidade,estado,país&hl=idioma

Com parâmetros: http://www.google.com/ig/api?weather=Vitoria,Espirito Santo,Brazil&hl=pt-br

Ao enviar esses parâmetros para o Google através da URL http://www.google.com/ig/api e seus respectivos parâmetros, será retornado um arquivo XML com a previsão do tempo para a localidade solicitada.

Esse arquivo retornará os seguintes dados:
  • Informações sobre a localidade para a qual foi solicitada a previsão do tempo
  • A previsão do tempo para o dia atual
  • A previsão do tempo para os próximos 4 dias

Atenção


Toda vez que a página onde está a previsão do tempo é carregada, é feito o acesso ao Google para se obter a previsão do tempo, o que pode tornar o carregamento da página lento. Recomenda-se gravar o arquivo XML retornado pelo Google no servidor, para que o acesso aos dados seja mais rápido.

Veja abaixo um exemplo do XML retornado pelo Google.


    
        
            
            
            
            
            
            
            
        </forecast_information>
        
            
            
            
            
            
            
        </current_conditions>
        
            
            
            
            
            
        </forecast_conditions>
        
            
            
            
            
            
        </forecast_conditions>
        
            
            
            
            
            
        </forecast_conditions>
        
            
            
            
            
            
        </forecast_conditions>
    </weather>
</xml_api_reply>


Explicando o arquivo previsão.xml


< forecast information> - armazena as informações da localidade para a qual foi solicitada a previsão do tempo.
< city data=""/> - nome da cidade e o estado
< postal_code data=""/> - uma estrutura de exibição como "cidade, estado, país"
< forecast_date data="" /> - data da solicitação da previsão do tempo (data em que foi gerado o arquivo XML)
< current_date_time data="" /> - data e hora corrente
< current_conditions> - armazena as informações da previsão do tempo para a data atual
< condition data=""/> - condição do tempo (nublado, possibilidade de chuva, etc)
< temp_f data=""/> - temperatura em graus Farenheit
< temp_c data=""/> - temperatura em graus Celsius
< humidity data=""/> - Umidade do ar
< icon data=""/> - imagem que representa a condição do tempo
< wind_condition data=""/> - velocidade do vento
< forecast_conditions> - armazena as informações da previsão do tempo para os próximos 4 dias
< day_of_week data=""/> - dia da semana
< low data=""/> - temperatura mínima
< high data=""/> - temperatura máxima
< icon data=""/> - imagem que representa a condição do tempo
< condition data=""/> - condição do tempo (nublado, possibilidade de chuva, etc)

Após entender o XML, vamos ver o arquivo previsao.class.php, responsável pelos métodos que irão armazenar os parâmetros para a solicitação da previsão do tempo e a geração do XML com a previsão do tempo.


xpath('/xml_api_reply/weather/forecast_information');
        $dados['atual'] = $xml->xpath('/xml_api_reply/weather/current_conditions');
        $dados['proximos'] = $xml->xpath('/xml_api_reply/weather/forecast_conditions');

        return $dados;
    }
}
?>

Entendendo o arquivo previsao.class.php


function Parametros() - essa função é responsável por retornar um array com os parâmetros necessários para a solicitação da previsão do tempo.
function GeneratePrevTempo($parametros) - essa função gera um array multidimensional com as informações retornadas pelo Google sobre a previsão do tempo.
Na função GeneratePrevTempo($parametros) são passados os parâmetros retornados na função Parametros($cidade,$estado,$pais,$idioma), para seja feita a requisição dos dados ao Google.

Observação:
A variável $url_alternativa está sendo usada para chamar o arquivo previsao.xml, para que seja possivel rodar localmente, sem conexão com a internet. Para acessar as informações online, basta usar a variável $url.

$url = $parametros['urlapi']."?weather='" . urlencode($parametros['cidade']) ."','" . urlencode($parametros['estado']) . "','" . urlencode($parametros['pais']) . "'&hl=" . $parametros['idioma'];


Essa linha é responsável por montar a url que solicitará os dados ao Google, passando os parâmetros necessários, como explicado no inpicio desse tutorial. Repare que está sendo utilizada a função urlencode() para que seja feita a codificação correta da url, de forma que o Google consiga entender os dados enviados.
$resultado = file_get_contents($url_alternativa);

Aqui é feita a leitura do arquivo retornado para a variável $resultado. Esse arquivo, no caso deste tutorial é um XML.
$xml = simplexml_load_string(utf8_encode($resultado));

Agora fazemos a leitura da string XML armazenada em $resultado e codificada para UTF8 através da função utf8_encode();
$dados['info'] = $xml->xpath('/xml_api_reply/weather/forecast_information');
$dados['atual'] = $xml->xpath('/xml_api_reply/weather/current_conditions');
$dados['proximos'] = $xml->xpath('/xml_api_reply/weather/forecast_conditions');

Nas linhas acima separamos em um array multidimensional os valores recuperados da string XML usando xpath, onde o parâmetro passado é o caminho onde a informação deverá ser buscada dentro do XML. Esse caminho são as tags que armazenam o conteúdo, por exemplo, '/xml_api_reply/weather/forecast_information' corresponde às tags , e , respectivamente.
return $dados;

Enfim, retornamos o array com os dados da previsão do tempo, para que possam ser utilizados no arquivo index.php, que será explicado agora.

 

    Previsão do Tempo com a API do Google Weather</title>
</head>
<body>	
    <h1>Previsão do Tempo - <?php echo date('d/m/Y', strtotime($previsao['info'][0]->forecast_date['data'])); ?></h1>
    <p><b>Cidade:</b> <?php echo utf8_decode($previsao['info'][0]->city['data']); ?></p>
	
    <h2>O Tempo Hoje</h2>
    <table class="conteudo_table" style="" >
        <tr>
            <td><img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="" alt="Previsão do Tempo com a API do Google Weather" >icon['data']; ?>" alt="clima" /></td>
            <td><?php echo $previsao['atual'][0]->temp_c['data']; ?>°C<br />
            <?php echo $previsao['atual'][0]->condition['data']; ?></td>
        </tr>
    </table>
	
    <h2>Nos Próximos Dias</h3>
    <table class="conteudo_table" style="" >
        <?php foreach ($previsao['proximos'] as $item) { ?>
            <tr>
                <td><img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="" alt="Previsão do Tempo com a API do Google Weather" >icon['data']; ?>" alt="clima" /></td>
                    <td><b><?php echo $item->day_of_week['data'];?></b> - <?php echo $item->condition['data']; ?><br /><?php echo $item->low['data']; ?>/<?php echo $item->high['data']; ?>° C</td>
            </tr>
        <?php } ?>
    </table>
</body>
</html>
</code></pre><br />
<br />
<h2>Entendendo o arquivo index.php</h2><br />
Como pode ser observado, a base desse arquivo é o bom e velho HTML, então dividi o mesmo em blocos de relevância, para que fique mais fácil compreender o que está sendo executado, uma vez que o foco desse tutorial não é ensinar o HTML e sim como implementar a previsão do tempo via API.<br />
<br />
O primeiro bloco a ser visto é o seguinte:<br />
<pre><code><?php
include('prevtempo.class.php');
$parametros = PrevTempo::Parametros('Vitoria','Espirito Santo','Brazil','pt-br');
$previsao = PrevTempo::GeneratePrevTempo($parametros);
?></code></pre><br />
<br />
Nesse bloco nós damos a include do arquivo <em>prevtempo.class.php</em>, que contém os métodos responsáveis pela solicitação e manipulação dos resultados retornados pela API. <br />
Em seguida retornamos para a variável <em>$parametros</em> os parâmetros para solicitação das informações. <br />
Depois retornamos para a variável <em>$previsao</em> os dados da previsão do tempo, através da função <em>GeneratePrevTempo($parametros)</em>.<br />
<br />
<strong>O segundo bloco a ser visto é:</strong><br />
<pre><code><h1>Previsão do Tempo - <?php echo date('d/m/Y', strtotime($previsao['info'][0]->forecast_date['data'])); ?></h1>
<p><b>Cidade:</b> <?php echo utf8_decode($previsao['info'][0]->city['data']); ?></p></code></pre><br />
Na primeira linha imprimimos a data atual, que é retornada a partir do array <em>$previsao['info'][0]->forecast_date['data']</em>. Veja a explicação a seguir para compreender essa chamada.<br />
Na segunda linha imprimimos o nome da cidade e o estado usando a mesma chamada da linha 1, substituindo somente a tag com o dado a ser impresso. Usamos a função utf8_decode() para retornar à codificação padrão da página.<br />
<pre><code>$previsao['info'][0]->forecast_date['data']
array_e_posicao->tag_com_o_dado['campo_com_o_valor'] </code></pre><br />
<em><strong>Sintaxe da chamada</strong></em><br />
<br />
<strong>O terceiro bloco é:</strong><br />
<pre><code><h2>O Tempo Hoje</h2>
<table class="conteudo_table" style="" >
    <tr>
        <td><img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="" alt="Previsão do Tempo com a API do Google Weather" >icon['data']; ?>" alt="clima" /></td>
        <td><?php echo $previsao['atual'][0]->temp_c['data']; ?>°C<br />
        <?php echo $previsao['atual'][0]->condition['data']; ?></td>
    </tr>
</table></code></pre><br />
Esse bloco é muito parecido com o anterior, porém pegamos as informações da previsão do tempo para o dia atual, inserindo o dia da semana, uma imagem da condição do tempo, a temperatura e a condição do tempo. Dessa vez pegamos os dados do array na posição 'atual'.<br />
<br />
<strong>No último bloco temos:</strong><br />
<pre><code><h2>Nos Próximos Dias</h3>
<table class="conteudo_table" style="" >
    <?php foreach ($previsao['proximos'] as $item) { ?>
        <tr>
            <td><img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="" alt="Previsão do Tempo com a API do Google Weather" >icon['data']; ?>" alt="clima" /></td>
            <td><b><?php echo $item->day_of_week['data'];?></b> - <?php echo $item->condition['data']; ?><br /><?php echo $item->low['data']; ?>/<?php echo $item->high['data']; ?>° C</td>
        </tr>
    <?php } ?>
</table></code></pre><br />
Nesse bloco, como vamos ter mais de um registro, será preciso percorrer todas as posições do array, então utilizamos o loop foreach para executar essa leitura. Para cada posição do array encontrada fazemos a impressão dos dados assim como foi feito no bloco anterior.<br />
<br />
<strong>Atenção:</strong><br />
As imagens da condição do tempo devem ser inseridas usando a seguinte sintaxe:<br />
<pre><code>Base: <img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="http://www.google.com/endereco_retornado_na_requisicao" alt="Previsão do Tempo com a API do Google Weather" >
Com o parâmetro: <img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="" alt="Previsão do Tempo com a API do Google Weather" >icon['data']; ?>" alt="clima" /></code></pre><br />
<br />
<strong>Dessa forma o resultado será o demonstrado na imagem abaixo:</strong><br />
<img itemprop="image" class="lazy " title="Previsão do Tempo com a API do Google Weather" src="http://www.oficinadanet.com.br//imagens/coluna/2489/previsao.jpg" alt="Previsão do Tempo com a API do Google Weather" ><br />
<br />
Bom pessoal, chegamos ao final de mais um tutorial sobre as APIs do Google, espero que tenham gostado e que tenham aprendido mais um recurso bem legal para implementarem em seus projetos.<br />
<br />
As dúvidas podem ser postadas no nosso fórum e as esclareceremos o mais breve possível. Enviem também sugestão de tutoriais que vocês têm vontade de ler aqui no Oficina da Net.<br />
<br />
Até o próximo tutorial!!!</p></p><script src="https://painel.m3midia.com.br/lib/prism/prism.js"></script><link rel="stylesheet" type="text/css" href="https://painel.m3midia.com.br/lib/prism/prism.css"></p>
                    </div><script type="text/javascript">try { _402_Show(); } catch(e) {}</script>
                    <div class="wifl">
                        Mais sobre: <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2138', 'para_programação']);"  href="https://www.oficinadanet.com.br/programacao" >programação</a>, <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2138', 'para_desenvolvimento']);"  href="https://www.oficinadanet.com.br/desenvolvimento" >desenvolvimento</a>, <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2138', 'para_php']);"  href="https://www.oficinadanet.com.br/php" >php</a>
                        <div style="float:right">
                            <span class="bt1-facebook bg9"  onclick="  window.open('https://www.facebook.com/sharer/sharer.php?app_id=209309632417494&u=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fphp%2Fprevisao_do_tempo_com_a_api_do_google_weather','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2138','flgcomment');  "  >Share</span>
                            <span class="bt1-twitter bg8"  onclick="  window.open('https://twitter.com/intent/tweet?text=Previs%C3%A3o+do+Tempo+com+a+API+do+Google+Weather&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fphp%2Fprevisao_do_tempo_com_a_api_do_google_weather&via=oficinadanet','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&twitter=1&id=2138','flgcomment');  "  >Tweet</span>
                            <span class="bt1-telegram bg25"  onclick="  window.open('https://telegram.me/share/url?url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fphp%2Fprevisao_do_tempo_com_a_api_do_google_weather&text=Previs%C3%A3o+do+Tempo+com+a+API+do+Google+Weather');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2138','flgcomment');  "  ></span>
                            <span class="bt1-flipboard bg26"  onclick="  window.open('https://share.flipboard.com/bookmarklet/popout?v=2&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fphp%2Fprevisao_do_tempo_com_a_api_do_google_weather&title=Previs%C3%A3o+do+Tempo+com+a+API+do+Google+Weather','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2138','flgcomment');  "  ></span>
                        </div>
                    </div>
                </div>
            </div>  
        <div class="bar2 p-rel" id="out_post_barra" data-distance="30" >
            <div class="bar2" id="post_barra" ><span class="titulo1" ><span>DESTAQUES</span></span><ul class="lst12 m-b-40 wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/15683-como-resolver-o-problema-de-consumo-de-disco-em-100-no-windows"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2138', 'pto15683']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/15683/100porcento_14080.jpg" title="Vídeo: Como resolver o problema de consumo de disco em 100% no Windows" alt="Vídeo: Como resolver o problema de consumo de disco em 100% no Windows" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Guiadowindows10</span>
                                    <h3 class="tit tit2" >Vídeo: Como resolver o problema de consumo de disco em 100% no Windows</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/netflix2017/19898-novidades-e-lancamentos-netflix-da-semana-1408-20082017"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2138', 'pto19898']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19898/capa2_14080.jpg" title="Novidades e lançamentos Netflix da semana (14/08 - 20/08/2017)" alt="Novidades e lançamentos Netflix da semana (14/08 - 20/08/2017)" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >netflix2017</span>
                                    <h3 class="tit tit2" >Novidades e lançamentos Netflix da semana (14/08 - 20/08/2017)</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/16064-quais-sao-as-dez-maiores-redes-sociais"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2138', 'pto16064']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/16064/youtube_14080.jpg" title="As 10 maiores redes sociais - Atualizado" alt="As 10 maiores redes sociais - Atualizado" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Redes sociais</span>
                                    <h3 class="tit tit2" >As 10 maiores redes sociais - Atualizado</h3>
                                </div>
                            </a>
                        </li></ul><span class="titulo1" ><span>Recomendado</span></span><ul class="lst12 m-b-40 wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/14518-qual-a-linguagem-de-programacao-e-mais-bem-remunerada"  onclick="_gaq.push(['_trackEvent', 'barra_conteudo_relacionado', 'pfr2138', 'pto14518']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/14518/td_legacy-code_14080.jpg" title="Os melhores salários por linguagem de programação 2017" alt="Os melhores salários por linguagem de programação 2017" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >programação</span>
                                    <h3 class="tit tit2" >Os melhores salários por linguagem de programação 2017</h3>
                                </div>
                            </a>
                        </li></ul><span class="titulo1 m-t-10" ><span>Mais compartilhados</span></span><div class="wifl m-b-20"><ul class="lst12  wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/tecnologia/19886-policia-federal-precisa-criar-software-para-lidar-com-mais-de-1-milhao-de-gb-da-lava-jato"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66750']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19886/capa_14080.jpg" title="Polícia Federal precisa criar software para lidar com mais de 1 milhão de GB da Lava Jato" alt="Polícia Federal precisa criar software para lidar com mais de 1 milhão de GB da Lava Jato" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>248</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >Polícia Federal precisa criar software para lidar com mais de 1 milhão...</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/perifericos/19912-review-razer-deathadder-elite"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66834']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19912/capa-da-elite_14080.jpg" title="Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses" alt="Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>242</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/zenfone4/19954-asus-apresenta-o-zenfone-4-e-zenfone-4-pro"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66958']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19954/zenfone4-capa_14080.jpg" title="ASUS apresenta o Zenfone 4 e Zenfone 4 PRO" alt="ASUS apresenta o Zenfone 4 e Zenfone 4 PRO" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>207</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >ASUS apresenta o Zenfone 4 e Zenfone 4 PRO</h3>
                                </div>
                            </a>
                        </li></ul></div>      
        </div>
    </div>
            <div class="wifl conteudo"><div style="float:left;">
<div style="width: 300px; height: 250px; float: left;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ON_CONTEUDO_BOTTOM_1 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-5305121862343092"
     data-ad-slot="1981035403"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div></div>
                    <div style="float:left; max-width:750px; margin-left:20px">
                        <p><strong>Você também pode gostar de:</strong></p>
                        <ul style="list-style:square; color:#f3661a"><li><a style='color:red' href='https://www.youtube.com/user/OficinaDaNetTV?sub_confirmation=1' rel='nofollow' target='_blank'>Inscreva-se em nosso canal no Youtube</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2138', 'pto19505']);" href="https://www.oficinadanet.com.br/programacao/19505-confira-tudo-que-rolou-no-hackatour-2017">Confira tudo que rolou no Hackatour 2017</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2138', 'pto2973']);" href="https://www.oficinadanet.com.br/artigo/java/criando-um-cadastro-de-usuario-em-java">Criando um cadastro de usuário em Java</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2138', 'pto13484']);" href="https://www.oficinadanet.com.br/post/13484-qual-a-melhor-linguagem-de-programacao">Qual a melhor linguagem de programação?</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2138', 'pto17189']);" href="https://www.oficinadanet.com.br/post/17189-concurso-do-tre-sp-tem-vagas-para-ti">Concurso do TRE/SP com vagas para TI</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2138', 'pto17035']);" href="https://www.oficinadanet.com.br/post/17035-meu-site-meu-app-como-criar-aplicativo-de-seu-site">Meu Site meu App - Como criar aplicativo de seu site</a></li>
                        </ul>
                    </div>
            </div>  
        <div class="content5 post-bottom1" style="margin:0">
            
    <div class="wifl post-bottom1" >
        <span class="titulo1 tit_tag" ><span>Comentários</span></span>
        <div id="comment" class="comentarios_box">
            <div id="disqus_thread"></div>
        </div>
    </div>
        </div>
        <div class="bar2 p-rel" data-distance="30" >
            <div class="bar2 m-t-20" ><span class="titulo1 m-t-10" ><span>Continue lendo</span></span><ul class="lst12 m-b-40 wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/games/19750-rockstar-esta-desenvolvendo-gta-6"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19750/gta_14080.jpg" title="Ator Tim Neff nega ter feito captura de movimentos para GTA 6" alt="Ator Tim Neff nega ter feito captura de movimentos para GTA 6" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Games</span>
                                    <h3 class="tit tit2" >Ator Tim Neff nega ter feito captura de movimentos para GTA 6</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/microsoft/19634-sucessor-do-xbox-one-x-pode-estar-em-desenvolvimento-"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19634/xboxone-pro_14080.jpg" title="Sucessor do Xbox One X pode estar em desenvolvimento " alt="Sucessor do Xbox One X pode estar em desenvolvimento " >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Microsoft</span>
                                    <h3 class="tit tit2" >Sucessor do Xbox One X pode estar em desenvolvimento </h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/19501-taiser-de-anthem-para-ps4-foi-apresentado-no-xbox-one-"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19501/console-mi_14080.jpg" title="Trailer de Anthem para PS4 foi apresentado no Xbox One " alt="Trailer de Anthem para PS4 foi apresentado no Xbox One " >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Games</span>
                                    <h3 class="tit tit2" >Trailer de Anthem para PS4 foi apresentado no Xbox One </h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/19359-huawei-e-inatel-criam-centro-de-desenvolvimento-de-competencia-e-inovacao"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19359/inatel_14080.jpg" title="Huawei e Inatel criam Centro de Desenvolvimento de Competência e Inovação" alt="Huawei e Inatel criam Centro de Desenvolvimento de Competência e Inovação" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Negócios</span>
                                    <h3 class="tit tit2" >Huawei e Inatel criam Centro de Desenvolvimento de Competência e Inova...</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/19318-e3-2017-nintendo-anuncia-na-e3-2017-rpg-de-pokemon-"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19318/pok_14080.jpg" title="E3 2017: RPG de Pokémon é anunciado em conferência da Nintendo" alt="E3 2017: RPG de Pokémon é anunciado em conferência da Nintendo" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Games</span>
                                    <h3 class="tit tit2" >E3 2017: RPG de Pokémon é anunciado em conferência da Nintendo</h3>
                                </div>
                            </a>
                        </li></ul>
            </div>
        </div>
        
        
    </section>    
</div><div class="wifl">
<div class="wifl" >
    <div class="content-fix wifl p-b-40 p-t-40 bg2" >
        <div class="banner970250_ctr">
            <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
            <!-- ON_FIM_BIG -->
            <ins class="adsbygoogle"
                 style="display:inline-block;width:970px;height:250px"
                 data-ad-client="ca-pub-5305121862343092"
                 data-ad-slot="5294428607"></ins>
            <script>
            (adsbygoogle = window.adsbygoogle || []).push({});
            </script>
        </div>
    </div>
</div></div></div>
                </section>
<footer class="footer wifl" id="footer">
    <div class="corpo">
        <a href="https://www.oficinadanet.com.br" class="logo2"></a>
        <div class="out-menu-footer">
            <ul class="menu-footer lst-footer1 wifl">
                <li><a href="https://www.oficinadanet.com.br/sobre">Sobre nós</a></li>
                <li><a href="https://www.oficinadanet.com.br/contato">Fale conosco</a></li>
                <li><a href="https://www.oficinadanet.com.br/colunista" >Seja um colunista</a></li>
                <li><a href="https://www.oficinadanet.com.br/equipe" >Equipe</a></li>
            </ul>
            <ul class="menu-footer wifl">
                <li><a href="https://www.facebook.com/oficinadanet">Facebook</a></li>
                <li><a href="https://twitter.com/OficinadaNet">Twitter</a></li>
                <li><a href="https://www.youtube.com/user/oficinadanettv">Youtube</a></li>
                <li><a href="https://www.instagram.com/oficinadanetoficial/">Instagram</a></li>
                <li><a href="https://www.oficinadanet.com.br/rss">RSS</a></li>
            </ul>
        </div>
        <div class="box-m3"  >
            <p class="wifl txt1">Um site do grupo</p>
            <a class="m3midia" href="http://www.m3midia.com.br"></a>
            <p class="wifl txt2">© 2017 <span>M3 Mídia</span></p>
            <p class="wifl txt2">Todos os direitos reservados</p>
        </div>
    </div>
</footer>
            <span title="Ir para o topo" class="top_page" id="top_page" ><span></span></span>
        <div class="wifl hgt100 blackoverlay" id="blackoverlay"></div>
<div style="display:none" id="flgcomment"></div>
<div id="out_lib" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</div>
<script type="text/javascript">
    
    var vv={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=vv._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=vv._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}
    function BV(str){return vv.decode(str);}

    function scrollPageToID(id)
    {
        $('html,body').animate({ scrollTop: $('#'+id).offset().top - ( $(window).height() - $('#'+id).outerHeight(true) ) / 2  }, 700);
    }

    function serializeDataAttr(form)
    {
        var dataarr = new Array();
        for(var i in form.data()) {
            var subarr = new Array();
            subarr['name'] = i;
            subarr['value'] = form.data()[i];
            dataarr.push(subarr);
        }
        return $.param(form.serializeArray().concat(dataarr));
    }

    function testaVazio(campo,comparacao,mensagem,erro)
    {
        if (erro == true) {return true;}
        if (document.getElementById(campo).value == comparacao)
        {
            alert (mensagem);
            document.getElementById(campo).value = "";
            document.getElementById(campo).focus();
            return true;
        }
        else {return false;}
    }
    function testaCheckBox(classe,mensagem)
    {
        erro = true;
        checkboxes = document.getElementsByClassName(classe);

        for(var i=0, n=checkboxes.length; i<n; i++)
        {
            if(checkboxes[i].checked)
                erro = false;
        }

        if(erro == true)
        {
            alert(mensagem);
            checkboxes[0].focus();
            return true;
        }
        else
            return false;
  }
    function ajaxDireto(url,param,retorno,tipo) //usa jquery
    {
        if(!tipo) tipo = "POST"
         $.ajax({
           type: tipo,
           url: url,
           data: param,
           success: function(html){
             $("#"+retorno).html(html);
           }
         });

    }

    function newsletterCad(e,step)
    {
//        alert(step);
//        alert(e);

        if(step == 1)
        {
            alert('1');
            $(e+' .out_captcha').html('<div class="wifl p-rel newsbrandcap" id="brand_cap_widget_wrapper" ><span class="load-ico" ></span></div><script type="text/javascript" src="https://api.pontamedia.net/challenge.php?k=8f8436b8ae2f804f336e902439085b08a914db96"></script'+'>');
            alert('2');
//            $('#news_bb_right_plan').css('left','-306px');
        }
        else
        {
            /*
            ajaxDireto('',$('#newscad_form1').serialize()+'&'+$('#newscad_form2').serialize(),'out_new_cad');
            */
        }
    }

    function populaSelectCidade(ele)
    {
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=populaSelectCidade&sigla='+$(ele).val(),'select_cidade');
    }

     $(document).ready(function (e) {
        var header_height = $("header").height();
        $(window).scroll(function(){
            var scrolltop = $(window).scrollTop();
            if(scrolltop > 0)
                $('#out-img-curso-aberto').css('top',(($(window).scrollTop()/2) *-1) + header_height);
            else
                $('#out-img-curso-aberto').css('top',header_height+'px');
        });
    });

    var scroll_aux      = 0;
    var header_top      = $("#header").offset().top;
    var header_height   = $("#header").outerHeight();
    var window_height   = $(window).height();
    var height_document = $(document).height();

    function fixedMenu()
    {
        var scroll = $(window).scrollTop();

        if( scroll >= (header_top+header_height) )
        {
            if(scroll < scroll_aux )
            {
                $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
            }
            else
            {
                if( (scroll+window_height+20) > height_document )
                {
                    $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
                }
                else
                {
                    var v_tra  = '0.3s';
                    if( scroll <= ( header_top + header_height + 100) )
                        v_tra  = '0s';

                    $('#mov_header').css({'position':'fixed',transition: v_tra,'top':'-'+header_height+'px'});
                }
            }
        }
        else if(scroll <= header_top)
        {
            $('#mov_header').css({'position':'absolute',transition: '0.3s','top':'0px'});

        }
        scroll_aux = scroll;
    }

    function boxHoverSite(act,cic,e)
    {
        var top     = $(e).offset().top+$(e).outerHeight();
        var e_hover = '';

        if($(e).data('box-hover'))
        {
            e_hover = '#'+$(e).data('box-hover')+'_hover';

            switch(act)
            {
                case 2:
                    $('.contr_hov_itens').fadeOut(0);
                    $(e_hover).fadeIn(400);
                    $(e_hover).addClass('contr_hov_itens');
                    boxHoverSite(0,0,e);
                break;
                case 0:
                    if(cic < 5)
                    {
                        var timeBoxHoverSite = setTimeout(function()
                        {
                            cic++;
                            boxHoverSite(0,cic,e);
                        }, 500);
                    }
                    else
                    {
                        clearTimeout(timeBoxHoverSite);
                        if(!$(e_hover).is(":hover") && !$(e).is(":hover") && !$(e_hover+' *').is(":focus"))
                        {
                            $(e_hover).fadeOut(400);
                        }
                        else
                            boxHoverSite(0,0,e);
                    }

                break;
            }
        }
        else
        {
            $('.contr_hov_itens').fadeOut(0);
        }
    }

    function blackoverlay(act)
    {
        if(act)
        {
            $('#blackoverlay').fadeIn(400);
            $('html').addClass('no_scroll');
        }
        else
        {
            $('#blackoverlay').fadeOut(400);
            $('html').removeClass('no_scroll');
        }
    }

    function actAovivo()
    {
        window.location = "";
    }

    function actBodyPago()
    {
        window.open("");
    }

    
    function actSininho()
    {
        _gaq.push(['_trackEvent', 'sininho', 'sininho', 'sininho']);
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONSININHO&valor=1&tempo=36000','box_sininho');
        setTimeout("document.location = 'https://www.oficinadanet.com.br/novidades'",1000);
    }

    function actMenuMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_mobile').trigger('classChange');

            if(!$('#menumobile-act').data('post-left'))
            {
                $('#menumobile-act').data('post-left',$('#menumobile-act').css('left'));
            }
            $('#menumobile-act').css('left','0');
            $('#menumobile').css('display','none');
            $('#fechar_menumobile').css('display','block');
        }
        else
        {
            $('#menumobile-act').css('left',$('#menumobile-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_mobile').trigger('classChange');
            $('#menumobile').css('display','block');
            $('#fechar_menumobile').css('display','none');
        }
        blackoverlay(act);
    }

    function actPopup(act,tipo)
    {
        if(act == 'fechar')
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome='+tipo+'&valor=1','box_popup');
            $('#box_popup').css('display','none');
            $('#box_popup_big').css('display','none');
            blackoverlay();
        }
    }

    function actSmartMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_smart').trigger('classChange');

            if(!$('#smart_filtro_m-act').data('post-left'))
            {
                $('#smart_filtro_m-act').data('post-left',$('#smart_filtro_m-act').css('left'));
            }
            $('#smart_filtro_m-act').css('left','0');
            $('#smart_filtro_m_abre').css('display','none');
            $('#smart_filtro_m_fecha').css('display','block');
            $('#smart_filtro_ud_out').css('display','block');
        }
        else
        {
            $('#smart_filtro_m-act').css('left',$('#smart_filtro_m-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_smart').trigger('classChange');
            $('#smart_filtro_m_abre').css('display','block');
            $('#smart_filtro_m_fecha').css('display','none');
            $('#smart_filtro_ud_out').css('display','none');
        }
        blackoverlay(act);
    }

    var scroll_aux2     = 0;
    var window_width    = $(window).width();

    function fixedOnScroll(id)
    {
        if ($('#' + id).length > 0)
        {
            if( window_width > 1300 )
            {

                var k_distance      = 10;
                var comp_height     = 0;
                var scroll_top      = $(window).scrollTop();
                var height_maior    = false;
                var bottom_pause    = height_document;

                var anchor_top_dist     = $('#' + id).offset().top;
                var item_movel_height   = $('#' + id + ' > *').height();

                if ($('#' + id).data('distance'))
                {
                    k_distance = $('#' + id).data('distance');
                }


                if( item_movel_height+k_distance > window_height )
                {
                    height_maior    = true;
                    comp_height     = (item_movel_height - window_height );
                }

                if($( ".bottom_pause_post_barra" ).length)
                {
                    bottom_pause =  $( ".bottom_pause_post_barra" ).offset().top - ( item_movel_height + parseInt($( ".bottom_pause_post_barra" ).css('margin-top')) +k_distance);
                }

                if( bottom_pause  < scroll_top && !height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist )+'px'
                    });
                    //console.log('1 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if( ( bottom_pause + k_distance )  < ( scroll_top - comp_height  ) && height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist  )+'px'
                    });
                    //console.log('2 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top - k_distance) - comp_height ) > anchor_top_dist && height_maior)
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "bottom": k_distance + 'px',
                        "top": "initial"
                    });
                    //console.log('3 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top + k_distance) - comp_height ) > anchor_top_dist && !height_maior)
                {
                    if(scroll_aux2>scroll_aux)
                    {
                        k_distance = k_distance + header_height;
                        //console.log('4 '+scroll_aux2+' '+scroll_aux);
                    }
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "top": k_distance+'px',
                        "bottom": "initial"
                    });
                    //console.log('4 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else
                {
                    $('#' + id + ' > *').css({
                        "z-index": "initial",
                        "left": 'initial',
                        "position": "initial",
                        "bottom": 'initial',
                        "top": 'initial'
                    });
                    //console.log('5 '+( ( bottom_pause ) - anchor_top_dist ));
                }
            }
            scroll_aux2 = scroll_top;
        }
    }

    function actBtVerMais(e)
    {
        var id = $(e).data('target');
        $('#'+id).show();
        $(e).hide();
    }

    function atcFixedOnScroll()
    {
        fixedOnScroll('out_post_barra');
    }

    function actContatoEmpresa(act,tipo)
    {
        if(act && tipo != 0)
        {

            if(tipo == 1)
                $('#empresa_contato_titulo').html('Entre em contato');
            else
                $('#empresa_contato_titulo').html('Solicite um orçamento');

            $('#hidden_tipo').val(tipo);

            $('#blackoverlay').addClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato').fadeIn(400);
            $('#empresa_contato').height($('#empresa_contato'+' > *').outerHeight());
        }
        else
        {
            $('#empresa_contato').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato_titulo').html('');
        }
        blackoverlay(act);
    }

    function actCorrigirTexto(act,e)
    {
        if($('#modal_corrigir_txt').length == 0)
        {
            $(e).data('corrigir_titulo');
            $("html").append('<div class="modal modal-s block corrigir" id="modal_corrigir_txt" ><span class="load-ico" ></span></div>');
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=corrigirTexto&monta=1&corrigir_titulo='+$(e).data('corrigir_titulo')+'¶_email='+$(e).data('para_email'),'modal_corrigir_txt');
        }


        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_corrigir').trigger('classChange');
            $('#modal_corrigir_txt').fadeIn(400);
        }
        else
        {
            $('#modal_corrigir_txt').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_corrigir').trigger('classChange');
        }
        blackoverlay(act);
    }

    function newsletterCad(ele,s)
    {
        if(s == '1')
        {
            var cad_idx = $(ele).data('idx');
            $('#'+cad_idx+'_form2 .out_captcha').html('<div class="wifl p-rel newsbrandcap" id="brand_cap_widget_wrapper" ><span class="load-ico" ></span></div><script type="text/javascript" src="https://api.pontamedia.net/challenge.php?k=8f8436b8ae2f804f336e902439085b08a914db96"></script'+'>');
            $('#'+cad_idx+'_ulcad').css('left',$('#'+cad_idx+'_ulcad').outerWidth()*-1);
//            $('#'+$(ele).data('id_ulout')).css('height',$('#'+cad_idx+'_ulcad .stp2').outerHeight());
        }
        else
        {
            var cad_idx = $(ele).data('idx');
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php',$('#'+cad_idx+'_form1').serialize()+'&'+$('#'+cad_idx+'_form2').serialize(),$(ele).data('id_ulout'));
        }
    }

    $(document).ready(function()
    {
        
//        $(function () {
//            $(window).scroll(atcFixedOnScroll);
//        });

        $('.box_hover').mouseenter(function()
        {
            boxHoverSite(2,0,this);
        });

        $(window).scroll(fixedMenu);
        fixedMenu();
        $(".amenu_diagramado").click(function(){scrollPageToID($(this).attr('href').substring(1));});
        $(".bt_ver_mais").click(function(){ actBtVerMais(this); });
        $(".ver_mais_preco_obj").click(function(){ scrollPageToID('precos'); });
        $('#bt_header_busca').click(function(){ $('#busca_input').focus();});
        $('#smart_filtro_ud_dwn').click(function(){$(".smart_filtro").animate({scrollTop: '+=200px'}, 300);});
        $('#smart_filtro_ud_up').click(function(){$(".smart_filtro").animate({scrollTop: '-=200px'}, 300);});
        $('#mobile_busca').click(function(){ $('#mobile_bf').css('display','block');});
        $('#aovivo').click(function(){ actAovivo(); });
        $('#sininho').click(function(){ actSininho(true); });
        $('#smart_filtro_m_abre').click(function(){ actSmartMobile(true); });
        $('#smart_filtro_m_fecha').click(function(){ actSmartMobile(false); });
        $('#menumobile').click(function(){ actMenuMobile(true); });
        $('#fechar_menumobile').click(function(){ actMenuMobile(false); });
        $('.fechar_newsletter_big').click(function(){ actPopup('fechar','NEWSBIG'); });
        $('#fechar_newsletter').click(function(){ actPopup('fechar','ONNEWS'); });
        $('#fechar_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#popup_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#fechar_sininho').click(function(){ actSininho(false); });
        $("#form_envia").click(function(){ submitFormulario(); });
        $("#mostra_fone").click(function(){ $('#empresa_fone').html(BV($('#empresa_fone').data('info'))); $('#mostra_fone').hide(); });
        $(".empresa_contato").click(function(){ actContatoEmpresa(true,$(this).data('tipo'));});
        $('#empresa_contato_fechar').click(function(){ actContatoEmpresa(false,0) });
        $('.act_corrigir_texto').click(function(){ actCorrigirTexto(true,this) });
        $('.bt1-comment').click(function(){ scrollPageToID('comment') });
        $('#btcarregarcomments').click(function(){ carregaComentarios() });
//        $('.obj_filtro_preco').click(function(){ labelObjFiltroPreco(this);});

        $(".form_newsletter_cad").submit(function(event){  event.preventDefault(); newsletterCad(this,'1'); });
        $(".form_newsletter_cad2").submit(function(event){ event.preventDefault(); newsletterCad(this,'2'); });

        $('#blackoverlay').on('classChange',function(){
            $('.blackoverlay_sininho').click(function(){ actSininho(false) });
            $('.blackoverlay_mobile').click(function(){ actMenuMobile(false) });
            $('.blackoverlay_smart').click(function(){ actSmartMobile(false) });
            $('.blackoverlay_cont_empresa').click(function(){ actContatoEmpresa(false,0) });
            $('.blackoverlay_corrigir').click(function(){ actCorrigirTexto(false,'') });
        });


        $('.accordion_act1 .i-tit').click(function(e)
        {
            if($(this).prop("tagName") != 'A')
            {
                $(this).addClass('click');
                $('.li-wrapper:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });
                $('.i-tit:not(\'.click\')').removeClass('ativo');

                if(!$(this).hasClass('ativo'))
                {
                    $(this).addClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:$(this).find('+ .li-wrapper > .accordion_act1').outerHeight()}, { duration: 400, queue: false });
                }
                else
                {
                    $(this).removeClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:0},400);
                }
                $(this).removeClass('click');
            }
        });


        if($('#tem_enquete').length > 0)
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=getEnquete&enquete_id='+$('#tem_enquete').data("id"),'tem_enquete');
        }

        $('.accordion_act2 .tit_1').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp1:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_id         = 'wrapper_'+$(this).data('wrap0');
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_1').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                $('.tit_1').removeClass('ativo');
            }
            $(this).removeClass('click');
        });

        $('.accordion_act2 .tit_2').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp2:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            var wrapper1_id = 'wrapper_'+$(this).data('wrap0');
            var wrapper2_id = 'wrapper_'+$(this).data('wrap0')+'_'+$(this).data('wrap1');

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();
                var wrapper2_height     = $('#'+wrapper2_id+' > .accordion_act2 > li').length* $('#'+wrapper2_id+' > .accordion_act2 > li').outerHeight();


                $('#'+wrapper1_id).animate({height:wrapper1_height+wrapper2_height}, { duration: 400, queue: false });
                $('#'+wrapper2_id).animate({height:wrapper2_height}, { duration: 400, queue: false });

                $('.tit_2').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                var wrapper1_height = $('#'+wrapper1_id+' > .accordion_act2 > li').length*$('#'+wrapper1_id+' > .accordion_act2 > li > .tit_2').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_2').removeClass('ativo');
            }
            $(this).removeClass('click');
        });
    });

    var lst_carregamento        = 1;
    var txtstatus               = 'ok';
    var html_ico_load_auto_load = '<span id="icoload_autoload" class="wifl p-rel" ><span class="load-ico" ></span></span>';
    function carregaConteudo()
    {
        if($('#auto_load_wrapper').length > 0)
        {
            var scrollPosition      = window.pageYOffset;
            var windowSize          = window.innerHeight;
            var footerHeightTop     = $('#footer').offset().top;

            var stop_load           = document.getElementById('auto_load_wrapper').getAttribute('data-stop-load');

            if((scrollPosition + windowSize + 800) > footerHeightTop && stop_load == '0')
            {
                if(txtstatus == 'ok')
                {
                    $("#auto_load_wrapper").append(html_ico_load_auto_load);
                    txtstatus = 'timeout';
                    $.ajax({
                        type: 'POST',
                        url: 'https://www.oficinadanet.com.br/ajax_oficina.php',
                        data: 'act=autoLoadConteudo&lst_carregamento='+lst_carregamento+'&'+serializeDataAttr($('#auto_load_wrapper')),
                        success: function(html)
                        {
                            $("#auto_load_wrapper").append(html);
                            $("#icoload_autoload").remove();
                            txtstatus = 'ok';
                        }
                    });
                    lst_carregamento++;
                }
            }
        }
    }

    $(function () {
        $(window).scroll(carregaConteudo);
        carregaConteudo();
    });

    $(window).scroll(function() {
        if ($(this).scrollTop() >= 150) {
            $('#top_page').fadeIn(200);
        } else {
            $('#top_page').fadeOut(200);
        }
    });
    $('#top_page').click(function() {
        $('body,html').animate({
            scrollTop : 0
        }, 500);
    });


    if ($(".carousel_destaque")[0])
    {
        $('#out_lib').append('<link href="https://painel.m3midia.com.br/lib/slick/slick.css" rel="stylesheet">');
        $.getScript("https://painel.m3midia.com.br/lib/slick/slick.js", function(){
            $('.carousel_destaque').slick({
                slidesToShow: 1,
                slidesToScroll: 1,
                autoplay: true,
                pauseOnHover: true,
                autoplaySpeed: 10000
            });
            setTimeout(function(){
                $('.carousel_destaque').removeClass('carregando');;
            }, 1500);
        });
    }

    if ($(".conteudo_galeria")[0])
    {
        $('#out_lib').append('<link href="https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.css" rel="stylesheet">');
        $.getScript("https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.js", function(){
            $('.conteudo_galeria').lightSlider({
           item: 3,
           loop:false,
           slideMove:3,
           easing: 'cubic-bezier(0.25, 0, 0.25, 1)',
           speed:600,
           responsive : [
               {
                   breakpoint:800,
                   settings: {
                       item:3,
                       slideMove:1,
                       slideMargin:6,
                     }
               },
               {
                   breakpoint:480,
                   settings: {
                       item:2,
                       slideMove:1
                     }
               }
           ]
            }).lightGallery({

            });
            $('.out_conteudo_galeria').css('display','block');
        });
    }

    (function ($) {
        $.fn.tweetHighlighted = function(options) {
            var settings = {}, classes;
            options = options || {};
            settings.node = options.node || '<button type="button">Tweet</button>';
            settings.cssClass = options.cssClass || 'tweet-me';
            settings.minLength = options.minLength || 1;
            settings.maxLength = options.maxLength || 144 * 4;
            settings.extra = options.extra || '';
            settings.via = options.via || null;
            settings.popupArgs = options.popArgs || 'width=400,height=400,toolbar=0,location=0';
            settings.callback = options.callback || null;
            classes = settings.cssClass.split(' ').filter(function(item) {return item.length;});
            settings._selector = '.' + classes.join('.');

            var onTextSelect = function(selector, callback) {
                function getSelectedText() {
                  if (window.getSelection) {
                        return window.getSelection().toString();
                  } else if (document.selection) {
                    return document.selection.createRange().text;
                  }
                  return '';
                };
                $(selector).mouseup(function(e) {
                  var text = getSelectedText();
                  if (text !== '') {
                    callback(e, text);
                  }
                });
                $(document).click(function(e) {
                  var text = getSelectedText();
                  if (text !== '') {
                    e.stopPropagation();
                  }
                  else
                    $(settings._selector).fadeOut(500).remove();
                });
            };

            var getTweetURL = function(text, extra, via) {
                var url = 'https://twitter.com/intent/tweet?url=http://www.oficinadanet.com.br/artigo/php/previsao_do_tempo_com_a_api_do_google_weather&via=oficinadanet&text=';
                url += encodeURIComponent(text);
               if (extra)
                    url += encodeURIComponent(' ' + extra);
                if (via)
                    url += '&via=' + via;
                return url;
            };

            onTextSelect(this, function(e, text) {
                var btnExists = $(settings._selector).length, url;

                if (btnExists || text.length > settings.maxLength
                    || text.length < settings.minLength)
                return;

                url = getTweetURL(text, settings.extra, settings.via);
                $(settings.node).addClass(settings.cssClass
                 ).offset({top: e.pageY,
                           left: e.pageX}
                 ).css({position: 'absolute',
                        cursor: 'pointer'}
                 ).appendTo('body'
                 ).fadeIn(500
                 ).click(function(e) {
                     $(settings._selector).fadeOut(500).remove();
                     window.open(url, '_blank', settings.popupArgs);
                     if( settings.callback != null ){
                       settings.callback(text);
                     }
                 });
            });
        };
    })(jQuery);

    $(function() {
        $('.conteudo').tweetHighlighted({
            node: '<span>Compartilhe no Twitter</span>',
            cssClass: 'bt1-twitter bg8 btn btn-primary highlighted',
            minLength: 2,
            maxLength: 2000 * 2,
            via: 'twitterhandle',
            popupArgs: 'width=600,height=400,toolbar=0,location=0'
        });
      });
</script>

            <script type="text/javascript">
                var disqus_shortname = 'oficinadanet'; // required: replace example with your forum shortname
                var disqus_url = 'https://www.oficinadanet.com.br/artigo/php/previsao_do_tempo_com_a_api_do_google_weather';

                var disqus_config = function () {
                    this.callbacks.onNewComment = [function(comment) {ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2138','flgcomment');
                    }];
                };
                (function() {
                    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
                    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
                })();
            </script>
            <div style="display:none;" id="flgcomment"></div>
        
<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async></script>
<script>
var OneSignal = OneSignal || [];
OneSignal.push( function() {
    OneSignal.setDefaultTitle("Oficina da Net");
    OneSignal.setDefaultNotificationUrl("https://www.oficinadanet.com.br");
    var oneSignal_options = {appId: "c28261c1-6765-4517-bc5f-38bbeb9f2ec3"};
    //oneSignal_options['persistNotification'] = false;
    oneSignal_options['autoRegister'] = true;
    oneSignal_options['welcomeNotification'] = { };
    oneSignal_options['welcomeNotification']['title'] = "Oi. Obrigado pela inscrição =)";
    oneSignal_options['welcomeNotification']['message'] = "As melhores novidades avisaremos por aqui ;) - Siga @oficinadanet";
    oneSignal_options['safari_web_id'] = "web.onesignal.auto.2068edc0-2ec7-4d8d-bc37-83913e3acbff";
    OneSignal.init(oneSignal_options);
});


            var tempo = '2500';
            window.setTimeout('location.reload();', tempo*1000);</script>
        <div id="box_popup" class="box_news youtube">
            <div class="act fechar_box_popup box_hover p-rel" id="fechar_youtube"></div>
            <span class="wifl">AINDA NÃO SE INSCREVEU?</span>
            <p class="wifl">Vem ver os vídeos legais que<br>estamos produzindo no Youtube.</p>
            <div style=" position: absolute; background: white; padding:5px 25px; right:11%; bottom:50px;">
                <script src="https://apis.google.com/js/platform.js"></script>
                <div class="g-ytsubscribe" data-channel="oficinadanettv" data-layout="default" data-count="default"></div>
            </div>
            <a href="http://bit.ly/ontvsing" target="_blank" rel="nofollow" class="popup_youtube m-t-30" id="popup_youtube"></a>
        </div>
        <script type="text/javascript">
            function abreBoxOficina()
            {
                $('#box_popup').css('display','block');
            }
            setTimeout('abreBoxOficina();','8000');
        </script>
                <script type="text/javascript">
            setTimeout("$('#box_sininho').fadeIn(1000)",1000);
        </script>
        <link rel="stylesheet" type="text/css" href="https://www.oficinadanet.com.br/_template/css/geral.css?v=400"><script src="https://api.cazamba.com/03303c1e265cde1d3eac045f1de60862.js" type="text/javascript"></script>
    </body>
</html>