Oficina da Net Logo

Introdução ao Silverlight - Parte 2

Usando o Visual Studio 2005 para criar um projeto "WPF/E". O SDK do "WPF/E" inclui um modelo para o Visual Studio 2005 que permite a criação de projetos "WPF/E". Para usar esse modelo no Visual Studio 2005, você precisará do service pack 1 do Visual Studio 2005.

Por | @oficinadanet Programação Pular para comentários

Usando o Visual Studio 2005 para criar um projeto "WPF/E"


O SDK do "WPF/E" inclui um modelo para o Visual Studio 2005 que permite a criação de projetos "WPF/E". Para usar esse modelo no Visual Studio 2005, você precisará do service pack 1 do Visual Studio 2005.

Em seguida, você precisará do Update to Support Web Application Projects, que pode ser baixado e instalado do site da Microsoft.

O Visual Studio agora está pronto para criar projetos "WPF/E". Inicie o Visual Studio IDE. Em seguida, selecione o menu File e clique em New Project (Novo projeto). Selecione WPFE na caixa Project Types (Tipos de projetos) à esquerda. Em Templates (Modelos), à direita, você verá o modelo JavaScript Application (Aplicativo JavaScript) WPF/E que é usado para criar um novo aplicativo "WPF/E" (Figura 1).

http://www.oficinadanet.com.br//imagens/coluna/2339//s1.gif
Figura 1. Usando o modelo do Visual Studio

Clique em OK e será aberto um novo projeto contendo uma página HTML única e um arquivo XAML representando um botão simples. É conveniente examinar o HTML para ver como ele usa o JavaScript para configurar o controle "WPF/E" (veja detalhes mais adiante) e também como o XAML expõe um evento que pode ser interceptado e manipulado no JavaScript.

Preparando um projeto do Visual Studio 2005 para "WPF/E"


Embora você possa criar um aplicativo usando o modelo da seção anterior, também é interessante entender como o "WPF/E" funciona e é entregue. Você pode ver com que facilidade um site existente pode ser configurado para implantar o módulo "WPF/E" no navegador. Nesta seção, veremos como configurar seu site manualmente para ser um site "WPF/E".

Ao escrever este white paper, usei o Visual Studio 2005 e o CTP do Orcas". Você não precisa do "Orcas", mas, se o tiver instalado, será muito mais fácil digitar o código XAML, devido ao IntelliSense e à possibilidade de visualizar o XAML concluído no designer XAML "Cider".

Observação O Cider é projetado para WPF, não para "WPF/E", portanto não deve ser usado para desenvolver o código XAML para "WPF/E" desta vez.

Para começar, inicie o Visual Studio 2005 e crie um novo site usando a caixa de diálogo New Web Site (Novo site) em File, como mostra a Figura 2.

http://www.oficinadanet.com.br//imagens/coluna/2339//s2.gif
Figura 2. Criando um novo site no Visual Studio 2005

O uso da caixa de diálogo New Web Site criará uma nova solução contendo uma página Default.aspx ASP.NET simples que, ao ser executada, gera HTML que será processado no navegador. Isso fornecerá a base para sua primeira página "WPF/E".

Em seguida, você deve adicionar o arquivo aghost.js ao seu site. Novamente, você pode fazer isso arrastando-o do Windows Explorer e soltando-o em sua solução. É recomendável mantê-lo (e todos os outros arquivos JavaScript) em uma pasta separada.

Finalmente, crie uma nova pasta na solução denominada XAML e copie nela o arquivo Popcan.xaml criado anteriormente.

Editando sua página da Web para processar conteúdo "WPF/E"


Em seguida, você editará sua página da Web para manipular o conteúdo "WPF/E" incorporado. Isso é muito simples, pois envolve apenas a adição de uma referência JavaScript única e uma chamada a um objeto JavaScript definido em aghost.js. As bibliotecas JavaScript e os instaladores "WPF/E" farão o restante.

Primeiro, edite sua página de forma que ela se assemelhe à Listagem 1: O título foi alterado de Untitled Page (Página sem título) para My first WPF/E Page! (Minha primeira página WPF/E); uma referência JavaScript a aghost.js foi adicionada ao cabeçalho; e um novo div contendo a chamada ao objeto agHost foi adicionado ao corpo da página.

Listagem 1. Código HTML default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits="_Default" %> 





    My first WPF/E Page!</title>
    <script type="text/javascript" src="agHost.js "></script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="AgControl1Host">
            <script type="text/javascript">
                new agHost("AgControl1Host", "AgControl1", "400", "400",
                "#00000000", null, "xaml/Popcan.xaml", "True", "30",
                null,0,8,5);
            </script>
        </div>
    </form>
