From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- .../index.html | 130 +++ .../add-ons/extensoes_bootstrapped/index.html | 352 +++++++ files/pt-pt/archive/add-ons/index.html | 11 + .../index.html | 375 +++++++ .../index.html | 286 +++++ .../apps/ferramentas_e_frameworks/index.html | 45 + files/pt-pt/archive/apps/index.html | 14 + .../pt-pt/archive/b2g_os/api/camera_api/index.html | 38 + .../b2g_os/api/camera_api/introducao/index.html | 178 ++++ files/pt-pt/archive/b2g_os/api/index.html | 156 +++ .../building_apps_for_firefox_os/index.html | 361 +++++++ .../manifesto/index.html | 926 +++++++++++++++++ .../archive/b2g_os/firefox_os_apps/index.html | 140 +++ .../localiza\303\247\303\243o/index.html" | 101 ++ .../index.html" | 690 +++++++++++++ files/pt-pt/archive/b2g_os/index.html | 241 +++++ .../archive/b2g_os/phone_guide/flame/index.html | 305 ++++++ files/pt-pt/archive/b2g_os/phone_guide/index.html | 53 + files/pt-pt/archive/b2g_os/simulator/index.html | 118 +++ .../index.html" | 283 +++++ files/pt-pt/archive/css3/index.html | 1090 ++++++++++++++++++++ files/pt-pt/archive/devtools_api_social/index.html | 213 ++++ files/pt-pt/archive/firefox_os/index.html | 11 + files/pt-pt/archive/index.html | 25 + files/pt-pt/archive/mdn/index.html | 20 + .../conteudo_mdn_em_webplatform.org/index.html | 19 + .../archive/meta_docs/escrever_conteudo/index.html | 58 ++ files/pt-pt/archive/meta_docs/index.html | 12 + files/pt-pt/archive/meta_docs/trello/index.html | 101 ++ .../pt-pt/archive/mozilla/drag_and_drop/index.html | 142 +++ files/pt-pt/archive/mozilla/index.html | 10 + .../pt-pt/archive/mozilla/uris_and_urls/index.html | 122 +++ files/pt-pt/archive/mozilla/xbl/index.html | 36 + .../archive/mozilla/xul/comunidade/index.html | 6 + files/pt-pt/archive/mozilla/xul/image/index.html | 154 +++ files/pt-pt/archive/mozilla/xul/index.html | 83 ++ .../archive/mozilla/xul/namespaces/index.html | 153 +++ .../archive/mozilla/xul/outros_recursos/index.html | 6 + files/pt-pt/archive/mozilla/xul/scale/index.html | 235 +++++ .../adicionar_etiquetas_e_imagens/index.html | 102 ++ .../tutorial/ficheiros_de_propriedade/index.html | 115 +++ .../pt-pt/archive/mozilla/xul/tutorial/index.html | 142 +++ .../modificar_o_tema_predefinido/index.html | 70 ++ .../mozilla/xul/tutorial/xbl_bindings/index.html | 215 ++++ files/pt-pt/archive/normas_web/index.html | 151 +++ .../o_detetor_plugin_hang_detector/index.html | 46 + .../como_o_rss_trabalha/index.html" | 18 + .../archive/rss/como_come\303\247ar/index.html" | 57 + .../o_que_\303\251_rss/index.html" | 242 +++++ .../porque_usar_rss/index.html" | 22 + .../rss/como_come\303\247ar/sindicar/index.html" | 99 ++ files/pt-pt/archive/rss/index.html | 47 + .../archive/rss/vers\303\243o/0.90/index.html" | 79 ++ "files/pt-pt/archive/rss/vers\303\243o/index.html" | 107 ++ files/pt-pt/archive/themes/index.html | 11 + .../index.html | 123 +++ 56 files changed, 8945 insertions(+) create mode 100644 files/pt-pt/archive/add-ons/communication_between_html_and_your_extension/index.html create mode 100644 files/pt-pt/archive/add-ons/extensoes_bootstrapped/index.html create mode 100644 files/pt-pt/archive/add-ons/index.html create mode 100644 files/pt-pt/archive/add-ons/interaction_between_privileged_and_non-privileged_pages/index.html create mode 100644 files/pt-pt/archive/add-ons/trabalhar_com_multiprocessos_firefox/index.html create mode 100644 files/pt-pt/archive/apps/ferramentas_e_frameworks/index.html create mode 100644 files/pt-pt/archive/apps/index.html create mode 100644 files/pt-pt/archive/b2g_os/api/camera_api/index.html create mode 100644 files/pt-pt/archive/b2g_os/api/camera_api/introducao/index.html create mode 100644 files/pt-pt/archive/b2g_os/api/index.html create mode 100644 files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/index.html create mode 100644 files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/manifesto/index.html create mode 100644 files/pt-pt/archive/b2g_os/firefox_os_apps/index.html create mode 100644 "files/pt-pt/archive/b2g_os/firefox_os_apps/localiza\303\247\303\243o/index.html" create mode 100644 "files/pt-pt/archive/b2g_os/firefox_os_apps/permissoes_de_aplica\303\247\303\243o/index.html" create mode 100644 files/pt-pt/archive/b2g_os/index.html create mode 100644 files/pt-pt/archive/b2g_os/phone_guide/flame/index.html create mode 100644 files/pt-pt/archive/b2g_os/phone_guide/index.html create mode 100644 files/pt-pt/archive/b2g_os/simulator/index.html create mode 100644 "files/pt-pt/archive/b2g_os/utilizar_o_gestor_de_aplicac\303\265es/index.html" create mode 100644 files/pt-pt/archive/css3/index.html create mode 100644 files/pt-pt/archive/devtools_api_social/index.html create mode 100644 files/pt-pt/archive/firefox_os/index.html create mode 100644 files/pt-pt/archive/index.html create mode 100644 files/pt-pt/archive/mdn/index.html create mode 100644 files/pt-pt/archive/meta_docs/conteudo_mdn_em_webplatform.org/index.html create mode 100644 files/pt-pt/archive/meta_docs/escrever_conteudo/index.html create mode 100644 files/pt-pt/archive/meta_docs/index.html create mode 100644 files/pt-pt/archive/meta_docs/trello/index.html create mode 100644 files/pt-pt/archive/mozilla/drag_and_drop/index.html create mode 100644 files/pt-pt/archive/mozilla/index.html create mode 100644 files/pt-pt/archive/mozilla/uris_and_urls/index.html create mode 100644 files/pt-pt/archive/mozilla/xbl/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/comunidade/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/image/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/namespaces/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/outros_recursos/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/scale/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/tutorial/adicionar_etiquetas_e_imagens/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/tutorial/ficheiros_de_propriedade/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/tutorial/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/tutorial/modificar_o_tema_predefinido/index.html create mode 100644 files/pt-pt/archive/mozilla/xul/tutorial/xbl_bindings/index.html create mode 100644 files/pt-pt/archive/normas_web/index.html create mode 100644 files/pt-pt/archive/plugins/out_of_process_plugins/o_detetor_plugin_hang_detector/index.html create mode 100644 "files/pt-pt/archive/rss/como_come\303\247ar/como_o_rss_trabalha/index.html" create mode 100644 "files/pt-pt/archive/rss/como_come\303\247ar/index.html" create mode 100644 "files/pt-pt/archive/rss/como_come\303\247ar/o_que_\303\251_rss/index.html" create mode 100644 "files/pt-pt/archive/rss/como_come\303\247ar/porque_usar_rss/index.html" create mode 100644 "files/pt-pt/archive/rss/como_come\303\247ar/sindicar/index.html" create mode 100644 files/pt-pt/archive/rss/index.html create mode 100644 "files/pt-pt/archive/rss/vers\303\243o/0.90/index.html" create mode 100644 "files/pt-pt/archive/rss/vers\303\243o/index.html" create mode 100644 files/pt-pt/archive/themes/index.html create mode 100644 files/pt-pt/archive/utilizar_normas_web_nas_suas_paginas_da_web/index.html (limited to 'files/pt-pt/archive') diff --git a/files/pt-pt/archive/add-ons/communication_between_html_and_your_extension/index.html b/files/pt-pt/archive/add-ons/communication_between_html_and_your_extension/index.html new file mode 100644 index 0000000000..c3b06f74f9 --- /dev/null +++ b/files/pt-pt/archive/add-ons/communication_between_html_and_your_extension/index.html @@ -0,0 +1,130 @@ +--- +title: Comunicação entre HTML e a sua extensão +slug: Archive/Add-ons/Communication_between_HTML_and_your_extension +tags: + - Desenvolvimento da Web + - Extensões + - Extras +translation_of: Archive/Add-ons/Communication_between_HTML_and_your_extension +--- +

Consulte também Interação entre páginas privilegiadas e não privilegiadas.

+ +

Comunicação entre uma página HTML e a extensão

+ +

After building a sample extension by reading carefully and following the complete instructions for Building an Extension I was able to get an extension that could display something on the status bar. What I wanted to do was have an extension "look" for something on an HTML page and if it found that something perform some operation on the found thing and then update the status bar with the results of the operation. With a lot of help from irc://irc.mozilla.org#js and irc://irc.mozilla.org#extdev I was able to get it running pretty well, but I still would rather have the client less responsible for pinging the extension to "look" for what is on the page.

+ +
O que eu tentei
+ + + + + +