</body>
</html></code></pre><br />
<br />
Observação A chamada JavaScript a "new AgHost" pode parecer um pouco obscura, mas não se preocupe: Você examinará isso mais adiante.<br />
<br />
Agora você está pronto para executar o aplicativo e fazer o ASP.NET gerar a página com conteúdo "WPF/E". Pressione F5 no Visual Studio 2005 para iniciar o aplicativo. Na primeira vez que você executar um aplicativo, o navegador detectará se o "WPF/E" está instalado. Se não estiver instalado, quando a página for iniciada, será exibida uma caixa de diálogo perguntando se você deseja instalar o módulo "WPF/E". O Apêndice I detalha a experiência da instalação para o Internet Explorer e o Mozilla Firefox executados no Windows.<br />
<br />
Nas próximas seções, primeiro você examinará a experiência de executar esse aplicativo no Internet Explorer e no Mozilla Firefox. Depois disso, você examinará o objeto JavaScript que controla o "WPF/E", além de adicionar animação à sua imagem.<br />
<br />
<h2>Compreendendo o JavaScript</h2><br />
A seguir está o código JavaScript que incorporou esse XAML na página usando o "WPF/E".<br />
<br />
<pre><code>new agHost("AgControl1Host", "AgControl1", "400", "400", "#00000000", 
"xaml/Popcan.xaml", "True", "30", null,0,8,5);</code></pre> <br />
<br />
Isso cria uma nova instância do plug-in "WPF/E", usando uma lista de parâmetros que podem ser usados para criá-lo. Esses parâmetros são (em ordem):<br />
<br />
<strong>hostElementID</strong>: É o nome do elemento HTML em que o controle plug-in será hospedado. Portanto, se você tiver um < div > na página que contém o plug-in, dê um nome ao < div > e use esse nome aqui.<br />
<br />
<strong>controlID</strong>: É o identificador do próprio plug-in.<br />
<br />
<strong>height</strong>: É a altura desejada do controle em pixels.<br />
<br />
<strong>width</strong>: É a largura desejada do controle em pixels.<br />
<br />
<strong>backgroundColor</strong>: É a cor do plano de fundo desejada para o controle.<br />
<br />
<strong>sourceElement</strong>: É o nome do elemento da página que contém o XAML para o controle. Essa é uma forma de configurar o XAML para o controle ? onde o XAML está na página ? contido em um elemento < script >. Se utilizar essa abordagem, coloque o identificador do elemento < script > nesse parâmetro, de onde o controle o retirará.<br />
<br />
<strong>sourceURL</strong>: É a localização de um arquivo XAML externo.<br />
<br />
<strong>isWindowless</strong>: Isso é booleano. Defina-o como True se desejar que o controle "WPF/E" não tenha janelas. Isso significa que, em uma página HTML, o controle "WPF/E" será embutido no HTML e, por exemplo, se você o definir para ser transparente, o HTML será exibido "atrás" dele. Se não for sem janelas (ou seja, se for definido como False), o conteúdo "WPF/E" ficará em uma área distinta da página e a marcação HTML fluirá ao redor.<br />
<br />
<strong>maxFrameRate</strong>: É um número que especifica a taxa máxima de quadros em que o "WPF/E" processará o conteúdo animado.<br />
<br />
<strong>loadHandler</strong>: É o nome de um elemento < script > na página a ser lançado quando o controle for carregado.<br />
<br />
<strong>errorHandler</strong>: É o nome de um elemento < script > na página a ser lançado quando ocorrer um erro no controle.<br />
<br />
Quando você cria uma nova instância de um controle agHost usando esses parâmetros, é feita uma chamada a agHost.js (portanto, você precisará de uma referência de script para este arquivo em seu HTML), que gera a marca < object > em que reside o controle. Portanto, no caso anterior, a marca < object > seguinte será gerada, se você estiver usando o Internet Explorer.<br />
<br />
<pre><code><object id="AgCotnrol1" height="400" width="400"
    Codebase="install/xcpctrl.cab"
    classid="CLSID:32C73088-76AE-40F7-AC40-81F62CB2C1DA">
    <param name="Source" value="xaml/Popcan.xaml" />
    <param name="MaxFrameRate" value="30" />
    <param name="BackgroundColor" value="#00000000" />
    <param name="WindowlessMode" value="True" />
</object></code></pre>	<br />
<br />
Se preferir, você poderá sempre usar esse código diretamente em sua página. Entretanto, o uso do objeto JavaScript é muito mais detalhado e não sobrecarrega sua página HTML nos detalhes da implementação da marca < object >.<br />
<br />
Fonte: <a onclick="_gaq.push(['_trackEvent', 'link_externo', 'de_post-1994', 'para_url_http://msdn.microsoft.com/pt-br/library/cc580591.aspx']);"   target="_blank"   href="https://www.oficinadanet.com.br/redirect.php?tipo=postout&urlout=http%3A%2F%2Fmsdn.microsoft.com%2Fpt-br%2Flibrary%2Fcc580591.aspx" rel="nofollow" >MSDN</a></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>
                        <div class="wifl m-t-30">
                            <p><strong>Recomendações do editor:</strong></p>
                            <ul class="relacionadolink"><li><a onclick="_gaq.push(['_trackEvent', 'recomendacoes_editor', 'pfr1994', 'pto24894']);" href="https://www.oficinadanet.com.br/samsung/24894-samsung-deixa-vazar-nova-linha-de-wearables-atraves-de-seu-aplicativo">Samsung deixa vazar nova linha de wearables através de seu aplicativo</a></li><li><a onclick="_gaq.push(['_trackEvent', 'recomendacoes_editor', 'pfr1994', 'pto24893']);" href="https://www.oficinadanet.com.br/ciencia/24893-dinossauro-que-viveu-ha-233-milhoes-de-anos-e-encontrado-no-brasil">Dinossauro que viveu há 233 milhões de anos é encontrado no Brasil</a></li><li><a onclick="_gaq.push(['_trackEvent', 'recomendacoes_editor', 'pfr1994', 'pto24885']);" href="https://www.oficinadanet.com.br/netflix2019/24885-filmes-sobre-fe-e-espiritualidade-para-ver-na-netflix-em-2019">Filmes sobre Fé e espiritualidade para ver na Netflix em 2019</a></li><li><a onclick="_gaq.push(['_trackEvent', 'recomendacoes_editor', 'pfr1994', 'pto24891']);" href="https://www.oficinadanet.com.br/windows10/24891-microsoft-comeca-a-testar-versao-do-windows-10-que-nao-sera-lancada-ate-2020">Microsoft começa a testar versão do Windows 10 que não será lançada até 2020</a></li><li><a onclick="_gaq.push(['_trackEvent', 'recomendacoes_editor', 'pfr1994', 'pto24862']);" href="https://www.oficinadanet.com.br/hardware/24862-melhores-mouses-ate-300">Melhores mouses até R$ 300 (Fevereiro 2019)</a></li>
                            </ul>
                        </div> 
                </div>
                <script>try { _402_Show(); } catch(e) {}</script>
            </div>  
    <div class="bar2" >
        <div class="bar2"><div class="wifl m-b-40"><span class="titulo1" ><span>Mais lidas</span></span><ul class="lst12  wifl  lsn "  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/15281-windows-10-windows-store-loja-de-aplicativos"  onclick="_gaq.push(['_trackEvent', 'barra_mais_share', 'pfr1994', 'pto15281']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/15281/loja_14080.jpg" title="Windows 10: Windows Store – Loja de Aplicativos" alt="Windows 10: Windows Store – Loja de Aplicativos" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Windows</span>
                                    <span class="tit tit2" >Windows 10: Windows Store – Loja de Aplicativos</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/netflix2018/24108-titulos-que-serao-removidos-da-netflix-em-novembro-de-2018-1-quinzena"  onclick="_gaq.push(['_trackEvent', 'barra_mais_share', 'pfr1994', 'pto24108']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24108/apa-ost_14080.jpg" title="Títulos que serão removidos da Netflix em novembro de 2018 - 1ª quinzena" alt="Títulos que serão removidos da Netflix em novembro de 2018 - 1ª quinzena" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Netflix lançamentos em 2018</span>
                                    <span class="tit tit2" >Títulos que serão removidos da Netflix em novembro de 2018 - 1ª quinze...</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/13675-como-restaurar-seu-windows-phone"  onclick="_gaq.push(['_trackEvent', 'barra_mais_share', 'pfr1994', 'pto13675']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/13675/capa_14080.jpg" title="Como restaurar as configurações de fábrica do seu Windows Phone?" alt="Como restaurar as configurações de fábrica do seu Windows Phone?" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Smartphones</span>
                                    <span class="tit tit2" >Como restaurar as configurações de fábrica do seu Windows Phone?</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/huawei/24886-telefones-chineses-representam-um-terco-do-mercado-europeu"  onclick="_gaq.push(['_trackEvent', 'barra_mais_share', 'pfr1994', 'pto24886']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24886/how-to-quick-charge-huawei-p20-pro-3_750x469_5c65b04ec4c01_14080.jpg" title="Telefones chineses representam um terço do mercado europeu" alt="Telefones chineses representam um terço do mercado europeu" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Huawei</span>
                                    <span class="tit tit2" >Telefones chineses representam um terço do mercado europeu</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/hardware/24860-5-melhores-teclados-mecanicos-ate-500-reais"  onclick="_gaq.push(['_trackEvent', 'barra_mais_share', 'pfr1994', 'pto24860']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24860/dsc06161-3_14080.jpg" title="5 melhores teclados mecânicos até 500 reais (Fevereiro 2019)" alt="5 melhores teclados mecânicos até 500 reais (Fevereiro 2019)" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Hardware</span>
                                    <span class="tit tit2" >5 melhores teclados mecânicos até 500 reais (Fevereiro 2019)</span>
                                </div>
                            </a>
                        </li></ul></div>      
        </div>
        <div class="bar2 p-rel" id="out_post_barra" data-distance="30" >
            <div class="bar2" id="post_barra" >
                <!-- /6524261/ON_300x600_LATERAL -->
                <div class='wifl m-b-40'>
                <div id='div-gpt-ad-1519730196190-0' style='height:600px; width:300px;'>
                <script>
                googletag.cmd.push(function() { googletag.display('div-gpt-ad-1519730196190-0'); });
                </script>
                </div></div>
                    <div class="box1 full rss m-b-40" >
                        <span class="tit" >Assine a nossa newsletter</span>
                        <div class="form" >
                            <form
                                    action="https://www.oficinadanet.com.br/cadastro"
                                    method="post"
                                    onsubmit="_gaq.push(['_trackEvent', 'barranewsletter', 'barranewsletter', 'barranewsletter']); return true;">

                                <input type="hidden" value="" name="uri"/>
                                <input type="hidden" name="loc" value="pt_BR"/>
                                <input class="form_campo" type="email" name="email" id="email" placeholder="seu e-mail" >
                                <input class="bt bt1" type="submit" value="OK" >
                            </form>
                        </div>
                    </div>
            </div>
        </div>
    </div>
<div class="wifl bottom_pause_post_barra"><div style="float:left;">
<div style="width: 300px; float: left;">
<!-- /6524261/ON_FOOTER -->
<div id="div-gpt-ad-1512402583744-0" style="height:250px; width:300px;">
<script>
googletag.cmd.push(function() { googletag.display("div-gpt-ad-1512402583744-0"); });
</script>
</div>
</div></div>
    <div style="float:left; max-width:750px; margin-left:20px" class="wifl"><span class="titulo1" ><span>O QUE LER EM SEGUIDA</span></span><ul class="lst4 post wifl  lsn "  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/claro/24890-claro-e-acusada-de-manipular-logo-do-45g-para-enganar-consumidores"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr1994', 'pto24890']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1"></span>
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24890/capa-blog-4.5g_750x469_5c66aacedeb83_200113.jpg" title="Claro é acusada de manipular logo do 4.5G para enganar consumidores" alt="Claro é acusada de manipular logo do 4.5G para enganar consumidores" >
                                    <span class="gradient"></span>
                                </div>
                                <span class="wifl tit4">Claro é acusada de manipular logo do 4.5G para enganar consumidores</span>
                                <div class="wifl nfo">
                                    <span class="ass-autor cor2">por Rafaela Pozzebom</span></div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/facebook/24889-facebook-monitora-locais-de-usuarios-em-que-considera-perigoso"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr1994', 'pto24889']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1"></span>
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24889/facebook_200113.jpg" title="Facebook monitora locais de usuários em que considera perigoso" alt="Facebook monitora locais de usuários em que considera perigoso" >
                                    <span class="gradient"></span>
                                </div>
                                <span class="wifl tit4">Facebook monitora locais de usuários em que considera perigoso</span>
                                <div class="wifl nfo">
                                    <span class="ass-autor cor2">por Rafaela Pozzebom</span></div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/netflix2019/24784-novidades-e-lancamentos-netflix-da-semana-1102-a-1702"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr1994', 'pto24784']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1"></span>
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24784/z-nation_200113.jpg" title="Novidades e lançamentos Netflix da semana (11/02 a 17/02)" alt="Novidades e lançamentos Netflix da semana (11/02 a 17/02)" >
                                    <span class="gradient"></span>
                                </div>
                                <span class="wifl tit4">Novidades e lançamentos Netflix da semana (11/02 a 17/02)</span>
                                <div class="wifl nfo">
                                    <span class="ass-autor cor2">por Fernanda Beling</span></div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/netflix2019/24757-titulos-que-serao-removidos-da-netflix-em-fevereiro-de-2019"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr1994', 'pto24757']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1"></span>
                                    <img src="https://www.oficinadanet.com.br/imagens/post/24757/rebeliaooo_200113.jpg" title="Títulos que serão removidos da Netflix em fevereiro de 2019" alt="Títulos que serão removidos da Netflix em fevereiro de 2019" >
                                    <span class="gradient"></span>
                                </div>
                                <span class="wifl tit4">Títulos que serão removidos da Netflix em fevereiro de 2019</span>
                                <div class="wifl nfo">
                                    <span class="ass-autor cor2">por Fernanda Beling</span></div>
                            </a>
                        </li></ul>
    </div>
<style>
    #share_container{position:relative;height:auto;margin:7px 0;display:inline-block;}
    #share_container .share_menu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;flex-wrap:wrap;margin:0;padding:0px;background-color:transparent;-webkit-box-pack:flex-start;-webkit-justify-content:flex-start;-ms-flex-pack:flex-start;justify-content:flex-start;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
    #share_container .share_menu.vertical.right{right:0;top:calc(50% - 120px);}
    #share_container .share_menu.vertical.left{left:0;top:calc(50% - 120px);}
    #share_container .share_menu.vertical{-webkit-flex-flow:column;-ms-flex-flow:column;flex-flow:column;position:fixed;padding:10px;z-index:2147483694;background-color:#fff;border-radius:2px;}
    #share_container .share_menu.vertical li{margin:5px auto;background-color:#fff;border: 1px solid #cecece;border-radius: 5px; cursor: pointer}
    #share_container .share_menu.vertical li:hover{border: 1px solid #f3661a;}
    #share_container .share_menu li{list-style:none;position:relative;text-align:center;margin:5px 2px 0px;padding:0px;font-size:0px;width:30px;height:30px;}
        #share_container .facebookShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-fb.png);display: block;}
    #share_container .twitterShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-tw.png);display: block;}
    #share_container .linkedinShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-in.png);display: block;}
    #share_container .emailShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-mail.png);display: block;}
    #share_container .whatsappShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-wa.png);display: block;}
    #share_container .telegramShare {width: 30px;height: 30px;background:  url(https://www.oficinadanet.com.br/_template/imagem/ico-bs-tg.png);display: block;}
    
@media screen and (max-width:1100px) {
    #share_container {display: none}
}
</style>
<div id="share_container" class=" left">
    <ul class="share_menu left vertical">
        <li class="share_btn visible" title="Compartilhe no Facebook"  onclick="  window.open('https://www.facebook.com/sharer/sharer.php?app_id=209309632417494&u=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dfacebook%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais','','width=600,height=400');  _gaq.push(['_trackEvent', 'btshare', 'facebook', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=facebook&utm_medium=sharebutton&utm_campaign=RedesSociais']);  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=1994','flgcomment');  " ><span class="facebookShare">Facebook</span></li>
        <li class="share_btn visible" title="Compartilhe no Twitter"  onclick="  window.open('https://twitter.com/intent/tweet?text=Introdu%C3%A7%C3%A3o+ao+Silverlight+-+Parte+2&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dtwitter%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais&via=oficinadanet','','width=600,height=400');  _gaq.push(['_trackEvent', 'btshare', 'twitter', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=twitter&utm_medium=sharebutton&utm_campaign=RedesSociais']);  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&twitter=1&id=1994','flgcomment');  " ><span class="twitterShare">Twitter</span></li>
        <li class="share_btn visible" title="Compartilhe no Linkedin"  onclick="  window.open('https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dlinkedin%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais&summary=Usando+o+Visual+Studio+2005+para+criar+um+projeto+%26quot%3BWPF%2FE%26quot%3B.+O+SDK+do+%26quot%3BWPF%2FE%26quot%3B+inclui+um+modelo+para+o+Visual+Studio+2005+que+permite+a+cria%C3%A7%C3%A3o+de+projetos+%26quot%3BWPF%2FE%26quot%3B.+Para+usar+esse+modelo+no+Visual+Studio+2005%2C+voc%C3%AA+precisar%C3%A1+do+service+pack+1+do+Visual+Studio+2005.&title=Introdu%C3%A7%C3%A3o+ao+Silverlight+-+Parte+2&source=oficinadanet','','width=600,height=400');  _gaq.push(['_trackEvent', 'btshare', 'linkedin', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=linkedin&utm_medium=sharebutton&utm_campaign=RedesSociais']);  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=1994','flgcomment');  " ><span class="linkedinShare">Linkedin</span></li>
        <li class="share_btn visible" title="Compartilhe por Email"  onclick="  document.location='mailto:?subject=Introdução ao Silverlight - Parte 2&body=Artigo: https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dshr_mail%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais';  _gaq.push(['_trackEvent', 'btshare', 'email', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=shr_mail&utm_medium=sharebutton&utm_campaign=RedesSociais']);  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=1994','flgcomment');  " ><span class="emailShare">Email</span></li>
        <li class="share_btn visible" title="Compartilhe pelo WhatsApp"  onclick="  _gaq.push(['_trackEvent', 'btshare', 'whatsapp', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=whatsapp&utm_medium=sharebutton&utm_campaign=RedesSociais']);  window.open('https://api.whatsapp.com/send?text=Introdução ao Silverlight - Parte 2 - https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dwhatsapp%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais');  " ><span class="whatsappShare">WhatsApp</span></li>
        <li class="share_btn visible" title="Compartilhe pelo Telegram"  onclick="  _gaq.push(['_trackEvent', 'btshare', 'telegram', 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2?utm_source=telegram&utm_medium=sharebutton&utm_campaign=RedesSociais']);  window.open('https://telegram.me/share/url?url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fdesenvolvimento%2Fintroducao_ao_silverlight_-_parte_2%3Futm_source%3Dtelegram%26utm_medium%3Dsharebutton%26utm_campaign%3DRedesSociais&text=Introdu%C3%A7%C3%A3o+ao+Silverlight+-+Parte+2');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=1994','flgcomment');  " ><span class="telegramShare">Telegram</span></li>
    </ul>
</div>
</div>
        <div class="wifl post-bottom1" id="boxcomment" >
            <span class="titulo1 tit_tag" ><span>Comentários</span></span>
                    <div id="btcarregarcomments_disqus" class="bt-all tpl2 wifl">Carregar comentários</div>
                    <div id="comment" class="comentarios_box">
                        <div id="disqus_thread"></div>
                    </div>
        </div>
            
    </section>
</div></div>
                <script>
                    var disqus_shortname = 'oficinadanet'; // required: replace example with your forum shortname
                    var disqus_url = 'https://www.oficinadanet.com.br/artigo/desenvolvimento/introducao_ao_silverlight_-_parte_2';

                    var disqus_config = function () {
                        this.callbacks.onNewComment = [function(comment) {ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=1994','flgcomment');
                        }];
                    };
                    function carregaComentariosDisqus()
                    {
                        $('#btcarregarcomments_disqus').hide();

                        (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>
        function loadLazyMateria()
        {carregaComentariosDisqus();         
        }
    </script>
                                <div class="wifl" >
                                    <div class="content-fix content10 bg2" >
<div class="wifl" >
    <!-- /6524261/ON_BLOCOFIM -->
    <div style="min-width:728px; max-width:970px; margin:auto" id='div-gpt-ad-1532261836772-0'>
    <script>
    googletag.cmd.push(function() { googletag.display('div-gpt-ad-1532261836772-0'); });
    </script>
    </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</a></li>
                <li><a href="https://www.oficinadanet.com.br/contato">Contato</a></li>
                <li><a href="https://www.oficinadanet.com.br/privacidade" >Política de Privacidade</a></li>
                <li><a href="https://www.oficinadanet.com.br/equipe" >Equipe</a></li>
                <li><a href="https://www.oficinadanet.com.br/siga-nossas-redes-sociais" >Todas as Redes</a></li>
            </ul>
            <ul class="menu-footer wifl">
                <li><span class="linksredes" onclick="window.open('https://www.facebook.com/oficinadanet')">Facebook</span></li>
                <li><span class="linksredes" onclick="window.open('https://www.youtube.com/user/oficinadanettv')">Youtube</span></li>
                <li><span class="linksredes" onclick="window.open('https://twitter.com/OficinadaNet')">Twitter</span></li>
                <li><span class="linksredes" onclick="window.open('https://www.instagram.com/oficinadanetoficial/')">Instagram</span></li>
                <li><span class="linksredes" onclick="window.open('https://t.me/oficinadanet')">Grupo no Telegram</span></li>
            </ul>
        </div>
        <div class="out-menu-cupons">
            <span>Descontos</span>
            <ul class="lst_cupons wifl lsn">
                <li><a href="https://www.oficinadanet.com.br/cupons/cupom-de-desconto-netshoes">Descontos Netshoes</a></li>
                <li><a href="https://www.oficinadanet.com.br/cupons/cupom-de-desconto-saraiva">Descontos Saraiva</a></li>
                <li><a href="https://www.oficinadanet.com.br/cupons/cupom-de-desconto-livraria-cultura">Descontos Livraria Cultura</a></li>
                <li><a href="https://www.oficinadanet.com.br/cupons/cupom-de-desconto-fast-shop">Descontos Fast Shop</a></li>
                <li><a href="https://www.oficinadanet.com.br/cupons/cupom-de-desconto-sou-barato">Descontos Sou Barato</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">© 2019 <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>
        <script>
                var tempo = '1800';
                window.setTimeout('location.reload();', tempo*1000);
                </script>
                <div class="wifl hgt100 blackoverlay" id="blackoverlay"></div>
<div id="out_lib" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</div>
<script>
    
    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 setCookie (name,value,expires,path,domain,secure)
    {
      document.cookie = name + "=" + escape (value) +
        ((expires) ? "; expires=" + expires.toUTCString() : "") +
        ((path) ? "; path=" + path : "") +
        ((domain) ? "; domain=" + domain : "") +
        ((secure) ? "; secure" : "");
    }
    
    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);

        
    }

    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 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 actAbreComments(act)
    {
        if(act)
        {
            var post_id        = $('#bt_new_cmt').data('post_id');
            var url            = $('#bt_new_cmt').data('url');
            var tipo           = $('#bt_new_cmt').data('tipo');
            var comentariosnrs = $('#bt_new_cmt').data('comentariosnrs');
            
            if($("#box_new_cmt_retorno").html() == '')
            {
                ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=getCommentsBox&post_id='+post_id+'&url='+url+'&tipo='+tipo+'&comentariosnrs='+comentariosnrs,'box_new_cmt_retorno');
                ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id='+post_id,'flgcomment');
            }
            
            $('#box_new_cmt_open').css('right','0');
            $('#bt_new_cmt_orelha').css('display','none');
            $('#bt_new_cmt_orelha_close').css('display','block');
            $('#bt_new_cmt_orelha_close').css('left','-30px');
        }
        else
        {
            var window_width = $(window).width();
            var right        = 'calc(-37% - 15px)';
            
            if(window_width < 1400)
            {
                right = '-330px';
            }
            
            $('#box_new_cmt_open').css('right',right);
            $('#bt_new_cmt_orelha_close').css('display','none');
            $('#bt_new_cmt_orelha').css('display','block');
            $('#bt_new_cmt_orelha').css('left','-43px');
        }
    }
    
    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');
            $('#box_popup_mobile').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 loadCheck       = 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($( ".bottom_pause_post_barra" ).length)
                {
                    bottom_pause =  $( ".bottom_pause_post_barra" ).offset().top - ( k_distance + header_height + item_movel_height + parseInt($( ".bottom_pause_post_barra" ).css('margin-top')));
                }

                //console.log('3 '+item_movel_height+' '+bottom_pause+' '+scroll_top+' '+scroll_aux2+' '+scroll_aux+' conta: '+(bottom_pause - scroll_top));
                
                //console.log('4 '+(bottom_pause - scroll_top) +' --- '+ anchor_top_dist);
                
                if( ( bottom_pause - scroll_top) < 0  ) //chega ao fim
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": 'initial',
                        "position": "fixed",
                        "bottom": "initial",
                        "transition":" 0s",
                        "top": (  (bottom_pause + k_distance + header_height) - scroll_top   )+'px'
                    });
                    if(loadCheck == 0)
                    {
                        loadLazyMateria();
                        
                        loadCheck = 1;
                    }

                }
                else if ((scroll_top + k_distance + header_height ) > anchor_top_dist) //scroll down
                {
                    k_distance = k_distance + header_height;
                    
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "top": (k_distance) + 'px',
                        "bottom": "initial",
                        "transition":" 0.8s all ease"

                    });
                }
                else if (( (scroll_top + k_distance) - comp_height ) > anchor_top_dist) //scroll up
                {
                    k_distance = k_distance + header_height;
                    
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "top": (k_distance)+'px',
                        "bottom": "initial",
                        "transition":" 0.8s all ease"
                    });
                }
                else
                {
                    $('#' + id + ' > *').css({
                        "z-index": "initial",
                        "left": 'initial',
                        "position": "initial",
                        "bottom": 'initial',
                        "top": 'initial'
                    });
                }
            }
            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 actBuscaDesktop(act)
    {
        $('#busca_clique').toggle();
        $('#busca_input').focus();
        $('#blackoverlay').addClass('blackoverlay_busca_desktop').trigger('classChange');
        blackoverlay(act);
    }

    function actBuscaObjeto()
    {
        $('#box_marca_closed').hide();
        $('#box_marca_busca').show();
        $('.box_marca').css('background-color','#f3661a');
        $('#busca_marca_input').focus();
    }

    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)
    {
        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'));
    }

    function fixedMenuDiagramado()
    {
        var scrolltop = $(window).scrollTop();

        if(scrolltop >= 350)
            $('.conteudo .out_menu_diagramado').css('top','0');
        else
            $('.conteudo .out_menu_diagramado').css('top','850px');
    };
    
    function fechaBoxBigPopup(gaq,cookie,link)
    {
        blackoverlay();
        setCookie(cookie,'1');
        _gaq.push(["_trackEvent", "popup_seguir", gaq, gaq]);
        document.location = link;
    }
    
    $(document).ready(function()
    {
            
        $(function ()
        {
            $(window).scroll(atcFixedOnScroll);
        });

        $('.disabled').click(function(e)
        {
           e.preventDefault();
        })

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

        $(window).scroll(fixedMenu);
        $(window).scroll(fixedMenuDiagramado);
        fixedMenu();
        fixedMenuDiagramado();
        $(".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(); });
        $('#smart_filtro_m_abre').click(function(){ actSmartMobile(true); });
        $('#bt_new_cmt').click(function(){ actAbreComments(true); });
        $('#bt_new_cmt_orelha').click(function(){ actAbreComments(true); });
        $('#bt_new_cmt_orelha_close').click(function(){ actAbreComments(false); });
        $('.commentcall').click(function(){scrollPageToID('boxcomment');});
        $('#busca_clique_open').click(function(){ actBuscaDesktop(true); });
        $('#box_marca_closed').click(function(){ actBuscaObjeto(); });
        $('#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_youtube_big').click(function(){ actPopup('fechar','YOUTUBEBIG'); });
        $('.fechar_youtube_mobile').click(function(){ actPopup('fechar','YOUTUBEMOBILE'); });
        $('.fechar_instagram_mobile').click(function(){ actPopup('fechar','INSTAGRAMMOBILE'); });
        $('.fechar_todasredes_mobile').click(function(){ actPopup('fechar','TODASREDESMOBILE'); });
        $('.fechar_rss_big').click(function(){ actPopup('fechar','RSSBIG'); });
        $('.fechar_twitter_big').click(function(){ actPopup('fechar','TWITTERBIG'); });
        $('.fechar_instagram_big').click(function(){ actPopup('fechar','INSTAGRAMBIG'); });
        $('.fechar_todasredes_big').click(function(){ actPopup('fechar','TODASREDESBIG'); });
        $('.todasredes').click(function(){ actPopup('abrir','TODASREDESBIG'); });
        $('#fechar_newsletter').click(function(){ actPopup('fechar','ONNEWS'); });
        $('#fechar_youtube').click(function(){ actPopup('fechar','YOUTUBEBIG'); });
        $('#popup_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $("#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) });
        $('#btcarregarcomments_disqus').click(function(){ carregaComentariosDisqus() });
        $('#btcarregarcomments_facebook').click(function(){ carregaComentariosFacebook() });
        $(".form_newsletter_cad").submit(function(event){  event.preventDefault(); newsletterCad(this,"1"); });
        $(".form_newsletter_cad2").submit(function(event){ event.preventDefault(); newsletterCad(this,"2"); });
        $(".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_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,'') });
            $('.blackoverlay_busca_desktop').click(function(){ actBuscaDesktop(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');
            }
        });

        $('.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++;
                }
            }
        }
    }
    
    
    $(".expand-gperf").click(function() {
        $(this).next().toggle();
    });

    $(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');
        });
    }
    
    </script>