The basic problem with the event model is probably due to what I was trying to do. In my HTML I have an input element in a form. I set the onBlur action to a little javascript function that performed a standard AJAX request to get a result. The onreadystatechange was set to another little javascript function that would update a specific element on the HTML page with the result. The result of the AJAX request was the something that I wanted the extension to find. There were only a handful of events that seemed relevant (Load, Change, DOMInsertNode, DOMInsertNodeIntoDocument, DOMActivate) and I tried them all in many different ways. Some of the events only apply to certain types of elements so I included trying to modify the result of the AJAX request to be of the appropriate element type (img, which supports "onLoad," rather than span, which doesn't, for example).

+ +

The problem with the events is the timing. I wasn't sure about the difference between the capture or bubbling flag that you pass to addEventListener but every time I would catch the event in the extension, the element from the AJAX request wasn't fully updated into the HTML page. What that meant is that everytime the extension went looking for the element, it wasn't there yet.

+ +

As a last ditch effort I tried setting a timeout using setTimeout when I got the event in the extension to wait a few milliseconds before looking for the desired element. This was non-optimal and the timeout wasn't very reliable for some reason. Sometimes I would get the timeout, sometimes I would'nt.

+ +
O que eu consegui no final
+ +

Some helpful information on the irc channel led me to believe that a custom event might help. I started to research custom events on Google but everything that I found was far too complicated for what I wanted to achieve. Eventually I put the creation of the custom event into the stateChanged function that was handling the receipt of the AJAX request. After the HTML component was update with the result of the AJAX request, I created and dispatched the event like this:

+ +
   var event = document.createEvent("Events");
+   event.initEvent("my-custom-event", true, true);
+   document.body.dispatchEvent(event);
+
+ +

In the code of the extension that catches the loading of a new page I added this code:

+ +
   var doc = aEvent.originalTarget; // doc is document that triggered "onload" event
+   // do something with the loaded page.
+   // doc.location is a Location object (see below for a link).
+   // You can use it to make your code executed on certain pages only.
+   if (doc && doc.addEventListener)
+     doc.addEventListener("my-custom-event", myExtension.customReceived, false);
+
+ +

Since the event is dispatched after the element in the HTML is updated by the statusChanged function, the element that extension is looking for is there to find.

+ +
+ + + + + +
diff --git a/files/pt-pt/archive/add-ons/extensoes_bootstrapped/index.html b/files/pt-pt/archive/add-ons/extensoes_bootstrapped/index.html new file mode 100644 index 0000000000..e665476bcb --- /dev/null +++ b/files/pt-pt/archive/add-ons/extensoes_bootstrapped/index.html @@ -0,0 +1,352 @@ +--- +title: Extensões bootstrapped +slug: Archive/Add-ons/Extensoes_bootstrapped +tags: + - Extensões + - Extras + - Firefox 4 + - Gecko 2.0 + - Guía + - Localização + - Tradução +translation_of: Archive/Add-ons/Bootstrapped_extensions +--- +

browser.bookmarks.export( function() {...} // optional function ){{LegacyAddonsNotice}}{{AddonSidebar}}

+ +

{{ gecko_minversion_header("2.0") }}

+ +

Traditional extensions include overlays, wherein the application can load up XUL from the extension's package and automatically apply it on top its own UI. While this makes creating extensions that add to the application's user interface relatively easy, it means that updating, installing, or disabling an extension requires an application restart.

+ +

Gecko 2.0 {{ geckoRelease("2.0") }} introduces bootstrapped extensions. These are special extensions that, instead of using overlays to apply their user interface to the application, programmatically insert themselves into the application. This is done using a special script file that's included in the extension that contains functions the browser calls to command the extension to install, uninstall, start up, and shut down.

+ +

All the application does is call into this script file; the extension is responsible for adding and removing its user interface and handling any other setup and shutdown tasks it requires.

+ +

This article discusses how bootstrapped extensions work. See this tutorial on converting from an overlay extension to restartless for a practical step by step guide to migrating.

+ +

O processo de arranque e encerramento

+ +

A key feature of bootstrapped extensions is that they must be able to start up and shut down on demand by the application. When the extension's startup() function is called, it must manually inject its user interface and other behavior into the application. Similarly, when its shutdown() function is called, it must remove anything that it has added to the application, as well as all references to any of its objects.

+ +

There are several scenarios in which the startup() function may be called; for example:

+ + + +

Some examples of when the shutdown() function may be called:

+ + + +

Notas na modificação da inteface da aplicação do utilizador

+ +

chrome.manifest nos extras de bootstrapped

+ +

You can use a chrome.manifest file in bootstrapped add-ons to:

+ + + +

Not all chrome.manifest instructions are supported in bootstrapped add-ons, for example you still cannot register XUL Overlays from a bootstrapped add-on. See the chrome.manifest documentation for details.

+ +

In Firefox 10 and later the chrome.manifest file located in the root of the add-on's XPI (i.e. a sibling of the install.rdf) is loaded automatically. In Firefox 8 and 9 you had to load/unload the manifest manually using {{ ifmethod("nsIComponentManager", "addBootstrappedManifestLocation") }} and {{ ifmethod("nsIComponentManager", "removeBootstrappedManifestLocation") }}. This feature was unavailable in Firefox versions before 8.

+ +

Adicionar manualmente a interface do utilizador

+ +

If you decide to go ahead and try to develop a bootstrapped extension that modifies the application's user interface, here are a few suggestions to get you started.

+ +

You need to look up the relevant application UI elements by their ID by calling {{ domxref("document.getElementById()") }}, then manipulate them to inject your UI. For example, you can get access to the menu bar in Firefox with document.getElementById("main-menubar").

+ +

Be sure that at shutdown time, you remove any user interface you've added.

+ +

Criar uma extensão bootstrapped

+ +

To mark an extension as bootstrappable, you need to add the following element to its install manifest:

+ +
<em:bootstrap>true</em:bootstrap>
+ +

Then you need to add a bootstrap.js file that contains the required functions; this should be alongside the install.rdf file in the extension's package.

+ +

Compatibilidade com versões anteriores

+ +

Because older versions of Firefox don't know about the bootstrap property or bootstrap.js file, it's not overly difficult to create an XPI that will work on both as a bootstrappable extension and as a traditional extension. Create your extension as a bootstrappable extension, then add the traditional overlays as well. Newer versions of Firefox will use the bootstrap.js script, ignoring the components and overlays, while older versions will use the overlays.

+ +

Pontos de entrada de bootstrap

+ +

The bootstrap.js script should contain several specific functions, which are called by the browser to manage the extension. The script gets executed in a privileged sandbox, which is cached until the extension is shut down.

+ +

arranque

+ +

Called when the extension needs to start itself up. This happens at application launch time, when the extension is enabled after being disabled or after it has been shut down in order to install an update. As such, this can be called many times during the lifetime of the application.

+ +

This is when your add-on should inject its UI, start up any tasks it may need running and so forth.

+ +
void startup(
+  data,
+  reason
+);
+
+ +
Parameters
+ +
+
data
+
A bootstrap data structure.
+
reason
+
One of the reason constants, indicating why the extension is being started up. This will be one of APP_STARTUP, ADDON_disable, ADDON_INSTALL, ADDON_UPGRADE, or ADDON_DOWNGRADE.
+
+ +

encerramento

+ +

Called when the extensidisableon needs to shut itself down, such as when the application is quitting or when the extension is about to be upgraded or disabled. Any user interface that has been injected must be removed, tasks shut down, and objects disposed of.

+ +
void shutdown(
+  data,
+  reason
+);
+
+ +
Parameters
+ +
+
data
+
A bootstrap data structure.
+
reason
+
One of the reason constants, indicating why the extension is being shut down. This will be one of APP_SHUTDOWN, ADDON_DISABLE, ADDON_UNINSTALL, ADDON_UPGRADE, or ADDON_DOWNGRADE.
+
+ +

instalar

+ +

Your bootstrap script must include an install() function, which the application calls before the first call to startup() after the extension is installed, upgraded, or downgraded.

+ +
void install(
+  data,
+  reason
+);
+
+ +
Parameters
+ +
+
data
+
A bootstrap data structure.
+
reason
+
One of the reason constants, indicating why the extension is being installed. This will be one of ADDON_INSTALL, ADDON_UPGRADE, or ADDON_DOWNGRADE.
+
+ +

desinstalar

+ +

This function is called after the last call to shutdown() before a particular version of an extension is uninstalled.

+ +
Nota: If you open the add-on manager and then click "Remove" on an add-on, it will not call uninstall function right away. This is a soft uninstall because of the available "Undo" option. If the add-on manager is closed or another event takes place such that the "Undo" option becomes unavailable, then the hard uninstall takes place and the uninstall function is called.
+ +
Nota: The uninstall function fires on downgrade and upgrade as well so you should make sure it is an uninstall by doing this:
+function uninstall(aData, aReason) {
+     if (aReason == ADDON_UNINSTALL) {
+          console.log('really uninstalling');
+     } else {
+          console.log('not a permanent uninstall, likely an upgrade or downgrade');
+     }
+}
+ +
void uninstall(
+  data,
+  reason
+);
+
+ +
Parâmetros
+ +
+
data
+
Uma estrutura de dados de bootstrap.
+
reason
+
One of the reason constants, indicating why the extension is being uninstalled. This will be one of ADDON_UNINSTALL, ADDON_UPGRADE, or ADDON_DOWNGRADE.
+
+ +

Contantes reason

+ +

The bootstrap functions accept a reason parameter, which explains to the extension why it's being called. The reason constants are:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ConstanteValorDescrição
APP_STARTUP1The application is starting up.
APP_SHUTDOWN2The application is shutting down.
ADDON_ENABLE3The add-on is being enabled.
ADDON_DISABLE4The add-on is being disabled. (Also sent during uninstallation)
ADDON_INSTALL5The add-on is being installed.
ADDON_UNINSTALL6The add-on is being uninstalled.
ADDON_UPGRADE7The add-on is being upgraded.
ADDON_DOWNGRADE8The add-on is being downgraded.
+ +

Dados de bootstrap

+ +

Each of the entry points is passed a simple data structure containing some useful information about the add-on being bootstrapped. More information about the add-on can be obtained by calling AddonManager.getAddonByID(). The data is a simple JavaScript object with the following properties:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropriedadeTipoDescrição
idstringThe ID of the add-on being bootstrapped.
versionstringThe version of the add-on being bootstrapped.
installPathnsIFileThe installation location of the add-on being bootstrapped. This may be a directory or an XPI file depending on whether the add-on is installed unpacked or not.
resourceURInsIURIA URI pointing at the root of the add-ons files, this may be a jar: or file: URI depending on whether the add-on is installed unpacked or not. {{ gecko_minversion_inline("7.0") }}
oldVersionstringThe previously installed version, if the reason is ADDON_UPGRADE or ADDON_DOWNGRADE, and the method is install or startup. {{ gecko_minversion_inline("22.0") }}
newVersionstringThe version to be installed, if the reason is ADDON_UPGRADE or ADDON_DOWNGRADE, and the method is shutdown or uninstall. {{ gecko_minversion_inline("22.0") }}
+ +
+

Nota: An add-on may be upgraded/downgraded at application startup, in this case the startup method reason is APP_STARTUP, and the oldVersion property is not set. Also be aware that in some circumstances an add-on upgrade/downgrade may occur without the uninstall method being called.

+
+ +

Depurador de extra (add-on)

+ +

From Firefox 31 onwards, you can use the Add-on Debugger to debug bootstrapped add-ons.

+ +

Localização (L10n)

+ +

Localizing bootstrapped add-ons is very much the same since Firefox 7, as that is when chrome.manifest compatibility landed.

+ +

Ficheiros JS e JSM - Utilizando Ficheiros de Propriedade

+ +

Para localizar os seus ficheiros .js e .jsm tem de utilziar os ficheiros de propriedade.

+ +

The absolute minimum needed here is:

+ +
    +
  1. File: install.rdf
    2. +
  2. File: chrome.manifest
    3. +
  3. File: bootstrap.js
    4. +
  4. Folder: locale +
      +
    1. Folder: VALID_LOCALE_HERE +
        +
      1. File: ANYTHING.properties
        2. +
      +
      2. +
    +
    5. +
+ +

In the locale folder you must have folders for each of the languages you want to provide; each folder must be named a valid locale (ex: en-US). Inside this folder must be a property file. Inside the chrome.manifest file these locale must be defined. For example if you had a subfolder of en-US in locale folder your chrome.manifest file will have to contain: locale NAME_OF_YOUR_ADDON en-US locale/en-US/

+ +

Here is an example: GitHub :: l10n-properties - on startup of this add-on it will show a prompt saying USA or Great Britain, which ever it deems closest to your locale. You can test different locale by going to about:config and changing preference of general.useragent.locale to en-US and then to en-GB and disabling then re-enabling the add-on.

+ +

XUL and HTML Files - Using Entities from DTD Files

+ +

Many times HTML pages are used, however they cannot be localized with DTD files. There are three changes you must make:

+ +
    +
  1. You have to change the HTML file's extension to be .xhtml
    2. +
  2. The doctype must be defined point to a DTD file in your locale folder such as: <!DOCTYPE html SYSTEM "chrome://l10n/locale/mozilla.dtd">
    3. +
  3. Must add xmlns attribute to html tag for example: <html xmlns="http://www.w3.org/1999/xhtml">
    4. +
  4. If you have multiple DTD files read on here: Using multiple DTDs
    5. +
+ +

The bare minimum needed is:

+ +
    +
  1. File: install.rdf
    2. +
  2. File: chrome.manifest
    3. +
  3. File: bootstrap.js
    4. +
  4. Folder: locale +
      +
    1. Folder: VALID_LOCALE_HERE +
        +
      1. File: ANYTHING.dtd
        2. +
      +
      2. +
    +
    5. +
+ +

The chrome.manifest file must include a definition for content for example: content NAME_OF_YOUR_ADDON ./

+ +

The chrome.manifest file must also include a line pointing to the locale, just like in the above property section, if you had a folder named en-US in locale, the chrome.manifest file should contain: locale NAME_OF_YOUR_ADDON en-US locale/en-US/

+ +

Here is an example add-on that opens an HTML page and a XUL page on install: GitHub :: l10n-xhtml-xul. Here is an example showing how to use a localized HTML page as an options page: GitHub :: l10n-html-options. You can go to about:config and change the value of the preference general.useragent.locale to en-US and then to en-GB and then reload the open pages to see the localization change.

+ +

Leitura adicional

+ + diff --git a/files/pt-pt/archive/add-ons/index.html b/files/pt-pt/archive/add-ons/index.html new file mode 100644 index 0000000000..9c0f942944 --- /dev/null +++ b/files/pt-pt/archive/add-ons/index.html @@ -0,0 +1,11 @@ +--- +title: Add-ons +slug: Archive/Add-ons +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Add-ons +--- +

Archived add-ons documentation.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/pt-pt/archive/add-ons/interaction_between_privileged_and_non-privileged_pages/index.html b/files/pt-pt/archive/add-ons/interaction_between_privileged_and_non-privileged_pages/index.html new file mode 100644 index 0000000000..3b8723a163 --- /dev/null +++ b/files/pt-pt/archive/add-ons/interaction_between_privileged_and_non-privileged_pages/index.html @@ -0,0 +1,375 @@ +--- +title: Interação entre páginas privilegiadas e não privilegiadas +slug: Archive/Add-ons/Interaction_between_privileged_and_non-privileged_pages +tags: + - Code snippets + - Extensões + - Extras +translation_of: Archive/Add-ons/Interaction_between_privileged_and_non-privileged_pages +--- +

Enviar dados de um documento sem privilégios para o chrome

+ +

An easy way to send data from a web page to an extension is by using custom DOM events. In your extension's browser.xul overlay, write code which listens for a custom DOM event. Here we call the event MyExtensionEvent.

+ +
var myExtension = {
+  myListener: function(evt) {
+    alert("Received from web page: " +
+          evt.target.getAttribute("attribute1") + "/" +
+          evt.target.getAttribute("attribute2"));
+  }
+}
+document.addEventListener("MyExtensionEvent", function(e) { myExtension.myListener(e); }, false, true);
+// The last value is a Mozilla-specific value to indicate untrusted content is allowed to trigger the event.
+
+ +

The data from the web page (unprivileged code) will be the values of attribute1 and attribute2. To trigger the alert() in the listener and pass the data from the web page, write code such as this in the web page:

+ +
var element = document.createElement("MyExtensionDataElement");
+element.setAttribute("attribute1", "foobar");
+element.setAttribute("attribute2", "hello world");
+document.documentElement.appendChild(element);
+
+var evt = document.createEvent("Events");
+evt.initEvent("MyExtensionEvent", true, false);
+element.dispatchEvent(evt);
+
+ +

This code creates an arbitrary element -- <MyExtensionDataElement/> -- and inserts it into the web page's DOM. Values are set for two arbitrary attributes on the element. These can also be named anything you like, but we've chosen attribute1 and attribute2. Finally, the code creates and dispatches a custom event named MyExtensionEvent -- similar to the standard DOM click event you catch with onclick handlers. The event bubbles up from the web page and reaches the extension (privileged code) where your listener catches it and reads the attribute values from the DOM element where the event originated.

+ +

(To better ensure others do not also implement the same event with a different meaning, one might either attach a namespace to <MyExtensionDataElement/>  and check on the event handler for the correct namespaceURI property, or as per the DOM specification, use initEvent() with an event name that is itself namespaced (XML Name characters only): "It is also strongly recommended that third parties adding their own events use their own prefix to avoid confusion and lessen the probability of conflicts with other new events.")

+ +

In the case where your extension's overlay does not interact directly with browser.xul, such as in a sidebar, it might be easier to add the event listener to the top-level document directly as shown below (also see: accessing the elements of the top-level document from a child window).

+ +
var mainWindow = window.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
+                  .getInterface(Components.interfaces.nsIWebNavigation)
+                  .QueryInterface(Components.interfaces.nsIDocShellTreeItem)
+                  .rootTreeItem
+                  .QueryInterface(Components.interfaces.nsIInterfaceRequestor)
+                  .getInterface(Components.interfaces.nsIDOMWindow);
+mainWindow.document.addEventListener("MyExtensionEvent", function(e) { myExtension.myListener(e); }, false, true);
+
+ +

If you need to to pass lots of data, consider using CDATA sections instead of the simple attributes on a custom element.

+ +

Note: If you're using HTML5's postMessage() to send a message from unprivileged code to privileged code, adding 'true' to the end of your event listener in your privileged chrome code will allow the message to be received.

+ +

 

+ +
document.addEventListener("message", function(e) { yourFunction(e); }, false, true);
+ +

Enviar dados do chrome para um documento sem privilégios

+ +

To "answer" the web page (e.g., return code), your extension can set an attribute or attach child elements on the event target element (<MyExtensionDataElement/> in this example).

+ +

You can optionally clean up the created element, or create it once when the web page loads then re-use it each time.

+ +

Another option is to send a return event from the extension to the web page. This can be done using the same principle as the above example.

+ +

There is only one extension, but there can be many active web pages. So to trigger the right event on the right page we have to tell the extension which page to call. The information we need for that is contained in evt.target.ownerDocument.

+ +

We can extend the above example with some data transfer from the extension to the web page. In the following code sample 2 methods are combined: Setting an extra attribute in the original event target element, and creating a new event message with a new event target element. For this to work we need to define the original target element globally. We need a new event trigger in the web page and some code to show the event message actually arrived. In the extension we have to dispatch an event message to the right web page.

+ +

The code containing the callback could look like this:

+ +

In the extension:

+ +
var myExtension =
+{
+  myListener: function(evt)
+  {
+    alert("Received from web page: " +
+           evt.target.getAttribute("attribute1") + "/" +
+           evt.target.getAttribute("attribute2"));
+
+/* the extension answers the page*/
+    evt.target.setAttribute("attribute3", "The extension");
+
+    var doc = evt.target.ownerDocument;
+
+    var AnswerEvt = doc.createElement("MyExtensionAnswer");
+    AnswerEvt.setAttribute("Part1", "answers this.");
+
+    doc.documentElement.appendChild(AnswerEvt);
+
+    var event = doc.createEvent("HTMLEvents");
+    event.initEvent("MyAnswerEvent", true, false);
+    AnswerEvt.dispatchEvent(event);
+  }
+}
+
+document.addEventListener("MyExtensionEvent", function(e) { myExtension.myListener(e); }, false, true);
+// The last value is a Mozilla-specific value to indicate untrusted content is allowed to trigger the event.
+
+ +

In the web page:

+ +
document.addEventListener("MyAnswerEvent",function(e) { ExtensionAnswer(e); },false);
+
+var element;
+
+function CallExtension()
+{
+  var element = document.createElement("MyExtensionDataElement");
+  element.setAttribute("attribute1", "foobar");
+  element.setAttribute("attribute2", "hello world");
+  document.documentElement.appendChild(element);
+  var evt = document.createEvent("Events");
+  evt.initEvent("MyExtensionEvent", true, false);
+  element.dispatchEvent(evt);
+}
+
+function ExtensionAnswer(EvtAnswer)
+{
+  alert(element.getAttribute("attribute3") + " " +
+        EvtAnswer.target.getAttribute("Part1"));
+}
+
+ +

Basic example of similar idea, extension passes information via attributes and fires event on div in page, here.

+ +

Chromium-like messaging: json request with json callback

+ +

Web page:

+ +
<html>
+  <head>
+    <script>
+      var something = {
+        send_request: function(data, callback) { // analogue of chrome.extension.sendRequest
+          var request = document.createTextNode(JSON.stringify(data));
+
+          request.addEventListener("something-response", function(event) {
+            request.parentNode.removeChild(request);
+
+            if (callback) {
+              var response = JSON.parse(request.nodeValue);
+              callback(response);
+            }
+          }, false);
+
+          document.head.appendChild(request);
+
+          var event = document.createEvent("HTMLEvents");
+          event.initEvent("something-query", true, false);
+          request.dispatchEvent(event);
+        },
+
+        callback: function(response) {
+          return alert("response: " + (response ? response.toSource() : response));
+        }
+      }
+    </script>
+  </head>
+  <body>
+    <button onclick="return something.send_request({foo: 1}, something.callback)">send {foo: 1} with callback</button>
+    <button onclick="return something.send_request({baz: 3}, something.callback)">send {baz: 3} with callback</button>
+    <button onclick="return something.send_request({mozilla: 3})">send {mozilla: 3} without callback</button>
+    <button onclick="return something.send_request({firefox: 4}, something.callback)">send {firefox: 4} with callback</button>
+  </body>
+</html>
+
+ +

Overlay on browser.xul in your extension:

+ +
var something = {
+  listen_request: function(callback) { // analogue of chrome.extension.onRequest.addListener
+    document.addEventListener("something-query", function(event) {
+      var node = event.target;
+      if (!node || node.nodeType != Node.TEXT_NODE)
+        return;
+
+      var doc = node.ownerDocument;
+      callback(JSON.parse(node.nodeValue), doc, function(response) {
+        node.nodeValue = JSON.stringify(response);
+
+        var event = doc.createEvent("HTMLEvents");
+        event.initEvent("something-response", true, false);
+        return node.dispatchEvent(event);
+      });
+    }, false, true);
+  },
+
+  callback: function(request, sender, callback) {
+    if (request.foo) {
+      return setTimeout(function() {
+      callback({bar: 2});
+      }, 1000);
+    }
+
+    if (request.baz) {
+      return setTimeout(function() {
+      callback({quux: 4});
+      }, 3000);
+    }
+
+    if (request.mozilla) {
+      return alert("alert in chrome");
+    }
+
+    return callback(null);
+  }
+}
+
+something.listen_request(something.callback);
+
+ +

Message Passing in Chromium

+ +

Enviar dados estruturados

+ +

The above mechanisms use element attributes and are thus only strings. You may want to transfer objects. Gecko prevents chrome to access custom object properties added by the content, because that can create security holes. A workaround is to treat the communication between webpage and chrome as a normal network protocol and use XML.

+ +

With element attributes and E4X, this is fairly easy. You do need to convert your data to/from E4X objects, though. And your chrome needs to carefully check every value passed (you need to do that either way).

+ +
var targetDoc = null;
+
+function onLoad() {
+  var iframe = document.getElementById("contentiframe");
+  targetDoc = iframe.contentDocument;
+  iframe.contentWindow.addEventListener("newStuff", receiveStuffFromPage, false);
+}
+
+function receiveStuffFromPage(event) {
+  var uc = getEventData(event); // uc = unchecked data in form of E4X XML
+  var stuff = {};
+  stuff.id = sanitize.integer(uc.@id);
+  stuff.name = sanitize.label(uc.@name);
+}
+
+function sendSomethingToPage (something) {
+  var somethingXML = <something/>; // |something| object as E4X XML
+  somethingXML.@id = something.id;
+  somethingXML.@weight = something.weight;
+  sendMsg("sendSomething", somethingXML);
+}
+
+/**
+ * Send msgs from chrome to the page
+ * @param type {String} the event type. The receiver needs to use that
+ * when doing addEventListener(type, ...)
+ * @param dataXML {E4X} the data or detail
+ */
+function sendMsg(type, dataXML) {
+  var el = targetDoc.body;
+  el.setAttribute("eventDataToPage", dataXML ? dataXML.toString() : "");
+  var event = targetDoc.createEvent("Event")
+  event.initEvent(type, true, true);
+  el.dispatchEvent(event);
+}
+
+/**
+ * Verifies that the event is indeed coming from our page
+ * as expected, and returns the data for that event.
+ * @returns {E4X} the (unchecked) detail data from the page.
+ * You must check the data.
+ * @see <https://developer.mozilla.org/en-US/docs/Code_snippets/
+ * Interaction_between_privileged_and_non-privileged_pages#Security_notes>
+ */
+function getEventData(event) {
+  if (event.target.ownerDocument != targetDoc)
+    throw "event from unexpected source";
+  return new XML(event.target.getAttribute("eventDataFromPage"));
+}
+
+ +

Notas de segurança

+ + + +

Recursos

+ +

Fórum de Discussão de Mozillazine

+ +

Comunicação entre HTML e a sua extensão

+ +

Consulte também

+ + + +
+ + + +
diff --git a/files/pt-pt/archive/add-ons/trabalhar_com_multiprocessos_firefox/index.html b/files/pt-pt/archive/add-ons/trabalhar_com_multiprocessos_firefox/index.html new file mode 100644 index 0000000000..ce794196ea --- /dev/null +++ b/files/pt-pt/archive/add-ons/trabalhar_com_multiprocessos_firefox/index.html @@ -0,0 +1,286 @@ +--- +title: Trabalhar com multiprocessos do Firefox +slug: Archive/Add-ons/Trabalhar_com_multiprocessos_Firefox +translation_of: Archive/Add-ons/Working_with_multiprocess_Firefox +--- +
+ + +
+

Add-ons using the techniques described in this document are considered a legacy technology in Firefox. Don't use these techniques to develop new add-ons. Use WebExtensions instead. If you maintain an add-on which uses the techniques described here, consider migrating it to use WebExtensions.

+ +

Starting from Firefox 53, no new legacy add-ons will be accepted on addons.mozilla.org (AMO) for desktop Firefox and Firefox for Android.

+ +

Starting from Firefox 57, only extensions developed using WebExtensions APIs will be supported on Desktop Firefox and Firefox for Android.

+ +

Even before Firefox 57, changes coming up in the Firefox platform will break many legacy extensions. These changes include multiprocess Firefox (e10s), sandboxing, and multiple content processes. Legacy extensions that are affected by these changes should migrate to use WebExtensions APIs if they can. See the "Compatibility Milestones" document for more information.

+ +

A wiki page containing resources, migration paths, office hours, and more, is available to help developers transition to the new technologies.

+
+
+ +
+

This article explains how an add-on developer can check whether their add-on is compatible with multiprocess Firefox, and if it isn't, how to fix it.

+
+ +

In older versions of Firefox, chrome code (including code inserted by extensions) and content run in the same operating system process. So extensions can access content directly:

+ +
gBrowser.selectedBrowser.contentDocument.body.innerHTML = "replaced by chrome code";
+ +

However, in multiprocess Firefox (also called Electrolysis or E10S), the extension's code will run in a different process from content, and this kind of direct access will no longer be possible.

+ +

Checking whether you're affected

+ +

As a rule, you won't be affected if:

+ + + +

You will be affected if:

+ + + +

For more details, see the article on Limitations of chrome scripts, which lists patterns that will no longer work in the chrome process.

+ +

Testes

+ +

In multiprocess Firefox, add-ons can run in two different modes: either with compatibility shims or without them. Add-ons are more likely to work with compatibility shims, but they will run much more slowly if they access web content often. Shims will be removed six months after multiprocess Firefox is released to users, so developers should avoid shims if possible.

+ +

Testing if your add-on works with shims: Make sure you're running Firefox Nightly, in which multiprocess support is enabled by default. To verify that multiple process are being used, visit about:support and confirm that the "Multiprocess Windows" row contains "default: true". (If you see a different value, open Firefox preferences and check "Enable multi-process Nightly" in the General pane.) Now install your add-on and test that all features work. If you're testing an unsigned version of your extension, make sure you turn signing enforcement off.

+ +

Testing if your add-on works without shims: As before, make sure you're running Firefox Nightly with multiple processes enabled. Next, add a new property to your extension's install.rdf named multiprocessCompatible, with a value of true. Now install your add-on and test that all features work.

+ +

The rest of this document explains how to make broken add-ons work in multiprocess Firefox without using shims.

+ +

Adaptação ao Múltiplos Processos

+ +

If your add-on is not multiprocess-compatible, the best solution is to rewrite your add-on as a WebExtension. WebExtensions APIs are compatible with multiprocess Firefox. WebExtensions are the future of Firefox add-ons: other types of add-on, including XUL overlay add-ons, bootstrapped add-ons, and SDK add-ons, are now considered deprecated. From version 57, Firefox will no longer load such add-ons.

+ + + +

Note that WebExtensions don't give you all the same features that legacy add-ons do. However we are open to extending the WebExtension APIs to support the needs of add-on developers, so if you have ideas, we'd love to hear them. You can reach the WebExtensions team on the dev-addons mailing list or #webextensions on IRC.

+ +

If you can't port to WebExtensions yet, the Add-on SDK's high-level APIs are the next best choice. But note that this is not a future-proof solution, since SDK add-ons will not be supported from Firefox 57 onwards.

+ +

The last option is to use the message manager to communicate with the content process. The message manager can be used from the Add-on SDK or from overlay or bootstrapped add-ons.

+ + + +

Again, note that this is not a future-proof solution, since SDK, overlay, and bootstrapped add-ons will not be supported from Firefox 57 onwards.

+ +

If you need help, please contact us in the #addons channel at irc.mozilla.org. We're here to help!

diff --git a/files/pt-pt/archive/apps/ferramentas_e_frameworks/index.html b/files/pt-pt/archive/apps/ferramentas_e_frameworks/index.html new file mode 100644 index 0000000000..46face0a4a --- /dev/null +++ b/files/pt-pt/archive/apps/ferramentas_e_frameworks/index.html @@ -0,0 +1,45 @@ +--- +title: Ferramentas e frameworks +slug: Archive/Apps/Ferramentas_e_frameworks +tags: + - Aplicações + - Bibliotecas + - Ferramentas + - Firefox OS + - Frameworks + - Ritmos de Trabalho +translation_of: Archive/Apps/Tools_and_frameworks +--- +
+

This part of the App Center provides guides to using tools, frameworks and libraries to speed up Open Web App development — Brick, app templates, X-Tag, and Firefox OS Cordova support.

+
+ +
+
+

Componentes e modelos

+ +
+
Web components and Mozilla Brick
+
Mozilla Brick is a Web component library, based on the X-Tag library, which allows easy usage of custom elements.
+
Utilização de modelos de aplicaçãoes
+
To help you get going with app development as quickly as possible, there are some template apps you can use as a basis for your own apps. This guide provides information on those templates, how to get them, and how to work with them.
+
X-Tag
+
X-Tag and the Web components specification family provide a means for us to define custom elements that will dealt with as first class citizens by the browser, rather than as an inefficient afterthought. This guide explains how they work.
+
Elementos personalizados
+
This article describes some of the most useful custom elements available inside Mozilla's X-Tag library.
+
+
+ +
+

Aplicações de plataforma cruzada e ferramentas de criação

+ +
+
Cordova support for Firefox OS
+
This article provides a basic introduction to Apache Cordova and explains how to use it to generate an Open Web App for installation on Firefox OS.
+
Cordova Firefox OS plugin reference
+
Reference showing sample code and examples for the Cordova plugins that currently support Firefox OS.
+
+
+
+ +

 

diff --git a/files/pt-pt/archive/apps/index.html b/files/pt-pt/archive/apps/index.html new file mode 100644 index 0000000000..41b0a9c452 --- /dev/null +++ b/files/pt-pt/archive/apps/index.html @@ -0,0 +1,14 @@ +--- +title: Apps +slug: Archive/Apps +tags: + - Apps + - Firefox OS + - NeedsTranslation + - TopicStub + - Web +translation_of: Archive/Apps +--- +

This page includes archived content for Apps, including obsolete web app content, Firefox OS app-related content, and so forth.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/pt-pt/archive/b2g_os/api/camera_api/index.html b/files/pt-pt/archive/b2g_os/api/camera_api/index.html new file mode 100644 index 0000000000..435465c622 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/api/camera_api/index.html @@ -0,0 +1,38 @@ +--- +title: Camera API +slug: Archive/B2G_OS/API/Camera_API +tags: + - API + - Firefox OS + - Graphics + - NeedsTranslation + - Reference + - Référence(2) + - TopicStub + - WebAPI + - camera +translation_of: Archive/B2G_OS/API/Camera_API +--- +

+ +

+

Non-standard
+ This feature is not on a current W3C standards track, but it is supported on the Firefox OS platform. Although implementations may change in the future and it is not supported widely across browsers, it is suitable for use in code dedicated to Firefox OS apps.

+

+ +

The Camera API allows applications to manage the camera of the device. It allows them to take photographs, record videos, and get information like the focus, the zoom, the white balance, the flash, … It is a priviledged API and can only be used by certified applications.

+ +

This API was initially only available to certified applications, but is available to privileged apps on Firefox 2.0 onwards.

+ +
+

Note: Except if you are implementing a replacement for the default Camera application, you shouldn't use this API. Instead, if you want to use the camera in your device, you should use the Web Activities API.

+
+ +

See also

+ + diff --git a/files/pt-pt/archive/b2g_os/api/camera_api/introducao/index.html b/files/pt-pt/archive/b2g_os/api/camera_api/introducao/index.html new file mode 100644 index 0000000000..d64e05da53 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/api/camera_api/introducao/index.html @@ -0,0 +1,178 @@ +--- +title: Introdução à API de Câmara +slug: Archive/B2G_OS/API/Camera_API/Introducao +tags: + - API da Web + - API de Câmara + - Intermediário + - Multimedia + - Precisa de Atualização + - Referencia DOM Gecko + - cámara +translation_of: Archive/B2G_OS/API/Camera_API/Introduction +--- +

 

+ + + +

 

+ +

Through the Camera API, it is possible to take pictures with your device's camera and upload them into the current web page. This is achieved through an input element with type="file" and an accept attribute to declare that it accepts images. The HTML looks like this:

+ +
<input type="file" id="take-picture" accept="image/*">
+
+ +

When users choose to activate this HTML element, they are presented with an option to choose a file, where the device's camera is one of the options. If they select the camera, it goes into picture taking mode. After the picture has been taken, the user is presented with a choice to accept or discard it. If accepted, it gets sent to the <input type="file"> element and its onchange event is triggered.

+ +

Get a reference to the taken picture

+ +

With the help of the File API you can then access the taken picture or chosen file:

+ +
var takePicture = document.querySelector("#take-picture");
+takePicture.onchange = function (event) {
+    // Get a reference to the taken picture or chosen file
+    var files = event.target.files,
+        file;
+    if (files && files.length > 0) {
+        file = files[0];
+    }
+};
+
+ +

Presenting the picture in the web page

+ +

Once you have a reference to the taken picture (i.e., file), you can then use window.URL.createObjectURL() to create a URL referencing the picture and setting it as the src of an image:

+ +
// Image reference
+var showPicture = document.querySelector("#show-picture");
+
+// Create ObjectURL
+var imgURL = window.URL.createObjectURL(file);
+
+// Set img src to ObjectURL
+showPicture.src = imgURL;
+
+// For performance reasons, revoke used ObjectURLs
+URL.revokeObjectURL(imgURL);
+
+ +

If createObjectURL() isn't supported, an alternative is to fallback to FileReader:

+ +
// Fallback if createObjectURL is not supported
+var fileReader = new FileReader();
+fileReader.onload = function (event) {
+    showPicture.src = event.target.result;
+};
+fileReader.readAsDataURL(file);
+
+ +

Complete example

+ +

If you want to see it in action, take a look at the complete working Camera API example.

+ +

Here is the code used for that demo:

+ +

HTML page

+ +
<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>Camera API</title>
+        <link rel="stylesheet" href="css/base.css" type="text/css" media="screen">
+    </head>
+
+    <body>
+
+        <div class="container">
+            <h1>Camera API</h1>
+
+            <section class="main-content">
+                <p>A demo of the Camera API, currently implemented in Firefox and Google Chrome on Android. Choose to take a picture with your device's camera and a preview will be shown through createObjectURL or a FileReader object (choosing local files supported too).</p>
+
+                <p>
+                    <input type="file" id="take-picture" accept="image/*">
+                </p>
+
+                <h2>Preview:</h2>
+                <p>
+                    <img src="about:blank" alt="" id="show-picture">
+                </p>
+
+                <p id="error"></p>
+
+            </section>
+
+            <p class="footer">All the code is available in the <a href="https://github.com/robnyman/robnyman.github.com/tree/master/camera-api">Camera API repository on GitHub</a>.</p>
+        </div>
+
+
+        <script src="js/base.js"></script>
+
+
+    </body>
+</html>
+
+ +

JavaScript file

+ +
(function () {
+    var takePicture = document.querySelector("#take-picture"),
+        showPicture = document.querySelector("#show-picture");
+
+    if (takePicture && showPicture) {
+        // Set events
+        takePicture.onchange = function (event) {
+            // Get a reference to the taken picture or chosen file
+            var files = event.target.files,
+                file;
+            if (files && files.length > 0) {
+                file = files[0];
+                try {
+                    // Create ObjectURL
+                    var imgURL = window.URL.createObjectURL(file);
+
+                    // Set img src to ObjectURL
+                    showPicture.src = imgURL;
+
+                    // Revoke ObjectURL
+                    URL.revokeObjectURL(imgURL);
+                }
+                catch (e) {
+                    try {
+                        // Fallback if createObjectURL is not supported
+                        var fileReader = new FileReader();
+                        fileReader.onload = function (event) {
+                            showPicture.src = event.target.result;
+                        };
+                        fileReader.readAsDataURL(file);
+                    }
+                    catch (e) {
+                        //
+                        var error = document.querySelector("#error");
+                        if (error) {
+                            error.innerHTML = "Neither createObjectURL or FileReader are supported";
+                        }
+                    }
+                }
+            }
+        };
+    }
+})();
+
diff --git a/files/pt-pt/archive/b2g_os/api/index.html b/files/pt-pt/archive/b2g_os/api/index.html new file mode 100644 index 0000000000..706080ff54 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/api/index.html @@ -0,0 +1,156 @@ +--- +title: B2G OS APIs +slug: Archive/B2G_OS/API +tags: + - API + - B2G API + - NeedsTranslation + - TopicStub + - b2g os api's +translation_of: Archive/B2G_OS/API +--- +

List of B2G OS APIs 

+ +

+A +B +C +D + + +F + + +H + + + + + + + + +M +N + + +P + + + + +S +T +U + + +W + + + + + + + +

diff --git a/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/index.html b/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/index.html new file mode 100644 index 0000000000..ddb6c550ff --- /dev/null +++ b/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/index.html @@ -0,0 +1,361 @@ +--- +title: Building apps for Firefox OS +slug: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS +tags: + - Firefox OS + - Installation + - Layout + - Manifest + - NeedsTranslation + - TopicStub + - distribution + - packaging +translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS +--- +

+ +
+

Firefox OS apps are essentially no different to standard websites or web apps. They are built using standard open web technologies — HTML, CSS, JavaScript, etc. — and can be accessed using a web browser. The main differences lie in their ability to be installed on devices and work offline, access to advanced APIs that allow interaction with device features such as camera, gyroscope and address book, and the existence of a solid developer ecosystem — including a Marketplace for distribution of free and paid apps. Generally, they provide users with an "app experience", while still being based on open, cross platform technologies.

+
+ +

Firefox OS apps have a low barrier for entry, especially for existing web developers and mobile developers; they are also a lot more portable across platforms than native equivalents, and not locked into walled gardens. As we've already mentioned Firefox OS apps are based on web technologies — HTML, CSS, and JavaScript — so if you've written a web page you already know the basics. Even if you don't have the basics you'll be able to easily follow this guide, but you may want to check out our list of Beginner's tutorials to learn more about developing with open web technologies.

+ +

This section of MDN provides a detailed reference on web app development topics specific to creating apps that are installable on Firefox OS (and other Firefox-supported platforms like Android), including app manifests, writing install functionality, permissions for using device APIs, and more. It is targeted towards experienced developers that are just looking to create or port an existing app to Firefox OS.

+ +
+

Note: There is also a very useful screencast series available, if you prefer watching videos — App Basics for Firefox OS.

+
+ +
+

Note: If you are a complete beginner to web apps (perhaps you just know a bit of HTML/CSS/JS) and want a very simple guide to building up an app, check out our Firefox OS app beginners tutorial.

+
+ +

Firefox OS

+ +

Firefox OS (also referred to by its codename Boot to Gecko — or B2G) is Mozilla's open source mobile operating system. It's based on a Linux kernel, which boots into a Gecko-based runtime that lets users install and run open web apps, Gecko being the rendering engine that the Firefox browser uses to render and display web content.

+ +

Firefox OS comes with Gaia, which forms the entire UI layer of Firefox OS and the default suite of apps that handle the fundamental functions of the phone such as settings, calls, SMS, taking and storing photos, etc.

+ +

Mozilla's open web apps are installable on Firefox OS, and other Firefox-supported platforms via Mozilla's web run time technology. For more details, see Open web apps for Android, and Open web apps for Desktop.) In future, the technologies should be standardized and adopted across a wider range of platforms.

+ +

Installable app workflow

+ +

An installable open web app is very similar to a normal web app or web site — it is built using familiar web technologies like HTML, CSS and JavaScript. The difference is in the additional features the Firefox (OS) platform has available. The following diagram illustrates how those features work together.

+ +

+ +
    +
  1. Start with a fairly standard web application, built using your favourite toolchain.
    2. +
  2. Identify this as an installable web app by adding a manifest.webapp file to the web app root directory. This defines a number of things about the app such as its name, icons, localization information, and probably most importantly the permissions the app needs to access device APIs such as Camera, Device Storage, Bluetooth and SMS.
    3. +
  3. Create any functionality you require that makes use of special device APIs.
    4. +
  4. Create the assets your app needs, such as the icons.
    5. +
  5. Package and distribute your app. This can be done in a variety of ways, from simple self-published hosted apps (in which case you'd have to write your own install functionality), to packaged apps distributed via the Firefox Marketplace (which handles the install functionality for you.)
    6. +
+ +

Recommendations

+ +

This section provides recommendations and best practices for creating installable open web apps.

+ +

Web app manifest files

+ +

Your app's manifest.webapp file should be placed in the root of your app directory, and contain a simple JSON structure, as explained in detail in our App Manifest reference. A simple App Manifest JSON looks like so:

+ +
{
+  "name": "My App",
+  "description": "My elevator pitch goes here",
+  "launch_path": "/index.html",
+  "icons": {
+    "512": "/img/icon-512.png",
+    "128": "/img/icon-128.png"
+  },
+  "developer": {
+    "name": "Your name or organization",
+    "url": "http://your-homepage-here.org"
+  },
+  "default_locale": "en"
+}
+ +

For simple apps, this is all you'll need, but you may also need other fields, as discussed in appropriate places below.

+ +

Functionality, Device APIs, and permissions

+ +

One of the main strengths of the Firefox OS platform is the provision of new Web APIs to access key device services like the contacts, and hardware like NFC, Bluetooth and SMS. There are many examples of the different new APIs available along with examples throughout our App Center Build section, but in this section we'll give you some specific pointers towards tasks you might want to accomplish with them. Common task categories include:

+ + + +

Different APIs have different levels of security, with some APIs being limited in who can access them. This makes sense — it would be really insecure to just let any app have access to say, a device's SMS and dialer functionality. The different levels are as follows:

+ + + +

To request permission to use a restricted API, you have to include a permissions field in your manifest file, and set the type field to privileged in the case of privileged APIs. These fields will look something like this:

+ +
"type" : "privileged",
+"permissions": {
+  "contacts": {
+    "description": "Required for autocompletion in the share screen",
+    "access": "readcreate"
+    },
+  "alarms": {
+    "description": "Required to schedule notifications"
+  }
+}
+ +
+

Note: You can find out exactly what permissions (if any) each API requires by looking at our App permissions reference; this reference also lists which version of Firefox OS supports each API. To find out what API features are new as of each version of Firefox OS, consult our Firefox OS developer release notes.

+
+ +

Using Web activities also requires that you specify their type and required data in the activities field, for example:

+ +
"activities": {
+  "share": {
+    "filters": {
+      "type": [ "image/png", "image/gif" ]
+    },
+    "href": "foo.html",
+    "disposition": "window",
+    "returnValue": true
+  }
+}
+ +

Lastly, some APIs such as the Alarm and Notification APIs also require you to specify a messages field, which details what kind of system messages are to be captured by the app, and what page(s) will handle them:

+ +
"messages": [
+    { "alarm": "/index.html" },
+    { "notification": "/index.html" }
+  ]
+ +

Icons and other design best practices

+ +

The best practices you would use for creating a Firefox OS app are pretty much the same as those you would use for creating any standard web app, in terms of both coding and design.

+ +
    +
  1. You should use responsive design techniques to make sure your app layout will work well on a variety of screen sizes, especially media queries and viewport. Because many devices have high resolution screens these days, this should include use of resolution media queries to optimize for different resolutions.
    2. +
  2. You should take advantage of the building blocks and design patterns we've made available (see our app Design section.)
    3. +
  3. You should also make sure to optimize your code as much as possible so it is more likely to work on low-memory devices, which many Firefox OS devices are (see our Performance topic).
    4. +
  4. For the visual design of Firefox apps, you are free to follow your own path, but you could certainly get some useful pointers from our Firefox OS style guide.
    5. +
  5. For your app icons, you should make sure to include at least a 512x512 icon and a 128x128 icon. Read Icon implementation for Apps for more information.
    6. +
+ +

App packaging, installation and distribution

+ +

When an App is ready to be distributed, you have a few options of how to publish them:

+ + + +
+

Note: Self-published apps don't have the ability to access privileged APIs, for security reasons.

+
+ +
+

Note: Another common cause of failure in app installation is incorrect paths in manifests and install code. These paths should be relative to the origin of the server location. So for example, if your example's root is at http://www.mysite.com/myapp/, and your icon is at http://www.mysite.com/myapp/manifest.webapp, the install path would be /myapp/manifest.webapp, not /manifest.webapp.

+
+ +
+

Note: Installable open web apps used to have a "single app per origin" security policy, but this was lifted as of Firefox 34/Firefox OS 2.1 (read this FAQ entry for more information). If you still need to support older versions, consider hosting your apps at separate origins; one strategy is to create different subdomains for your apps.

+
+ +

Multi-locale apps

+ +

You can create multi-locale apps quite easily. This is done by:

+ +
    +
  1. Adding special data-l10n-id attributes to each HTML element that requires localization, the value of which should be an identifier for that string. For example:
    2. +
  2. <h1 data-l10n-id="app-title">My app</h1>.
    3. +
  3. Including the l10n.js library in your page using a regular <script> element.
    4. +
  4. Creating a locales folder inside your app directory containing a folder for each separate locale, then placing an app.properties file inside each one containing that language's translations, each one on a new line. For example app-title = Mon application for French.
    5. +
  5. Creating a locales.ini file inside the locales folder, which specifies the default locale and the path to each app.properties file. This will look like so: + 
    @import url(en/app.properties)
+
+[es]
+@import url(fr/app.properties)
    +
    6. +
  6. Referencing locales.ini from your HTML file using a <link> element, like so: + 
    <link rel="resource" type="application/l10n" href="locales/locales.ini" />
    +
    7. +
  7. Updating your manifest file to include a default locale and locales field containing information about your supported locales: + 
    "default_locale": "en",
+"locales": {
+  "fr": {
+    "name" : "Mon application",
+    "description" : "Mon application description"
+  }
+}
    +
    8. +
+ +

For more details, begin with our Getting started with app localization article, then check out the rest of our articles about app localization.

+ +

Debugging apps

+ +

Mozilla provides a number of tools to help you test Firefox OS apps.

+ +

Testing on Firefox desktop

+ +

The quickest way to test your app's basic functionality is to simply load it in Firefox desktop (open the index.html file in the browser) — this supports most of the features you'll be using to develop your app (with the exception of some of the device APIs.) From here you can use the standard Firefox Toolbox to debug your code, and the Responsive Design View to test responsive/mobile layouts.

+ +

Testing in the Firefox OS simulator

+ +

You can also test the app in a Firefox OS simulator via our WebIDE tool. This will give you a more realistic idea of how it will look on a real device.

+ +
+

Note: Our new WebIDE tool is currently only available in Firefox Nightly, but will be rolled out across all versions soon. It does everything App Manager does and more, including in-app code editing, creation of new apps, and tools like the Monitor, which enables to track performance across an app's lifespan.

+
+ +

Testing on a Firefox OS device

+ +

Some device APIs — such as the vibration API — can't be tested successfully on a simulator. To fully test this you'll need to get hold of a real Firefox OS device. If you've got one, you can connect it to your computer and install apps contained on your local drive straight onto it via the App Manager/WebIDE.

+ +

Logcat

+ +

The Android adb logcat tool is very useful for getting debugging output from a Firefox OS device, if you are comfortable with command line tools. For example, you can get info on dying apps using the following:

+ +
adb logcat GeckoConsole:* *:F | grep -vE "parsing value|Unknown property|declaration|invalid source| but found |pseudo-"
+ +

Supporting cross-Firefox OS versions

+ +

Note that when developing apps for Firefox OS, you need to bear in mind what platform versions will be available on the devices your customers will have (see our available phones table for a list.) Remember that it is not as simple to update phone platform software as it is desktop software — users tend to be at the mercy of the network providers. You therefore need to develop apps to support these versions. As an example, multiline Flexbox doesn't work on Firefox OS versions below 1.3, so you may need to use a simpler layout method or provide a fallback for older versions.

+ +

This issue should go away soon, as more consumer Firefox OS devices appear, equipped with newer versions of Firefox OS out of the box.

+ +
+

The current baseline platform we recommended developing for is Firefox OS 1.1.

+
+ +
+

Note: MDN's web platform reference pages include browser/platform support information, plus you can find support information for more App-specific technologies on our Apps API Reference.

+

+ +

Examples

+ +

You can find many examples throughout the App Center Build section; there are also some examples in our Reference apps section.

+ +

Tutorials

+ +

Installable app basics

+ +
+
Firefox OS app beginners tutorial
+
A complete beginner's guide to creating a Firefox OS app.
+
Packaged apps
+
A packaged app is an Open Web App that has all of its resources contained in a zip file, instead of having its resources on a Web server. In here you'll learn all you need to know about packaged apps.
+
Hosted apps
+
A hosted app is an Open Web App that has all of its resources (HTML, CSS, JavaScript, app manifest and so on) stored on a Web server. This article will tell you all you need to know about hosted apps.
+
Packaged or hosted?
+
Should you make your app hosted or packaged? This article will help you decide.
+
Self-publishing apps
+
This guide explains how to write the code that controls publishing apps, should you wish to write it yourself rather than use the Firefox Marketplace.
+
+ +

Advanced topics

+ +
+
Icon implementation for apps
+
Implementation specifics for implementing Firefox app icons, including different sizes needed.
+
Updating apps
+
How app updates are handled.
+
+ +
+

Reference

+ +
+
Firefox OS app tools
+
This page provides a list of useful tools, libraries and examples that are useful for Firefox OS app developers, whether you want an code template to copy, or need help with adding a specific feature to your Firefox OS app.
+
App manifest
+
A detailed guide to Open Web App manifest files, and the different options they can contain.
+
App permissions
+
Access to device APIs is key to creating many useful apps. Here is what's available and how to access them. +
+

Note: you can use the Firefox OS App Generator to automatically generate and install FxOS apps with particular permissions, message-listeners, types, etc.

+
+
+
Firefox OS API support table
+
A list of the different APIs available to Firefox OS, and what support is available for them.
+
App installation and management APIs
+
A reference for the installation and management APIs that control installation and other functions of installable Open Web Apps.
+
Platform-specific details of app installation
+
There are some differences in how apps are installed across the various platforms that support Open Web Apps; this article will help you to understand them.
+
CSP for open web apps
+
Unlike traditional web sites, privileged and certified apps enforce a CSP (content security policy) by default. This may cause quite a bit of existing code to break while porting and cause a significant amount of confusion if developers are unaware that the CSP exists. This article explains what the restrictions imposed by the open web app CSP are.
+
+ +

FAQ

+ +
+
App manifests FAQ
+
Manifest frequently asked questions.
+
+
+ +
+
 
+
diff --git a/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/manifesto/index.html b/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/manifesto/index.html new file mode 100644 index 0000000000..fc1eb924f0 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/firefox_os_apps/building_apps_for_firefox_os/manifesto/index.html @@ -0,0 +1,926 @@ +--- +title: Manisfesto da Aplicação +slug: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS/Manifesto +tags: + - Aplicações + - B2G + - Firefox OS + - Manifesto + - Marketplace + - Movel + - Não Padrão + - OS +translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS/Manifest +--- +

{{ non-standard_header() }}

+ +
+

Importante: este documento refere-se ao formato de manifesto do sistema operativo Firefox, e não às  especificações do manifesto 3C, concebido para aplicações da Web progressivas de vários navegadores. 

+
+ +
+

The Firefox OS app manifest provides information about an app (such as name, author, icon, and description) in a simple document usable by both users and app stores. Most importantly, it contains a list of Web APIs that your app needs. This allows users to make informed decisions about apps before installing them. It is one of the key things that distinguishes a Firefox OS App from a website.

+
+ +
+

Nota: Browsers that handle manifests and allow installation of Firefox OS apps incorporate a Web runtime. This includes Firefox OS, and newer versions of Firefox for Android and Firefox for desktop.

+
+ +
+

Nota: You can find answers to common questions about app manifests in our App Manifest FAQ.

+
+ +

Criar um manisfesto da aplicação

+ +

This section details the critical details you need to create and use an app manifest.

+ +

Convenções: nome de ficheiro, localização, e formato

+ + + +

Manipulação do caminho

+ + + +

Requisitos para submeter para Firefox Marketplace

+ +

If you want to publish your app to the Firefox Marketplace, your app manifest must contain the following fields:

+ + + +

Requisitos para as Aplicações da Web Abertas

+ +

If you're building a generic hosted app that will not be published in the Firefox Marketplace, your app manifest must contain the following fields below:

+ + + +
+

Note: To self-publish an app from a page that you control, you have to provide a mechanism for users to trigger installation of the app. This is usually done by calling navigator.Apps.install() when a button is clicked in the case of a hosted app, or navigator.Apps.installPackage() in the case of a packaged app.

+
+ +

Validação do manifesto da aplicação

+ +

If you're submitting to the Firefox Marketplace, your app manifest must pass Marketplace Validation.

+ +

Try our App Validator, which will help you identify any errors. Or you can use this API to validate your app manifest.

+ +

Atualização de manifestos

+ +

For information on updating apps, see Updating apps.

+ +

Exemplo de manifesto

+ +

The following is a minimal manifest. You can copy it into a text file and replace the values with your own information.

+ +
{
+  "name": "My App",
+  "description": "My elevator pitch goes here",
+  "launch_path": "/index.html",
+  "icons": {
+    "512": "/img/icon-512.png",
+    "128": "/img/icon-128.png"
+  },
+  "developer": {
+    "name": "Your name or organization",
+    "url": "http://your-homepage-here.org"
+  },
+  "default_locale": "en",
+  "chrome": { "navigation": true }
+}
+ +

Campos do manifesto da aplicação requeridos

+ +

The fields in your manifest can be in any order. Fields in the manifest other than the ones listed below will be ignored.

+ +

name

+ +
+

Nota: Required for all app manifests.

+
+ +

A human-readable name for the app. Maximum length is 128 characters.

+ +

If you change the name of your app after distribution, the name will not be updated for any existing installations.

+ +
"name": "The Open Web!"
+ +

description

+ +
+

Nota: Required for all app manifests.

+
+ +

A human-readable description for the app. Maximum length is 1024 characters.

+ +
"description": "Exciting Open Web App!"
+ +

launch_path

+ +
+

Nota: Required for all app manifests.

+
+ +

The path within the app's origin that is loaded when the app starts.

+ +

Specifies the starting point of the content local to the zip file containing the packaged app. For example, if the launch_path is /mywebapp/index.html, the app will open the file at /mywebapp/index.html when the app is launched.

+ +
Dicas: + + +
+ +
"launch_path": "/index.html"
+ +

icons

+ +
+

Nota: 1 icon sized 128×128 required for all app manifests. 1 icon sized 512×512 recommended for all app manifests.

+
+ +

A map of icon sizes to URIs of the icons.

+ +

Remember that internal paths to icons must be absolute from the app's origin, while paths to externally hosted icons must be fully qualified.

+ +

Icons must be square, and in .png format. Icons should not have solid backgrounds that extend to all four corners of the icon.

+ +
+
Cuidado: if you're submitting to the Firefox Marketplace, your icons must also follow the Firefox Marketplace app icon guidelines.
+
+ +

Required icon sizes

+ +
+
128×128
+
For display on the Firefox Marketplace and devices.
+
+ + + +
+
512×512
+
From Firefox 2.0 onwards, larger icons are needed for crisp display on all the different possible combinations of Phone and tablet screen sizes, screen resolutions, and 3 and 4-column layouts. We accept a 512×512 icon, which is then scaled for all the different uses across devices. This size is also useful for display on other platforms apps can be installed across, such as Android.
+
+ +

Other icon sizes that might be useful

+ +
+
60×60
+
For the exact on-device icon size on older Firefox OS versions.
+
16×16, 32×32, 48×48, 64×64, 90×90, 128×128 and 256×256
+
These icon sizes are used on various other platforms your app can be installed on, such as Windows, OS X and Android.
+
+ +
"icons": {
+  "128": "/img/icon-1.png",
+  "512": "/img/icon-2.jpg"
+}
+ +
+

Nota: For a thorough explanation of how we decided on the 512×512 icon size, read our Icon implementation guide.

+
+ +

developer

+ +
+

Nota: Only the name is required for all app manifests.

+
+ + + +
"developer": {
+    "name": "The Open Web!",
+    "url": "http://www.mywebapp.com"
+}
+ +

default_locale

+ +
+

Nota: If {{anch("locales")}} is defined, default_locale is required for your app manifest.

+
+ +

A language tag (RFC 4646) that defines the language you used in the field values of your app manifest.

+ +

Although default_locale is not required for apps that don't have locales, it is recommended that you include it. If you do not define a default_locale, the Firefox Marketplace will guess your app's language.

+ +

For example, if your app uses English, it's default_locale would be:

+ +
"default_locale": "en"
+ +

type

+ +
+

Nota: If your app is privileged or internal (certified), type is required for your app manifest.

+
+ +

The app's type, which defines its level of access to sensitive device WebAPIs. If you do not define type, it will default to web as the type.

+ + + +
+

Nota: For more information on app types, see Packaged apps.

+
+ +
"type": "certified"
+ +

Optional app manifest fields

+ +

The following fields are optional.

+ +

activities

+ +

A set of Web Activities that your app supports (full list). It's structured like so:

+ + + +

For example, here's an entry with one activity named share.

+ +
"activities": {
+  "share": {
+    "filters": {
+      "type": [ "image/png", "image/gif" ]
+    },
+    "href": "foo.html",
+    "disposition": "window",
+    "returnValue": true
+  }
+}
+ +

The object for the share activity in the example has filters, href, disposition and returnValue properties. These are described in Activity handler description.

+ +

appcache_path

+ +

The absolute path to the application cache (AppCache) manifest. When a Firefox OS app is installed, the AppCache manifest will be fetched and parsed, and its static assets under the CACHE header will be cached.

+ +
+

Nota: Packaged apps cache assets on the device when installed. You don't need to set an AppCache for packaged apps.

+
+ +
+

Nota: AppCache is a flawed technology, and will soon be replaced by the much more effective Service Workers.

+
+ +
"appcache_path": "/cache.manifest"
+ +

chrome

+ +

A set of navigation controls on the bottom of the screen that consists of Back, Forward, Reload and Favorite.

+ +

chrome navigation

+ +
+

Note: We'd recommend designing a back button for your app interface, instead of relying on this option.

+
+ +
"chrome": { "navigation": true }
+ +

csp

+ +
+

Note: Optional; applies to all packaged apps installed on Firefox OS, Firefox Desktop or Firefox for Android.

+
+ +

This field can be used to define a Content Security Policy (CSP) that is applied to all pages in the app. The policies you can add to a CSP are listed in CSP policy directives, and for an app you'll need to include them in a line like so:

+ +
"csp" : "default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'"
+ +

The default policies applied to Firefox OS privileged and internal/certified apps are as follows:

+ +
+
Privileged CSP
+
+ 
default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'
+
+
Certified/Internal CSP
+
+ 
default-src *; script-src 'self'; object-src 'none'; style-src 'self'
+
+
+ +

These defaults can’t be overridden, only added to, i.e. the CSP policy in the manifest can only make the actual CSP applied more restrictive in the case of privileged/internal apps.

+ +
+

Note: See the Apps CSP page for more details on the CSP restrictions particular to apps.

+
+ +

datastores-owned

+ +
+

Note: Applies only to internal/certified apps to be installed on Firefox OS.

+
+ +

When making use of the Data Store API, the app that owns the data store MUST include the datastores-owned field in its manifest to claim ownership, for example:

+ +
"datastores-owned": {
+  "myData": {
+    "access": "readwrite",
+    "description": "my data store"
+  }
+}
+ +

You can include multiple properties to represent different data stores, and each one can use an access of readonly/readwrite to specify whether the data store can be read/modified by other applications. A description is also included to describe the purpose of the data store.

+ +

datastores-access

+ +
+

Note: Applies only to internal/certified apps to be installed on Firefox OS.

+
+ +

When making use of the Data Store API, any non-owner app that wants access to the the data store MUST include the datastores-access field in its manifest, for example:

+ +
"datastores-access": {
+  "myData": {
+    "access": "readwrite",
+    "description": "Read and modify my data store"
+  }
+}
+ +

Without this field being specified, the default behaviour is "no access". Again, multiple properties can be included if you want to access multiple data stores, and an access of readonly or readwrite can be set to declare what access type is needed by the app.

+ +

fullscreen

+ +

A control that tells the runtime whether or not to launch the app in full-screen mode.

+ +

Since most apps run in fullscreen, we recommend setting this to true.

+ +
"fullscreen": "true"
+ +

inputs

+ +

Specifies supported layouts for the keyboard app. Each layout is described using a key-value pair, where the key represents the layout name (which will be displayed in the Settings app), and the value describes detailed information about the layout, including launch path of the layout and supported input types.

+ +

The allowed values in the types field is a subset of the {{htmlelement("input")}} element {{htmlattrxref("type","input")}} attribute values. Currently allowed values are text, search, tel, number, url, email.

+ +

An example follows:

+ +
"inputs": {
+   "en": {
+     "launch_path": "/index.html#en",
+     "name": "English",
+     "description": "English layout",
+     "types": ["url", "text"],
+     "locales": {
+       "en-US": {
+         "name": "English",
+         "description": "English layout"
+       },
+       "zh-TW": {
+         "name": "英文",
+         "description": "英文鍵盤"
+       }
+     }
+   },
+   "en-Dvorak": {
+     "launch_path": "/index.html#en-Dvorak",
+     "name": "English (Dvorak)",
+     "description": "Dvorak layout",
+     "types": ["url", "text"]
+   },
+   "es": {
+     "launch_path": "/index.html#es",
+     "name": "Spanish",
+     "description": "Spanish layout",
+     "types": ["url", "text"]
+   },
+
+  ...
+
+}
+ +

installs_allowed_from

+ +

One (or more) URLs to the domains where your app can be installed from.

+ +

This field is intended for apps that end-users can purchase. The field identifies the app stores with whom you have a commercial relationship. If left empty, your app can be installed from anywhere.

+ +
+
Caution: Do not put a trailing slash at the end of URLs, because the installation will fail.
+
+ +

For example, if your app can be installed from the Firefox Marketplace, installs_allowed_from will look like this:

+ +
"installs_allowed_from": [
+  "https://marketplace.firefox.com"
+]
+ +

Note: The array ["*"] would mean that installations of this app are allowed from any site. This is the default. Note that an empty array [] would disallow installation from any site, including your own.

+ +

locales

+ +

A map of one or more language-specific overrides of the field values in your app manifest.

+ +

Each locales entry contains a list of the app manifest fields you want to override for a specific language. Keys for locales use the same language tags as for default_locale (RFC 4646).

+ +
+
+

Caution:

+ +
    +
  • +

    If you are defining locales, remember to also define default_locale.

    +
    • +
  • +

    Do not define the value of default_locale again in locales.

    +
    • +
  • +

    You cannot override these fields: default_locale, locales, and installs_allowed_from.

    +
    • +
+
+
+ +

For example, your apps' default language is English, so its default_locale would be en. But you want to override the name and description for your Italian and German users with translated name and description. So your locales entries would look like this:

+ +
"locales": {
+  "it": {
+    "name": "L'Open Web",
+    "description": "Eccitante azione di sviluppo web open!"
+  },
+  "de": {
+    "name": "Der Open Web",
+    "description": "Spannende offene Web-Entwicklung-Action!"
+  }
+}
+ +

messages

+ +
+

Note: Applies only to apps to be installed on Firefox OS.

+
+ +

The system messages you allow the app to capture, and the pages in your app that will display when those messages occur.

+ +

Below is an example from the Firefox OS Dialer app. Every time an incoming call comes in (system message: telephony-new-call), the device shows the dialer's keypad (URL: /dialer/index.html#keyboard-view).

+ +
"messages": [
+  { "alarm": "/index.html" }
+  { "notification": "/index.html" }
+  { "telephony-new-call": "/dialer/index.html#keyboard-view" }
+]
+ +

orientation

+ +
+

Note: Applies only to apps using Android or Firefox OS.

+
+ +

The positioning at which the application will stay locked.

+ +

Illustration of possible values:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
valueApp will stay locked to
portrait-primaryPhone upright in portrait orientation
portrait-secondaryPhone upsidedown in portrait orientation
portrait
+ If you declare this, there's no need to write
+ -primary or -secondary		Phone upright in portrait orientationPhone upsidedown in portrait orientation
landscape-primaryPhone lying on its left hand side in landscape orientation
landscape-secondaryPhone lying on its right hand side in landscape orientation
landscape
+ If you declare this, there's no need to write
+ -primary or -secondary		 +

Phone lying on its left hand side in landscape orientation

+ +

Phone lying on its right hand side in landscape orientation

+
+ +
"orientation": [ "landscape-primary" ]
+ +

origin

+ +
+

Note: Applies only to privileged or internal (certified) packaged apps.

+
+ +

Packaged apps have a special internal protocol of app://UUID where UUID is a string unique to each device the app is installed on. UUID is not easily accessible at this time. The origin field allows you to replace this UUID value with a single domain name that will be used by each installed app.

+ +
+

Remember: domain name must start with app://, and you must be the owner of the domain name you specify.

+
+ +
"origin": "app://mywebapp.com"
+ +

permissions

+ +

The user permissions for sensitive device APIs that your app needs, for example, access to the user's Contacts. See a full list of WebAPI permissions/features.

+ +

Each permission requires:

+ + + +

For example, here's a manifest entry for an app that needs permission to use the device's contacts and alarms.

+ +
"permissions": {
+  "contacts": {
+    "description": "Required for autocompletion in the share screen",
+    "access": "readcreate"
+    },
+  "alarms": {
+    "description": "Required to schedule notifications"
+  }
+}
+ +
+

Note: If an app tries to use one of these APIs without a corresponding entry in the permissions field, it will fail to run.

+
+ +

There are many APIs, some of whom require the app type to be privileged or internal (certified). For example, systemXHR requires the type field to be set to privileged in order to work:

+ +
  "type": "privileged",
+  "permissions": {
+    "systemXHR": {
+      "description": "Required to download podcasts."
+    }
+  }
+
+ +

precompile

+ +
+

Note: Applies only to packaged apps.

+
+ +

The path to JavaScript files containing asm.js code that you want compiled at install time.

+ +

Compilation at install time makes the installation process longer, but reduces the time it takes to start up an app.

+ +
"precompile": [
+  "game.js",
+  "database.js"
+]
+ +

redirects

+ +
+

Note: Applies only to privileged/internal (certified) apps that are to be installed on Firefox OS.

+
+ +

The internal URLs your app uses to handle external processes.

+ +

For example, your app might use Facebook OAuth authentication to get a user's contacts. When the authentication is finished, the server usually redirects back to a URL that you control. Because packaged apps are not hosted on the web, a packaged app does not have a valid URL that can be redirected to. So you use the redirects field to redirect an external URL to an internal app URL.

+ +

In the scenario above, the redirects field will look like this:

+ +
"redirects": [
+  {"from": "http://facebook.com/authentication/success.html",
+    "to": "/app/main_interface.html"}
+]
+ +

The scope of the redirects declared by redirects is limited to the app that declares them. That makes it so that several apps can redirect the same public URL to their own local resources, and it also prevents global hijacking of public URLs by an application.

+ +

role

+ +

The role field is mainly for internal use by the Gaia engineering team; it allows you to specify how an app should be used by B2G, its role in the system. For example, is it a keyboard, or a homescreen replacement?

+ +
"role": "system",
+ +

Options include:

+ + + +

version

+ +
+

Note: Required for packaged app manifests.

+
+ +

A string that represents the version of the app, shown in Marketplace and when installing the app.

+ +

In packaged apps the version is used to determine distinguish if an update needs to be installed. The field needs to be incremented when uploading an update of your app to Marketplace.

+ +

In hosted apps this field is for your convenience; it's not used by the runtime, so version can be any value. Defining it is recommended.

+ +
"version": "2.1"
+ +

Serving manifests

+ +

The app manifest must be served from the same origin that the app is served from.

+ +

The manifest should be stored with a file extension of .webapp. App manifests must be served with a Content-Type header of application/x-web-app-manifest+json. This is currently not enforced by Firefox but is enforced by the Firefox Marketplace. Firefox OS only checks this if the origin of the page where the user triggers the install is different from the origin of the app itself. You don't need other headers such as Content-Security-Policy and X-UA-Compatible.

+ +

Manifests can be served over SSL to mitigate certain classes of attacks. You can also serve the manifest with HTTP compression. The manifest should not be cached.

+ +

The manifest must be in UTF-8 encoding in order for the app to be submitted to Firefox Marketplace. It is recommended that you omit the byte order mark (BOM). Other encodings can be specified with a charset parameter on the Content-Type header (i.e. Content-Type: application/x-web-app-manifest+json; charset=ISO-8859-4), although this will not be respected by the Marketplace.

+ +

User Agents when possible should meaningfully message the site identity and TLS status when prompting a user to install an app.

+ +

Serving from Apache

+ +

In your .htaccess file, you must add the following:

+ +
AddType application/x-web-app-manifest+json .webapp
+ +

If adding in an .htaccess file didn't work for you, you can add the same line in your Apache configuration file. Your configuration file might be named httpd.conf or 000-default.conf, depending upon your operating system and configuration.

+ +

Serving from Apache, using a PHP snippet

+ +

It may be that on a shared hosting plan, changing the Content-Type header with a .htaccess file is not working because this is globally disallowed. Meanwhile, if this hosting supports PHP, using the following short script can serve the purpose:

+ +
<?php
+// Serving the manifest file 'manifest.webapp' with the appropriate header
+header('Content-type: application/x-web-app-manifest+json');
+readfile('manifest.webapp');
+?>
+ +

This code should be placed in the same directory as the manifest, and named manifest.webapp.php for example.

+ +

Serving from Tomcat

+ +

In your web.xml file, you need to set the mime mapping

+ +
<mime-mapping>
+    <extension>webapp</extension>
+    <mime-type>application/x-web-app-manifest+json</mime-type>
+</mime-mapping>
+ +

 

+ +

Serving from IIS

+ +

You need to edit your web.config file. This will probably be located in the web site's root directory.

+ +

You will have to add a new entry in the <configuration> <system.webServer> <staticContent> section.

+ +
<remove fileExtension=".webapp" />
+<mimeMap fileExtension=".webapp" mimeType="application/x-web-app-manifest+json; charset=UTF-8" />
+ +
+

Note: For more information, read Adding Static Content MIME Mappings <mimeMap>.

+
+ +

Serving from nginx

+ +

You need to edit your mime.types file in the conf directory. This will probably be located in either /etc/nginx/ or /opt/nginx/.

+ +

You should have something similar to the following. Add the last line seen here:

+ +
types {
+  text/html   html htm shtml;
+  text/css    css;
+  text/xml    xml;
+  application/x-web-app-manifest+json   webapp;
+}
+ +

Serving from GitHub

+ +

If you serve your manifest file from GitHub Pages, GitHub will serve it with the Content-Type header of application/x-web-app-manifest+json.

+ +

Serving from Python

+ +

If you have Python installed, you can easily run a server from the local directory using the following:

+ +
import SimpleHTTPServer
+import SocketServer
+SimpleHTTPServer.SimpleHTTPRequestHandler.extensions_map['.webapp'] = 'application/x-web-app-manifest+json'
+httpd = SocketServer.TCPServer(("", 3000), SimpleHTTPServer.SimpleHTTPRequestHandler)
+httpd.serve_forever()
+
+ +

Serving from Flask (Python)

+ +

If you have flask project you don't need create file manifest.webapp but you can use route() decorator to tell Flask what URL should trigger our function. First you need import Response from Flask

+ +
from flask import Response
+ +

in your flask application, add the route() decorator, as indicated below:

+ +
@app.route('/manifest.webapp')
+def manifest():
+        data = json.dumps({
+            "name": "Flask Application",
+            "version": "1.0",
+            "description": "Example of manifest.webapp",
+            "launch_path": "/",
+            "icons": {
+                    "256": "/img/256.png",
+                    "128": "/img/128.png",
+                    "120": "/img/120.png",
+                    "90": "/img/90.png",
+                    "60": "/img/60.png",
+                    "32": "/img/32.png"
+                },
+            "developer": {
+            "name": "Rizky Ariestiyansyah",
+            "url": "http://oonlab.com"
+            },
+            "orientation": ["portrait"],
+            "default_locale": "en"
+        })
+        return Response(data, mimetype='application/x-web-app-manifest+json')
+ +

Serving from Rack (Ruby)

+ +

In config/initializers/mime_types.rb, add:

+ +
Rack::Mime::MIME_TYPES['.webapp'] = 'application/x-web-app-manifest+json'
+ +

Especificação

+ +

Not part of any specification — this document refers to the proprietary Firefox OS manifest format, and not the W3C manifest spec. We will hopefully document this at a different location, sometime soon.

+ +

Compatibilidade do navegador

+ +

For obvious reasons, support is primarily expected on mobile browsers.

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OS (Gecko)IE MobileOpera MobileSafari Mobile
Basic support{{ CompatNo() }}{{ CompatNo() }}1.0.1{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +
+ + + + + +
diff --git a/files/pt-pt/archive/b2g_os/firefox_os_apps/index.html b/files/pt-pt/archive/b2g_os/firefox_os_apps/index.html new file mode 100644 index 0000000000..4b6226ee81 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/firefox_os_apps/index.html @@ -0,0 +1,140 @@ +--- +title: Firefox OS apps +slug: Archive/B2G_OS/Firefox_OS_apps +tags: + - Apps + - Building + - Components + - Firefox OS + - Installing + - NeedsTranslation + - TopicStub + - device APIs +translation_of: Archive/B2G_OS/Firefox_OS_apps +--- +

+ +

This section of the Firefox OS docs covers the specific techniques required — and available tools — for building Firefox OS apps. You'll find a number of details below, from Firefox OS building blocks/web components, to device APIs and App installation.

+ +

Building Firefox OS apps

+ +
+
Building apps for Firefox OS
+
Firefox OS/Firefox platform app specifics, including App installation and management APIs, manifest files, packaged and hosted apps, handling API permissions.
+
Localization
+
This set of articles provides information for developers wishing to provide localized versions of their apps.
+
Performance
+
This page lists performance-related topics specific to Firefox OS.
+
Firefox Accounts on Firefox OS
+
This article provides an overview of using Firefox Accounts in Firefox OS.
+
Reference apps
+
This page lists a number of sample apps we've put together for you to download, install, play with and learn from. Have fun!
+
Screencast series: App Basics for Firefox OS
+
In this collection of short videos, developers from Mozilla and Telenor explain in a few steps how you can get started with building applications for Firefox OS.
+
+ +

Building blocks

+ +
+
Building Blocks
+
The Firefox OS Building Blocks are reusable UI components (also called 'common controls') that reflect OS-wide design patterns. Building Blocks are used to create the interfaces of all Gaia default apps. You are free to make use of these components in your own Firefox OS apps, or general Web apps.
+
+ +

Styleguides

+ +
+
Firefox OS Visual styleguide
+
Our style guide for Firefox OS visual design, covering colours, typeface, backgrounds, app icons, and the design of specific UI elements.
+
Firefox OS Copy styleguide
+
This guide outlines the rules we follow for writing Firefox OS app copy, but can be used as a general guide to writing good copy for any app interfaces.
+
Firefox OS in Arabic
+
A guide to the specific UX design implementation Firefox OS has in place for dealing with Arabic (and other RTL languages.)
+
+ +

Assets

+ +
+
Firefox OS design asset library
+
In this section you'll find design assets, artwork, graphic templates, fonts and other materials that will be helpful as you design Firefox OS/Gaia apps.
+
Firefox OS icon font
+
Firefox OS has its own icon font set available: this article explains how to use it in your own apps.
+
Firefox OS transitions
+
A reference to some of the transitions used in Firefox OS to move between different states in apps, including animated GIFs demonstrating the animations used, plus code samples to show the CSS animation code needed to implement these animations.
+
+ +

References

+ +
+
Firefox OS device APIs
+
This article provides a list of pages covering those APIs, as well as the app manifest permissions for each one.
+
Firefox OS app tools
+
This page provides a list of useful tools, libraries, examples, etc. that are useful for Firefox OS app developers, whether you want a code template to copy, or need help with adding a specific feature to your Firefox OS app.
+
+ +

Other app topics

+ +
+
Porting Chrome apps to Firefox OS Apps
+
This article discusses the differences between Chrome apps and Firefox OS Apps, and how you can convert between the two.
+
App development FAQ
+
This FAQ is a compilation of answers to common app development questions.
+
+ +

See also

+ + diff --git "a/files/pt-pt/archive/b2g_os/firefox_os_apps/localiza\303\247\303\243o/index.html" "b/files/pt-pt/archive/b2g_os/firefox_os_apps/localiza\303\247\303\243o/index.html" new file mode 100644 index 0000000000..f9cfe4bca2 --- /dev/null +++ "b/files/pt-pt/archive/b2g_os/firefox_os_apps/localiza\303\247\303\243o/index.html" @@ -0,0 +1,101 @@ +--- +title: Localização de aplicação +slug: Archive/B2G_OS/Firefox_OS_apps/Localização +tags: + - Aplicações + - Apps + - B2G + - Firefox OS + - Gaia + - L10n.js + - Localization + - Localização +translation_of: Archive/B2G_OS/Firefox_OS_apps/Localization +--- +

+ +
+

This set of articles provides information for developers wishing to provide localized versions of their apps.

+
+ +

Tutoriais

+ +
+
Getting started with app localization
+
This tutorial provides a detailed guide to app localization.
+
Connecting developers and translators with Transifex
+
This article explores the use of Transifex for managing translation work, both for app developers and localizers.
+
+ +

Referência

+ +
+
L10n.js reference
+
This article provides a reference for the l10n.js library, and its associated date helper, l10n_date.js.
+
Internationalization helpers: IntlHelper and mozIntl
+
This article looks at how Firefox OS handles localization of dates, times, numbers and collators from version 2.5 onwards, using the Internationalization API and Gaia's built in helpers, IntlHelper and mozIntl.
+
App localization code best practices
+
Localization best practices and advanced techniques for experienced Gaia/app developers.
+
Developing Bidi Apps
+
Best coding practices and guidelines for developing bi-directional (left-to-right and right-to-left, RTL) apps.
+
+ +

Ferramentas

+ +
+
Translation tester
+
This app is for testing translations for Firefox OS apps and provides a blueprint for adding translation support to your own apps.
+
diff --git "a/files/pt-pt/archive/b2g_os/firefox_os_apps/permissoes_de_aplica\303\247\303\243o/index.html" "b/files/pt-pt/archive/b2g_os/firefox_os_apps/permissoes_de_aplica\303\247\303\243o/index.html" new file mode 100644 index 0000000000..403b62c93d --- /dev/null +++ "b/files/pt-pt/archive/b2g_os/firefox_os_apps/permissoes_de_aplica\303\247\303\243o/index.html" @@ -0,0 +1,690 @@ +--- +title: Permissões de Aplicação +slug: Archive/B2G_OS/Firefox_OS_apps/Permissoes_de_aplicação +tags: + - Aplicações + - Firefox OS + - Intermediário + - Permissões + - Referencia + - Referência(2) + - WebAPI +translation_of: Archive/B2G_OS/Firefox_OS_apps/App_permissions +--- +
+

O campo de permissões no manisfesto da aplicação controla o acesso a várias APIs sensíveis no dispositivo (algumas vezes chamada de WebAPIs). As permissões são descritas nas tabelas seguintes.

+
+ +

Os três níveis de permissão, em resumo, são:

+ + + +

For more information on app types, see Types of packaged apps.

+ +
+

Nota: If you use the App Manager/WebIDE to test your app, it will display an easy to read table of which permissions are allowed, denied, or require a prompt on the current device or simulator you are connected to.

+
+ +

Hosted app and privileged app permissions

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Manifest permissionAPI nameDescriptionMinimum app type requiredaccess propertyDefault grantedPlatform/version supported
alarmsAlarmSchedule a notification, or schedule an application to be started.hostednoneAllowFxOS 1.0.1
audio-capture +

getUserMedia, Web Speech API

+ 		Obtain MediaStream from audio input devices, e.g. microphone. This is needed to allow audio capture in Firefox OS 1.2+.hosted for getUserMedia, privileged for Web Speech APInonePrompt for all installed App types for getUserMedia, Allow for Web Speech API.FxOS 1.2 and
+ Desktop Firefox 20+ for getUserMedia, FxOS 2.5 and Desktop Firefox 44 for Web Speech API.
audio-channel-alarmAudioChannelsAlarm clock, calendar alarms.privilegednoneAllowFxOS 1.0.1
audio-channel-contentAudioChannelsMusic, video.hostednoneAllowFxOS 1.0.1
audio-channel-normalAudioChannelsUI sounds, Web content, music, radio.hostednoneAllowFxOS 1.0.1
audio-channel-notificationAudioChannelsNew email, incoming SMS.privilegednoneAllowFxOS 1.0.1
browserBrowserEnables the app to implement a browser in an iframe.privilegednoneAllowFxOS 1.0.1
cameraCamera +

Take photos, shoot video, record audio, and control the camera.

+ +
+

Note: camera was limited to certified apps initially because the app sandbox was preventing access to the camera hardware. Fixed from Firefox OS 2.0 onwards.

+
+ 		+

privileged in Firefox OS 2.0+ internal/certified up to Firefox OS 1.4

+ 		nonePrompt for all installed App types.FxOS 1.0.1-1.4 certified
+ FxOS 2.0+ privileged
contactsContactsAdd, read, or modify contacts from the address book on the device and read contacts from the SIM.privilegedreadonly, readwrite, readcreate, or createonlyPrompt for all installed App types.FxOS 1.1
+ Firefox Android 18
desktop-notificationmozNotification for Gecko <22, Notification for Gecko 22+Display a notification on the user's desktop. Note that this has changed, so for Gecko <22 (Firefox OS <1.2) you need to use mozNotification, while for Gecko 22+ (Firefox 1.2+) you need to use Notification.hostednonePrompt for Web content. Allow for all installed App types.FxOS 1.0.1, Android 4.0, Desktop 4.0 for prefixed version
+ FxOS 1.2, Android 22, Desktop 22 for non-prefixed version
device-storage:musicDevice StorageAdd, read, or modify music files stored on the device.privilegedreadonly, readwrite, readcreate, or createonlyPromptFxOS 1.0.1
device-storage:picturesDevice StorageAdd, read, or modify picture files stored on the device.privilegedreadonly, readwrite, readcreate, or createonlyPromptFxOS 1.0.1
device-storage:sdcardDevice StorageAdd, read, or modify files stored on the device's SD card.privilegedreadonly, readwrite, readcreate, or createonlyPromptFxOS 1.0.1
device-storage:videosDevice StorageAdd, read, or modify video files stored on the device.privilegedreadonly, readwrite, readcreate, or createonlyPromptFxOS 1.0.1
fmradioFM RadioControl the FM radio.hostednoneAllowFxOS 1.0.1
geolocationGeolocationObtain the current location of the user.hostednonePrompt (even for certified Apps)FxOS 1.0.1, Desktop Firefox 3.5, Android 4.0
inputKeyboardAllows the app to act as a virtual keyboard by listening to focus change events in other apps. All IME apps need this permission for sending input keys and updating the value of a input field.privilegednoneAllowFxOS 1.2
mobileidMobile identityAllows an app to obtain a verified phone number (MSISDN) after the user selects the number to be shared and gives explicit permission for the app to obtain it.privileged/nonePromptFxOS 2.0
mobilenetworkMobile NetworkObtain mobile network information (MCC, MNC, etc.).privilegednoneAllowFxOS 1.0.1
moz-firefox-accountsFirefox AccountsAllows the use of Firefox Accounts when using the navigator.mozId API.privilegednonePrompt for all installed App types.FxOS 2.0
nfcNFC APINFC enables an app to transmit data to other devices via near field communication. This permission is required for reading and writing data.PrivilegednoneAllowFxOS 2.2
nfc-shareNFC APIThis permission is just required for sharing tags via NFC.PrivilegednoneAllowFxOS 2.2
nfc-read, nfc-writeNFC APIThese permissions were used to request reading and writing privileges in Firefox OS 2.0/2.1Was certified/internal at this stage in development.noneAllowFxOS 2.0
pushSimple PushEnable an app to wake up to receive notification.hostednoneAllowFxOS 1.1
speech-recognitionWeb Speech APIAllows an app to use speech recognition.privilegednoneAllowFxOS 2.5 and Desktop Firefox 44.
systemXHRSystemXHRAllows anonymous (no cookies) cross-origin XHR without the target site having CORS enabled. Similar to the TCP Socket API but restricted to XHR, not just raw sockets, so it is slightly less risky. See XMLHttpRequest.privilegednoneAllowFxOS 1.0.1
tcp-socketTCP SocketCreate TCP sockets and communicate over them.privilegednoneAllowFxOS 1.0.1,
+ Desktop (early versions)
video-captureGetUserMediaObtain MediaStream from video input devices, e.g. camera. This is needed to allow video capture in Firefox OS 1.4+.hostednonePrompt for all installed App types.FxOS 1.4
+ +
+

Note: To declare an app as privileged, you need to put "type" : "privileged" into your app manifest. You don't need to include the type field in your manifest for web apps, as web is the default value.

+
+ +

Internal (Certified) app permissions

+ +

The following permissions require a internal app and are granted implicitly without prompting the user. Most app developers will not be able to use internal APIs, because they are intended for system-level apps and default apps created by Mozilla/operators/OEMs.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Manifest permissionAPI nameDescriptionMinimum app type requiredaccess propertyPlatform
attentionAttention Screen +

Allow content to open a window in front of all other content. Used by telephone and SMS.

+ +
+

Note: Attention screens use the Firefox OS-specific attention feature name when calling {{domxref("window.open()")}}.

+
+ 		internal (certified)noneFxOS 1.0.1
audio-channel-ringerAudioChannelsIncoming phone calls.internal (certified)noneFxOS 1.0.1
audio-channel-telephonyAudioChannelsPhone calls, VoIP calls.internal (certified)noneFxOS 1.0.1
audio-channel-publicnotificationAudioChannelsForced camera shutter sounds.internal (certified)noneFxOS 1.2
background-sensorsBackground SensorAbility to listen to proximity sensor events in the background. (All apps recieve these events in the foreground.)internal (certified)noneFxOS 1.0.1
backgroundservice (Deprecated)Background Services +

Enable an app to run in the background and perform tasks like syncing or responding to incoming messages.

+ +
+

Note: this functionality has been removed.

+
+ 		internal (certified)noneFxOS 1.0.1
bluetooth Low level access to Bluetooth hardware.internal (certified)noneFxOS 1.0.1
browser:embedded-system-appBrowserEnables an app opened in a browser {{htmlelement("iframe")}} to call methods of the API on — and listen and respond to related events fired by — itself (usually the parent window of the iframe calls the Browser API.) See {{bug("1196654")}} for further information.internal (certified)noneFxOS 2.5
cameraCamera +

Take photos, shoot video, record audio, and control the camera.

+ +
+

Note: camera was limited to certified apps initially because the sandbox that apps run in was preventing access to the camera hardware. This has been fixed from Firefox OS 2.0 onwards.

+
+ 		internal (certified) up to Firefox OS 1.4, privileged in Firefox OS 2.0+noneFxOS 1.0.1-1.4 certified
+ FxOS 2.0+ privileged
cellbroadcast Fires an event when a specific type of cell network message is received (an emergency network notification).internal (certified)noneFxOS 1.0.1
No permission needed, but datastores-access/datastores-owned needs to be set in the manifest (see Data Store API Manifest fields.)Data StoreA powerful, flexible storage mechanism for Firefox OS applications to use to store and share data.internal (certified)datastores-access/
+ datastores-owned		FxOS 1.0.1
device-storage:appsDevice StorageAdd, read, or modify files stored in the apps location on the device.
+
+ When this is used, the webapps-manage permission is also required alongside it (see below.)		internal (certified)readFxOS 1.0.1
embed-appsEmbed AppsAbility to embed apps in mozApp frames.internal (certified)noneFxOS 1.0.1
idleIdleNotify the app if the user is idle.internal (certified)noneFxOS 1.0.1
mobileconnectionMobile ConnectionObtain information about the current mobile voice and data connection.internal (certified)noneFxOS 1.0.1
network-eventsNetwork EventsMonitor network uploads and downloads.internal (certified)noneFxOS 1.0.1
networkstats-manageNetwork StatsObtain statistics of data usage per interface.internal (certified)noneFxOS 1.0.1
open-remote-windowOpen out-of-process windowsAllows normal window.open calls, but the resulting window is opened in a new process.internal (certified)noneFxOS 1.0.1
permissionsPermissions (Firefox OS)Allow an app to manage other permissions of other apps.internal (certified)noneFxOS 1.0.1
phonenumberservice????internal (certified)none??
powerPower ManagementTurn the screen on or off, control CPU, device power, and so on. Listen for and inspect resource lock events.internal (certified)noneFxOS 1.0.1
presentation-device-managePresentationObtain the list of available devices that can be used as external display and trigger device discovery.internal (certified)noneFxOS 3.0
settingsSettingsConfigure or read device settings.internal (certified)readonly or readwriteFxOS 1.0.1
smsWebSMSSend and receive SMS messages.internal (certified)noneFxOS 1.0.1,
+ 1.1 for MMS
telephonyWeb TelephonyAccess all telephony-related APIs to make and recieve phone calls.internal (certified)noneFxOS 1.0.1
timeTimeManagerSet current time. Time zone information is controlled by the Settings API. Formerly called systemclock.internal (certified)noneFxOS 1.0.1
voicemailVoicemailAccess voicemail.internal (certified)noneFxOS 1.0.1
webapps-manageOpen WebappsObtain access to the navigator.mozApps.mgmt API to manage installed Open Web Apps.
+
+ Required alongside the device-storage:apps permission (see above.)		internal (certified)noneFxOS 1.0.1, Desktop, Android
wifi-manageWiFi ManagementEnumerate available WiFi networks, get signal strength, connect to a network.internal (certified)noneFxOS 1.0.1
wappushWAP PushReceive WAP Push messages.internal (certified)noneFxOS 1.0.1
+ +
+

Nota: The internal codename for internal apps is certified apps. To declare an app as internal, you need to put "type" : "certified" into your app manifest.

+
+ +

Consulte também

+ +

A tabela de permissões (descontinuada e substituida por DXR) é onde são definidas as permissões da API do Firefox OSno código fonte do Firefox.

+ +
+ + + + + +
diff --git a/files/pt-pt/archive/b2g_os/index.html b/files/pt-pt/archive/b2g_os/index.html new file mode 100644 index 0000000000..c618cb8e2f --- /dev/null +++ b/files/pt-pt/archive/b2g_os/index.html @@ -0,0 +1,241 @@ +--- +title: B2G OS +slug: Archive/B2G_OS +tags: + - B2G + - Firefox OS + - Gaia + - Iniciação Firefox OS + - Principiante + - Resumo + - Sinopse + - básico +translation_of: Archive/B2G_OS +--- +
+

Firefox OS é o sistema operativo móvel desenvolvido pela Mozilla, baseado no Linux e no motor de renderização poderoso Gecko do Firefox.

+
+ +

Firefox OS is open source software that allows developers to harness the power and flexibility of the Web to create advanced end-user applications. The entire user interface is a web app, which can display and launch other apps. A Firefox OS web app is made with HTML, CSS, and JavaScript. In addition, Firefox OS web apps have access to the device hardware and services via an Application Programing Interface (API).

+ +

From a product perspective, Firefox OS is Mozilla's (and our OEM partners') branding and support services applied on top of Boot to Gecko (B2G), which is the operating system's engineering codename. Boot to Gecko is developed by a team of engineers inside Mozilla plus many external contributors from the wider Mozilla/open source community.

+ +
+

Desenvolver aplicações para o Firefox OS

+ +

Head over to our App Center for all the information you could possibly need on building open web apps that can be installed on Firefox OS !

+
+ +
+
+

Guias da Plataforma

+ +

Guides for platform developers on how the different components of the Firefox OS platform fit together and work.

+ + +
+ +
+

Criar e Instalar

+ +

Guides covering building and installing Firefox OS on an emulator, compatible device, or desktop simulator.

+ + +
+ +
+

Developer phones

+ +

Information on specific developer phones, such as tweaking, updating, recovering, and buying.

+ + +
+
+ +
+
+

Get started with Firefox OS add-ons

+ +

Firefox OS add-ons are new in Firefox OS 2.5! To start developing add-ons and getting involved in the add-ons community, read Getting started with Firefox OS add-ons.

+
+ +
+

Other useful pages

+ + +
+
+ +
+

Note: We are keeping track of ongoing work on Firefox OS documentation on our Firefox OS documentation status page. If you want to help contribute to Firefox OS documentation, please have a look at this page to see what work needs tweaking!

+
+ + + +
    +
  1. Introduction
    2. +
  2. Platform guide +
      +
    1. Platform guide overview
      2. +
    2. Architecture overview
      3. +
    3. Apps architecture
      4. +
    4. Gonk
      5. +
    5. Gecko
      6. +
    6. Gaia
      7. +
    7. Gaia apps guide
      8. +
    8. Security +
        +
      1. The Firefox OS security model
        2. +
      2. System security
        3. +
      3. Application security in Firefox OS
        4. +
      4. Securely installing and updating applications
        5. +
      +
      9. +
    9. Out of memory management on Firefox OS
      10. +
    10. Feature support chart
      11. +
    11. Settings list
      12. +
    +
    3. +
  3. Build and install +
      +
    1. Build and install overview
      2. +
    2. Firefox OS build process summary
      3. +
    3. Build prerequisites
      4. +
    4. Preparing for your first build
      5. +
    5. Building Firefox OS
      6. +
    6. Building Firefox OS for flame on OSX
      7. +
    7. Choosing how to run Gaia or Firefox OS
      8. +
    8. Building the Firefox OS simulator
      9. +
    9. Using the Firefox OS emulators
      10. +
    10. Installing Firefox OS on a mobile device
      11. +
    11. Creating and applying Firefox OS update packages
      12. +
    12. Building and installing FOTA community builds
      13. +
    13. B2G build variables reference sheet
      14. +
    +
    4. +
  4. Developing Firefox OS +
      +
    1. Developing Firefox OS overview
      2. +
    2. Filing bugs against Firefox OS
      3. +
    3. Modifying the hosts file
      4. +
    4. Customization with the .userconfig file
      5. +
    5. Customizing the b2g.sh script
      6. +
    6. Porting Firefox OS
      7. +
    +
    5. +
  5. Developing Gaia +
      +
    1. Developing Gaia overview
      2. +
    2. Running the Gaia codebase
      3. +
    3. Understanding the Gaia codebase
      4. +
    4. Making Gaia code changes
      5. +
    5. Testing Gaia code changes
      6. +
    6. Submitting a Gaia patch
      7. +
    7. Gaia build system primer
      8. +
    8. Customizing build-time apps
      9. +
    9. Market customizations guide
      10. +
    10. Customizing the keyboard in Firefox OS apps
      11. +
    11. Localizing Firefox OS
      12. +
    12. L10n Best Practices
      13. +
    13. Make options reference
      14. +
    14. Gaia tools reference
      15. +
    +
    6. +
  6. Firefox OS add-ons +
      +
    1. Firefox OS add-ons overview
      2. +
    2. Developing Firefox OS add-ons
      3. +
    +
    7. +
  7. Firefox OS phone guide +
      +
    1. Firefox OS phone guide overview
      2. +
    2. Phone and device specs
      3. +
    3. Geeksphone
      4. +
    4. ZTE OPEN
      5. +
    5. ZTE OPEN C
      6. +
    6. Flame
      7. +
    7. General device features
      8. +
    8. Troubleshooting
      9. +
    9. Best practices for open reference devices
      10. +
    +
    8. +
  8. Firefox OS on TVs and connected devices +
      +
    1. TVs and connected devices overview
      2. +
    2. How to connect WebIDE to TV (VIERA CX/CR series)
      3. +
    3. TV broadcast streams on Firefox OS products
      4. +
    4. Web animations on large screens
      5. +
    5. Implementing TV remote control navigation
      6. +
    6. Keyboard events in Firefox OS TV
      7. +
    7. TV remote control button mapping to keyboard
      8. +
    8. Firefox OS for TV UX Overview
      9. +
    +
    9. +
  9. Firefox OS release notes +
      +
    1. Firefox OS release notes overview
      2. +
    2. Firefox OS 2.2 for developers
      3. +
    3. Firefox OS 2.1 for developers
      4. +
    4. Firefox OS 2.0 for developers
      5. +
    5. Firefox OS 1.4 for developers
      6. +
    6. Firefox OS 1.3 for developers
      7. +
    7. Firefox OS 1.2 for developers
      8. +
    8. Firefox OS 1.1 for developers
      9. +
    9. Firefox OS 1.0.1 for developers
      10. +
    +
    10. +
  10. Automated testing +
      +
    1. Firefox OS automated testing overview
      2. +
    2. Running tests on Firefox OS: A guide for developers
      3. +
    3. Gaia UI tests
      4. +
    4. Gaia integration tests
      5. +
    5. Gaia unit tests
      6. +
    6. Gaia performance tests
      7. +
    7. Mochitests
      8. +
    8. Reftests
      9. +
    9. WebAPI tests
      10. +
    10. xpcshell tests
      11. +
    11. MTBF test
      12. +
    12. Marionette
      13. +
    13. Treeherder
      14. +
    +
    11. +
  11. Debugging +
      +
    1. Firefox OS debugging overview
      2. +
    2. Developer settings for Firefox OS
      3. +
    3. Connecting a Firefox OS device to the desktop
      4. +
    4. Setting up to debug Firefox OS using Firefox developer tools
      5. +
    5. On-device console logging
      6. +
    6. Installing and using ADB
      7. +
    7. Taking screenshots
      8. +
    8. Using the WebIDE
      9. +
    9. Firefox OS crash reporting
      10. +
    10. Debugging out of memory errors on Firefox OS
      11. +
    11. Debugging and security testing with Firefox OS
      12. +
    12. Debugging B2G using gdb
      13. +
    13. Debugging B2G using Valgrind
      14. +
    +
    12. +
diff --git a/files/pt-pt/archive/b2g_os/phone_guide/flame/index.html b/files/pt-pt/archive/b2g_os/phone_guide/flame/index.html new file mode 100644 index 0000000000..5f874186ca --- /dev/null +++ b/files/pt-pt/archive/b2g_os/phone_guide/flame/index.html @@ -0,0 +1,305 @@ +--- +title: Flame +slug: Archive/B2G_OS/Phone_guide/Flame +translation_of: Archive/B2G_OS/Phone_guide/Flame +--- +

A picture of the Flame device, showing the Firefox OS homescreen containing several app icons.

+ +

Available to order

+ +

The Flame developer reference phone is a milestone in Firefox OS device releases. The Flame hardware offers a representative set of specs — including FWVGA display and dual-core processor — to help developers build great content and experiences. A single hardware platform is also good for testers, making it easier to test and address specific software issues without having to worry about device model-specific bugs, etc.

+ +

If you have your phone in hand and want to start playing with it, developing and distributing apps, or contributing to the Firefox platform, the following links will get you where you need to go:

+ + + +

If you’d like to find out more about updating the operating system, recovering it, pushing apps to it, or phone specs, you’ll find the information you need below.

+ +

Purchasing a device

+ +

Our device manufacturer partner has made the device available to order on everbuying.com, for US$170 including global shipping (device cost is $145, shipping is $25 and custom fees may still apply, depending on the destination country). The device is bootloader- and carrier-unlocked, and it utilizes a quad-band GSM+UMTS radio so that it can work with a wide variety of operators/carriers.

+ +
+

Note: Another option for getting hold of a Flame is to participate in our Flames for Apps scheme, aimed at experienced HTML5 app developers wishing to port their highly-rated apps onto Firefox OS.

+
+ +

Important steps to follow first

+ +

There are a couple of steps you should make sure you follow for your particular operating system, before you start trying to update your device, for example by updating your Flame's version of Firefox OS, or pushing apps to your phone (both are covered below.)

+ +

All operating systems

+ +

You need to install ADB and Fastboot on your computer — these are applications that allow you to interact with your phone from your computer when the two are connected via the phone's USB charger cable. They are needed for Flashing your phone to a new version of Firefox OS, recovering from an unresponsive state, pushing apps to your phone, etc.

+ +
+

Note: If you are on Ubuntu you can install ADB and Fastboot simply by using sudo apt-get install android-tools-adb android-tools-fastboot on the command line.

+
+ +

ADB and Fastboot are available in the Android Developer Toolkit:

+ +
    +
  1. Go to this link
    2. +
  2. Press the Download Eclipse ADT button
    3. +
  3. Agree to the license conditions
    4. +
  4. Choose between the 32-bit and 64-bit version (32-bit will do if you are not sure)
    5. +
  5. Click the final Download Eclipse ADT with the Android SDK... button.
    6. +
  6. Once the download is complete, unzip the zip file's contents onto your computer's desktop
    7. +
  7. The folder name is a bit complicated; rename it to just adt
    8. +
+ +

ADB is a tool that you run from the command line. If you open your terminal/command prompt, go to adt/sdk/platform-tools and run the adb command, you should see a load of information thrown back at you about what you can do with ADB. Running adb devices should return the line List of devices attached, and nothing else, because you haven't got any devices attached yet.

+ +

But at this point, you need to set the PATH variable to point to the ADB tool, so you can run it from anywhere, not just when you are in the exact directory that ADB is in. To do this:

+ + + +

On Mac/Linux:

+ + + +

Linux and Mac

+ +

No additional steps should be required if you are using a Linux or Mac system, although depending on your Linux distro, you might need to add a udev rule for your phone.

+ +

The udev rule for the Flame should look something like the following:

+ +
SUBSYSTEM=="usb", ATTRS{idVendor}=="05c6", ATTRS{idProduct}=="9025", GROUP="users", MODE="0666"
+ +

Make sure to --reload-rules, then unplug and replug and your device before continuing.

+ +

Windows

+ +

To access the Flame device with the App Manager/ADB, a USB driver is required. Follow the steps outlined in the below sections to install it.

+ +

Downloading the driver

+ +

Download the Windows driver from this location. Once downloaded, extract the contents of the ZIP file to a suitable place on your hard drive.

+ +
+

Note: The Android Debug Bridge (ADB) must be installed first.

+
+ +

Installing the USB Driver

+ +

At this point, connect your Flame device to your computer using a USB cable.

+ +

To install the driver, open the Alcatel_USB_Driver_Q_4.0.0_2013_11_11_noinstall directory within the extracted ZIP file and double click on the DriverInstaller.exe executable. You may receive a warning at this point that the executable is from an unknown publisher. If so, select the Yes button and the executable will be launched.

+ +

Simple dialog box showing a picture of a phone along with install and uninstall buttons.

+ +

Click on the Install button to install the driver.

+ +

After the driver installs, you can check that it is working by opening a command line window and typing adb devices. This should list the connected device with an output something like:

+ +
List of devices attached
+3561d02a          device
+ +

If your device is not showing up here, check in the Windows Device Manager. Your Flame may be showing up as "ACER ADB Interface". You can confirm this by unplugging the device and seeing if it disappears from the device manager. Uninstall the driver software by right-clicking on "ACER ADB Interface" and clicking uninstall.  Be sure to check the box in the dialog to delete the driver software.  Now re-run the installer above. It is advisable to set the screen timeout on your Flame to something high (Settings > Display > Screen timeout) as Windows sometimes appears to reinstall the default drivers when the screen turns off.

+ +

Updating your Flame's software

+ +

We will have two main "channels" of Firefox OS software version releases for the Flame phone:

+ + + +

While our partners are working out a final storage solution for the software builds, you can get recovery files and tools at the following storage locations:

+ + + +

To install the base image on your device:

+ +
    +
  1. Make sure remote debugging is enabled on your Flame, using the Remote debugging/Debugging via USB option in the device's Developer settings (the option is different, depending on whether you have Firefox 1.3 and under, or Firefox 1.4+ installed).
    2. +
  2. Connect your Flame to your computer via a USB cable if it isn't already. Verify that the computer is connected to the device by running the adb devices command in a terminal.
    3. +
  3. Download and Extract the .zip file referenced above. Unzip it onto your Desktop.
    4. +
  4. Go into the directory you extracted the software into and run it: +
      +
    • On Windows, enter the directory in your command prompt, then run the flash.bat script using flash.bat.
      • +
    • On Linux / OSX, enter the directory in your terminal, then run the flash.sh script using sudo ./flash.sh (if you don't run it using sudo, the flash script may fail to see your device, and it won't work).
      • +
    +
    5. +
+ +
+

Note: You are also welcome to build your own builds to install on the Flame: see Building and installing Firefox OS.

+
+ +

Updating your Flame to a nightly build

+ +
+

Note: For this current build, Nightly development builds of Firefox OS do not support A-GPS, which may lead to slow performance of GPS functionality. We plan to resolve this in an updated future Nightly channel.

+
+ +
    +
  1. Before updating your phone to a Nightly build you should flash the latest base image to make sure the underlying systems are up to date. Download a base image and use it to update your device's software, as explained above.
    2. +
  2. Because the above step installs a fresh operating system on your device, you'll need to enable remote debugging on your Flame again, using the Remote debugging option in the device's Developer settings.
    3. +
  3. Next, choose a Nightly build to install (found on http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/.) You'll want one of the following: + +
    4. +
  4. Pick a version and download both the b2g-XX.XX.en-US.android-arm.tar.gz and gaia.zip files. Save them inside a directory on your Desktop called something like fxos.
    5. +
  5. Download the shallow flash script and save it in the same directory as the above two files: follow the link, press the Raw button, then use your browser's save functionality to save the page directly as shallow_flash.sh.
    6. +
  6. In your Terminal, cd into the directory you saved the files in and Flash the builds to your phone using the following command: +

    Mac

    + + 
    ./shallow_flash.sh -g gaia.zip -G b2g-XX.XX.en-US.android-arm.tar.gz
    + +

    Linux

    + + 
    ./shallow_flash.sh -ggaia.zip -Gb2g-XX.XX.en-US.android-arm.tar.gz
+
    + +

    Windows (Note: instruction still being worked out, may not work yet)

    + + 
    shallow_flash.sh -g gaia.zip -G b2g-XX.XX.en-US.android-arm.tar.gz
+
    +
    7. +
+ +
+

Note: If you get a "permission denied" error when running the above command, your shell script probably doesn't have the right permissions. Running chmod +x shallow_flash.sh on it should solve this problem.

+
+ +
+

Note: A "shallow flash" updates Gecko and Gaia plus data directories, as opposed to a full flash, which updates Gecko/Gaia, but also the underlying Gonk layer and associated binaries particular to that device type. This is why it is a good idea to update to the official base image first, as suggested above, then shallow flash over the top of that, once you've got the Gonk/binary layer right.

+
+ +
+

Important: When running a shallow or full flash, your phone data will be overwritten: you should therefore back up your data before updating!

+
+ +

Once the install procedure finishes the phone should reboot into the updated build and display the first time user workflow.

+ +

Font fix

+ +

After updating Gecko and Gaia to nightly with the v123 base image, there will be a mismatch between the fonts that Gecko and Gaia expects and what the base image provides. To fix this, download our font update package, extract it, navigate into the directory created by extracting, and run the supplied flash.sh script.

+ +
+

Note: Another option is to use the update_system_fonts.sh script, which will download and flash the system fonts automatically.

+
+ +

Fastboot mode

+ +

If flashing a new build to your phone fails to work, your phone may become unresponsive, leading to the phone rebooting in recovery mode. The recovery mode provides few options (Reboot, Update from adb, Wipe data, Wipe cache, and Update from sdcard). Unfortunately, selecting Update from adb triggers a sideload mode in which you cannot use the other adb commands. The adb sideload command would work but the various flash scripts rely on other adb commands.

+ +

From sideload mode, you can force fastboot mode as follows:

+ +
    +
  1. Power off the phone (which may involve removing the battery in extreme cases...)
    2. +
  2. Plug in the USB cable.
    3. +
  3. Power the phone up again by pressing the Volume Down and Power buttons together.
    4. +
+ +

The phone should only display the very first static logo and stay there, without displaying the boot animation. It seems stuck but is not really: it is in fastboot mode and is waiting for a USB connection. At this point, a USB-connected, computer with adb installed should see the phone listed when the fastboot devices command is run. Note that regular adb would not see the device — only fastboot sees it. In this mode, you can use the flash script to install v123 as explained above. As the script does use both adb and fastboot commands, you may see some initial error and warnings from adb, but the device should be flashed properly at the end of the procedure.

+ +

Emergency download mode

+ +

If flashing a new build to your phone fails to work, your phone becomes unresponsive, and the phone cannot enter fastboot mode, you can use emergency mode for recovery. A USB cable and the Emergency Download Tool are required to enter emergency download mode. Install this tool and follow the instructions.

+ +

Recovery mode

+ +

You can enter recovery mode to clear your phone data or manually update the firmware. There are two ways to enter this mode:

+ + + +

When in recovery mode, press the Volume up/down keys to move the selection highlight, and the Power key to select. Make sure you have your phone data (Contacts, SMS, etc.) backed up before clearing data, and your upgrade packages downloaded before updating.

+ +

Pushing apps to your Flame

+ +

The App Manager tool makes it easy to push apps to your phone, for testing, etc. Full instructions are available in the article Using the App Manager.

+ +
+

Note: If you are running Firefox Nightly, you can instead make use of our next generation WebIDE tool, which performs the same functions as the App Manager, plus more.

+
+ +

RAM adjustment

+ +

You can adjust the available RAM capacity to see how apps perform on Firefox OS phones with lower memory footprints.

+ +

This is accomplished by entering fastboot mode (install fastboot first, which is available on the same SDK page as ADB) and typing:

+ +
adb reboot bootloader
+fastboot oem mem [0|256-1024]
+ +

“0” is the memory automatically detected and “256-1024” is the number of megabytes. For example, if you want to adjust device RAM capacity to 512M, enter fastboot oem mem 512.

+ +

You'll need to then reboot your device for the settings to take effect. This can be done using:

+ +
fastboot reboot
+ +

The current memory size can be returned by entering fastboot mode and typing:

+ +
fastboot getvar mem
+
+ +

Network and Device specs

+ +

Network:

+ + + +

Hardware: You can find more of the hardware features listed on our Phone and device specs page.

+ +

Additional features include:

+ + + +

See also

+ + diff --git a/files/pt-pt/archive/b2g_os/phone_guide/index.html b/files/pt-pt/archive/b2g_os/phone_guide/index.html new file mode 100644 index 0000000000..d90e90d259 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/phone_guide/index.html @@ -0,0 +1,53 @@ +--- +title: Firefox OS developer phone guide +slug: Archive/B2G_OS/Phone_guide +tags: + - B2G + - Firefox OS + - Landing + - NeedsTranslation + - Phones + - TopicStub +translation_of: Archive/B2G_OS/Phone_guide +--- +
+

This section contains developer information relevant to specific phones that run Firefox OS. We have general information available on Building and installing Firefox OS and Hacking Firefox OS, so please go there for information about building and installing the platform from scratch. Developers with specific phones in their possession may however find the following articles useful.

+
+

Specific device information

+
+
+ Firefox OS phone data
+
+ In this article we list the various available Firefox OS phones along with information such as their code names, availability, and specific hardware features.
+
+ Flame
+
+ Information on Mozilla's high-end Firefox OS reference phone, codenamed the Flame, and produced in partnership with T2Mobile.
+
+ Geeksphone
+
+ In this article we cover some basic tips on how to keep your Geeksphone up-to-date and how to tweak the system Gaia applications.
+
+ ZTE OPEN
+
+ This article contains information on the ZTE OPEN Firefox OS device.
+
+ ZTE OPEN C
+
+ The ZTE Open C is an updated ZTE-produced Firefox OS device, with higher end hardware and newer software.
+
+

General Firefox OS information

+
+
+ General device features
+
+ This page lists typical Firefox OS hardware features and minimum hardware requirements.
+
+ Troubleshooting
+
+ This article provides tips for resolving common problems you may have while using Firefox OS.
+
+ Best practices for open reference devices
+
+ A set of best practices that we believe should come highly recommended for any widely available open reference devices. All of the recent Firefox OS reference devices have followed these practices.
+
diff --git a/files/pt-pt/archive/b2g_os/simulator/index.html b/files/pt-pt/archive/b2g_os/simulator/index.html new file mode 100644 index 0000000000..1c8c9341a6 --- /dev/null +++ b/files/pt-pt/archive/b2g_os/simulator/index.html @@ -0,0 +1,118 @@ +--- +title: Simulador do Firefox OS +slug: Archive/B2G_OS/Simulator +tags: + - Aplicações + - Ferramentas + - Firefox OS +translation_of: Archive/B2G_OS/Simulator +--- +
+

Esta página descreve o Simulador do Firefox OS para os programadores que segmentam o Firefox OS 1.2 ou superior. Se está a desenvolver aplicações para o Firefox OS 1.1, em vez disso, consulte a documentação do Firefox OS 1.1 Simulator.

+
+ +

The Firefox OS Simulator is a version of the higher layers of Firefox OS that simulates a Firefox OS device, but runs on the desktop. This means that in many cases, you don't need a real device to test and debug your app. It runs in a window the same size as a Firefox OS device, includes the Firefox OS user interface and built-in apps, and simulates many of the Firefox OS device APIs.

+ +

The Simulator is packaged and distributed as a Firefox add-on. Once you've downloaded it and installed it in Firefox, you can run it, push apps to it, and attach the developer tools to it using the App Manager tool or WebIDE.

+ +

Instalação

+ +

To install the simulator, use WebIDE's Manage Extra Components pane (available as part of Firefox 34 and onwards). Multiple versions are available, and you are advised to install them all, for maximum flexibility.

+ +
+

Starting with Firefox 43, the about:addons page may display warnings about your addon being unsigned. The simulators are properly signed at install time, however they are subsequently modified and thus appear "broken". They will continue to run successfully despite this warning message. Details are in {{ Bug(1197262) }}.

+
+ +

To start the Simulator, you choose it from WebIDE's runtime list. For more details, see the instructions in the WebIDE documentation. Once the Simulator's running, you can push apps to it and debug them using the WebIDE, just as you can with a real device.

+ +

If you are using the App Manager (an older tool available prior to the WebIDE), you can install a simulator via the following button:

+ +

Instalar Simulador

+ +

A IU do Simulador

+ +

The Simulator appears as a separate window, sized so the simulated screen area is 320x480 pixels. To simulate touch events you can click the mouse button and drag while holding the button down. So by clicking and dragging right-to-left from the Home Screen, you'll see the built-in apps, as well as any apps you have added:

+ +

+ +

The Simulator has two buttons in a toolbar at the bottom:

+ + + +

Emulação do cartão SD

+ +

In the Simulator the device SD card is mapped to the "fake-sdcard" directory in the Simulator's profile, which is itself located inside the "extensions" directory under the Firefox profile in which the Simulator is installed. For example:

+ +
/path/to/Firefox/Profiles/Firefox-profile-name/extensions/fxos_2_2_simulator@mozilla.org/profile/fake-sdcard
+ +

Files read or written using the getDeviceStorage API will appear here.

+ +

Before version 2.2 of the Simulator, you had to create the "fake-sdcard" directory manually for this to work. From 2.2 onwards, the "fake-sdcard" directory is created for you automatically.

+ +

Also from version 2.2 onwards, if you're running the Simulator from the command line you can define a different directory by passing the --storage-path option.

+ +
Note: this is mostly meant for API testing. Music will be read not from the "fake-sdcard" directory, but from your system's ~/Music, pictures from ~/Pictures, videos from ~/Videos. Downloads go to ~/Downloads. user-dirs.dirs redefinitions are supported.
+ +

Limitações do Simulador

+ +

Note that the Firefox OS Simulator isn't a perfect simulation.

+ +

Limitações do Hardware

+ +

Apart from screen size, the Simulator does not simulate the hardware limitations of a Firefox OS device such as available memory or CPU speed.

+ +

Codecs de áudio/vídeo

+ +

The following codecs depend on hardware-accelerated decoding and are therefore not yet supported:

+ + + +

This means it isn't possible to use the Simulator to test video playback in apps and on websites like Youtube that rely on these codecs.

+ +

APIs Não Suportadas

+ +

Certain APIs that work on the device won't work on the Simulator, generally because the supporting hardware is not available on the desktop. We've implemented simulations for some APIs such as geolocation, and expect to add more in future releases. However, at the moment the following APIs are not supported. Using them might throw errors or just return incorrect results:

+ + + +

Obter ajuda

+ +

If you have a question, try asking us on the dev-developer-tools mailing list or on #devtools on irc.mozilla.org.

+ +

How to enable verbose logging

+ +

You can see messages logged from your app in the Web Console, which you can attach to your app using the WebIDE. If you want to catch early messages happening during app startup, before the console gets connected and working, you can enable verbose logging in the Simulator.

+ +

Visit about:config and create a new preference. The preference name is different for each version of the Simulator:

+ + + +

Set it to the string value "all", and disable, then reenable, the add-on in the Add-on Manager. Now extra messages about the Simulator's operation will appear in the Browser Console.

+ +

Criar o Simulador

+ +

If you'd like to test patches to the Gecko or Gaia code that the Simulator contains, you may be interested in modifying the simulator to use a custom Gecko build or Gaia profile. Alternatively, you can build a new Simulator from your Gecko checkout.

+ +

Alternativas

+ +

Different ways to run Gaia — including a list of them in order of ease for running and reverse order of closeness to the shipped product (according to it, Firefox OS Simulator is easiest but furthest).

diff --git "a/files/pt-pt/archive/b2g_os/utilizar_o_gestor_de_aplicac\303\265es/index.html" "b/files/pt-pt/archive/b2g_os/utilizar_o_gestor_de_aplicac\303\265es/index.html" new file mode 100644 index 0000000000..96d59b7659 --- /dev/null +++ "b/files/pt-pt/archive/b2g_os/utilizar_o_gestor_de_aplicac\303\265es/index.html" @@ -0,0 +1,283 @@ +--- +title: Utilizar o Gestor de Aplicações +slug: Archive/B2G_OS/Utilizar_o_Gestor_de_Aplicacões +translation_of: Archive/B2G_OS/Using_the_App_Manager +--- +
+

Importante: O Gestor de Aplicações deverá ser considerado desaprovado; o trabalho para remover o código do Gestor de Aplicações do Firefox já foi iniciado (consultar {{bug("1007061")}}), e se em vez disso, já utilizar WebIDE, a menos que tenha uma boa razão para o não fazer.

+
+ +
+

The App Manager is a tool for Firefox Desktop which provides a number of useful tools to help developers test, deploy and debug HTML5 web apps on Firefox OS phones & Simulator, directly from Firefox browser. This page documents how to use the App Manager.

+ +

App Manager is available for Firefox OS 1.2 or later, lower versions are supported in Firefox OS 1.1 Simulator. The App Manager is being replaced by the WebIDE, starting from Firefox 33. The WebIDE provides all the features of the App Manager and also features an editing environment to create and develop Firefox OS apps.

+
+ +

{{EmbedYouTube("z1Bxg1UJVf0")}}

+ +

The App Manager is composed of:

+ + + +

Quick setup

+ +

This section is designed to get you up and running as soon as possible; if you need some more detail please skip forward to the {{ anch("Device and system configuration") }} section and start reading from there.  Also see the {{ anch("Troubleshooting") }} section for help if you are having trouble.

+ +
    +
  1. Make sure you have Firefox Desktop 26+ installed
    2. +
  2. Open the App Manager (in the URL bar, type about:app-manager, or go to Tools > Web Developer > App Manager in your Firefox menu.) This should appear in a new browser tab.
    3. +
  3. If you don't have a real device: +
      +
    1. Install the Firefox OS Simulator add-on, then go back to the App Manager tab of your browser.
      2. +
    2. In App Manager's bottom toolbar, click on Start Simulator, then click on the name of the installed simulator, which should appear there.
      3. +
    +
    4. +
  4. If you have a real device: +
      +
    1. Make sure your device is running Firefox OS 1.2+
      2. +
    2. On Windows, make sure to install the drivers provided by your phone manufacturer
      3. +
    3. In the Settings of your device, disable Screen Lock (Settings > Phone lock > Lock Screen) and enable Remote Debugging (Settings > Device information > More information > Developer)
      4. +
    4. Install the ADB Helper add-on in Firefox Desktop
      5. +
    5. Connect your device to your machine via a USB cable
      6. +
    6. You should see the name of your device in the App Manager's bottom bar. Click on it.
      7. +
    +
    5. +
  5. The bottom bar should show "Connected to: xxx"
    6. +
  6. Click on the Apps panel and add an app (packaged or hosted)
    7. +
  7. The Refresh button validates your app and installs it on the Simulator/Device
    8. +
  8. The Debug button connects the developer tools to the running app
    9. +
  9. See the {{ anch("Troubleshooting") }} section for help if you are having trouble
    10. +
+ +

Device and system configuration

+ +

The first thing you'll need to do when using the App Manager is make sure your system and phone are set up correctly. This section will run through all the steps required.

+ +

Firefox OS 1.2+ required

+ +

Make sure your device is running Firefox OS 1.2/Boot2Gecko 1.2 or higher. To check which version of Firefox OS the device is runing, go to Settings > Device Information > Software.

+ +

If you don't have a high enough version installed, depending on what phone you have you will need to either install an available nightly build of Firefox 1.2+, or configure and build it yourself from source.

+ +

Builds available:

+ + + +
+

Note: To build your own Firefox OS 1.2+ distribution, follow the instructions located at Building and installing Firefox OS, starting with Firefox OS build prerequisites.

+
+ +

Remote debugging

+ +

Next, you need to enable remote debugging in Firefox OS. To do so, go to Settings > Device information > More information > Developer and check the Remote Debugging checkbox.

+ +

ADB or ADB helper

+ +

The process uses the Android Debug Bridge (ADB) to handle the device-computer connection and communication. There are two options for running ADB:

+ + +
+

Note: There's no need to run this command if you installed the ADB Helper Add-on.

+
+ +

Connecting your device to the App Manager

+ +

With all your configuration done, it's now time to plug your device into your computer and start the App Manager:

+ +
    +
  1. Plug the device into your computer via USB.
    2. +
  2. Disable Screen lock on your device by going to Settings > Screen Lock and unchecking the Lock Screen checkbox. This is a good idea because when the screen gets locked, the phone connection gets lost, meaning it is no longer available for debugging.
    3. +
  3. Start the App Manager — In Firefox Desktop select the Tools > Web Developer > App Manager menu option, or type about:app-manager in the URL bar.
    4. +
  4. At the bottom of the App Manager tab, you will see a connection status bar (see screenshot below). You should be able to connect your device by clicking the "Connect to localhost:6000" button.
    5. +
  5. If this works successfully, a prompt should appear on your device: "An incoming request to permit remote debugging connection was detected. Allow connection?". Tap the OK button (You may also have to press the power button on the phone so you can see the prompt.) The connection status bar should update to say "Connected to B2G", with a Disconnect button available to press if you want to cancel the connection.
    6. +
+ +

+ +
+

Note: The other controls in the connection status bar allow you to connect a simulator to the App Manager, which we cover in the next section, below, and change the port that the connection happens on. If you change the port, you'll also need to enable port forwarding for this port as well, as instructed in the {{anch("Enable port forwarding")}} section, above.

+
+ +

Using a Firefox OS Simulator Add-on

+ +

If you haven't got a real device available to use with App Manager, you can still try it out using a Firefox OS Simulator Add-on. To start off, install the simulator with the following button (multiple versions are available; you are advised to install them all, for maximum flexibility):

+ +

Install Simulator

+ +

Once you've installed the simulator(s), you need to go to about:app-manager to see the connection status bar at the bottom of the App Manager tab, and click the "Start simulator" button. At least three buttons will appear:

+ + + +
+

Note: The Firefox OS 1.5 Simulator has been removed, as 1.5 was changed to 2.0. If you have the Firefox OS 1.5 Simulator installed, it won't automatically update to 2.0, so you should uninstall 1.5 and install 2.0 instead. The Firefox OS 2.0 simulator will then automatically update.

+
+ +
+

Note: The Firefox OS 1.2 Simulator has been removed, as no phones are likely to be released with version 1.2 installed — this version is therefore of limited value, and it makes more sense to spend your time debugging on other versions.

+
+ +

Running custom builds in the App Manager

+ +

Note that you can run custom B2G Desktop and Gaia/Gecko builds in the App Manager via the simulator. Read Running custom Firefox OS/Gaia builds in the App Manager for instructions on how to do this.

+ +

Apps panel: Test and debug Firefox OS apps

+ +

Now that everything is working, let's review the functionality available inside the App Manager, starting with the Apps panel. From here, you can import an existing app to push onto your device, for testing and debugging:

+ + + +

Information about your app should appear on the right hand side of the window, as seen below:

+ +

+ +

Manifest editor

+ +

From Firefox 28 onwards, the Apps Panel includes an editor for the app manifest:

+ +

+ +

Debugging

+ +

Clicking on "Update" will update (install) the app on the device. Clicking on "debug" will connect a toolbox to the app, allowing you to debug its code directly:

+ +

+ +
+

You'll enjoy playing around with the toolbox — try altering the DOM, CSS etc. and you'll see the updates reflected on the device in realtime. Such updates will be saved on the installed app code; you'll see them next time you open the app on the device.

+
+ +

Before Firefox 28, the tools are launched in a separate window. From Firefox 28 onwards, the tools are launched in a separate tab in the App Manager itself, alongside the Apps and Device tabs. The tab is given your app's icon so it's easy to find:

+ +

+ +

Errors

+ +

If an app was not added successfully — for example if the URL was incorrect, or you selected a packaged app folder — an entry will be added to the page for this app, but this will include error information.

+ +

+ +

You can also delete an app from this view, by hovering over the App name/description on the left of the window, and pressing the "X" button that appears in each case. This however doesn't remove the app from the device. To do that you need to manually remove the app using the device itself.

+ +

Device panel

+ +

The Device tab displays information about the connected device. From the "Installed Apps" window, apps on the device can be started and debugged.

+ +

+ +
+

Note: Certified Apps are not listed by default. See how to debug certified apps.

+
+ +

The "Permissions" window shows the required privileges for different Web APIs on the current device:

+ +

+ +

Finally, you can take a screenshot of the current device display by clicking the "Screenshot" button. The screenshot appears in a new tab on Firefox, and from there you can save or discard it as you wish.

+ +

Debugging Certified Apps

+ +

Currently only devices running a development build of Firefox OS 1.2+ are capable of debugging certified apps. If you have a development build, you can enable certified app debugging by changing the pref devtools.debugger.forbid-certified-apps to false in your profile. To do this, follow the steps below:

+ +

Using a real device

+ +
    +
  1. +

    On your computer, enter the following command in Terminal/console to enter your device's filesystem via the shell:

    + + 
    adb shell
    + +

    Your prompt should change to root@android.

    +
    2. +
  2. +

    Next, stop B2G running using the following command:

    + + 
    stop b2g
    +
    3. +
  3. +

    Navigate to the following directory:

    + + 
    cd /data/b2g/mozilla/*.default/
    +
    4. +
  4. +

    Here, update the prefs.js file with the following line:

    + + 
    echo 'user_pref("devtools.debugger.forbid-certified-apps", false);' >> prefs.js
    +
    5. +
  5. +

    After you've finished editing and saving the file, start B2G again using the following command:

    + + 
    start b2g
    +
    6. +
  6. +

    Exit the android filesystem using the exit command; this will return you to your normal terminal prompt.

    +
    7. +
  7. +

    Next, reconnect to the App Manager and you should see certified apps appear for debugging.

    +
    8. +
+ +

Using the B2G desktop client

+ +

With the B2G desktop client, the preference is already defined in your profile in greprefs.js, located at the root of your B2G desktop client folder. Stop your B2G desktop client and edit the file to turn the devtools.debugger.forbid-certified-apps preference to false. Then restart the B2G client and connect the App Manager. You should now see all applications.

+ +
+

Note: If you want to add this preference to your Gaia build you can run make DEVICE_DEBUG=1 reset-gaia.

+
+ +

Troubleshooting

+ +

If the device is not recognized:

+ + + +

Can't connect your device to the App Manager or start the simulator? Let us know or file a bug. and

diff --git a/files/pt-pt/archive/css3/index.html b/files/pt-pt/archive/css3/index.html new file mode 100644 index 0000000000..5cabcb8ebd --- /dev/null +++ b/files/pt-pt/archive/css3/index.html @@ -0,0 +1,1090 @@ +--- +title: CSS3 +slug: Archive/CSS3 +tags: + - CSS + - Precisa de Tradução + - Referencia +translation_of: Archive/CSS3 +--- +

CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2.1. It brings a lot of long-awaited novelties, like rounded corners, shadows, gradients, transitions or animations, as well as new layouts like multi-columns, flexible box or grid layouts. Experimental parts are vendor-prefixed and should either be avoided in production environments, or used with extreme caution as both their syntax and semantics can change in the future.

+ +

Módulos e processo de uniformização

+ +

CSS Level 2 needed 9 years, from August 2002 to June 2011 to reach the Recommendation status. This was due to the fact that a few secondary features held back the whole specification. In order to accelerate the standardization of non-problematic features, the CSS Working Group of the W3C, in a decision referred as the Beijing doctrine, divided CSS in smaller components called modules . Each of these modules is now an independent part of the language and moves towards standardization at its own pace. While some modules are already W3C Recommendations, other still are early Working Drafts. New modules are also added when new needs are identified.

+ +

CSS Modules and Snapshots as defined since CSS3 Formally, there is no CSS3 standard per se . Each module being standardized independently, the standard CSS consists of CSS2.1 amended and extended by the completed modules, not necessary all with the same level number. At each point of time, a snapshot of the CSS standard can be defined, listing CSS2.1 and the mature modules.

+ +

The W3 consortium periodically publishes such snapshots, like in 2007, 2010, 2015, 2017, and 2018.

+ +

Though today no module with a level greater than 3 is standardized, this will change in the future. Some modules, like Selectors 4 or CSS Borders and Backgrounds Level 4 already have an Editor's Draft, though they haven't yet reached the First Published Working Draft status.

+ +

Estado dos módulos CSS

+ +

Módulos concluídos

+ +

A few CSS modules already became a standard as a W3C Recommendation. These should be no more changes.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Colors", "", "") }}{{ Spec2("CSS3 Colors") }} since June 7th, 2011
+

Adds the {{ cssxref("opacity") }} property, and the hsl(), hsla(), rgba() and rgb() functions to create {{cssxref("<color>")}} values. It also defines the currentColor keyword as a valid color.

+ +

The transparent color is now a real color (thanks to the support for the alpha channel) and is a now an alias for rgba(0,0,0,0.0).

+ +

It deprecates the system-color keywords that shouldn't be used in a production environment anymore.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Namespaces", "", "") }}{{ Spec2("CSS3 Namespaces") }} since September 29th, 2011
+

Adds the support for the XML Namespaces by defining the notion of CSS qualified name, using the ' | ' syntax and adding the {{ cssxref("@namespace") }} CSS at-rule.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Selectors", "", "") }}{{ Spec2("CSS3 Selectors") }} since September 29th, 2011
+

Adds:

+ +
    +
  • Substring matching attribute selectors, E[attribute^="value"], E[attribute$="value"], E[attribute*="value"] .
    • +
  • New pseudo-classes: {{ cssxref(":target") }}, {{ cssxref(":enabled") }} and {{ cssxref(":disabled") }}, {{ cssxref(":checked") }}, {{ cssxref(":indeterminate") }}, {{ cssxref(":root") }}, {{ cssxref(":nth-child") }} and {{ cssxref(":nth-last-child") }}, {{ cssxref(":nth-of-type") }} and {{ cssxref(":nth-last-of-type") }}, {{ cssxref(":last-child") }}, {{ cssxref(":first-of-type") }} and {{ cssxref(":last-of-type") }}, {{ cssxref(":only-child") }} and {{ cssxref(":only-of-type") }},{{ cssxref(":empty") }}, and {{ cssxref(":not") }}.
    • +
  • Pseudo-elements are now characterized by two colons rather than one: :after becomes {{ cssxref("::after") }}, :before becomes {{ cssxref("::before") }}, :first-letter becomes {{ cssxref("::first-letter") }}, and :first-line becomes {{ cssxref("::first-line") }}.
    • +
  • The new general sibling combinator ( h1~pre ).
    • +
+
+ +

The next iteration of the Selectors specification is already in progress, though it still hasn't reached the First Public Working Draft stage.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Media Queries", "", "") }}{{ Spec2("CSS3 Media Queries") }} since June 19th, 2012
+

Extends the former media type ( print, screen, … ) to a full language allowing queries on the device media capabilities like only screen and (color) .

+ +

Media queries are not only used in CSS document but also in some attributes of HTML Elements, like the {{ htmlattrxref("media","link") }} attribute of the {{ HTMLElement("link") }} element.

+
+ +

The next iteration of this specification is in the work, allowing to tailor a Web site regarding the input methods available on the user agent, with new media features like hover or pointer. Detection of EcmaScript support, using the script media features is also proposed.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Style", "", "") }}{{ Spec2("CSS3 Style") }} since November 7th, 2013
Formally defines the syntax of the content of the HTML style global attribute.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Fonts", "", "") }}{{ Spec2("CSS3 Fonts") }} since September 20th, 2018
+

Amends the CSS2.1 Font matching algorithm to be closer to what is really implemented.

+ +

Adds:

+ +
    +
  • Support for downloadable fonts via the CSS {{ cssxref("@font-face") }} at-rule.
    • +
  • The control of the contextual inter-glyph spacing via the CSS {{ cssxref("font-kerning") }} property.
    • +
  • The choice of language-specific glyphs via the CSS {{ cssxref("font-language-override") }} property.
    • +
  • The choice of glyphs with specific OpenType features via the CSS {{ cssxref("font-feature-settings") }} property.
    • +
  • The control of the aspect ratio to use when fallback fonts are selected via the CSS {{ cssxref("font-size-adjust") }} property.
    • +
  • The choice of alternative font faces using the CSS {{ cssxref("font-stretch") }}, {{ cssxref("font-variant-alternates") }}, {{ cssxref("font-variant-caps") }}, {{ cssxref("font-variant-east-asian") }}, {{ cssxref("font-variant-ligatures") }}, {{ cssxref("font-variant-numeric") }}, and {{ cssxref("font-variant-position") }} properties. It also extends the related CSS {{ cssxref("font-variant") }} shorthand property and introduces the {{ cssxref("@font-feature-values") }} at-rule.
    • +
  • The control of the automatic generation of an oblique or bold face when none are found via the CSS {{ cssxref("font-synthesis") }} property.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Basic UI", "", "") }}{{ Spec2("CSS3 Basic UI") }} since June 21st, 2018
+

Adds:

+ +
    +
  • The ability to tweak the box model using the CSS {{ cssxref("box-sizing") }} property.
    + At risk: due to insufficient browser support, standardization of the padding-box value may be postponed to the next iteration of this module.
    • +
  • Allow the styling of forms according their content using the CSS {{ cssxref(":indeterminate") }}, {{ cssxref(":default") }}, {{ cssxref(":valid") }}, {{ cssxref(":invalid") }}, {{ cssxref(":in-range") }}, {{ cssxref(":out-of-range") }}, {{ cssxref(":required") }}, {{ cssxref(":optional") }}, {{ cssxref(":read-only") }}, and {{ cssxref(":read-write") }} pseudo-classes and the {{ cssxref("::value") }}, {{ cssxref("::choices") }}, {{ cssxref("::repeat-item") }}, and {{ cssxref("::repeat-index") }} pseudo-elements.
    + At risk: due to insufficient browser support, standardization of the pseudo-elements {{ cssxref("::value") }}, {{ cssxref("::choices") }}, {{ cssxref("::repeat-item") }}, and {{ cssxref("::repeat-index") }} may be postponed to the next iteration of this module .
    • +
  • Support for icons, defined by the CSS {{ cssxref("icon") }} property simultaneously with the new icon value of the CSS {{ cssxref("content") }} property.
    + At risk: due to insufficient browser support, standardization of the {{ cssxref("icon") }} property and the icon value may be postponed to CSS4.
    • +
  • Support for the CSS {{ cssxref("outline-offset") }} property giving more control on the position of the outline.
    • +
  • Support for the CSS {{ cssxref("resize") }} property allowing Web authors to control if and how elements should be resized.
    • +
  • Support for the CSS {{ cssxref("text-overflow") }} property defining how text overflows, if needed.
    + At risk: due to insufficient browser support, the 2-value syntax of this property as well as the support for {{cssxref("<string>")}} values may be postponed to the next iteration of this module.
    • +
  • The ability to define the hotspot of a cursor as well as the new none, context-menu, cell, vertical-text, alias, copy, no-drop, not-allowed, nesw-resize, nwse-resize, col-resize, row-resize, all-scroll, zoom-in, zoom-out, extending the {{ cssxref("cursor") }} property.
    • +
  • The ability to specify the sequential navigation order (that is the tabbing order ) using the CSS {{ cssxref("nav-index") }}, {{ cssxref("nav-up") }}, {{ cssxref("nav-right") }}, {{ cssxref("nav-left") }}, {{ cssxref("nav-down") }} properties.
    + At risk: due to insufficient browser support, standardization of the navigation properties may be postponed to the next iteration of this module.
    • +
  • The ability to control the usage of an IME editor, using the CSS {{ cssxref("ime-mode") }} property.
    + At risk: due to insufficient browser support, standardization of the {{ cssxref("ime-mode") }} property may be postponed to the next iteration of this module.
    • +
+
+ +

An early list of what could be in the next iteration of the CSS Basic User Interface Module is available.

+ +

Módulos estáveis

+ +

A few CSS modules are already fairly stable and have reached one of the three recommendation level of the CSSWG: Candidate Recommendation, Proposed Recommendation or Recommendation. These can be used without prefix and are pretty stable, though a few features can still be dropped at the Candidate Recommendation stage.

+ +

These modules extend and amend the CSS2.1 specification which build the core of the specification. Together with it, they are the current snapshot of the CSS specification.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Backgrounds", "", "") }}{{ Spec2("CSS3 Backgrounds") }}
+

Adds:

+ +
    +
  • Support, on backgrounds, for any type of {{cssxref("<image>")}}, and not only for uri() defined ones.
    • +
  • Support for multiple background images.
    • +
  • The {{ cssxref("background-repeat") }} space and round values, and for the 2-value syntax of this CSS property.
    • +
  • The {{ cssxref("background-attachment") }} local value.
    • +
  • The CSS {{ cssxref("background-origin") }}, {{ cssxref("background-size") }}, and {{ cssxref("background-clip") }} properties.
    • +
  • Support for curved border corners, with the CSS {{ cssxref("border-radius") }}, {{ cssxref("border-top-left-radius") }}, {{ cssxref("border-top-right-radius") }}, {{ cssxref("border-bottom-left-radius") }}, and {{ cssxref("border-bottom-right-radius") }} properties.
    • +
  • Support for the use of an {{cssxref("<image>")}} as the border with the CSS {{ cssxref("border-image") }}, {{ cssxref("border-image-source") }}, {{ cssxref("border-image-slice") }}, {{ cssxref("border-image-width") }}, {{ cssxref("border-image-outset") }}, and {{ cssxref("border-image-repeat") }} properties.
    • +
  • Support for shadows of the element with the CSS {{ cssxref("box-shadow") }} property.
    • +
+
+ +

The CSS4 iteration of the Backgrounds and Borders specification is already in progress, though it still hasn't reached the First Public Working Draft stage, it plans to add the ability to clip a border (with the CSS {{ cssxref("border-clip") }}, {{ cssxref("border-clip-top") }}, {{ cssxref("border-clip-right") }}, {{ cssxref("border-clip-bottom") }}, and {{ cssxref("border-clip-left") }} properties) or to control the shape of the border in a corner (using the CSS {{ cssxref("border-corner-shape") }} property).

+ + + + + + + + + + + +
{{ SpecName("CSS3 Conditional", "", "") }}{{ Spec2("CSS3 Conditional") }}
Adds features for conditional processing of parts of style sheets, conditioned on capabilities of the browser or the document the style sheet is being applied to. It consists mainly in allowing nested at-rules inside {{ cssxref("@media") }} and the adding of a new CSS at-rule, {{ cssxref("@supports") }}, and a new DOM method {{domxref("CSS.supports()")}}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Multicol", "", "") }}{{ Spec2("CSS3 Multicol") }}
Adds support for easy multi-column layouts using the CSS {{ cssxref("columns") }}, {{ cssxref("column-count") }}, {{ cssxref("column-fill") }}, {{ cssxref("column-gap") }}, {{ cssxref("column-rule") }}, {{ cssxref("column-rule-color") }}, {{ cssxref("column-rule-style") }}, {{ cssxref("column-rule-width") }}, {{ cssxref("column-span") }}, {{ cssxref("column-width") }}, {{ cssxref("break-after") }}, {{ cssxref("break-before") }}, and {{ cssxref("break-inside") }}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Values", "", "") }}{{ Spec2("CSS3 Values") }}
+

Makes initial and inherit keywords usable on any CSS property.

+ +

Formally defines the CSS data types of CSS 2.1, that were implicitely defined by their grammar token and some textual precisions.

+ +

Adds:

+ +
    +
  • Definition for new font-relative length units: rem and ch .
    • +
  • Definition for viewport-relative length units: vw, vh, vmax, and vmin .
    • +
  • Precision about the real size of the absolute length units, which are not really absolute, but defined in relation with the reference pixel .
    • +
  • Definition for {{ cssxref("<angle>") }}, {{cssxref("<time>")}}, {{cssxref("<frequency>")}}, {{cssxref("<resolution>")}}.
    • +
  • Normative value to the definition of {{cssxref("<color>")}}, {{cssxref("<image>")}}, and {{cssxref("<position>")}}.
    • +
  • Definition for the {{ cssxref("calc", "calc()") }}, {{ cssxref("attr", "attr()")}}, and toggle() functional notations.
    + At risk: due to insufficient browser support, standardization of the calc(), attr(), and toggle() functional notations may be postponed to the next iteration of this module.
    • +
+
+ +

Several types definition, like <ident> and <custom-ident>, have been deferred to CSS Values and Units Module Level 4.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Flexbox", "", "") }}{{ Spec2("CSS3 Flexbox") }}
Add a flexbox layout to the CSS {{ cssxref("display") }} property and several new CSS properties to control it: {{ cssxref("flex") }}, {{ cssxref("flex-align") }}, {{ cssxref("flex-direction") }}, {{ cssxref("flex-flow") }}, {{ cssxref("flex-item-align") }}, {{ cssxref("flex-line-pack") }}, {{ cssxref("flex-order") }}, {{ cssxref("flex-pack") }}, and {{ cssxref("flex-wrap") }}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Cascade", "", "") }}{{ Spec2("CSS3 Cascade") }}
+

Adds:

+ +
    +
  • The {{ cssxref("initial") }}, {{ cssxref("unset") }} values for properties.
    • +
  • The CSS {{ cssxref("all") }} property.
    • +
  • The scoping mechanism.
    • +
+ +

Clarifies:

+ +
    +
  • Interaction of media-dependent @import statements and style sheet loading requirements.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Writing Modes", "", "") }}{{ Spec2("CSS3 Writing Modes") }}
Defines the writing modes of both horizontal and vertical scripts and clarifies how the CSS {{ cssxref("direction") }} and {{ cssxref("unicode-bidi") }} properties interact with the new CSS {{ cssxref("text-orientation") }} property, and extends them where needed.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Counter Styles", "", "") }}{{ Spec2("CSS3 Counter Styles") }}
+ +

Módulos de teste

+ + + + + + + + + + + +
{{ SpecName("CSS3 Images", "", "") }}{{ Spec2("CSS3 Images") }}
+

Defines the {{cssxref("<image>")}} data type.

+ +

Extends the url() syntax to support image slices using media fragments.

+ +

Adds:

+ +
    +
  • The dppx unit to the {{cssxref("<resolution>")}} data type.
    • +
  • The image() function as a more flexible alternative to url() to define an image from an url.
    + At risk: due to insufficient browser support, standardization of the image() function may be postponed to the next iteration of this module.
    • +
  • Support for linear-gradient(), repeating-linear-gradient(), radial-gradient() and repeating-radial-gradient().
    • +
  • The ability to define how a replaced element should fit in its element, using the CSS {{ cssxref("object-fit") }} property.
    + At risk: due to insufficient browser support, standardization of the {{ cssxref("object-fit") }} and property may be postponed to the next iteration of this module.
    • +
  • The ability to override the resolution and orientation of an external image using the CSS {{ cssxref("image-resolution") }} and {{ cssxref("image-orientation") }} properties.
    + At risk : due to insufficient browser support, standardization of the {{ cssxref("image-resolution") }} and {{ cssxref("image-orientation") }} properties may be postponed to the next iteration of this module
    • +
+
+ +

The CSS Image Values and Replaced Content Level 4 which will supersede CSS Image Level 3 is in development and is a {{Spec2("CSS4 Images")}}.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Speech", "", "") }}{{ Spec2("CSS3 Speech") }}
Defines the speech media type, an aural formatting model and numerous properties specific for speech-rendering user agents.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Text Decoration", "", "") }}{{ Spec2("CSS3 Text Decoration") }}
+

Extends:

+ +
    +
  • the CSS {{ cssxref("text-decoration") }} property by making it a shorthand for the CSS {{ cssxref("text-decoration-line") }}, {{ cssxref("text-decoration-color") }}, and {{ cssxref("text-decoration-style") }} properties. And adds the {{ cssxref("text-decoration-skip") }}, and {{ cssxref("text-underline-position") }} properties.
    • +
+ +

Adds:

+ +
    +
  • Support for East-Asian-script emphasis marks with the CSS {{ cssxref("text-emphasis") }}, {{ cssxref("text-emphasis-style") }}, {{ cssxref("text-emphasis-color") }}, and {{ cssxref("text-emphasis-position") }} properties.
    • +
  • Support for script shadows with the CSS {{ cssxref("text-shadow") }} property.
    • +
+ +

Clarifies:

+ +
    +
  • The paint order of the decorations.
    • +
+ +

At risk: due to insufficient browser support, standardization of the text-decoration-skip, line positioning rules and the ability to place both emphasis marks and ruby above the same base text may be postponed to the next iteration of this module.

+
+ + + + + + + + + + + +
{{ SpecName("CSS Shapes", "", "") }}{{ Spec2("CSS Shapes") }}
Defines geometric shapes, which can be applied to floats. These shapes describe areas, around which inline content wraps instead of wrapping around the bounding box.
+ + + + + + + + + + + +
{{ SpecName("CSS Masks", "", "") }}{{ Spec2("CSS Masks") }}
Defines a way for partially or fully hiding portions of visual elements. It describes how to use another graphical element or image as a luminance or alpha mask.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Fragmentation", "", "") }}{{ Spec2("CSS3 Fragmentation") }}
Defines how partitions of a Web page should happen, that is page, column breaks, and widows and orphans handling. +

Adds:

+ +
    +
  • Support for defining the behavior of decorations, that is borders and background colors or images, when a box is breaked (at a page, column or line-break) with the CSS {{ cssxref("box-decoration-break") }} property.
    • +
+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Variables", "", "") }}{{ Spec2("CSS3 Variables") }}
Defines a mechanism allowing to define variables in CSS.
+ + + + + + + + + + + +
{{ SpecName("Compositing", "", "") }}{{ Spec2("Compositing") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Syntax", "", "") }}{{ Spec2("CSS3 Syntax") }}
Clarifies how charsets are determined; minor changes in parsing and tokenization algorithms.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Grid", "", "") }}{{ Spec2("CSS3 Grid") }}
Add a grid layout to the CSS display property and several new CSS properties to control it: {{cssxref("grid")}}, {{cssxref("grid-area")}}, {{cssxref("grid-auto-columns")}}, {{cssxref("grid-auto-flow")}}, {{cssxref("grid-auto-position")}}, {{cssxref("grid-auto-rows")}}, {{cssxref("grid-column")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row")}}, {{cssxref("grid-row-start")}}, {{cssxref("grid-row-end")}}, {{cssxref("grid-template")}}, {{cssxref("grid-template-areas")}}, {{cssxref("grid-template-rows")}}, and {{cssxref("grid-template-columns")}}.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Display", "", "") }}{{ Spec2("CSS3 Display") }}
+ + + + + + + + + + + +
{{ SpecName("CSS Will Change", "", "") }}{{ Spec2("CSS Will Change") }}
+ + + + + + + + + + + +
{{ SpecName("CSS4 Media Queries", "", "") }}{{ Spec2("CSS4 Media Queries") }}
+ + + + + + + + + + + +
{{ SpecName("Geometry Interfaces", "", "") }}{{ Spec2("Geometry Interfaces") }}
+ + + + + + + + + + + +
{{ SpecName("CSS4 Cascade", "", "") }}{{ Spec2("CSS4 Cascade") }}
+ + + + + + + + + + + +
{{SpecName("CSS Scroll Snap Points")}}{{Spec2("CSS Scroll Snap Points")}}
+ + + + + + + + + + + +
{{SpecName('CSS Painting API')}}{{Spec2('CSS Painting API')}}
+ + + + + + + + + + + +
{{SpecName('CSS Containment')}}{{Spec2('CSS Containment')}}
+ + + + + + + + + + + +
{{SpecName('CSS4 Writing Modes')}}{{Spec2('CSS4 Writing Modes')}}
+ +

Modules in the refining phase

+ +

Specifications that are deemed to be in the refining phase are already fairly stable. Though changes are still expected, they shouldn't create incompatibilities with current implementations; they should mainly define behavior in edge cases.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Animations", "", "") }}{{ Spec2("CSS3 Animations") }}
Allows the definition of animations effects by adding the CSS {{ cssxref("animation") }}, {{ cssxref("animation-delay") }},{{ cssxref("animation-direction") }}, {{ cssxref("animation-duration") }}, {{ cssxref("animation-fill-mode") }}, {{ cssxref("animation-iteration-count") }}, {{ cssxref("animation-name") }}, {{ cssxref("animation-play-state") }}, and {{ cssxref("animation-timing-function") }} properties, as well as the {{ cssxref("@keyframes") }} at-rule.
+ + + + + + + + + + + +
{{ SpecName("Web Animations", "", "") }}{{ Spec2("Web Animations") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Text", "", "") }}{{ Spec2("CSS3 Text") }}
+

Extends:

+ +
    +
  • the CSS {{ cssxref("text-transform") }} property with the value full-width.
    • +
  • the CSS {{ cssxref("text-align") }} property with the value start, end, start end, and match-parent for a better support of documents with multiple directionalities of text.
    • +
  • the CSS {{ cssxref("text-align") }} property with a {{cssxref("<string>")}} value to align on that character. This is useful to align number on the decimal point.
    • +
  • the CSS {{ cssxref("word-spacing") }} and {{ cssxref("letter-spacing") }} properties with range constraints to control flexibility in justification.
    • +
+ +

Adds:

+ +
    +
  • Control on how whitespaces are displayed using the CSS {{ cssxref("text-space-collapse") }} and {{ cssxref("tab-size") }} properties.
    • +
  • Control on line breaks and word boundaries using the CSS {{ cssxref("line-break") }}, {{ cssxref("word-break") }}, {{ cssxref("hyphens") }}, {{ cssxref("text-wrap") }}, {{ cssxref("overflow-wrap") }}, and {{ cssxref("text-align-last") }} properties.
    • +
  • Control on how justification is happening, in order to support more type of scripts, using the CSS {{ cssxref("text-justify") }} property.
    • +
  • Control on edge effect using the CSS {{ cssxref("text-indent") }} and {{ cssxref("hanging-punctuation") }} properties.
    • +
+
+ +

A few features present in early CSS Text Level 3 draft have being postponed to the next iteration of this module .

+ + + + + + + + + + + +
{{ SpecName("CSS3 Transforms", "", "") }}{{ Spec2("CSS3 Transforms") }}
+

Adds:

+ +
    +
  • the support of bi-dimensional transforms to be applied to any element using the CSS {{ cssxref("transform") }} and {{ cssxref("transform-origin") }} properties. The supported transforms are: matrix(), translate(), translateX(), translateY(), scale(), scaleX(), scaleY(), rotate(), skewX(), and skewY().
    • +
  • the support of tri-dimensional transforms to be applied to any element by adding the CSS {{ cssxref("transform-style") }}, {{ cssxref("perspective") }}, {{ cssxref("perspective-origin") }}, and {{ cssxref("backface-visibility") }} properties and extended the {{ cssxref("transform") }} property with the following transforms are: matrix 3d(), translate3d(), translateZ(), scale3d(), scaleZ(), rotate3d(), rotateX(), rotateY(), rotateZ(), and perspective().
    • +
+ +

Note: this specification is a merge of CSS 2D-Transforms, CSS 3D-Transforms and SVG transforms.

+
+ + + + + + + + + + + +
{{ SpecName("CSS3 Transitions", "", "") }}{{ Spec2("CSS3 Transitions") }}
Allows the definition of transitions effects between two properties values by adding the CSS {{ cssxref("transition") }}, {{ cssxref("transition-delay") }}, {{ cssxref("transition-duration") }}, {{ cssxref("transition-property") }}, and {{ cssxref("transition-timing-function") }} properties.
+ + + + + + + + + + + +
{{ SpecName("CSS3 Box Alignment", "", "") }}{{ Spec2("CSS3 Box Alignment") }}
+ + + + + + + + + + + +
{{ SpecName("CSS4 Selectors", "", "") }}{{ Spec2("CSS4 Selectors") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Lists", "", "") }}{{ Spec2("CSS3 Lists") }}
Extends the list counter mechanism so that list markers can be styled and Web developers can define new list counter schemes.
+ + + + + + + + + + + +
{{ SpecName("Motion Path Level 1", "", "") }}{{ Spec2("Motion Path Level 1") }}
+ + + + + + + + + + + +
{{ SpecName("CSS4 Fonts", "", "") }}{{ Spec2("CSS4 Fonts") }}
+ + + + + + + + + + + +
CSS Easing Functions Level 1Working Draft
+ + + + + + + + + + + +
{{ SpecName("CSS Logical Properties", "", "") }}{{ Spec2("CSS Logical Properties") }}
+ +

Modules in the revising phase

+ +

Modules that are in the revising phase are much less stable than those in the refining phase. Often the syntax is still under scrutiny and may evolve a lot, in a non-compatible way. Alternative syntaxes are tested and often implemented.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Paged Media", "", "") }}{{ Spec2("CSS3 Paged Media") }}
+ + + + + + + + + + + +
{{ SpecName("CSSOM View", "", "") }}{{ Spec2("CSSOM View") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Sizing", "", "") }}{{ Spec2("CSS3 Sizing") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Ruby", "", "") }}{{ Spec2("CSS3 Ruby") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Overflow", "", "") }}{{ Spec2("CSS3 Overflow") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Box", "", "") }}{{ Spec2("CSS3 Box") }}
+ + + + + + + + + + + +
{{ SpecName("CSS Scrollbars", "", "") }}{{ Spec2("CSS Scrollbars") }}
+ +

Modules in the exploring phase

+ + + + + + + + + + + +
CSS Backgrounds and Borders Level 4Working Draft
+ + + + + + + + + + + +
{{ SpecName("CSS3 Device", "", "") }}{{ Spec2("CSS3 Device") }}
Adds a new at-rule, {{ cssxref("@viewport") }}, allowing to specify the size, zoom factor, and orientation of the viewport that is used as the base for the initial containing block.
+ + + + + + + + + + + +
{{ SpecName("CSS Exclusions", "", "") }}{{ Spec2("CSS Exclusions") }}
Extends the floats mechanism to define exclusion regions in any positioning scheme. Adds the notion of shapes, in which content must flows.
+ + + + + + + + + + + +
{{ SpecName("Filters 1.0", "", "") }}{{ Spec2("Filters 1.0") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 GCPM", "", "") }}{{ Spec2("CSS3 GCPM") }}
Adds the ability to tailor printed version of a document by allowing to control header, footer but also references tables like indexes or tables of content.
+ + + + + + + + + + + +
CSS Page FloatsWorking Draft
+ + + + + + + + + + + +
{{ SpecName("CSS3 Template", "", "") }}{{ Spec2("CSS3 Template") }}
+ + + + + + + + + + + +
{{ SpecName("CSS Line Grid", "", "") }}{{ Spec2("CSS Line Grid") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Positioning", "", "") }}{{ Spec2("CSS3 Positioning") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Regions", "", "") }}{{ Spec2("CSS3 Regions") }}
Defines a new mechanism allowing content to flow across, eventually non-contiguous, multiple areas called regions.
+ + + + + + + + + + + +
{{ SpecName("CSSOM", "", "") }}{{ Spec2("CSSOM") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Font Loading", "", "") }}{{ Spec2("CSS3 Font Loading") }}
+ + + + + + + + + + + +
{{ SpecName("CSS Scope", "", "") }}{{ Spec2("CSS Scope") }}
+ + + + + + + + + + + +
{{ SpecName("CSS3 Inline", "", "") }}{{ Spec2("CSS3 Inline") }}
+ + + + + + + + + + + +
{{ SpecName("CSS4 Images", "", "") }}{{ Spec2("CSS4 Images") }}
+

Extends:

+ +
    +
  • the image() functional notation to describe the directionality of the image (rtl or ltr), allowing for bidi-sensitive images.
    • +
  • the {{ cssxref("image-orientation") }} property by adding the keyword from-image, allowing to follow EXIF data stored into images to be considered.
    • +
+ +

Adds:

+ +
    +
  • the image-set() functional notation to allow the definition to equivalent images at different resolution allowing for resolution-negotiated selection of images.
    • +
  • the element() functional notation allowing the use of part of the page as image.
    • +
  • the cross-fade() functional notation allowing to refer to intermediate images when transitioning between two images and defines the interpolation between two images.
    • +
  • the conic-gradient() and repeating-conic-gradient() functional notation describing a new type of gradient.
    • +
  • the {{cssxref("image-rendering")}} property that allow to define how resize of the object should be handled.
    • +
+
+ +

Modules in the rewriting phase

+ +

Modules that are in the rewriting phase are outdated and require to be rewritten. The syntax is still under scrutiny and may evolve a lot, in a non-compatible way. Alternative syntaxes are tested and often implemented.

+ + + + + + + + + + + +
{{ SpecName("CSS3 Content", "", "") }}{{ Spec2("CSS3 Content") }}
+ +

Abandoned modules

+ + + + + + + + + + + +
{{ SpecName("CSS Non-element Selectors", "", "") }}{{ Spec2("CSS Non-element Selectors") }}
diff --git a/files/pt-pt/archive/devtools_api_social/index.html b/files/pt-pt/archive/devtools_api_social/index.html new file mode 100644 index 0000000000..68ab1e2393 --- /dev/null +++ b/files/pt-pt/archive/devtools_api_social/index.html @@ -0,0 +1,213 @@ +--- +title: Utilizar Firefox Devtools com a API Social +slug: Archive/Devtools_API_Social +translation_of: Archive/Social_API_Devtools +--- +

O Firefox tem um número de ferramentas de desenvolvimento que podem ser utilizadas para ajudar com o desenvolvimento dos provedores de API Social. Contudo, até que o bug 839959 termine, o processo não é tão simples como deveria ser. Enquanto isso, esta página descreve algumas soluções alternativas.

+ +

Ativar Devtools do Chrome

+ +

Both of the techniques below require the chrome devtools to be manually enabled. To do this, open about:config in a tab, and after verifying that you will be careful, toggle the boolean value devtools.chrome.enabled to true.

+ +

Utilizar o Inspetor de DOM e Profiler

+ + + +
// Uncomment one of the following lines. NOTE: You must ensure the element you
+// want to inspect has been created - e.g., the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow;
+
+// The "notification" panel - this will show the most-recently-used panel
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ + + +

Utilizar o 'Depurador' com os elementos sociais.

+ + + +
// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ +
// Uncomment one of the following lines.  NOTE: You must ensure the element you
+// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ +
// Uncomment one of the following lines.  NOTE: You must ensure the element you
+// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ +
// Uncomment one of the following lines.  NOTE: You must ensure the element you
+// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ +
// Uncomment one of the following lines.  NOTE: You must ensure the element you
+// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
+ +
// Uncomment one of the following lines.  NOTE: You must ensure the element you
+// want to inspect has been created - eg, the sidebar must be visible, the flyouts
+// must have been opened once, etc.
+
+// The sidebar:
+let w = document.getElementById("social-sidebar-browser").contentWindow;
+
+// The "flyout" panel.
+// let w = document.getElementById("social-flyout-panel").firstChild.contentWindow
+
+// The "notification" panel - this will show the most-recently-used panel.
+// let w = document.getElementById("social-notification-panel").firstChild.contentWindow;
+
+
+if (!w) {
+    alert("This window is yet to be created");
+} else {
+    XPCOMUtils.defineLazyModuleGetter(this, "Toolbox",
+      "resource:///modules/devtools/Toolbox.jsm");
+    XPCOMUtils.defineLazyModuleGetter(this, "TargetFactory",
+      "resource:///modules/devtools/Target.jsm");
+    let target = TargetFactory.forWindow(w);
+    let toolbox = gDevTools.getToolbox(target);
+    toolbox ? toolbox.destroy() : gDevTools.showToolbox(target, undefined, "window");
+}
diff --git a/files/pt-pt/archive/firefox_os/index.html b/files/pt-pt/archive/firefox_os/index.html new file mode 100644 index 0000000000..591f6946fa --- /dev/null +++ b/files/pt-pt/archive/firefox_os/index.html @@ -0,0 +1,11 @@ +--- +title: Firefox OS +slug: Archive/Firefox_OS +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/B2G_OS +--- +

This page lists archived content for the Firefox OS product, and the open source project it is based on, B2G OS. For current B2G OS material, see the B2G OS page.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/pt-pt/archive/index.html b/files/pt-pt/archive/index.html new file mode 100644 index 0000000000..ebdf47390c --- /dev/null +++ b/files/pt-pt/archive/index.html @@ -0,0 +1,25 @@ +--- +title: Arquivo de conteúdo obsoleto +slug: Archive +tags: + - Arquivo + - Landing +translation_of: Archive +--- +

{{QuickLinksWithSubpages("/pt-PT/docs/Archive", 2, 0, 1)}}

+ +

Aqui na MDN, nós tentamos evitar a eliminação imediata de conteúdo que pode ser útil para pessoas que segmentam plataformas legadas, sistemas operativos, e navegadores. Talvez o seu público alvo sejam pessoas que estão a utilizar hardware mais antigo, por exemplo, e não podem atualizar para os navegadores mais recentes e melhores. Ou, por "motivos", a sua empresa precisa de utilizar um software muito antigo e você precisa de criar um conteúdo da Web que seja executado nesse software. Ou talvez esteja apenas curioso sobre o histórico de uma funcionaldiade ou API obsoleta, e como esta funcionou.

+ +

Existem muitas razões pelas quais a documentação antiga pode ser útil. Então, nós estabelecemos esta área na qual podemos arquivar a documentação antiga. O material nesta zona de conteúdo 'Arquivado' não deve ser utilizado para criar novos sites da Web ou aplicações para os navegadores modernos. Está aqui apenas para referência histórica.

+ +
+

Nota para autores: nós precisamos de tentar manter as subpáginas aqui organizadas, em vez de serem todas colocadas numa pasta grande. Tente criar subárvores para categorias de material. Além disso, mova apenas as páginas que são extremamente obsoletas. Se alguém puder realisticamente precisar da informação num produto vivo, pode não ser apropriado movê-la aqui. Em geral, pode ser melhor discutir isso no canal MDN Web Docs antes de mover conteúdo para aqui.

+
+ +

{{SubpagesWithSummaries}}

+ + diff --git a/files/pt-pt/archive/mdn/index.html b/files/pt-pt/archive/mdn/index.html new file mode 100644 index 0000000000..9e550840e3 --- /dev/null +++ b/files/pt-pt/archive/mdn/index.html @@ -0,0 +1,20 @@ +--- +title: MDN Archive +slug: Archive/MDN +tags: + - Archive + - MDN + - NeedsTranslation + - TopicStub +translation_of: Archive/MDN +--- +

{{MDNSidebar}}

+ +
+

Obsolete
+ This documentation is obsolete.

+
+ +

The documentation listed below is archived, obsolete material about MDN itself.

+ +

{{LandingPageListSubpages}}

diff --git a/files/pt-pt/archive/meta_docs/conteudo_mdn_em_webplatform.org/index.html b/files/pt-pt/archive/meta_docs/conteudo_mdn_em_webplatform.org/index.html new file mode 100644 index 0000000000..29379105c4 --- /dev/null +++ b/files/pt-pt/archive/meta_docs/conteudo_mdn_em_webplatform.org/index.html @@ -0,0 +1,19 @@ +--- +title: Conteúdo MDN em WebPlatform.org +slug: Archive/Meta_docs/Conteudo_MDN_em_WebPlatform.org +translation_of: Archive/Meta_docs/MDN_content_on_WebPlatform.org +--- +

Web Platform Docs (WPD) é um site para a documentação e educação sobre os padrões da Web, mantido por W3C e apoiado pela Mozilla, entre outros. Anyone is welcome to contribute content from MDN to WebPlatform.org, under the terms of MDN's Creative Commons Share-Alike 2.5 (CC-BY-SA) license. Content that originates from MDN must be attributed to MDN, with a link to the source article. The Web Platform Docs site provides support for doing this in a systematic way.

+ +

If you create an account on WPD and create a new page, you’ll see that there is an option in the "new page" form to indicate that the content you’re contributing came from MDN, and to provide the original URL on MDN. There is also a way on WPD to mark sections of articles as coming from MDN, for cases where they get merged into CC-BY content. (CC-BY is the default license for reuse on WPD.) The External Attribution page on WebPlatform.org describes how to do all of that.

+ +

Questões?

+ +
+
Sobre a MDN ou o seu conteúdo
+
Publique-o no fórum de discussão da MDN, ou pergunte em #mdn on irc.mozilla.org.
+
Sobre os termos da licença da Mozilla
+
Envie uma mensagem para licensing@mozilla.org.
+
Sobre os 'Documentos da Plataforma da Web', o seu conteúdo, a sua licença, ou os seus termos de utilização
+
Publique-os na lista de endereços (discussão) public-webplatform, mantida por W3C, pu pergunte em #webplatform on irc.freenode.org.
+
diff --git a/files/pt-pt/archive/meta_docs/escrever_conteudo/index.html b/files/pt-pt/archive/meta_docs/escrever_conteudo/index.html new file mode 100644 index 0000000000..e2d9caad57 --- /dev/null +++ b/files/pt-pt/archive/meta_docs/escrever_conteudo/index.html @@ -0,0 +1,58 @@ +--- +title: Escrever conteúdo +slug: Archive/Meta_docs/Escrever_conteudo +tags: + - MDN +translation_of: Archive/Meta_docs/Writing_content +--- +

There are always things that can be added or updated on MDN. Whether it's all-new documentation for a sparkling new API or a revision to an older API that's changed subtly, you'll find lots of opportunities to help.

+ +

Editar uma página existente

+ +

If you've found a page you'd like to revise, simply click the "edit" button at its top right corner. This will open the WYSIWYG editor for working on the page's contents. See the MDN editor guide for details on how to work with the editor, as well as how to work with the macro system we use to help automate the construction and formatting of content.

+ +

There are lots of reasons you might edit an existing page:

+ + + +

Adicionar uma nova página

+ +

This is the big one! Adding a new page to MDN makes the Web love you and want to hug you. There are several obvious reasons to create a new page, including to document an API that's not yet documented or to add a new tutorial or guide on a topic.

+ +

There are some ways to go about creating a new page on MDN, once you've logged in:

+ +
+
Click a "missing page" link
+
As you browse MDN, you'll occasionally find links to pages that don't exist yet. Often, as we create articles, we include links to pages that need to be created, even if they haven't been made yet. This helps us keep track of things that need to eventually be done, although sometimes it takes some time to get back to them. You should feel free to do so! Just click these links and you'll be taken straight into the editor for the new page.
+
Create a subpage
+
Near the top-right corner of each article is a "Advanced" drop-down menu. In that menu is a "New sub-page" option. Clicking that option opens the page editor for a new page whose parent page in the site hierarchy is the page on which you chose "New sub-page". Simply fill out the title and slug and start writing the article's content.
+
Create a clone
+
You can also clone an existing page using the "Clone this page" option in the "This page" drop-down menu. Clicking this option makes a copy of the current page, whose parent page is the same as the current page, and opens the editor on that page, where you can set the page's title and slug, as well as edit the content of the page. This is typically a good way to add a new page to an existing reference area of the site, for example, because it gets you a sample layout for the content.
+
Create a link to a page that doesn't exist, then click it
+
This is a bit of a hybrid method. Since every page ought to be linked to from somewhere, you could start by creating a link to the new article by adding it to an existing page, then, after saving that page, you can click the link you just inserted to open an editor for the new article.
+
+ +
+

Note: If you're not logged in, you will get a 404 error when trying to visit an article that doesn't exist, instead of being offered an editor for a new page.

+
+ +

Encontrar informação

+ +

There's a lot of information out there, and it can be tricky to hunt down the exact help you need. Here are some tips to get you started.

+ +
+
Module owner lists
+
Mozilla projects work on a "module owner" basis; each major component has an owner or owners who are responsible for what goes on there. These owners are often your best source of information — or at least a great way to find the right person to talk to.
+
Mozilla source cross-reference
+
MXR, the Mozilla cross-reference, lets you access all the source code for the Mozilla project (with the exception of some things, like much of Firefox OS, which is located on GitHub). The code and its comments are often a great resource for information.
+
Mozilla wiki
+
The Mozilla wiki — often referred to as "wikimo" — is a repository of process and design notes, drafts, plans, and preliminary specifications. Despite being often a cluttered mess, it's a treasure trove of invaluable information.
+
diff --git a/files/pt-pt/archive/meta_docs/index.html b/files/pt-pt/archive/meta_docs/index.html new file mode 100644 index 0000000000..52de2c8447 --- /dev/null +++ b/files/pt-pt/archive/meta_docs/index.html @@ -0,0 +1,12 @@ +--- +title: MDN "meta-documentation" archive +slug: Archive/Meta_docs +tags: + - Archive + - MDN + - NeedsTranslation + - TopicStub +translation_of: Archive/Meta_docs +--- +

Here you'll find archived "meta-documentation"; that is, documentation about how to write documentation on MDN. The articles here are obsolete and should no longer be referenced; we are retaining them here for reference while we migrate some content to new places, but very little of this is useful.

+

{{LandingPageListSubpages}}

diff --git a/files/pt-pt/archive/meta_docs/trello/index.html b/files/pt-pt/archive/meta_docs/trello/index.html new file mode 100644 index 0000000000..ba96cd940a --- /dev/null +++ b/files/pt-pt/archive/meta_docs/trello/index.html @@ -0,0 +1,101 @@ +--- +title: Trello +slug: Archive/Meta_docs/Trello +tags: + - Guía + - Metadados MDN + - Processos + - Trello +translation_of: Archive/Meta_docs/Trello +--- +

The MDN community uses a Trello board to organize and keep track of the things that need to be done to improve, update, and add to our content. This guide will help you learn what Trello is and how we use it.

+ +
+

The Trello-based process has been replaced with a new process, using a platform called Taiga. Please see MDN's agile process to learn more.

+
+ +

Having a tool like this to maintain a public task list lets our entire community participate in planning, and helps everyone understand what we're working on. That way, both MDN staff writers and our amazing community of volunteer contributors can know what's going on at a glance. Our board is public, meaning that everyone can see it. If you already have an account on Trello, you can star (favorite/bookmark) the board so that you can get to it quickly whenever you connect to Trello.

+ +

Introdução ao Trello

+ +

The Trello software is a Web application (created by Trello, Inc.) which you can access using your Web browser or an app on your mobile device (Android, iOS, Kindle Fire, and Windows 8 are among the supported platforms). This lets you check or update the Trello board at your convenience. For more information, you can read their "about" page.

+ +

O quadro do Trello

+ +

A board is composed of lists, and each list is composed of cards. Every card represents an "action item", which is a task that needs to be accomplished. You can add comments, due dates, detailed lists of sub-tasks, etc. on every card. But most importantly, you can drag and drop a card from a list to another, which means the task has changed status; for instance, you might drag a card from the "Doing" column to the "Review needed" column, which indicates that you've finished the task and would like for someone to review your work.

+ +

Screenshot of the MDN content Trello board.

+ +

Listas

+ +

A list is a set of cards; while you can assign whatever meaning you wish to each column, the MDN team uses each column to represent the status of the task. The farther to the right the column is, the closer to complete the task is. This is similar to the método GTD ou a metodologia Kanban.

+ +

We have the following primary lists (other lists may crop up temporarily from time to time):

+ +
+
A Aguardar
+
The tasks here have been accepted as something that need to be done, but are not currently being actively worked on. When work begins on a task, it should advance to the next column.
+
Ações
+
The tasks in this column are actively being worked on.
+
Precisa de Revisão
+
The tasks in this list have been completed but the writer(s) would like someone to review the work to ensure that it's accurate and/or stylistically/grammatically.
+
Sem atualizações nos últimos 14 dias
+
Bugs in this list have been languishing with no new information for more than two weeks. These bugs are in danger of being moved back into the On Hold list unless their status is updated soon.
+
Concluído em...
+
We create lists of bugs created in specific months to help us track our rate of progress and to be able to provide achievement lists
+
+ +

Lists are simply are a collection of cards with a title, used to organize cards.

+ +

Fichas

+ +

A card has much more content in it. As mentioned earlier, a card corresponds to a specific task or project. The card is described by its title which is displayed on the "front" of the card when you're looking at the board. Clicking on a card "flips" the card, showing you a panel with additional details. The detail view looks something like this:

+ +

+ +

A visualizaçao detalhada de uma ficha tem estas secções:

+ +
+
1. Membros
+
The members of the board that are assigned to this task/card. These are the Trello users that are working on the task in some way. Here, we can see that four people are involved with this task.
+
2. Etiquetas
+
You can think of labels as themes or categories that can apply to more than one list. Here, we can see that this card is related to "Open Web Docs" (a category), "Q1 Delivery" (a planning tag), "Learning Area" (a tag indicating a section of MDN), etc. These labels are used for organizational purposes, but are also helpful for filtering; see {{anch("Filters")}} below.
+
3. Data limite
+
You can add a due date for a card to help with planning. This date can also be used for sorting and filtering. Trello can also be configured to display a calendar showing items that are due in a given time period, but this feature is not currently enabled on the MDN Content Team Status board.
+
4. Conteúdo
+
In this example, the card has a checklist to detail the precise actions that are needed to complete the task. You might also find comments and attachments inside a card. So if someone wants to put a note for this card, one can add a comment and so on. Usually, checklists are used to break down a task in smaller units which do not need to be displayed for everyone on the board.
+
+ +

Filtros

+ +

If you look back at the first screenshot, you can see that there are a lot of cards. While working on some project, you might want to focus on specific ones (such as those associated with a particular technology or project). To make the board clearer and to find the right cards more efficiently, you can use filters.

+ +

For example, if you only want to see the cards representing tasks or projects that are first quarter goals, you can turn on the corresponding filter on the label "Q1 Deliverables" and get this as a result:

+ +

+ +

Experiment with filters! You can filter on members (to find work being done by specific people), due dates, and more.

+ +

Como utilizar o Trello

+ +

Every member of the writing staff is a member of this board. In addition, volunteers can easily get access too. See {{anch("Getting involved")}} to learn how.

+ +

Once you have access, you can either create cards representing proposed or ongoing projects, and you can add yourself to a card to indicate that you intend to work on that task. You can then update cards with new details such as new comments, attachments, or changes to to-do lists on the cards.

+ +

Participar

+ +

We encourage you to join us and contribute to these tasks! Pick a task that is described on one of the cards and start working on it. Once you are working on it, you'll need to be able to edit the corresponding card. For this you'll need to have a Trello account, which is free. Then you will need an administrator of the board to add you to the board. To contact an administrator, you can:

+ + + +

Consulte também

+ + diff --git a/files/pt-pt/archive/mozilla/drag_and_drop/index.html b/files/pt-pt/archive/mozilla/drag_and_drop/index.html new file mode 100644 index 0000000000..b963b08118 --- /dev/null +++ b/files/pt-pt/archive/mozilla/drag_and_drop/index.html @@ -0,0 +1,142 @@ +--- +title: Drag and Drop +slug: Archive/Mozilla/Drag_and_drop +tags: + - NeedsTranslation + - TopicStub + - XUL +translation_of: Archive/Mozilla/Drag_and_drop +--- +

{{ Next("Drag and Drop JavaScript Wrapper") }}

+

{{ deprecated_header("gecko1.9.1") }}

+
+ As of Gecko 1.9.1 (Firefox 3.5), these APIs are officially deprecated the newer, simpler, portable API should be used in their place.
+

This section describes how to implement objects that can be dragged around and dropped onto other objects.

+

The Drag and Drop Interface

+

Many user interfaces allow one to drag particular objects around within the interface. For example, dragging files to other directories, or dragging an icon to another window to open the document it refers to. Mozilla and XUL provide a number of events that can handle when the user attempts to drag objects around.

+

A user can start dragging by holding down the mouse button and moving the mouse. The drag stops when the user releases the mouse. Event handlers are called when the user starts and ends dragging, and at various points in-between.

+

Mozilla implements dragging by using a drag session. When a user requests to drag something that can be dragged, a drag session should be started. The drag session handles updating the mouse cursor and where the object should be dropped. If something cannot be dragged, it should not start a drag session. Because the user generally has only one mouse, only one drag session is in use at a time.

+

Note that drag sessions can be created from within Mozilla itself or from other applications. Mozilla will translate the data being dragged as needed.

+

The list below describes the event handlers that can be called, which may be placed on any element. You only need to put values for the handlers where you need to do something when the event occurs.

+
+
+ ondrag {{ Fx_minversion_inline(3) }}
+
+ Called periodically throughout the drag and drop operation.
+
+ ondraggesture 
+
+ Called when the user starts dragging the element, which normally happens when the user holds down the mouse button and moves the mouse. The script in this handler should set up a drag session.
+
+ ondragstart {{ Fx_minversion_inline(3) }} 
+
+ An alias for ondraggesture; this is the HTML 5 spec name for the event and may be used in HTML or XUL; however, for backward compatibility with older versions of Firefox, you may wish to continue using ondraggesture in XUL.
+
+ ondragover 
+
+ This event handler is called for an element when something is being dragged over top of it. If the object can be dropped on the element, the drag session should be notified.
+
+ ondragenter 
+
+ Called for an element when the mouse pointer first moves over the element while something is being dragged. This might be used to change the appearance of the element to indicate to the user that the object can be dropped on it.
+
+ ondragexit 
+
+ Called for an element when the mouse pointer moves out of an element while something is being dragged. The is also called after a drop is complete so that an element has a chance to remove any highlighting or other indication.
+
+ ondragdrop 
+
+ This event handler is called for an element when something is dropped on the element. At this point, the user has already released the mouse button. The element can simply ignore the event or can handle it some way, such as pasting the dragged object into itself.
+
+ ondragend {{ Fx_minversion_inline(3) }} 
+
+ Called when the drag operation is finished.
+
+

There are two ways that drag and drop events can be handled. This first involves using the drag and drop XPCOM interfaces directly. The second is to use a JavaScript wrapper object that handles some of this for you. The code for this wrapper can be found in a file named {{ Source("toolkit/content/nsDragAndDrop.js nsDragAndDrop.js") }} which is contained in the widget-toolkit (or global) package.

+

XPCOM Drag and Drop interfaces

+

Two interfaces are used to support drag and drop. The first is a drag service, nsIDragService and the second is the drag session, nsIDragSession.

+

The nsIDragService is responsible for creating drag sessions when a drag starts, and removing the drag session when the drag is complete. The function invokeDragSession should be called to start a drag inside an ondraggesture event handler. Once this function is called, a drag has started.

+

The function invokeDragSession takes four parameters, as described below:

+
invokeDragSession(element,transferableArray,region,actions)
+
+
+
+ element 
+
+ A reference to the element that is being dragged. This can be retrieved by getting the property event.target during the event handler.
+
+ transferableArray 
+
+ An array of nsITransferable objects, one for each item being dragged. An array is used because you might want to drag several objects at once, such as a set of files.
+
+ region 
+
+ A region used for feedback indication. This should usually be set to null.
+
+ actions 
+
+ The actions that the drag uses. This should be set to one of the following constants, or several added together. The action can be changed during the drag depending on what is being dragged over.
+
+
+
+ nsIDragService.DRAGDROP_ACTION_NONE 
+
+
+
+ Used to indicate that no drag is valid.
+
+ nsIDragService.DRAGDROP_ACTION_COPY 
+
+ The item being dragged should be copied to its dropped location.
+
+ nsIDragService.DRAGDROP_ACTION_MOVE 
+
+ The item being dragged should be moved to its dropped location.
+
+ nsIDragService.DRAGDROP_ACTION_LINK 
+
+ A link (or shortcut or alias) to the item being dragged should be created in the dropped location.
+
+
+
+

The interface {{ interface("nsIDragService") }} also provides the function getCurrentSession which can be called from within the drag event handlers to get and modify the state of the drag. The function returns an object that implements {{ interface("nsIDragSession") }}.

+

The interface nsIDragSession is used to get and set properties of the drag that is currently occuring. The following properties and methods are available:

+
+
+ canDrop 
+
+ Set this property to true if the element the mouse is currently over can accept the object currently being dragged to be dropped on it. Set the value to false if it doesn't make sense to drop the object on it. This should be changed in the ondragover and ondragenter event handlers.
+
+ dragAction 
+
+ Set to the current action to be performed, which should be one or more of the constants described earlier. This can be used to provide extra feedback to the user.
+
+ numDropItems 
+
+ The number of items being dragged. For example, this will be set to 5 if five bookmarks are being dragged.
+
+ getData(transfer,index) 
+
+ Get the data being dragged. The first argument should be an nsITransferable object to hold the data. The second argument, index, should be the index of the item to return.
+
+ sourceDocument 
+
+ The document where the drag started.
+
+ sourceNode 
+
+ The DOM node where the drag started.
+
+ isDataFlavorSupported(flavor) 
+
+ Returns true if the data being dragged contains data of the specified flavor.
+
+

{{ Next("Drag and Drop JavaScript Wrapper") }}

+
+

Original Document Information

+ +
diff --git a/files/pt-pt/archive/mozilla/index.html b/files/pt-pt/archive/mozilla/index.html new file mode 100644 index 0000000000..0acec76e6d --- /dev/null +++ b/files/pt-pt/archive/mozilla/index.html @@ -0,0 +1,10 @@ +--- +title: Archived Mozilla and build documentation +slug: Archive/Mozilla +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla +--- +

These articles are archived, obsolete documents about Mozilla, Gecko, and the process of building Mozilla projects.

+

{{SubpagesWithSummaries}}

diff --git a/files/pt-pt/archive/mozilla/uris_and_urls/index.html b/files/pt-pt/archive/mozilla/uris_and_urls/index.html new file mode 100644 index 0000000000..f6a2802999 --- /dev/null +++ b/files/pt-pt/archive/mozilla/uris_and_urls/index.html @@ -0,0 +1,122 @@ +--- +title: URIs and URLs +slug: Archive/Mozilla/URIs_and_URLs +tags: + - Guía + - Mozilla + - Necko + - NeedsUpdate +translation_of: Archive/Mozilla/URIs_and_URLs +--- +
+

Aviso: O conteúdo deste artigo pode estar desatualizado. Ultima atualização do artigo original foi em 2002.

+
+ +

Resumo

+ +

A gestão da rede e dos recursos recuperáveis localmente é uma parte central da Necko. Os recursos são identificados pelo "Uniform Resource Identifier" do URI (Extraído do RFC 2396):

+ +
+
+
Uniform
+
Uniformity provides several benefits: it allows different types of resource identifiers to be used in the same context, even when the mechanisms used to access those resources may differ; it allows uniform semantic interpretation of common syntactic conventions across different types of resource identifiers; it allows introduction of new types of resource identifiers without interfering with the way that existing identifiers are used; and, it allows the identifiers to be reused in many different contexts, thus permitting new applications or protocols to leverage a pre-existing, large, and widely-used set of resource identifiers.
+
Resource
+
A resource can be anything that has identity. Familiar examples include an electronic document, an image, a service (e.g., "today's weather report for Los Angeles"), and a collection of other resources. Not all resources are network "retrievable"; e.g., human beings, corporations, and bound books in a library can also be considered resources. The resource is the conceptual mapping to an entity or set of entities, not necessarily the entity which corresponds to that mapping at any particular instance in time. Thus, a resource can remain constant even when its content---the entities to which it currently corresponds---changes over time, provided that the conceptual mapping is not changed in the process.
+
Identifier
+
An identifier is an object that can act as a reference to something that has identity. In the case of URI, the object is a sequence of characters with a restricted syntax.
+
+A URI can be further classified as a locator, a name, or both. The term "Uniform Resource Locator" (URL) refers to the subset of URI that identify resources via a representation of their primary access mechanism (e.g., their network "location"), rather than identifying the resource by name or by some other attribute(s) of that resource. ... The URI scheme defines the namespace of the URI, and thus may further restrict the syntax and semantics of identifiers using that scheme. Although many URL schemes are named after protocols, this does not imply that the only way to access the URL's resource is via the named protocol. Gateways, proxies, caches, and name resolution services might be used to access some resources, independent of the protocol of their origin, and the resolution of some URL may require the use of more than one protocol (e.g., both DNS and HTTP are typically used to access an "http" URL's resource when it can't be found in a local cache).
+ +

Em Necko, cada esquema URI é representado por um manipulador de protocolo. Por vezes, um manipulador de protocolo representa mais do que um esquema. O manipulador de protocolos fornece informações e métodos específicos do esquema para criar URIs dos esquemas que apoia. Um dos principais objetivos da Necko é fornecer um suporte de protocolo "plug able". Isto significa que deve ser possível adicionar novos protocolos ao Necko apenas implementando o nsIProtocolHandler e o nsIChannel. Também pode ser necessário implementar um novo urlparser para um novo protocolo, mas isso pode não ser necessário porque Necko já fornece implementações URI que podem lidar com uma série de esquemas, implementando o urlparser genérico definido no RFC 2396.

+ +

nsIURI e nsIURL

+ +

Num sentido estrito, Necko conhece apenas URLs, URIs pela definição acima são demasiado genéricos para serem devidamente representados dentro de uma biblioteca.

+ +

Existem, contudo, duas interfaces que se relacionam vagamente com a distinção entre URI e URL de acordo com a definição acima: nsIURI e nsIURL.

+ +

nsIURI representa o acesso a uma forma muito simples e muito genérica de um URL. Falando simplesmente do seu esquema e não esquema, separado por dois pontos, como "about". nsIURL herda de nsIURI e representa o acesso a URLs comuns com esquemas como "http", "ftp", ...

+ +

nsSimpleURI

+ +

Uma implementação do nsSimpleURI é o nsSimpleURI que é a base para protocolos como "sobre". nsSimpleURI contém setters e getters para o URI e os componentes de um URI: esquema e caminho (não esquema). Não existem suportes pré-escritos para URIs simples, devido à sua estrutura simples.

+ +

nsStandardURL

+ +

A implementação mais importante do nsIURL é o nsStandardURL, que é a base para protocolos como o http, ftp, ...

+ +

Estes esquemas apoiam um sistema hierárquico de nomenclatura, onde a hierarquia do nome é denotada por um "/" delimitador que separa os componentes no caminho. nsStandardURL também contém as facilidades para analisar estes tipos de URLs, para quebrar a especificação do URL nos segmentos mais básicos.

+ +

A especificação consiste no path e prepath. O prepath consiste dum esquema e autoridade. A autoridade consiste dum prehost, host e port. O prehost consiste num nome de utilizador e senha. O path consiste em diretório, nome de ficheiro, parametro, query e ref. O nome do ficheiro consiste em filebasename e fileextension.

+ +

Se a especificação estiver completamente decomposta, consiste em: esquema, nome de utilizador, palavra-passe, anfitrião (host), port, diretório, nome base de ficheiro, extensão de ficheiro, param, consulta e ref. Juntos, estes segmentos formam a especificação do URL com a seguinte sintaxe:

+ +

scheme://username:password@host:port/directory/filebasename.fileextension;param?query#ref

+ +

Por razões de desempenho, a especificação completa é armazenada de forma fugida no objecto nsStandardURL com pointers (position e length) para cada segmento básico e para os segmentos mais globais como caminho e pré-hospedeiro, por exemplo.

+ +

A Necko fornece urlparsers pré-escritos para esquemas baseados em sistemas de nomenclatura hierárquica.

+ +

Escapar

+ +

Para processar um URL seguramente é necessário às vezes "escapar" alguns caracteres, para os esconder do processador. Um carácter escaped é codificado como um carácter triplo, que consiste do carácter de percentagem "%" seguido por dois dígitos hexadecimais a representar um byte de código. Por exemplo, "%20" é a codificação escapada do carácter de espaço no US-ASCII.

+ +

Para citar o RFC 2396:

+ +
A URI is always in an "escaped" form, since escaping or unescaping a completed URI might change its semantics. Normally, the only time escape encodings can safely be made is when the URI is being created from its component parts; each component may have its own set of characters that are reserved, so only the mechanism responsible for generating or interpreting that component can determine whether or not escaping a character will change its semantics. Likewise, a URI must be separated into its components before the escaped characters within those components can be safely decoded.
+ +

Isto significa que segmentos de URLs são escapados de forma diferente. Isto é feito através do NS_EscapeURL que faz parte do xpcom, mas começou como parte do Necko. A informação de como escapar cada segmento é guardado numa matriz.

+ +

Um string não deve ser escapado mais que uma vez. O Necko não escapa um caráter que já foi escapado, a não ser que é forcado por uma máscara especial que pode ser usado se se sabe que um string não está escapado.

+ +

Processar URLs

+ +

RFC 2396 define um processador de URL que pode lidar com a sintaxe que é comum à maioria de esquemas de URL que existem atualmente.

+ +

Por vezes, é necessária uma análise específica do esquema. Também para ser um pouco tolerante a erros de sintaxe, o analisador tem de saber mais sobre a sintaxe específica dos URLs para esse esquema. Para se manter quase genérico Necko contém três analisadores para as principais classes de URLs padrão. Qual deles tem de ser utilizado é definido pela implementação do nsIProtocolhandler para o esquema em questão.

+ +

As três classes principais são:

+ +
+
Authority
+
Os URLs têm um segmento de autoridade, como "http".
+
NoAuthority
+
Estes URLs não têm um segmento de autoridade, ou têm um degenerado, como o esquema "file". Este parser também pode identificar drives se possível dependendo na plataforma.
+
Standard
+
Não se sabe se existe um segmento de autoridade, menos correção de sintaxe pode ser aplicado neste caso.
+
+ +

Diferenças Notáveis

+ +
    +
  1. Necko não apoia certos formatos de URLs relativos que estão depreciados, baseado nesta parte do RFC 2396:
    + +
    If the scheme component is defined, indicating that the reference starts with a scheme name, then the reference is interpreted as an absolute URI and we are done. Otherwise, the reference URI's scheme is inherited from the base URI's scheme component. Due to a loophole in prior specifications (RFC1630), some parsers allow the scheme name to be present in a relative URI if it is the same as the base URI scheme. Unfortunately, this can conflict with the correct parsing of non-hierarchical URI. For backwards compatibility, an implementation may work around such references by removing the scheme if it matches that of the base URI and the scheme is known to always use the "hier_part" syntax. The parser can then continue with the steps below for the remainder of the reference components. Validating parsers should mark such a misformed relative reference as an error.
    + +

    Foi decidido não ter compatibilidade com formatos depreciados, portanto URLs como "http:page.html" ou "http:/directory/page.html" são interpretados como URLs absolutos e são corrigidos pelo processador.

    +
    2. +
  2. A gestão dos segmentos de consulta é diferente dos exemplos dados no RFC 2396:
    + +
    Within an object with a well-defined base URI of http://a/b/c/d;p?q the relative URI would be resolved as follows: ... ?y = http://a/b/c/?y ...
    + Em vez disso ?y = http://a/b/c/d;p?y foi implementado como sugerido pelo RFC 1808 mais antigo. Esta decisão é baseada num correio eletrónico de Roy T. Fielding, um dos autores do RFC 2396, afirmando que o exemplo dado está errado. Detalhes podem ser encontrados no bug 90439.
    3. +
  3. Atualmente, os url-objects de Necko apenas apoiam as autoridades de alojamento ou as URLs sem autoridades. Autoridades baseadas em registos como definido no RFC 2396
    + +
    Many URI schemes include a top hierarchical element for a naming authority, such that the namespace defined by the remainder of the URI is governed by that authority. This authority component is typically defined by an Internet-based server or a scheme-specific registry of naming authorities. ... The structure of a registry-based naming authority is specific to the URI scheme, but constrained to the allowed characters for an authority component.
    + +

    não são apoiados.

    +
    4. +
+ +

Referencias

+ +

 A referência principal para URIs, URLs e URL-parsing é RFC 2396.

+ +
+

Informação de Documento Original

+ + +
diff --git a/files/pt-pt/archive/mozilla/xbl/index.html b/files/pt-pt/archive/mozilla/xbl/index.html new file mode 100644 index 0000000000..f3e30b0280 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xbl/index.html @@ -0,0 +1,36 @@ +--- +title: XBL +slug: Archive/Mozilla/XBL +tags: + - XBL +translation_of: Archive/Mozilla/XBL +--- +

XML Binding Language (XBL, as vezes tambem chamado Extensible Bindings Language) é uma linguagem para descrever Bindings que podem ser conectadas a elementos em outros documentos. O elemento ao que o Binding é conectado, chamado de elemento ligado, adquire o comportamento novo especificado pela ligação.

+ +

Ligações podem conter manipuladores de eventos que estão registrados no elemento ligado, uma implementação de novos métodos e propriedades que se tornam acessíveis através do elemento ligado, e conteúdo anônimo que é inserido abaixo do elemento ligado.

+ +

Muitos XUL widgets são no mínimo parcialmente implantados usando XBL. Você pode desenvolver seus próprios widgets reutilizáveis através de XUL, HTML, SVG, e outros primitivos usando XBL.

+ +

Especificações

+ +

XBL 1.0 é especificado na XBL 1.0 Reference. Infelizmente a implementação atual no Mozilla é diferente das especificações, e não existe documentação conhecida descrevendo as diferenças. Existe a esperança que a Referência seja atualizada para descrever estas diferenças.

+ +

XBL 1.0 é uma tecnologia específica do Mozilla, e não um padrão W3C. Entretanto, no mínimo dois padrões estão sendo desenvolvidos: sXBL and XBL 2.0.but there are

+ + + +

Algumas diferenças entre sXBL e XBL2 estão listados em um artigo de Anne van Kesteren.

+ +

Veja também

+ + + + diff --git a/files/pt-pt/archive/mozilla/xul/comunidade/index.html b/files/pt-pt/archive/mozilla/xul/comunidade/index.html new file mode 100644 index 0000000000..a2712cc2a1 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/comunidade/index.html @@ -0,0 +1,6 @@ +--- +title: Comunidade +slug: Archive/Mozilla/XUL/Comunidade +--- +

+

diff --git a/files/pt-pt/archive/mozilla/xul/image/index.html b/files/pt-pt/archive/mozilla/xul/image/index.html new file mode 100644 index 0000000000..5316e18ebd --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/image/index.html @@ -0,0 +1,154 @@ +--- +title: image +slug: Archive/Mozilla/XUL/image +tags: + - Elementos XUL + - Referência XUL +translation_of: Archive/Mozilla/XUL/image +--- +
+ « XUL Reference home [ + Examples | + Attributes | + Properties | + Methods | + Related ] +
+ +

Resumo

+ +

Um elemento que exibe uma imagem, bem como o elemento img de HTML. O atributo src pode ser utilziado para especificar o URL da imagem.

+ +

Está disponível mais informação no Tutorial de XUL.

+ +
+
+

Nota: Prior to Gecko 8.0, images did not shrink down with the same ratio in both directions when specifying maximum sizes using maxheight or maxwidth. The new behavior aligns more with the HTML <img> element and shrinks both the width and height down proportionally.

+
+
+ +
+
Atributos
+
onerror, onload, src, validate
+
+ +
+
Propriedades
+
accessibleType, src
+
+ +
+
Classes de estilo
+
alert-icon, error-icon, message-icon, question-icon
+
+ +

Exemplos

+ +
Image:Firefoxlogo2.png
+ +
<image src='Firefoxlogo.png' width='135' height='130'/>
+
+ +

Atributos

+ +

+ + +
+
onerror
+
Type: script code
+
This event is sent to an image element when an error occurs loading the image.
+
+
+ + +
+
image.onload
+
Type: script code
+
This event handler will be called on the image element when the image has finished loading. This applies whether the image is applied via the src attribute or the list-style-image style property. If you change the image, the event will fire again when the new image loads. This event will not bubble up the element tree.
+
+
+ +
+
+ src
+
+ Type: URI
+
+ The URI of the content to appear in the element.
+
+ + +
+ + +
+
validate
+
Type: one of the values below
+
This attribute indicates whether to load the image from the cache or not. This would be useful if the images are stored remotely or you plan on swapping the image frequently. The following values are accepted, or leave out the attribute entirely for default handling:
+
+
+
always
+
The image is always checked to see whether it should be reloaded.
+
never
+
The image will be loaded from the cache if possible.
+
+
+
+
+ +

Propriedades

+ +
+
+
+ accessibleType
+
+ Type: integer
+
+ A value indicating the type of accessibility object for the element.
+
+
+ +
+
src
+
Type: URL
+
Gets and sets the value of the src attribute.
+
+

Inherited Properties
align, , allowEvents, , boxObject, builder, , , , className, , , , , collapsed, contextMenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxHeight, maxWidth, menu, minHeight, minWidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statusText, style, ,, tooltip, tooltipText, top, width
+ +

Métodos

+ + +

Inherited Methods
addEventListener(), appendChild(), blur, click, cloneNode(), compareDocumentPosition, dispatchEvent(), doCommand, focus, getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getBoundingClientRect(), getClientRects(), getElementsByAttribute, getElementsByAttributeNS, getElementsByClassName(), getElementsByTagName(), getElementsByTagNameNS(), getFeature, getUserData, hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isDefaultNamespace(), isEqualNode, isSameNode, isSupported(), lookupNamespaceURI, lookupPrefix, normalize(), querySelector(), querySelectorAll(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS(), setUserData
+ +

Classes de estilo

+ +
+
+ alert-icon
+
+ Class that adds an alert icon. This typically looks like an exclamation mark. This and the other icon classes may be used by image elements or other elements which can have an image.
+
+
error-icon
+
Class that adds an error icon. This will typically be a red "X" icon.
+
+
message-icon
+
Class that adds a message box icon.
+
+
question-icon
+
Class that adds a question icon, which usually looks like a question mark.
+
+ +

Relacionado

+ +

See also the image and icon attributes.

+ +

Interfaces

+ + + +
diff --git a/files/pt-pt/archive/mozilla/xul/index.html b/files/pt-pt/archive/mozilla/xul/index.html new file mode 100644 index 0000000000..3485d951c8 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/index.html @@ -0,0 +1,83 @@ +--- +title: XUL +slug: Archive/Mozilla/XUL +tags: + - Todas_as_Categorias + - XUL +translation_of: Archive/Mozilla/XUL +--- +

 

+ +
Tutorial XUL + +

Um tutorial introdutório ao XUL, originário do XULPlanet.

+
+ +
+

A XML User Interface Language (XUL) (em português "linguagem XML de interface de usuário") é a linguagem de interface de usuário da Mozilla baseada na XML que permite construir aplicações multi-plataformas ricas em características que podem rodar ligadas ou desligadas da internet. Essas aplicações são facilmente personalizadas com texto, gráficos e disposições alternativas, fazendo com que possam ser marcadas e localizadas para vários mercados. Desenvolvedores Web que já estejam familiarizados com DHTML irão aprender XUL rapidamente e vão logo poder criar aplicações.

+
+ + + + + + + + +
+

Documentação

+ +
+
Referência XUL
+
Veja também a documentação MDC em prefwindow.
+
+ +
+
Controles XUL
+
Uma rápida lista de todos os controles XUL disponíveis.
+
+ +
+
Visão Geral do XUL
+
Descreve as características chave e os componentes do XUL.
+
+ +
+
Guia modelo do XUL
+
Um guia detalhado sobre modelos XUL, que é um meio de gerar conteúdo de um código de dados.
+
+ +
+
Sobreposições XUL
+
Um artigo sobre sobreposições XUL. Sobreposições são usadas para descrever conteúdo extra para a UI. Ele proporciona um poderoso mecanismo para extender e customizar aplicações XUL existentes.
+
+ +

Veja todos...

+ 		+

Comunidade

+ +

{{ DiscussionList("dev-tech-xul", "mozilla.dev.tech.xul") }}

+ + + +

Ferramentas

+ + + +

Veja todas...

+ +

Tópicos relacionados

+ +

JavaScript, CSS, RDF, XBL, Extensões, XULRunner

+ +

Categorias

+ +

Interwiki Language Links

+ +

 

+
diff --git a/files/pt-pt/archive/mozilla/xul/namespaces/index.html b/files/pt-pt/archive/mozilla/xul/namespaces/index.html new file mode 100644 index 0000000000..53bc371053 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/namespaces/index.html @@ -0,0 +1,153 @@ +--- +title: Espaços de nomes +slug: Archive/Mozilla/XUL/Namespaces +tags: + - Extensões + - Extras +translation_of: Archive/Mozilla/XUL/Namespaces +--- +

 

+ +

Em adição a este documento, consulte Namespaces Crash Course.

+ +

Espaços de nomes XML fornecem uma maneira para distinguir nomes duplicados de elementos e atributos. Os nomes de elementos e atributos duplicados podem ocorrer quando um documento XML contém elementos e atributos de dois ou mais esquemas XML diferentes (ou DTDs). para citar Wikipédia: "Em geral, um espaço de nome é um recipiente abstrato que fornece contexto para os itens... este contém e permite a desambiguação de itens com o mesmo nome."

+ +

If you are familiar with C++ namespaces, Java packages, perl packages, or Python module importing, you are already familiar with the namespace concept.

+ +

An XML namespace is identified by an unique name (called a URI, not a URL, even though it can look like a URL). An URI is any string, although most people choose a URL-based URI because URLs are an easy way to hope for uniqueness. Although there's nothing preventing someone else from using the namespace http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul, it's fairly unlikely anyone would choose that accidentally. Even if they did accidentally choose it, they may not define the same elements as XUL anyway (e.g., <textbox/>) in their schema/DTD.

+ +

Any element type or attribute name in an XML namespace can be uniquely identified by its XML namespace and its "local name". Together, these two items define a qualified name, or QName.

+ +

For example, <xul:textbox/> uses a namespace named "xul" and a local name "textbox". This distinguishes it from, for example, <foobar:textbox/> which might occur in the same document. The xul and foobar namespaces must be defined at the top of the XML document in which they are used, like so:

+ +
 <foobar:some-element
+     xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+     xmlns:foobar="the-foobar-namespace">
+   <xul:textbox id="foo" value="bar"/>
+   <foobar:textbox favorite-food="pancakes"/>
+ </foobar:some-element>
+
+ +

Notice I've mixed two <textboxes/> in the same document. The only way to distinguish that they have different meanings is with namespaces.

+ +

There's only one other thing to know: "default namespace". Every XML element has a "default namespace", and this is used with XUL elements all the time. In XUL documents, you'll usually see this:

+ +
 <window
+     id="foo"
+     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+   ...
+   ...
+ </window>
+
+ +

and in XHTML documents, you'll see this:

+ +
 <html xmlns="http://www.w3.org/1999/xhtml">
+   ...
+   ...
+ </html>
+
+ +

There is a very subtle difference here than before. Before I wrote xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" but here the :xul piece is omitted. This signifies to the XML parser that http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul is the default namespace for the element and its descendant elements (unless further overridden by a default namespace on a descendant element), and that any element without a namespace (i.e., no prefix and colon) belongs to the default namespace. That's why we can write the shorthand <textbox/> instead of <xul:textbox/> in XUL (although the latter is just as correct when not using http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul as the default namespace) -- the XUL namespace is defined as the default on the topmost element. In other words, a default namespace permits a kind of short-hand to be used for all descendants of an element.

+ +

Here's a question: what namespace contains the element foo in the XML document below?

+ +
  <foo/>
+
+ +

The answer is that it's in no namespace, or alternately, it's in the namespace denoted by the empty string:

+ +
  <foo xmlns=""/>
+
+ +

This second example is semantically equivalent to the first.

+ +

Now, a second question: what namespaces are the bar, baz, and quux attributes in?

+ +
  <foo bar="value">
+    <element xmlns="namespace!" baz="value">
+      <element quux="value"/>
+    </element>
+  </foo>
+
+ +

bar is obviously not in a namespace. What about baz and quux? The answer is that they aren't in a namespace either. In fact no unprefixed attribute is ever in a namespace, primarily because XML originally didn't have namespaces, and all XML from that time had to stay in no namespace. This is a source of perennial confusion for XML namespaces.

+ +
+ + + + + +
diff --git a/files/pt-pt/archive/mozilla/xul/outros_recursos/index.html b/files/pt-pt/archive/mozilla/xul/outros_recursos/index.html new file mode 100644 index 0000000000..fba234096d --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/outros_recursos/index.html @@ -0,0 +1,6 @@ +--- +title: Outros recursos +slug: Archive/Mozilla/XUL/Outros_recursos +--- +

+

diff --git a/files/pt-pt/archive/mozilla/xul/scale/index.html b/files/pt-pt/archive/mozilla/xul/scale/index.html new file mode 100644 index 0000000000..fab8882332 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/scale/index.html @@ -0,0 +1,235 @@ +--- +title: scale +slug: Archive/Mozilla/XUL/scale +tags: + - PrecisaDeConteúdo +--- +

+ + « XUL Reference home [ + Examples | + Attributes | + Properties | + Methods | + Related ] + +

Uma escala permite ao usuário selecionar um valor de uma faixa. Uma barra exibida horizontalmente ou verticalmente permite ao usuário selecionar um valor arrastando um ponteiro na barra. +

Use o atributo de orientação para especificar a orientação da escala. O valor padrão é <tt>horizontal</tt>, que exibe uma escala horizontal. Valores pequenos são para a esquerda e valores maiores para a direita. Configure o atributo orient para <tt>vertical</tt> para usar uma escala vertical. +

O usuário pode usar as teclas de flecha para incrementar ou decrementar o valor em uma unidade, ou as teclas de "page up" e "page down" para incrementar ou decrementar uma página, como especificado pelo atributo pageincrement. As teclas "home" e "end" configuram o valor da escala para os valores mínimo e máximo, respectivamente. +

+
Atributos +
disabled, increment, max, min, pageincrement, tabindex, value +
+
Propriedades +
disabled, max, min, increment, pageIncrement, tabIndex, value,
+
Métodos +
decrease, decreasePage, increase, increasePage, +
+

Examples

+

Escala horizontal: +

+
<scale min="1" max="10"/>
+
+

Image:Controlguide-scale.png +

Escala vertical: +

+
<scale min="1" max="10" orient="vertical"/>
+
+

Atributos

+

+

+ + +
+
disabled
+
Type: boolean
+
Indicates whether the element is disabled or not. If this attribute is set, the element is disabled. Disabled elements are usually drawn with grayed-out text. If the element is disabled, it does not respond to user actions, it cannot be focused, and the command event will not fire. In the case of form elements, it will not be submitted. Do not set the attribute to true, as this will suggest you can set it to false to enable the element again, which is not the case. + +
The disabled attribute is allowed only for form controls. Using it with an anchor tag (an <a> link) will have no effect.
+ +
+ The element will, however, still respond to mouse events. To enable the element, leave this attribute out entirely.
+
+
Visible controls have a disabled property which, except for menus and menuitems, is normally preferred to use of the attribute, as it may need to update additional state.
+
+ + +
+
+ +
+
+ increment
+
+ Type: integer
+
+ The amount by which the curpos (for scroll bars) or value (for number boxes and scale) attribute changes when the arrows are clicked(or scales are dragged). The default value is 1.
+
+
+
+ +
+
+ min
+
+ Type: integer
+
+ The minimum value the control's value may take. The default value is 0.
+
+

 

+
+
+ +
+
+ Type: integer
+
+ The maximum value that the scale or number box may be set to. The default value is 100 for scales and Infinity for number boxes.
+
+ +

 

+
+
+ + +
+
pageincrement
+
Type: integer
+
The amount by which the value of the curpos or value attribute changes when the tray of the scroll bar (the area in which the scroll bar thumb moves) is clicked, or when the page up or page down keys are pressed. The default value is 10.
+
+
+
+ + +
+
tabindex
+
Type: integer
+
The tab order of the element. The tab order is the order in which the focus is moved when the user presses the "tab" key. Elements with a higher tabindex are later in the tab sequence.
+
+
+
+ + +
+
value
+
Type: string
+
The string attribute allows you to associate a data value with an element. It is not used for any specific purpose, but you can access it with a script for your own use. Be aware, however, that some elements, such as textbox will display the value visually, so in order to merely associate data with an element, you could 1) Use another attribute like "value2" or "data-myAtt" (as in the HTML5 draft), as XUL does not require validation (less future-proof); 2) Use setAttributeNS() to put custom attributes in a non-XUL namespace (serializable and future-proof); 3) Use setUserData() (future-proof and clean, but not easily serializable). For user editable menulist elements, the contents, as visible to the user, are read and set using the Menulist.value syntax. For those elements, setAttribute("value", myValue) and getAttribute("value") do not access or affect the contents displayed to the user.
+
+ + + +

 

+
+ +

Propriedades

+

+

+
+
+ disabled
+
+ Type: boolean
+
+ Gets and sets the value of the disabled attribute.
+
+
+
+
+
+ increment
+
+ Type: integer
+
+ Gets and sets the value of the increment attribute.
+
+
+
+
+ min
+
+ Type: integer
+
+ Gets and sets the value of the min attribute.
+
+
+
+
+ max
+
+ Type: integer
+
+ Gets and sets the value of the max attribute.
+
+
+
+
+ pageIncrement
+
+ Type: integer
+
+ Gets and sets the value of the pageincrement attribute.
+
+
+
+
+ tabIndex
+
+ Type: integer
+
+ Gets and sets the value of the tabindex attribute.
+
+
+
+
+ value
+
+ Type: string
+
+ Gets and sets the value of the value attribute. For textbox and user editable menulist elements, the contents, as visible to the user, are read and set using the Textbox.value and Menulist.value syntax.
+
+ +

 

+ +

Métodos

+ +

Inherited Methods
addEventListener(), appendChild(), blur, click, cloneNode(), compareDocumentPosition, dispatchEvent(), doCommand, focus, getAttribute(), getAttributeNode(), getAttributeNodeNS(), getAttributeNS(), getBoundingClientRect(), getClientRects(), getElementsByAttribute, getElementsByAttributeNS, getElementsByClassName(), getElementsByTagName(), getElementsByTagNameNS(), getFeature, getUserData, hasAttribute(), hasAttributeNS(), hasAttributes(), hasChildNodes(), insertBefore(), isDefaultNamespace(), isEqualNode, isSameNode, isSupported(), lookupNamespaceURI, lookupPrefix, normalize(), querySelector(), querySelectorAll(), removeAttribute(), removeAttributeNode(), removeAttributeNS(), removeChild(), removeEventListener(), replaceChild(), setAttribute(), setAttributeNode(), setAttributeNodeNS(), setAttributeNS(), setUserData
+
+
+ decrease()
+
+ Return type: no return value
+
+ Decreases the value of the scale or number box by the increment.
+
+
+
+ decreasePage()
+
+ Return type: no return value
+
+ Decreases the value of the scale by the pageincrement.
+
+
+
+ increase()
+
+ Return type: no return value
+
+ Increases the value of the scale or number box by the increment.
+
+
+
+ increasePage()
+
+ Return type: no return value
+
+ Increases the value of the scale by the page increment.
+
+ +

Relacionado

+
Interfaces +
nsIDOMXULControlElement +
+

Categorias +

Interwiki Language Links +

diff --git a/files/pt-pt/archive/mozilla/xul/tutorial/adicionar_etiquetas_e_imagens/index.html b/files/pt-pt/archive/mozilla/xul/tutorial/adicionar_etiquetas_e_imagens/index.html new file mode 100644 index 0000000000..7f6d53c292 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/tutorial/adicionar_etiquetas_e_imagens/index.html @@ -0,0 +1,102 @@ +--- +title: Adicionar Etiquetas e Imagens +slug: Archive/Mozilla/XUL/Tutorial/Adicionar_Etiquetas_e_Imagens +tags: + - Tutoriais + - Tutorial de XUL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Adding_Labels_and_Images +--- +
+

« AnteriorPróxima »

+
+ +

Esta secção descreve uma maneira para adicionar etiquetas e imagens a uma janela. Além disso, nós consideramos em como incluir os elementos em grupos.

+ +

Elementos de Texto

+ +

You cannot embed text directly into a XUL file without tags around it and expect it to be displayed. You can use two XUL elements for this purpose.

+ +

Elemento Etiqueta

+ +

The most basic way to include text in a window is to use the label element. It should be used when you want to place a descriptive label beside a control, such as a button. An example is shown below:

+ +

Example 1 : Source View

+ +
<label value="This is some text"/>
+
+ +

The value attribute can be used to specify the text that you wish to have displayed. The text will not wrap, so the text will all be displayed on a single line. This syntax is the most common of labels.

+ +

If the text needs to wrap, you can place the text content inside opening and closing tags as in the following example:

+ +

Example 2 :

+ +
<label>This is some longer text that will wrap onto several lines.</label>
+
+ +

As with HTML, line breaks and extra whitespace are collapsed into a single space. Later, we'll find out how to constrain the width of elements so that we can see the wrapping more easily.

+ +
Atributo de Controle
+ +

You can use the control attribute to set which control the label is associated with. When the user clicks on an associated label, that control will be focused. This association is also important for accessibility, so that screen readers read aloud the label for the control as the user tabs to it. Set the value of the control attribute to the id of the element to be focused.

+ +

Example 3 : Source View

+ +
<label value="Click here:" control="open-button"/>
+<button id="open-button" label="Open"/>
+
+ +

In the example above, clicking the label will cause the button to be focused.

+ +

Elemento Descrição

+ +

For descriptive text not associated with any particular control, you can use the description tag. This element is useful for informative text at the top of a dialog or a group of controls for example. As with the label element, you can either use the value attribute for a single line of text or place text or XHTML content inside opening and closing description tags for longer blocks of text. It is more common to use the attribute syntax for labels, and the text content syntax for descriptions.

+ +

Example 4 : Source View

+ +
<description>
+  This longer section of text is displayed.
+</description>
+
+ +

You can set the text via script using the textContent property, as in the following example:

+ +
<description id="text" width="200"/>
+
+document.getElementById('text').textContent = "Some lengthy word wrapped text goes here.";
+
+ +

Internally, both the label element and the description elements are the same. The label element is intended for labels of controls, such as text fields. The control attribute is only supported for labels. The description element is intended for other descriptive text such as informative text at the top of a dialog box.

+ +

Imagens

+ +

XUL has an element to display images within a window. This element is appropriately named image. Note that the tag name is different than HTML (image instead of img). You can use the src attribute to specify the URL of the image file. The example below shows this:

+ +
<image src="images/banner.jpg"/>
+
+ +

Although you can use this syntax, it would be better in order to support different themes to use a style sheet to set the image URL. A later section will describe how to use style sheets, but an example will be shown here for completeness. You can use the list-style-image CSS property to set the URL for the image. Here are some examples:

+ +
XUL:
+ <image id="image1"/>
+ <image id="search"/>
+
+ +
Style Sheet:
+ #image1 {
+   list-style-image: url("chrome://findfile/skin/banner.jpg");
+ }
+
+ #search {
+   list-style-image: url("http://example.com/images/search.png");
+ }
+
+ +

These images come from within the chrome directory, in the skin for the findfile package. Because images vary by theme, you would usually place images in the skin directory.

+ +

In the next section, we will learn how to add some input controls to a window.

+ +
+

« AnteriorPróxima »

+
diff --git a/files/pt-pt/archive/mozilla/xul/tutorial/ficheiros_de_propriedade/index.html b/files/pt-pt/archive/mozilla/xul/tutorial/ficheiros_de_propriedade/index.html new file mode 100644 index 0000000000..44657ee360 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/tutorial/ficheiros_de_propriedade/index.html @@ -0,0 +1,115 @@ +--- +title: Ficheiros de Propriedade +slug: Archive/Mozilla/XUL/Tutorial/Ficheiros_de_propriedade +tags: + - Internacionalização + - Localização + - Tutoriais + - Tutorial de XUL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Property_Files +--- +

 

+ +

{{ PreviousNext("XUL Tutorial:Localization", "XUL Tutorial:Introduction to XBL") }}

+ +

Num script, não pode ser utilizadas as entities. Em vez disso, são utilizados 'ficheiros de Propriedade'.

+ +

Properties

+ +

DTD files are suitable when you have text in a XUL file. However, a script does not get parsed for entities. In addition, you may wish to display a message which is generated from a script, if, for example, you do not know the exact text to be displayed. For this purpose, property files can be used.

+ +

A property file contains a set of strings. You will find property files alongside the DTD files with a .properties extension. Properties in the file are declared with the syntax name=value. An example is shown below:

+ +
notFoundAlert=No files were found matching the criteria.
+deleteAlert=Click OK to have all your files deleted.
+resultMessage=%2$S files found in the %1$S directory.
+
+ +

Here, the property file contains three properties. These would be read by a script and displayed to the user.

+ +

A property file can also include comments. A line that begins with a hash sign ('#') is treated as a comment:

+ +
# This is a comment
+welcomeMessage=Hello, world!
+# This is another comment
+goodbyeMessage=Come back soon!
+
+ +

Stringbundles

+ +

You could write the code to read properties yourself, however XUL provides the {{ XULElem("stringbundle") }} element which does this for you. The element has a number of functions which can be used to get strings from the property file and get other locale information. This element reads in the contents of a property file and builds a list of properties for you. You can then look up a particular property by name.

+ +
<stringbundleset id="stringbundleset">
+<stringbundle id="strings" src="strings.properties"/>
+</stringbundleset>
+
+ +

Including this element will read the properties from the file 'strings.properties' in the same directory as the XUL file. Use a chrome URL to read a file from the locale:

+ +
<stringbundleset id="stringbundleset">
+<stringbundle id="strings" src="chrome://myplugin/locale/strings.properties"/>
+</stringbundleset>
+
+ +

Like other non-displayed elements, you should declare all your stringbundles inside a {{ XULElem("stringbundleset") }} element so that they are all kept together.

+ +

Getting a String from the Bundle

+ +

This {{ XULElem("stringbundle") }} element has a number of properties. The first is getString which can be used in a script to read a string from the bundle.

+ +
var strbundle = document.getElementById("strings");
+var nofilesfound=strbundle.getString("notFoundAlert");
+
+alert(nofilesfound);
+
+ + + +

Text Formatting

+ +

The next method is getFormattedString(). This method also gets a string with the given key name from the bundle. In addition, each occurrence of formatting code (e.g. %S) is replaced by each successive element in the supplied array.

+ +
var dir = "/usr/local/document";
+var count = 10;
+
+var strbundle = document.getElementById("strings");
+var result = strbundle.getFormattedString("resultMessage", [ dir, count ]);
+
+alert(result);
+
+ +

This example will display following message in an alert box.

+ +
10 files found in the /usr/local/document directory.
+
+ +

You will notice the formatting codes %1$S and %2$S is used, and replaced different order in the array. Formatting code %n$S is specify the position of corresponding parameter directly. Although the word order is not the same in all the languages, by using getFormattedString() the specification of the order can be put out the property files.

+ +

In case you need to format a string that already contains the percentage character in it (to get something like "50% Off" returned), escape the percentage character with another percentage character, like this:

+ +
my.percentage.string = %S%% Off
+
+ +

Not escaping the percentage character will generate an incorrect string that strips the space character between the percentage character and the next word of the string ("50%Off").

+ +

Non-ASCII Characters, UTF-8 and escaping

+ +

Gecko 1.8.x (or later) supports property files encoded in UTF-8. You can and should write non-ASCII characters directly without escape sequences, and save the file as UTF-8 without BOM. Double-check the save options of your text editor, because many don't do this by default. See Localizing extension descriptions for more details.

+ +

In some cases, it may be useful or needed to use escape sequences to express some characters. Property files support escape sequences of the form: \uXXXX , where XXXX is a Unicode character code. For example, to put a space at the beginning or end of a string (which would normally be stripped by the properties file parser), use \u0020 .

+ +


+ In the next section, we will look at XBL, which can be used to define the behavior of an element.

+ +

{{ PreviousNext("XUL Tutorial:Localization", "XUL Tutorial:Introduction to XBL") }}

+ +

Consulte Também

+ + diff --git a/files/pt-pt/archive/mozilla/xul/tutorial/index.html b/files/pt-pt/archive/mozilla/xul/tutorial/index.html new file mode 100644 index 0000000000..8071ee6794 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/tutorial/index.html @@ -0,0 +1,142 @@ +--- +title: XUL Tutorial +slug: Archive/Mozilla/XUL/Tutorial +tags: + - NeedsTranslation + - TopicStub + - Tutorials + - XUL + - XUL_Tutorial +translation_of: Archive/Mozilla/XUL/Tutorial +--- +

This tutorial describes XUL, the XML User-interface Language. This language was created for the Mozilla application and is used to describe its user interface.

+

Introduction

+ +

Simple Elements

+ +

The Box Model

+ +

More Layout Elements

+ +

Toolbars and Menus

+ +

Events and Scripts

+ +

Document Object Model

+ +

Trees

+ +

RDF and Templates

+ +

Skins and Locales

+ +

Bindings

+ +

Specialized Window Types

+ +

Installation

+ +
+

This XUL tutorial was originally created by Neil Deakin. He has graciously given us permission to use it as part of the MDN.

+
+
+

Original Document Information

+ +
+

 

diff --git a/files/pt-pt/archive/mozilla/xul/tutorial/modificar_o_tema_predefinido/index.html b/files/pt-pt/archive/mozilla/xul/tutorial/modificar_o_tema_predefinido/index.html new file mode 100644 index 0000000000..9c403175a6 --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/tutorial/modificar_o_tema_predefinido/index.html @@ -0,0 +1,70 @@ +--- +title: Modificar o Tema Predefinido +slug: Archive/Mozilla/XUL/Tutorial/Modificar_o_tema_predefinido +tags: + - Firefox + - Intermediário + - Personalização + - Tutoriais + - Tutorial XUL + - XUL +translation_of: Archive/Mozilla/XUL/Tutorial/Modifying_the_Default_Skin +--- +

{{ PreviousNext("XUL Tutorial:Styling a Tree", "XUL Tutorial:Creating a Skin") }}

+ +
+

Esta documentação não foi atualizada para o Firefox Quantum. Support for the userChrome.css file and any of its elements described below are not guaranteed in future versions of Firefox. Using it may lead to hard-to-diagnose bugs or crashes. Use at your own risk!

+
+ +

Esta secção descreve como modificar o tema de uma janela.

+ +

O Essencial do Tema

+ +

A skin is a set of style sheets, images and behaviors that are applied to a XUL file. By applying a different skin, you can change the look of a window without changing its functionality. Firefox provides a skin by default, and you may download others. The XUL for any skins is the same, however the style sheets and images used are different.

+ +

For a simple personalized look to a Firefox window, you can easily change the style sheets associated with it. Larger changes can be done by creating an entirely new skin. Firefox has a Theme Manager for changing the default skin. (Although the underlying code for Mozilla calls them skins and the user interface calls them themes, they're both referring to the same thing).

+ +

A skin is described using CSS, allowing you to define the colors, borders and images used to draw elements. The file classic.jar contains the skin definitions. The global directory within this archive contains the main style definitions for how to display the various XUL elements. By changing these files, you can change the look of the XUL applications.

+ +

Personalizar com userChrome.css

+ +

If you place a file called 'userChrome.css' in a directory called 'chrome' inside your user profile directory, you can override settings without changing the archives themselves. This directory should be created when you create a profile and some examples placed there. The file 'userContent.css' customizes Web pages, whereas 'userChrome.css' customizes chrome files.

+ +

For example, by adding the following to the end of the file, you can change all {{ XULElem("menubar") }} elements to have a red background.

+ +
menubar {
+  background-color: red;
+}
+
+ +

If you open any Firefox window after making this change, the menu bars will be red. Because this change was made to the user style sheet, it affects all windows. This means that the browser menu bar, the bookmarks menu bar and even the find files menu bar will be red.

+ +

Pacotes de Temas

+ +

To have the change affect only one window, change the style sheet associated with that XUL file. For example, to add a red border around the menu commands in the bookmarks manager window, add the following to bookmarksManager.css in the classic.jar or your favorite skin archive.

+ +
menuitem {
+  border: 1px solid red;
+}
+
+ +

If you look in one of the skin archives, you will notice that each contain a number of style sheets and a number of images. The style sheets refer to the images. You should avoid putting references to images directly in XUL files if you want your content to be skinnable. This is because a particular skin's design might not use images and it may need some more complex design. By referring to the images with CSS, they are easy to remove. It also removes the reliance on specific image filenames.

+ +

You can assign images to a button, checkbox and other elements by using the list-style-image property as in the following:

+ +
checkbox {
+  list-style-image: url("chrome://findfile/skin/images/check-off.jpg");
+}
+
+checkbox[checked="true"] {
+  list-style-image: url("chrome://findfile/skin/images/check-on.jpg");
+}
+
+ +

This code changes the image associated with a checkbox. The first style sets the image for a normal checkbox and the second style sets the image for a checked checkbox. The modifier 'checked=true' makes the style only apply to elements which have their checked attributes set to true.

+ +

See also : creating a skin for Firefox and CSS getting started

+ +

Na secção seguinte, nós iremos abordar a criação de um novo tema

+ +

{{ PreviousNext("XUL Tutorial:Styling a Tree", "XUL Tutorial:Creating a Skin") }}

diff --git a/files/pt-pt/archive/mozilla/xul/tutorial/xbl_bindings/index.html b/files/pt-pt/archive/mozilla/xul/tutorial/xbl_bindings/index.html new file mode 100644 index 0000000000..9b5dd8f99f --- /dev/null +++ b/files/pt-pt/archive/mozilla/xul/tutorial/xbl_bindings/index.html @@ -0,0 +1,215 @@ +--- +title: XBL bindings +slug: Archive/Mozilla/XUL/Tutorial/XBL_bindings +tags: + - 'CSS:Como_começar' +translation_of: Archive/Beginner_tutorials/Using_XBL_from_stylesheets +--- +

{{ PreviousNext("CSS:Como começar:JavaScript", "CSS:Como começar:Interfaces de usuário XUL") }}

+ +

Esta página ilustra como o você pode usar as CSS no Mozilla para melhorar a estrutura de aplicações complexas, fazendo o código e recursos mais facilmente reutilizáveis.

+ +

Você aplica esta técnica em uma simples demonstração.

+ +

Informação: XBL bindings

+ +

A estrutura proporcionada pela linguagem de marcação e as CSS não é ideal para aplicações complexas onde partes precisam ser autônomas e reutilizáveis. Você pode colocar folhas de estilo em arquivos separados, e pode também colocar os scripts em arquivos separados. Mas você precisa ligar estes arquivos no documento como um todo.

+ +

Outra limitação estrutural concerne ao conteúdo. Você pode usar as CSS para proporcionar conteúdo para elementos selecionados, mas o conteúdo é limitado a textos e imagens, e seu posicionamento é limitado em antes ou depois do elemento selecionado.

+ +

Mozilla proporciona um mecanismo que supera estas limitações: XBL (XML Bindings Language). Você pode usar o XBL para ligar elementos selecionados ao próprio:

+ + + +

Evitando ligar tudo no nível do documento, você pode fazer as partes autônomas que são fáceis de manter e reutilizar.

+ + + + + + + + +
Mais detalhes
Para mais informação sobre XBL bindings, veja a página XBL neste wiki.
+ +

Ação: Uma demonstração XBL

+ +

Crie um novo documento HTML, doc6.html. Copie e cole o conteúdo daqui:

+ +
+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
+<HTML>
+
+<HEAD>
+<TITLE>Como Começar Mozilla CSS - Demonstração XBL </TITLE>
+<LINK rel="stylesheet" type="text/css" href="style6.css">
+</HEAD>
+
+<BODY>
+<H1>Demonstração XBL</H1>
+<DIV id="square">Clique Aqui</DIV>
+</BODY>
+
+</HTML>
+
+
+ +

Crie um novo arquivo CSS, style6.css. Esta folha de estilo contém o documento de estilo. Copie e cole o conteúdo daqui:

+ +
+
/*** Demonstração XBL ***/
+#square {
+  -moz-binding: url("square.xbl#square");
+  }
+
+
+ +

Crie um novo arquivo de texto, square.xbl. Este arquivo contém o XBL binding. Copie e cole o conteúdo daqui, tendo certeza de ter rolado a tela para pegar tudo isto:

+ +
+
<?xml version="1.0"?>
+<!DOCTYPE bindings>
+<bindings xmlns="http://www.mozilla.org/xbl"
+             xmlns:html="http://www.w3.org/1999/xhtml">
+
+<binding id="square">
+
+  <resources>
+    <stylesheet src="bind6.css"/>
+    </resources>
+
+  <content>
+    <html:div anonid="square"/>
+    <html:button anonid="button" type="button">
+      <children/>
+      </html:button>
+    </content>
+
+  <implementation>
+
+    <field name="square"><![CDATA[
+      document.getAnonymousElementByAttribute(this, "anonid", "square")
+      ]]></field>
+
+    <field name="button"><![CDATA[
+      document.getAnonymousElementByAttribute(this, "anonid", "button")
+      ]]></field>
+
+    <method name="doDemo">
+      <body><![CDATA[
+        this.square.style.backgroundColor = "#cf4"
+        this.square.style.marginLeft = "20em"
+        this.button.setAttribute("disabled", "true")
+        setTimeout(this.clearDemo, 2000, this)
+        ]]></body>
+      </method>
+
+    <method name="clearDemo">
+      <parameter name="me"/>
+      <body><![CDATA[
+        me.square.style.backgroundColor = "transparent"
+        me.square.style.marginLeft = "0"
+        me.button.removeAttribute("disabled")
+        ]]></body>
+      </method>
+
+    </implementation>
+
+  <handlers>
+    <handler event="click" button="0"><![CDATA[
+     if (event.originalTarget == this.button) this.doDemo()
+     ]]></handler>
+    </handlers>
+
+  </binding>
+
+</bindings>
+
+
+ +

Crie um novo arquivo CSS, bind6.css. Esta folha de estilo separada contém o estilo para o binding. Copie e cole o conteúdo daqui:

+ +
+
/*** Demonstração XBL ***/
+[anonid="square"] {
+  width: 20em;
+  height: 20em;
+  border: 2px inset gray;
+  }
+
+[anonid="button"] {
+  margin-top: 1em;
+  padding: .5em 2em;
+  }
+
+
+ +

Abra o documento no seu navegador e pressione o botão.

+ +

O wiki não suporta JavaScript nas páginas, então não é possível demonstrar aqui. Deve parecer como isto, antes e depois de você pressionar o botão:

+ + + + + + + + +
+ + + + + + +
+

Demonstração XBL

+
+ 		+ + + + + + +
+

Demonstração XBL

+
+
+ +

Notas sobre esta demonstração:

+ + + + + + + + + + +
Desafios
Mude o arquivo XBL de modo que o quadrado dobre a largura ao mudar de cor, em vez de saltar para a direita. +

Use a ferramenta DOM Inspector para inspecionar o documento, reavaliando o conteúdo adicionado.

+
+ +

O que vem depois?

+ +

Se você teve dificuldade para entender esta página, ou se você tem algum comentário sobre ela, por favor contribua nesta página de Discussão.

+ +

Nesta demonstração, o quadrado e o botão foram widgets independentes que funcionam com um documento HTML. Mozilla tem uma linguagem de marcação especializada para criação de interfaces de usuários. A próxima página demostra isto: Interfaces de usuário XUL

+ +

{{ PreviousNext("CSS:Como começar:JavaScript", "CSS:Como começar:Interfaces de usuário XUL") }}

+ +

Categorias

+ +

Interwiki Language Links

diff --git a/files/pt-pt/archive/normas_web/index.html b/files/pt-pt/archive/normas_web/index.html new file mode 100644 index 0000000000..f7debd671a --- /dev/null +++ b/files/pt-pt/archive/normas_web/index.html @@ -0,0 +1,151 @@ +--- +title: Normas da Web +slug: Archive/Normas_Web +tags: + - Normas da Web +translation_of: Archive/Web_Standards +--- +
As normas da Web são cuidadosamente projetadas para distribuir os maiores benefícios para o maior número de utilizadores da Web enquanto assegura a viabilidade a longo prazo de qualquer documento publicado na Web. Projetar e criar com estas normas simplifica e baixa o custo de produção, enquanto distribui sites que estão acessíveis para mais pessoas e mais tipos de dispositivos da Internet. Os sites desenvolvidos com a utilziação destas linhas irão continuar a funcionar corretamente enquanto os navegadores de PCs tradicionais evoluem, e à medida que os novos dispositivos da Internet chegam ao mercado.
+ + + + + + + + +
+

Documentação

+ +
+
Migrando aplicações do Internet Explorer para o Mozilla
+
Ever have trouble getting your Internet Explorer-specific Web applications to work with Mozilla? This article covers common issues associated with migrating applications to the open source Mozilla-based browser.
+
+ +
+
Utilizar as Normas da Web nas suas Páginas da Web
+
This article provides an overview of the process for upgrading the content of your web pages to conform to the W3C web standards.
+
+ +
+
Choosing Standards Compliance Over Proprietary Practices
+
In the development world, there is a need for standards because applications are designed across multiple development groups.
+
+ +
+
The Business Benefits of Web Standards
+
This article discusses how adhering to web standards, and leaving behind proprietary markup and technologies, can contribute to a company's business goals.
+
+ +

Veja todos...

+ 		+

Comunidade

+ +

{{ DiscussionList("dev-web-development", "mozilla.dev.web-development") }}

+ + + +

Ferramentas

+ + + +

Veja todas...

+ +

Tópicos relacionados

+ +
+
CSS, DHTML, HTML, Desenvolvimento da Web, XHTML, XML
+
+
+ +
+

 O Projeto de Normas da Web

+ +
+ + + +
diff --git a/files/pt-pt/archive/plugins/out_of_process_plugins/o_detetor_plugin_hang_detector/index.html b/files/pt-pt/archive/plugins/out_of_process_plugins/o_detetor_plugin_hang_detector/index.html new file mode 100644 index 0000000000..c02e3fa0c1 --- /dev/null +++ b/files/pt-pt/archive/plugins/out_of_process_plugins/o_detetor_plugin_hang_detector/index.html @@ -0,0 +1,46 @@ +--- +title: O detetor de falhas de plug-ins +slug: Archive/Plugins/Out_of_process_plugins/O_detetor_plugin_hang_detector +tags: + - Extras + - Plug-ins + - Plugins +translation_of: Archive/Plugins/Out_of_process_plugins/The_plugin_hang_detector +--- +

Para ajudar a proteger os utilizadores contra plug-ins e scripts de plug-ins que deixam de responder, o Firefox agora inclui um "detector de falhas", que vigia os plug-ins que deixam de funcionar.

+ +

Como é que este funciona

+ +

When Firefox makes an NPAPI call to a plugin which is running in its own process, the NPAPI call is translated into an inter-process communication (IPC) request that is posted to the process. Firefox then waits for the response. If a response is not received within a given amount of time (by default, this is 45 seconds), the plugin is assumed to have locked up, and Firefox terminates the plugin by following these steps:

+ +
    +
  1. The plugin's process is stopped and a plugin-process "crash" mini-dump is retrieved.
    2. +
  2. A "crash" mini-dump is collected from the main browser process.
    3. +
  3. The plugin's process is terminated.
    4. +
  4. The crashed plugin user interface is displayed; this interface lets the user choose to reload the page and try again.
    5. +
+ +

O que ativa o detetor de falhas

+ +

There are several possible situations that can trigger the hang detector:

+ + + +

O que acontece com o relatório de falhas?

+ +

When the hang detector catches a problem, it gathers up the mini-dumps and submits the data to crash-stats, providing handy debugging information to developers so that the problem can be categorized and, if possible, corrected. The advanced query page makes it possible to differentiate between crash reports and hang reports, and lets search results be limited to either the browser process or the plugin process. In addition, the browser hang report and the corresponding plugin hang report are automatically cross-linked for you.

+ +

E se eu não quiser terminar a falha de plug-ins?

+ +

Sometimes developers may want to prevent hung plugins from being terminated; this could be useful, for example, while debugging script code in Flash or if you're using a debugger that causes event processing to be delayed (such as the Flash debugger).

+ +

You can change the timeout period used by the hang detector by changing the value of the dom.ipc.plugins.timeoutSecs preference. The value of this preference indicates the number of seconds an event response must take before the plugin is considered to be hung.

+ +

Setting this preference to -1 disables the plugin hang detector entirely.

+ +

See about:config on MozillaZine for information on changing preferences like this one.

diff --git "a/files/pt-pt/archive/rss/como_come\303\247ar/como_o_rss_trabalha/index.html" "b/files/pt-pt/archive/rss/como_come\303\247ar/como_o_rss_trabalha/index.html" new file mode 100644 index 0000000000..3473649d08 --- /dev/null +++ "b/files/pt-pt/archive/rss/como_come\303\247ar/como_o_rss_trabalha/index.html" @@ -0,0 +1,18 @@ +--- +title: Como Funciona o RSS +slug: Archive/RSS/Como_começar/Como_o_RSS_trabalha +tags: + - 'RSS:Como_começar' +translation_of: Archive/RSS/Getting_Started/How_RSS_Works +--- +

Esta página explica como funciona o RSS. Ainda não estará pronto para criar os seus próprios ficheiros RSS, mas estará a aprender sobre os diferentes sistemas que fazem parte do RSS syndication.

+ +

Como Funciona o RSS

+ +

São dois, os componentes principais que fazem parte do RSS syndication: o servidor e o cliente final.

+ +

O servidor é a parte do sistema que produz o feed RSS. Um sistema de notícias ou um sistema de blog estaria no lado servidor do RSS syndication. Um rádio por IP estaria no lado servidor do RSS syndication. Uma TV por IP estaria no lado servidor do RSS syndication.

+ +

O cliente é a parte final do RSS syndication que chega ao usuário. O navegador Mozilla Firefox estaria no lado cliente do RSS syndication. Um agregador desktop de RSS estaria no lado cliente do RSS. Um agregador web também estaria no lado cliente do RSS syndication.

+ +

{{ PreviousNext("RSS:Como começar:Porque usar RSS", "RSS:Como começar:Sindicar") }}

diff --git "a/files/pt-pt/archive/rss/como_come\303\247ar/index.html" "b/files/pt-pt/archive/rss/como_come\303\247ar/index.html" new file mode 100644 index 0000000000..547a924f4d --- /dev/null +++ "b/files/pt-pt/archive/rss/como_come\303\247ar/index.html" @@ -0,0 +1,57 @@ +--- +title: Como começar +slug: Archive/RSS/Como_começar +tags: + - PrecisaDeRevisãoEditorial + - RSS + - 'RSS:Como_começar' +translation_of: Archive/RSS/Getting_Started +--- +

 

+

Introdução

+

Este tutorial é uma introdução à Really Simple Syndication (RSS).

+

Isto guia-o, passo-a-passo, através do básico do RSS e mostra você trabalhando exemplos em ação. Este tutorial segue o mantra que + + o melhor caminho para aprender é fazer + . Por isso, você deverá criar seus próprios arquivos RSS à mão.

+

Quem deve usar este tutorial?

+

Este tutorial é na maior parte para iniciantes em RSS (i.e., com nenhum ou muito pouca experiência prévia em RSS). Entretanto, estes experimentos com RSS podem também achar este útil como uma ajuda no prenchimento de qualquer informação perdida sobre RSS que não estavam cientes sobre, ou como um guia para "refrescar".

+

Este tutorial assume que você tem alguma experiência com HTML (ou XML) e que você está confortável com os básicos da + + marcação + . Em outras palavras, um código como este não atrapalha você:

+
   Isto é um pouco de marcação com tags <b>bold</b>.
+
+

Se você está confortável com isto, você não deve ter problemas aprendendo RSS.

+
+

NOTA: Se você NÃO é um desenvolvedor web e NÃO que se tornara um, então este tutorial NÃO é para você. Você precisa estar confortável com a criação + + marcação + para estar apto para usar este tutorial efetivamente.

+
+

O que você necessita antes de começar?

+

Para pegar o máximo deste tutorial, você precisará de um editor de texto e um leitor RSS. Você precisa também saber como usar cada um destes.

+
+

NOTA: Um processador de palavras não é um editor de texto. Se um processador de palavras é usado, você DEVE ter certeza de salvar seus arquivos RSS em um (puro e simples) formato de texto.

+
+

Não é obrigatória a criação de arquivos RSS neste tutorial (você pode somente ler), mas isto seria um meio menos eficiente para você aprender. Você reterá mais informação e absorverá melhor se você criar os seus próprios arquivos RSS.

+

Como usar este tutorial

+

Embora cada página neste tutorial tenha sido escrita de modo que que possa agir como um tutorial + + sozinho + , isto assume que você já possuí o conhecimento da informação ensinada nas páginas anteriores deste tutorial. Embora você possa pular para qualquer ponto do tutorial que você deseje, nós sugerimos aos iniciantes em RSS que leiam este tutorial na ordem.

+

Tutorial

+
    +
  1. O que é RSS
    2. +
  2. Porque usar RSS
    3. +
  3. Como o RSS trabalha
    4. +
  4. Hello World (artigo ainda não escrito) link removido porque muitas pessoas colocam seus hello word nele
    5. +
  5. Sindicar
    6. +
  6. Blogs
    7. +
  7. Broadcatching
    8. +
  8. Microformatos
    9. +
  9. Advanced Broadcatching
    10. +
+

Categorias

+

Interwiki Language Links

+

{{ languages( { "en": "en/RSS/Getting_Started", "es": "es/RSS/Primeros_pasos", "fr": "fr/RSS/Premiers_pas", "pl": "pl/RSS/Na_pocz\u0105tek" } ) }}

diff --git "a/files/pt-pt/archive/rss/como_come\303\247ar/o_que_\303\251_rss/index.html" "b/files/pt-pt/archive/rss/como_come\303\247ar/o_que_\303\251_rss/index.html" new file mode 100644 index 0000000000..dceb21a856 --- /dev/null +++ "b/files/pt-pt/archive/rss/como_come\303\247ar/o_que_\303\251_rss/index.html" @@ -0,0 +1,242 @@ +--- +title: O que é RSS +slug: Archive/RSS/Como_começar/O_que_é_RSS +tags: + - 'RSS:Como_começar' +translation_of: Archive/RSS/Getting_Started/What_is_RSS +--- +

Esta página explica o que é o RSS. Você ainda não criará seus próprios arquivos RSS, mas você verá como o RSS é comumente usado e exemplos simples de arquivos RSS para uso comum. Você também acompanhará um pouco da história do RSS.

+ +

O que é RSS?

+ +

As versões de RSS mais populares são as baseadas na linguagem de marcação XML usada para publicação (syndication). (Apesar dos formatos RSS baseados em RDF existirem. Os antigos RSS 0.90 e RSS 1.0.) Os usos mais comuns do RSS syndication são para publicações de web sites de notícias, blogs, rádio de Internet e programação televisiva para Internet.

+ +

Este tutorial ensina o RSS 2.0. Mas se esforça em apontar as diferenças com as outras versões de RSS.

+ +

O RSS é praticamente nunca escrito à mão, mas quase sempre criado por softwares de servidores (normalmente escritos em uma linguagem como PHP, Java, C# ou Python) nos servidores web. Contudo, para que possamos aprender sobre o RSS nós criaremos os scripts RSS à mão.

+ +

Uma breve história do RSS

+ +

Em março de 1999 a Netscape lançou o RSS 0.90. Era muito diferente do RSS de hoje. Não era realmente um formato para publicação, mas um formato que fornecia um sumário de um website. Na verdade, naquele tempo, o RSS não atendia por Really Simple Syndication mas por Rich Site Summary.

+ +

Em julho de 1999 o RSS 0.91 da Netscape foi lançado. Como o RSS 0.90, o RSS 0.91 da Netscape também era de um formato para fornecimento de um sumário de um website e não realmente um formato de publicação (como é hoje). O RSS 0.91 da Netscape foi criado para simplificar as coisas. O RSS 0.90 era baseado em RDF. (O que muitos acharam ser excessivamente complexo). Já o RSS 0.91 da Netscape era apenas baseado em XML e acrescentou um DTD para permitir diversas entities (comumente encontradas em HTML).

+ +

E nesse ponto a Netscape tornou o RSS 0.90 baseado em RDF obsoleto e disse a todos que usassem o RSS 0.91 da Netscape que era baseado no XML.

+ +

Em junho de 2000 o RSS 0.91 da Userland foi lançado. (E, sim, isso significa que havia 2 diferentes versões de RSS 0.91). A diferença entre as 2 diferentes versões de RSS 0.91 — da Netscape e da Userland — é que a da Userland não possuia o DTD que o Netscape trazia; e por isso, não possuía os entities extras que o Netscape tinha (comumente encontradas em HTML). Fora isso entretanto, eram a mesma coisa. Tecnicamente falando, o RSS 0.91 da Userland era um subset do RSS 0.91 da Netscape.

+ +

Em dezembro de 2000 o grupo RSS-DEV lançou o RSS 1.0. Essa versão não era mais puramente baseado em XML, mas baseado em RDF (como o original, e agora obsoleto RSS 0.90). O grupo RSS-DEV mudou o significado de RSS, e transformou-o em RDF Site Summary. (Ao menos, era assim que atendia a versão do RSS deles.)

+ +

Então aqui tínhamos o RSS 0.91 da Netscape, o RSS 0.91 da Userland, e o RSS 1.0 do grupo RSS-DEV.

+ +

Mais tarde, ainda em dezembro, a Userland lançou o RSS 0.92. O RSS 0.92 deveria substituir o RSS 0.91 deles. (Se você perceber, entretanto, os números das versões dos RSS ficaram bagunçados neste ponto, pois o RSS 0.92 era mais novo que o RSS 1.0.)

+ +

E aqui tínhamos o RSS 0.91 da Netscape, o RSS 1.0 do grupo RSS-DEV, e o RSS 0.92 da Userland.

+ +

Em abril de 2001 a Userland lançou um beta para o RSS 0.93. Essa versão do RSS nunca foi transformado em "final" e permaneceu beta nunca tornando-se um substituto para o RSS 0.92.

+ +

Em agosto de 2002 a Userland lançou o beta do RSS 0.94. E assim como o RSS 0.93, essa versão nunca foi feita "final" e permaneceu beta, nunca tornando-se um substituto para o RSS  RSS 0.92.

+ +

Então, aqui ainda tínhamos o RSS 0.91 da Netscape, o RSS 1.0 do grupo RSS-DEV, e o RSS 0.92 da Userland. (Apesar de alguns estarem usando RSS 0.93 e RSS 0.94 mesmo que não devessem.)

+ +

Em setembro de 2002 a Userland lança o RSS 2.0. O RSS 2.0 deveria substituir o RSS 0.92 (e os betas RSS 0.93 e RSS 0.94 que ninguém deveria estar usando). A Userland pulou esses números de versão até o 2.0 porque o RSS-DEV já havia usado o 1.0 em seu RSS 1.0 baseado em RDF.

+ +

Neste ponto tínhamos o RSS 0.91 da Netscape, o RSS 1.0 do grupo RSS-DEV e o RSS 2.0 da Userland.

+ +

Agora, a história não acaba simplesmente lá. Uma vez em novembro de 2002 e outra em janeiro de 2003, o RSS 2.0 foi modificado de sua especificação original pela Userland. E apesar desses serem diferentes, foram todos chamados de RSS 2.0 no elemento <rss>.

+ +

E aqui, nesse ponto, nós ainda temos o RSS 0.91 da Netscape (uma vez que a Netscape nunca o tornou obsoleto) apesar da maioria das pessoas não usarem mais. Elas usavam tanto o RSS 1.0 baseado no RDF como o RSS 2.0 baseado no XML. Com o RSS 2.0 baseado no XML parecendo ser o mais popular. (Esse tutorial usa o RSS 2.0.)

+ +

Como o RSS é utilizado hoje

+ +

Hoje, o RSS é principalmente usado para publicação (syndication). Syndication é o processo de dizer aos outros que você tem conteúdo para eles consumirem. Em outras palavras, quando você publica (syndicate), você está dizendo a todos algo como: "Ei pessoal, eu tenho artigos que gostaria que todos viessem e lessem. Basta se inscrever ao meu RSS feed e você poderá acessar os mais recentes todas as vezes."

+ +
+

NOTA: Se você fornecer um RSS não protegido por password, você estará implicitamente dando a todos permissão para usar o conteúdo em seu RSS feed em todos os meios que eles verem que se encaixa. Eles podem ler. Eles podem fazer uma cópia local. Podem compartilhar essa cópia local. Podem pôr em seus websites. Podem até mesmo republicar. E mais.

+ +

Se você não quer que nada disso aconteça então não ponha um RSS feed não protegido por password. (E não torne o password público, claro.)

+
+ +

Os websites de notícias usam RSS para fornecer a todos uma lista de seus mais recentes artigos. Por exemplo:

+ +
        <?xml version="1.0"?>
+
+      <rss version="2.0">
+
+               <channel>
+             <title>Example News Site</title>
+             <description>This is an Example News Site.</description>
+             <lastBuildDate>Wed, 27 Jul 2005 00:30:30 -0700</lastBuildDate>
+             <link>http://news.example.com/</link>
+
+              <item>
+                 <title>News Flash: I Like Bread</title>
+                 <guid isPermaLink="false">4d4a0a12-f188-4c97-908b-eea27213c2fe</guid>
+                 <pubDate>Wed, 27 Jul 2005 00:30:30 -0700</pubDate>
+                 <link>http://news.example.com/artcle/554</link>
+              </item>
+              <item>
+                 <title>Big News Today: Birds Fly</title>
+                 <guid isPermaLink="false">c4a63f09-b45b-466b-8773-6ff264001ab7</guid>
+                 <pubDate>Tue, 19 Jul 2005 04:32:51 -0700</pubDate>
+                 <link>http://news.example.com/artcle/553</link>
+              </item>
+              <item>
+                 <title>Fire is Hot</title>
+                 <guid isPermaLink="false">c1795324-d5ea-44fa-95b1-b5ce2090d4f1</guid>
+                 <pubDate>Sun, 15 May 2005 13:02:08 -0700</pubDate>
+                 <link>http://news.example.com/artcle/552</link>
+              </item>
+              </channel>
+
+      </rss>
+ +

Os blogs usam o RSS para fornecer a todos uma lista de seus posts mais novos. Por exemplo:

+ +
        <?xml version="1.0"?>
+
+      <rss version="2.0">
+
+              <channel>
+             <title>Joe Blow's Blog</title>
+             <description>This is the Weblog of Joe Blow</description>
+             <lastBuildDate>Sun, 15 May 2005 13:02:08 -0500</lastBuildDate>
+             <link>http://joe-blow.example.net/</link>
+
+              <item>
+                 <title>I Be Blogging...</title>
+                 <guid>http://joe-blow.example.net/log/21</guid>
+                 <pubDate>Sun, 15 May 2005 13:02:08 -0500</pubDate>
+                 <link>http://joe-blow.example.net/log/21</link>
+             </item>
+             <item>
+                 <title>I am so SMRT</title>
+                 <guid>http://joe-blow.example.net/log/20</guid>
+                 <pubDate>Sat, 14 May 2005 22:19:18 -0500</pubDate>
+                 <link>http://joe-blow.example.net/log/20</link>
+             </item>
+             <item>
+                 <title>Huh?</title>
+                 <guid>http://joe-blow.example.net/log/19</guid>
+                 <pubDate>Sat, 14 May 2005 09:55:59 -0500</pubDate>
+                 <link>http://joe-blow.example.net/log/19</link>
+             </item>
+             <item>
+                 <title>Black Cat Spotted</title>
+                 <guid>http://joe-blow.example.net/log/18</guid>
+                 <pubDate>Fri, 13 May 2005 13:13:13 -0500</pubDate>
+                 <link>http://joe-blow.example.net/log/18</link>
+             </item>
+         </channel>
+
+          </rss> 
+
+ +

Aqueles que criam Internet Rádio usam o RSS para permitir aos usuários ouvirem seus shows (broadcatching). Por exemplo:

+ +
        <?xml version="1.0"?>
+
+      <rss version="2.0">
+
+              <channel>
+             <title>Joe's IPradio Show</title>
+             <description>The best IPradio Show on the Internet, staring Joe!</description>
+             <lastBuildDate>Mon, 15 Aug 2005 16:12:37 -0400</lastBuildDate>
+             <link>http://joe.ipradio.example.net/</link>
+
+              <item>
+                 <title>I C UR Tan Line</title>
+                 <guid>http://joe.ipradio.example.net/show/55</guid>
+                 <pubDate>Mon, 15 Aug 2005 16:11:57 -0400</pubDate>
+                 <enclosure url="http://joe.ipradio.example.net/show/55"
+                            length="4487216"
+                            type="application/ogg"
+                 />
+             </item>
+             <item>
+                 <title>Car Care for Car Fanatics</title>
+                 <guid>http://joe.ipradio.example.net/show/54</guid>
+                 <pubDate>Mon, 8 Aug 2005 13:12:12 -0400</pubDate>
+                 <enclosure url="http://joe.ipradio.example.net/show/54"
+                            length="4892178"
+                            type="audio/x-mp3"
+                 />
+             </item>
+             <item>
+                 <title>Best Beaches in BC</title>
+                 <guid>http://joe.ipradio.example.net/show/53</guid>
+                 <pubDate>Mon, 1 Aug 2005 18:22:14 -0400</pubDate>
+                 <enclosure url="http://joe.ipradio.example.net/show/53"
+                            length="3984215"
+                            type="application/ogg"
+                 />
+             </item>
+         </channel>
+
+          </rss>     
+
+ +
+

NOTA: Ouvir um Broadcatching de um Internet Rádio é também chamado de Podcasting, IPradio, e Audio Blogging.

+
+ +

Aqueles que criam programas televisivos para Internet usam o RSS para permitir aos usuários transmitir seus shows (broadcatch). Por exemplo:

+ +
        <?xml version="1.0"?>
+
+      <rss version="2.0">
+
+              <channel>
+             <title>Kate's IPTV Show</title>
+             <description>Watch it or else!  You know you want to.</description>
+             <lastBuildDate>Tue, 23 Aug 2005 21:02:05 -0800</lastBuildDate>
+             <link>http://katetv.example.com/</link>
+
+              <item>
+                 <title>This is Fun</title>
+                 <guid>http://katetv.example.com/show/4</guid>
+                 <pubDate>Tue, 23 Aug 2005 21:02:05 -0800</pubDate>
+                 <enclosure url="http://katetv.example.com/show/4"
+                            length="1911146"
+                            type="application/ogg"
+                 />
+             </item>
+             <item>
+                 <title>Watch This</title>
+                 <guid>http://katetv.example.com/show/3</guid>
+                 <pubDate>Tue, 16 Aug 2005 16:11:57 -0400</pubDate>
+                 <enclosure url="http://katetv.example.com/show/3"
+                            length="1387442"
+                            type="application/ogg"
+                 />
+             </item>
+             <item>
+                 <title>It is me again</title>
+                 <guid>http://katetv.example.com/show/2</guid>
+                 <pubDate>Tue, 9 Aug 2005 13:12:12 -0400</pubDate>
+                 <enclosure url="http://katetv.example.com/show/2"
+                            length="1894877"
+                            type="video/mpeg"
+                 />
+             </item>
+             <item>
+                 <title>Hello</title>
+                 <guid>http://katetv.example.com/show/1</guid>
+                 <pubDate>Tue, 2 Aug 2005 18:22:14 -0400</pubDate>
+                 <enclosure url="http://katetv.example.com/show/1"
+                            length="17442215"
+                            type="application/ogg"
+                 />
+             </item>
+         </channel>
+
+          </rss>     
+
+ +

O leitor observador deve ter percebido que os exemplos dos websites de notícias e dos blogs eram do mesmo tipo de RSS. Também que os exemplos de Internet Rádio e dos programas de TV para Internet eram do mesmo tipo de RSS. Na verdade, a única diferença real entre os RSS de notícias/blogs e de Internet Rádio/TV para Internet é que os RSS de notícias/blogs usam o elemento <link> e os Internet Rádio/Internet TV usam o elemento <enclosure>.

+ +
+

NOTA: Esses exemplos de RSS são muito, muito simples. E foram desenhados para dar a você uma idéia de como o RSS se parece basicamente. Todos esses exemplos de RSS são bem mínimos. Quando você criar seus próprios RSS feeds, você provavelmente irá querer fazê-los mais complexos que esses e incluir elementos RSS adicionais fazendo uso dos vários Módulos de RSS.

+
+ +

{{Next("RSS:Como começar:Porque usar RSS")}}

diff --git "a/files/pt-pt/archive/rss/como_come\303\247ar/porque_usar_rss/index.html" "b/files/pt-pt/archive/rss/como_come\303\247ar/porque_usar_rss/index.html" new file mode 100644 index 0000000000..904ce6ee43 --- /dev/null +++ "b/files/pt-pt/archive/rss/como_come\303\247ar/porque_usar_rss/index.html" @@ -0,0 +1,22 @@ +--- +title: Porque usar RSS +slug: Archive/RSS/Como_começar/Porque_usar_RSS +tags: + - 'RSS:Como_começar' +translation_of: Archive/RSS/Getting_Started/Why_use_RSS +--- +

Esta página explica por quê você pode querer usar o RSS. Você ainda não criará seus próprios arquivos RSS, mas aprenderá sobre as razões de usá-lo.

+ +

Por que usar RSS?

+ +

Se você está lendo isso, provavelmente já tem seus próprios motivos para querer usar o RSS. Existem, na verdade, diversas razões para usar RSS. Mas os 2 maiores motivos podem ser amplamente declaradas dizendo: #1 (obviamente apenas use se) atende a suas necessidades e #2 possui uma grande quantidade de movimentação — todos estão usando.

+ +

O RSS possui uma imensa quantidade de movimentação. As pessoas estão usando para publicar todo tipo de coisas. Artigos de notícias, blogs, bookmards, shows de Internet Rádio, shows de TV para Internet, atualizações de software, e-mails, mailing lists, music playlists, e mais. Se é esporádico, pode ser publicado com RSS.

+ +

Software que lê e pode fazer uso do RSS também está por todos os lugares. O Mozilla Firefox possui algum suporte ao RSS (com sua tecnologia Live Bookmark). Existem muitos agregadores de RSS de desktop afora para listá-los. E agregadores RSS web-based demais para listar. Além disso, software customizado também está fazendo uso do RSS.

+ +

Agregadores RSS estão em todos os lugares

+ +

Um motivo para usar o RSS para publicar é porque existem enormes quantidades de agregadores RSS web-based para desktop. (Demais para listar) E se você publicar usando RSS então todos aqueles desktops e agregadores RSS web-based serão capazes de usar e ler seu RSS feed.

+ +

{{ PreviousNext("RSS:Como começar:O que é RSS", "RSS:Como começar:Como o RSS trabalha") }}

diff --git "a/files/pt-pt/archive/rss/como_come\303\247ar/sindicar/index.html" "b/files/pt-pt/archive/rss/como_come\303\247ar/sindicar/index.html" new file mode 100644 index 0000000000..60cf684500 --- /dev/null +++ "b/files/pt-pt/archive/rss/como_come\303\247ar/sindicar/index.html" @@ -0,0 +1,99 @@ +--- +title: Sindicar +slug: Archive/RSS/Como_começar/Sindicar +tags: + - PrecisaDeRevisãoEditorial + - 'RSS:Como_começar' +translation_of: Archive/RSS/Getting_Started/Syndicating +--- +

Esta página explica a Web Syndication, ou Publicação Web, com o RSS. Você aprenderá como fazer isso para que ambas — pessoas e máquinas — possam encontrar seu RSS feed, ou alimentador de RSS.

+ +

O que é Syndication (Publicação)

+ +

Syndication (ou Web Syndication) é o ato de tornar um conteúdo disponível para outros lerem, ouvirem ou assistirem. Quando você cria um blog, um rádio de Internet ou um programa televisivo para Internet, você está publicando (syndicating).

+ +

O RSS ajuda você a publicar. Ele organiza sua publicação em um formato fácil para as máquinas entenderem.

+ +

Publicar com RSS pode significar 3 coisas:

+ +
    +
  1. Criar um RSS feed (também conhecido por alimentador de RSS).
    2. +
  2. Adicionar um elemento especial <link> à(s) página(s) HTML.
    3. +
  3. Adicionar um elemento especial <a> à(s) página(s) HTML.
    4. +
+ +

Nós já falamos sobre o item 1 — Criar um RSS feed — então nos focaremos nos itens 2 e 3 aqui.

+ +

Adicionando o <link>

+ +

Freqüentemente o dado em um RSS feed é também disponibilizado em uma página web HTML. Quando este é o caso, a página web HTML pode avisar pessoas e máquinas sobre o feed com um código como o seguinte:

+ +
<link rel="alternate" type="application/rss+xml" href="http://exemplo.com/feed" />
+
+ +

Muitas vezes as pessoas querem anunciar o RSS feed em outros lugares também. Por exemplo, em um artigo de blog. Você pode fazer isso com um código como o seguinte:

+ +
<link rel="home" type="application/rss+xml" href="http://exemplo.com/feed" />
+
+ +

Note que este parece quase exatamente a mesma coisa do código anterior. A única coisa modificada foi o valor do atributo rel. (O código anterior teve um rel de valor alternate. E este código teve um rel de valor home.)

+ +
+

NOTA: Tem havido muito abuso no uso do elemento <link> para publicação com RSS. Alguns bloggers o têm usado para que outros se inscrevam em seus blogs de qualquer página do blog (e não apenas da home page). O que resultou na adição de vários <link> com rel="alternate" por todos os lugares. (Nas entradas de blogs também e não apenas nas home page.) Isso é errado! Usar rel="alternate" neste caso é errado. Deve ser usado o rel="home". (Veja Understanding rel and rev para mais informações.) A parte importante quando se usa o <link> para publicar seu RSS feed é pôr o type="application/rss+xml".

+
+ +

Adicionando o <a>

+ +

Embora o uso do elemento HTML <link> seja poderoso; ele é na maioria das vezes escondido. Para anunciar o RSS feed de um modo mais direto, o elemento HTML <a> pode ser utilizado. Fazendo isso pode-se conseguir o mesmo resultado do elemento <link> discutido acima.

+ +

Quando puser um link de uma página web HTML onde os dados em um RSS feed também são disponibilizados use:

+ +
<a rel="alternate" type="application/rss+xml" href="http://exemplo.com/feed">...</a>
+
+ +

Quando puser um link de alguma coisa como um artigo de post de um blog, use o seguinte código:

+ +
<a rel="home" type="application/rss+xml" href="http://example.com/feed">...</a>
+
+ +

Mais uma vez, note que esses dois trechos de código parecem quase exatamente os mesmos. A única coisa modificada foi o valor do atributo rel. (O primeiro trecho de código tem um rel de valor alternate e o segundo trecho tem um rel de valor home.)

+ +

Ícones de Feed

+ +

RSS (e outros) feeds utilizam um ícone especial. É recomendado que use este ícone quando criar um link especial <a> para seu alimentador. O ícone parece como este:

+ +
+
Feed-icon-32x32.png
+
+ +

Você pode conseguir mais ícones como este do Feed Icons. (Outros tamanhos e cores também estão disponíveis. Arquivos fontes também estão disponíveis.)

+ +

Técnicas Avançadas de Publicação (Syndication)

+ +

Embora esta técnica de publicação não seja necessária, é recomendado seu suporte; especialmente para web sites e aplicações que necessitam de alta performance.

+ +

O protocolo HTTP — uma das tecnologias núcleo por trás da web — provê uma forma de priorizar o tipo de conteúdo que um cliente HTTP prefere para receber. Esta técnica toma vantagem disso fazendo com que os clientes prefer o RSS (acima do HTML ou outros formatos). Aqui está um exemplo simples de como é feito:

+ +
Accept: application/rss+xml, text/html
+
+ +

Apesar de na realidade, na produção de software, se pareça mais com isso.

+ +
Accept: application/rss+xml, application/xhtml+xml, text/html
+
+ +

Eis um exemplo mais completo:

+ +
GET / HTTP/1.1
+Host: example.com
+Accept: application/rss+xml, application/xhtml+xml, text/html
+
+ +

Quando um servidor HTTP (ou scripts de servidores) pega isso, ele deve redirecionar para o cliente HTTP do feed. Ele deve fazer isso com um HTTP 302 Found. Algo como:

+ +
HTTP/1.1 302 Found
+Location: http://exemplo.com/feed
+
+ +


+ {{ PreviousNext("RSS:Como começar:Como o RSS trabalha", "RSS:Como começar:Blogs") }}

diff --git a/files/pt-pt/archive/rss/index.html b/files/pt-pt/archive/rss/index.html new file mode 100644 index 0000000000..49eda2566c --- /dev/null +++ b/files/pt-pt/archive/rss/index.html @@ -0,0 +1,47 @@ +--- +title: RSS +slug: Archive/RSS +tags: + - RSS +translation_of: Archive/RSS +--- +
Como começar +

Um tutorial introdutório ao RSS

+
+ +
+

O Really Simple Syndication é um formato de dados baseado no XML que permite distribuir conteúdos simples.

+
+ + + + + + + + +
+

Documentação

+ +

Veja todos...

+ 		+

Comunidade

+ +

{{ DiscussionList("dev-tech-xml", "mozilla.dev.tech.xml") }}

+ + + +

Tópicos relacionados

+ +
+
Atom, RDF, XML
+
+ +

Categorias

+ +

Interwiki Language Links

+ +

 

+
diff --git "a/files/pt-pt/archive/rss/vers\303\243o/0.90/index.html" "b/files/pt-pt/archive/rss/vers\303\243o/0.90/index.html" new file mode 100644 index 0000000000..7001b622b7 --- /dev/null +++ "b/files/pt-pt/archive/rss/vers\303\243o/0.90/index.html" @@ -0,0 +1,79 @@ +--- +title: RSS/Versão/0.90 +slug: Archive/RSS/Versão/0.90 +translation_of: Archive/RSS/Version/0.90 +--- +

 

+

{{ Deprecated_header() }}

+

RSS 0.90

+

O RSS 0.90 é a versão mais antiga conhecida de RSS lançado ao público, e substituído pela Netscape RSS 0.91 (Revisão 1). Criado pela Netscape para ser um formato metadata provendo um sumário de um web site. (E não apenas um formato de publicação como é atualmente.)

+

O RSS 0.90 é um formato baseado no RDF.

+

Quando ele foi criado, o significado inicial do RSS era Rich Site Summary e não Really Simple Syndication. (Veja RSS - O que há em um nome para mais informações sobre o histórico do nome do RSS.))

+
+

NOTA: O RSS 0.90 teve seu uso desaprovado. Produtores de RSS NÃO DEVEM criar RSS 0.90 feeds, e DEVEM ao invés usar um novo e não-desaprovado formato RSS. (Veja a Lista de Versões de RSS para uma lista de formatos não-desaprovados.) Contudo, consumidores de RSS ainda DEVEM ser capazes de aceitar os RSS 0.90 feeds.

+
+

 

+

Exemplos

+

RSS 0.90 parece com algo assim:

+
+    <?xml version="1.0"?>
+
+    <rdf:RDF
+       xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+       xmlns="http://my.netscape.com/rdf/simple/0.9/"
+    >
+
+        <channel>
+            <title>Mozilla Dot Org</title>
+            <link>http://www.mozilla.org</link>
+            <description>the Mozilla Organization web site</description>
+        </channel>
+
+        <image>
+            <title>Mozilla</title>
+            <url>http://www.mozilla.org/images/moz.gif</url>
+            <link>http://www.mozilla.org</link>
+        </image>
+
+        <item>
+            <title>New Status Updates</title>
+            <link>http://www.mozilla.org/status/</link>
+        </item>
+
+        <item>
+            <title>Bugzilla Reorganized</title>
+            <link>http://www.mozilla.org/bugs/</link>
+        </item>
+
+        <item>
+            <title>Mozilla Party, 2.0!</title>
+            <link>http://www.mozilla.org/party/1999/</link>
+        </item>
+
+        <item>
+            <title>Unix Platform Parity</title>
+            <link>http://www.mozilla.org/build/unix.html</link>
+        </item>
+
+        <item>
+            <title>NPL 1.0M published</title>
+            <link>http://www.mozilla.org/NPL/NPL-1.0M.html</link>
+        </item>
+
+    </rdf:RDF>
+    
+
+

Note que aqui o RSS está sendo usado para listar seções de um web site ao invés de publicação (syndication).

+

 

+

Especificação

+

A especificação original do RSS 0.90 desapareceu de sua localização original:

+
+
+ http://my.netscape.com/publish/help/quickstart.html
+
+

Cópias dele foram salvas e podem ser vistas nas seguintes localizações:

+ +

{{ languages( { "ja": "ja/RSS/Version/0.90", "pl": "pl/RSS/Wersje/0.90" } ) }}

diff --git "a/files/pt-pt/archive/rss/vers\303\243o/index.html" "b/files/pt-pt/archive/rss/vers\303\243o/index.html" new file mode 100644 index 0000000000..f034387784 --- /dev/null +++ "b/files/pt-pt/archive/rss/vers\303\243o/index.html" @@ -0,0 +1,107 @@ +--- +title: Versão +slug: Archive/RSS/Versão +translation_of: Archive/RSS/Version +--- +

Versões de RSS

+

RSS tem uma história sórdida. Diferentes pessoas e grupos criaram especificações amplamente unilaterais que denominaram RSS. Alguns formatos RSS eram baseados em XML e outros baseados em RDF.

+

A lista abaixo é de todas as versões de RSS conhecidas. Eles estão listados em ordem cronológica de quando foram lançados.

+
+

NOTA: Na lista abaixo, apesar do RSS 1.0 parecer estar fora de lugar está na verdade no lugar cronologicamente correto

+
+
+

NOTA: Existem 3 diferentes versões de RSS 0.91. O RSS 0.91 da Netscape (Revisão 1), o RSS 0.91 da Netscape (Revisão 3) e o RSS 0.91 da Userland.

+
+
+

NOTA: O RSS 0.93 e o RSS 0.94 foram lançados apenas como beta e nunca se tornaram versões finais e por isso não eram para ter sido utilizados.

+
+

 

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameStatusRelease DateBased OnAuthor
RSS 0.90{{ Deprecated_inline() }}Março 1999RDFNetscape
Netscape RSS 0.91 (Revisão 1){{ Deprecated_inline() }}?XMLNetscape
Netscape RSS 0.91 (Revisão 3){{ Obsolete_inline() }}Julho 10, 1999XMLNetscape
Userland's RSS 0.91{{ Deprecated_inline() }}Junho 4, 2000XMLUserland
RSS 1.0PadrãoDezembro 9, 2000RDFgrupo RSS-DEV
RSS 0.92{{ Deprecated_inline() }}Dezembro 25, 2000XMLUserland
RSS 0.93{{ Deprecated_inline() }}Abril 20, 2001XMLUserland
RSS 0.94{{ Deprecated_inline() }}Agosto 19, 2002XMLUserland
RSS 2.0{{ Deprecated_inline() }}Setembro 2002XMLUserland
RSS 2.0 (post 2002-11-11){{ Deprecated_inline() }}Novembro 11, 2002XMLUserland
RSS 2.0 (post 2003-01-21)PadrãoJaneiro 21, 2003XMLUserland
+

{{ languages( { "es": "es/RSS/Versiones", "fr": "fr/RSS/Version", "ja": "ja/RSS/Version", "pl": "pl/RSS/Wersje" } ) }}

diff --git a/files/pt-pt/archive/themes/index.html b/files/pt-pt/archive/themes/index.html new file mode 100644 index 0000000000..aff151946d --- /dev/null +++ b/files/pt-pt/archive/themes/index.html @@ -0,0 +1,11 @@ +--- +title: Themes +slug: Archive/Themes +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Themes +--- +

Archived theme documentation.

+ +

diff --git a/files/pt-pt/archive/utilizar_normas_web_nas_suas_paginas_da_web/index.html b/files/pt-pt/archive/utilizar_normas_web_nas_suas_paginas_da_web/index.html new file mode 100644 index 0000000000..61629f890d --- /dev/null +++ b/files/pt-pt/archive/utilizar_normas_web_nas_suas_paginas_da_web/index.html @@ -0,0 +1,123 @@ +--- +title: Utilizar as Normas da Web nas suas Páginas da Web +slug: Archive/Utilizar_Normas_Web_nas_suas_Paginas_da_Web +tags: + - Desenvolvimento da Web + - Normas da Web + - Padrões da Web +translation_of: Archive/Using_Web_Standards_in_your_Web_Pages +--- +

 

+ +
"Browser makers are no longer the problem. The problem lies with designers and developers chained to the browser-quirk-oriented markup of the 1990s-often because they don't realize it is possible to support current standards while accommodating old browsers." +
- Web Standards Project
+
+ +

This article provides an overview of the process for upgrading the content of your web pages to conform to the World Wide Web Consortium (W3C) web standards. The first 2 sections address exclusively validation issues, benefits of validation, deprecated elements, deprecated attributes. How to upgrade a webpage markup code to pass validation and how to implement CSS are addressed by providing recommendations, tutorials and references.

+ +

The other sections address DOM and DHTML coding practices which are at odds with the W3C web standards and suggest replacements. Every proposed W3C web standards replacement in this article is working without a problem in modern browsers like MSIE 7, Firefox 2, Opera 9, Safari 3, Konqueror 3.5+, Icab 4, etc.

+ +

The next-to-last section, Summary of Changes, outlines all the changes described in this article. The last section offers excellent and best references for those wishing to learn more about upgrading techniques presented in this article and more for those wishing to perfect their web pages.

+ +

Conteúdos

+ +
    +
  1. Benefits of using web standards
    2. +
  2. Making your page using web standards - how to
    3. +
  3. Using the W3C DOM
    4. +
  4. Developing Cross Browser and Cross Platform Pages
    5. +
  5. Using XMLHttpRequest
    6. +
  6. Summary of Changes
    7. +
  7. References
    8. +
+ +
+

Informação do Documento Origina

+ + +
+ +

{{ languages( { "ja": "ja/Using_Web_Standards_in_your_Web_Pages", "zh-cn": "cn/\u5728\u60a8\u7684\u7f51\u9875\u4e2d\u5e94\u7528Web\u6807\u51c6" } ) }}

+ +
+ + + + + +
-- cgit v1.2.3-54-g00ecf