<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);
});

</script>
        <div id="box_news" style=" width:300px; height:200px; display: none; position: fixed; z-index: 9999; top:18%; right:calc(50% - 100px);">
            <div style="width:300px; height:150px; background-color: white; float:left; color:white; text-align: center; font-size:15px; z-index:99999">
                <div class="redes_out">
                    <div style="width:90%; padding:5%; margin-top:-17px; background: #cd201f; color: white; float:left; margin-bottom: 20px;">
                        <strong style="font-size:25px;">OFICINA DA NET NO</strong> <strong style="font-size:35px;">YOUTUBE!</strong><br /><br />
                        Hey, só entre em nosso canal e veja o que produzimos, você vai gostar. 
                        <br /><br />
                        » <span style=' text-decoration:underline; color:white; cursor: pointer' onclick='_gaq.push(["_trackEvent", "popseguir", "youtube", "youtube"]);window.open("http://bit.ly/ontvsing");'>ENTRAR NO CANAL</span> «
                        <br /><br />
                        <span style='font-size:20px; text-decoration:underline; color:white; cursor: pointer' onclick='_gaq.push(["_trackEvent", "popseguir", "youtube", "youtube"]);window.open("https://www.youtube.com/user/OficinaDaNetTV");'><strong style="margin-bottom: 10px">INSCREVA-SE</strong></span>
                        <br />
                        <script src="https://apis.google.com/js/platform.js"></script>
                        <div class="g-ytsubscribe" data-channel="oficinadanettv" data-layout="default" data-count="default"></div>
                        <br />e <span style=' text-decoration:underline; color:white; cursor: pointer' onclick='_gaq.push(["_trackEvent", "popseguir", "youtube", "youtube"]);window.open("http://bit.ly/ontvsing");'>ative o sininho</span> 😉<br>
                   
                        <br /><br /><br />
                        <div style="cursor:pointer; font-size:13px; text-align: right " onclick="fechaBoxOficina()">Não, obrigado</div>
                    </div>
        
                    <style>
                    .newsletter1 {width: 100%; height:222px; float: left; margin: 0; background: url(ROOTIMG2/template/images/sprite1.png) 0 -408px no-repeat; -webkit-box-shadow: 0 0 0 0 rgba(204, 204, 204, 1); -moz-box-shadow:    0 0 0 0 rgba(204, 204, 204, 1); box-shadow: 0 0 0 0 rgba(204, 204, 204, 1)}
                    .newsletter1 b, .newsletter1 em {width: 100%; float: left; text-align: center; color: white}
                    .newsletter1 b {margin-top: 20px; line-height: 24px; font-size: 24px; letter-spacing: -0.065em}
                    .newsletter1 em {margin-top: 14px; line-height: 16px; font-size: 16px; letter-spacing: -0.050em }
                    .newsletter1 .news_campo, .newsletter1 .news_bt_submit {height: 50px; float: left; margin-top: 22px; font-size: 17px; font-style: italic;  border: 0px; background-color: white; -webkit-box-shadow: 2px 2px 0px 0px rgba(36, 8, 65, 1); -moz-box-shadow: 2px 2px 0px 0px rgba(36, 8, 65, 1); box-shadow: 2px 2px 0px 0px rgba(36, 8, 65, 1)}
                    .newsletter1 .news_campo {width: 320px; padding: 0 0 0 10px; margin-left: 30px; color: #484848}
                    .newsletter1 .news_bt_submit {width: 50px; color: #22093e; cursor: pointer}
                    .redes_out {width: 100%; float: left; margin:17px 0 0 0}
                    </style>
                </div>
            </div>
        </div>
        
        <script>
            function abreBoxOficina()
            {
                $('#box_news').css('display','block');
                //blackoverlay(1);
            }
            function fechaBoxOficina()
            {
                $('#box_news').css('display','none');
                actPopup('fechar','YOUTUBEBIG');
                //blackoverlay(0);
            }
            setTimeout('abreBoxOficina();','35000');
        </script>
                
<script>
    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 actAvisoTopo(act)
    {
        switch(act)
        {
            case 'instagram':
                ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONINSTAGRAM&valor=1&tempo=36000','box_instagram');
            break;
            case 'youtube':
                ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONYOUTUBE&valor=1&tempo=36000','box_youtube');
            break;
            case 'user_topo':
                ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONUSERTOPO&valor=1&tempo=36000','box_user_topo');
            break;
        }
    }

    $(document).ready(function()
    {
        $('#sininho').click(function(){ actSininho(); });
        $('#instagram_topo').click(function(){ actAvisoTopo('instagram');});
        $('#youtube_topo').click(function(){ actAvisoTopo('youtube'); });
        $('#user_topo').click(function(){ actAvisoTopo('user_topo'); });
    });

</script>

    <script>
       setTimeout("$('#box_youtube').fadeIn(1000)",1000);
       setTimeout("$('#box_youtube').fadeOut(1000)",5000);
    </script>
    <link rel="stylesheet" href="https://www.oficinadanet.com.br/_template/css/geral.css?v=803"><!-- advertising 4TpJ9Me3Sia7qHJi9IM3odw5jJ_2hupbH48Ifjbng_aL0ZNxVUTj4-ltldS-hvBNbqaBGbAM-deLE4JswQFNbQ==-->
    <script data-cfasync="false"  id="clevernt">
    (function (document, window) {
        var c = document.createElement("script");
        c.type = "text/javascript";
        c.async = !0;
        c.src = "//clevernt.com/scripts/49eda678410baaf060c3a7dad9cff960.min.js?20180622=" + Math.floor((new Date).getTime());
        var a = !1;
        try {
            a = parent.document.getElementsByTagName("script")[0] || document.getElementsByTagName("script")[0];
        } catch (e) {
            a = !1;
        }
        a || ( a = document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0]);
        a.parentNode.insertBefore(c, a);
    })(document, window);
    </script>
    <!-- end advertising -->    <div class="player_dynad_tv"></div>
    </body>
</html>