diff options
Diffstat (limited to 'files/es/webapi')
| -rw-r--r-- | files/es/webapi/estado_de_bateria/index.html | 39 | ||||
| -rw-r--r-- | files/es/webapi/index.html | 144 | ||||
| -rw-r--r-- | files/es/webapi/pointer_lock/index.html | 284 | ||||
| -rw-r--r-- | files/es/webapi/using_geolocation/index.html | 232 |
4 files changed, 0 insertions, 699 deletions
diff --git a/files/es/webapi/estado_de_bateria/index.html b/files/es/webapi/estado_de_bateria/index.html deleted file mode 100644 index 9cdc7259be..0000000000 --- a/files/es/webapi/estado_de_bateria/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: API de Estado de Bateria -slug: WebAPI/Estado_de_Bateria -tags: - - API - - Apps - - Firefox OS - - Mobile -translation_of: Web/API/Battery_Status_API ---- -<p>La <strong>API de Estado de Batería</strong>, también conocida como "<strong>Battery API</strong>", provee información acerca del sistema de carga de la batería y permite notificar mediante eventos que son enviados cuando el nivel de la batería cambia. Este puede ser usado para ajustar el uso de recursos por parte de una aplicación y evitar un gasto innecesario de energía cuando la batería esta baja o para guardar cambios en un archivo antes de que la batería se agote y así prevenir perdida de información.</p> -<p>La API de Estado de Batería se puede extender mediante {{domxref("window.navigator")}} con una propiedad {{domxref("window.navigator.battery")}} que pertenece al objeto {{domxref("BatteryManager")}} y agrega algunos nuevos eventos que usted puede recibir en el monitor de estado de la batería.</p> -<h2 id="Ejemplo">Ejemplo</h2> -<p>En este ejemplo, observamos los cambios en el estado de la carga (este o no conectado y cargando) y en el nivel de la batería. Esto se hace escuchando el evento {{event("chargingchange")}} y el evento {{event("levelchange")}} respectivamente.</p> -<pre class="brush: js">var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery; - -function updateBatteryStatus() { - console.log("Battery status: " + battery.level * 100 + " %"); - - if (battery.charging) { - console.log("Battery is charging"); - } -} - -battery.addEventListener("chargingchange", updateBatteryStatus); -battery.addEventListener("levelchange", updateBatteryStatus); -updateBatteryStatus(); -</pre> -<p>Vea también: <a class="external" href="http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction">El ejemplo en las especificaciones</a></p> -<h2 id="Especificaciones">Especificaciones</h2> -<p>{{page("/en-US/docs/Web/API/BatteryManager","Specifications")}}</p> -<h2 id="Compatibilidad_del_Navegador">Compatibilidad del Navegador</h2> -<p>{{page("/en-US/docs/Web/API/BatteryManager","Browser_compatibility")}}</p> -<h2 id="Vea_también">Vea también</h2> -<ul> - <li><a class="external" href="http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">Hacks blog post - Usando la API de Batería</a></li> - <li>{{domxref("BatteryManager")}}</li> - <li>{{domxref("window.navigator.battery","navigator.battery")}}</li> -</ul> diff --git a/files/es/webapi/index.html b/files/es/webapi/index.html deleted file mode 100644 index 0c189b625d..0000000000 --- a/files/es/webapi/index.html +++ /dev/null @@ -1,144 +0,0 @@ ---- -title: WebAPI -slug: WebAPI -tags: - - Apps - - DOM - - Firefox OS - - Mobile - - NeedsTranslation - - TopicStub -translation_of: Web/API -translation_of_original: WebAPI ---- -<p><strong>WebAPI</strong> es un termino usado para referirse al conjunto de APIs compatibles y de acceso a los dispositivos que permite a las Web apps y contenido acceder al hardware del dispositivo (como el estado de la batería o la vibración de hardware), al igual que acceso a información almacenada en el dispositivo (como el calendario o la lista de contactos). Agregando estas APIs, esperamos expandir lo que la Web puede hacer hoy y solo plataformas propietarias fueron capaces de hacer en el pasado.</p> - -<div class="note"> -<p><strong>Nota:</strong> More of this documentation has been written than it looks like; links are not all added yet. We're actively working on improving this and expect to see things much better over the next couple of weeks. See the <a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">WebAPI doc status page</a>, where we're tracking work on WebAPI docs.</p> -</div> - -<div class="row topicpage-table"> -<div class="section"> -<h2 class="Documentation" id="Communication_APIs" name="Communication_APIs">APIs DE COMUNICACIÓN</h2> - -<dl> - <dt><a href="/en-US/docs/WebAPI/Network_Information" title="WebAPI/Network_Information">API de información de la red</a></dt> - <dd>Provee información básica sobre la conexión de red actual, como la velocidad de conexión.</dd> -</dl> - -<dl> - <dt><a href="/en-US/docs/WebAPI/WebBluetooth" title="WebAPI/WebBluetooth">Bluetooth</a></dt> - <dd>La API de WebBluetooth provee acceso a bajo nivel al hardware de Bluetooth del dispositivo.</dd> - <dt><a href="/en-US/docs/WebAPI/Mobile_Connection" title="WebAPI/Mobile_Connection">API de conexión móvil</a> {{NonStandardBadge}}</dt> - <dd>Expone información sobre la conectividad celular del dispositivo, como la fuerza de la señal, información del operador y así suscesivamente.</dd> - <dt><a href="/en-US/docs/WebAPI/Network_Stats" title="WebAPI/Network_Stats">API de estadísticas de red</a></dt> - <dd>Monitorea la data usada y expone esta data a aplicaciones privilegiadas.</dd> - <dt><a href="/en-US/docs/WebAPI/TCP_Socket" title="WebAPI/TCP_Socket">TCP Socket API</a></dt> - <dd>Proporciona sockets de bajo nivel y soporte SSL.</dd> - <dt><a href="/en-US/docs/WebAPI/WebTelephony" title="WebAPI/WebTelephony">Telefonía</a> {{NonStandardBadge}}</dt> - <dd>Permite a las apps contestar llamadas telefónicas y usar la interfaz de usuario de telefonía integrada.</dd> - <dt><a href="/en-US/docs/WebAPI/WebSMS" title="WebAPI/WebSMS">WebSMS </a>{{NonStandardBadge}}</dt> - <dd>Permite a las apps enviar y recibir mensajes de texto, así como también acceder y manejar los mensajes almacenados en el dispositivo.</dd> - <dt><a href="/en-US/docs/WebAPI/WiFi_Information" title="WebAPI/WiFi_Information">API de información de WiFi</a></dt> - <dd>API privilegiada, la cual provee información sobre la fuerza de la señal, el nombre de la red actual, redes wifi disponibles, y más.</dd> -</dl> - -<h2 class="Documentation" id="Hardware_access_APIs" name="Hardware_access_APIs">APIS de acceso a Hardware</h2> - -<dl> - <dt><a href="/en-US/docs/WebAPI/Using_Light_Events">API de sensor de luz ambiental</a></dt> - <dd>Provee acceso al sensor de luz ambiental, el cual permite a una app detectar el nivel de luz ambiental proximos al dispositivo.</dd> - <dt><a href="/en-US/docs/WebAPI/Battery_Status" title="WebAPI/Battery_Status">API de estado de batería</a></dt> - <dd>Provee información sobre el nivel de carga de la batería y si el dispositivo se encuentra conectado a un punto de carga o no.</dd> -</dl> - -<dl> - <dt><a href="/en-US/docs/Using_geolocation" title="Using_geolocation">API de Geolocalización</a></dt> - <dd>Provee información sobre la ubicación física del dispositivo.</dd> - <dt><a href="/en-US/docs/WebAPI/Pointer_Lock" title="API/Pointer_Lock_API">API de bloqueo de puntero</a></dt> - <dd>Permite a las apps bloquear acceso al mouse y obtener acceso a los deltas de movimiento en lugar de coordenadas absolutas; esto es ideal para juegos.</dd> -</dl> - -<dl> - <dt><a href="/en-US/docs/WebAPI/Proximity" title="WebAPI/Proximity">API de proximidad</a></dt> - <dd>Permite determinar la proximidad del dispositivo a objetos cercanos, como el rostro del usuario.</dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Detecting_device_orientation" title="WebAPI/Detecting_device_orientation">API de orientación del dispositivo</a></dt> - <dd>Provee notificaciones cuando la orientación del dispositivo cambia.</dd> - <dt><a href="/en-US/docs/Detecting_device_orientation" title="Detecting_device_orientation">API de orientación de pantalla</a></dt> - <dd>Provee notificaciones cuando cambia la orientación de la pantalla. También puedes usar esta API para dejar que su app indique que orientación prefiere.</dd> - <dt><a href="/en-US/docs/WebAPI/Vibration" title="WebAPI/WebBluetooth">API de Vibración</a></dt> - <dd>Permite a las apps controlar la vibración de hardware del dispositivo para cosas como retroalimentación háptica en juegos. Esto <strong>no</strong> es pensado para cosas como vibraciones de notificaciones, para ello revisa la <a href="/en-US/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a>.</dd> -</dl> - -<dl> - <dt><a href="/en-US/docs/WebAPI/Camera" title="WebAPI/Camera">API de Cámara</a> {{NonStandardBadge}}</dt> - <dd>Permite a las apps tomar fotografías y/o grabar videos usaando la cámara integrada del dispositivo.</dd> - <dt><a href="/en-US/docs/WebAPI/Power_Management" title="WebAPI/Power_Management">API de administración de energía </a>{{NonStandardBadge}}</dt> - <dd>Permite a las apps encender o apagar la pantalla, el CPU, la energía del dispositivo, y así sucesivamente. También provee soporte para escuchar e inspeccionar eventos de bloqueo de recursos.</dd> -</dl> - -<p><span class="alllinks"><a href="/en-US/docs/tag/WebAPI" title="tag/CSS">View All...</a></span></p> -</div> - -<div class="section"> -<h2 class="Documentation" id="Data_management_APIs" name="Data_management_APIs">APIs de administración de información</h2> - -<dl> -</dl> - -<dl> - <dt><a href="/en-US/docs/WebAPI/FileHandle_API" title="WebAPI/FileHandle_API">API de identificador de archivos</a></dt> - <dd>Provee soporte para escribir archivos con soporte de bloqueo.</dd> - <dt><a href="/en-US/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt> - <dd>Almacenamiento de información estructurada del lado cliente con soporte para búsquedas de alto rendimiento.</dd> -</dl> - -<h2 class="Documentation" id="Other_APIs" name="Other_APIs">OtrAS APIs</h2> - -<dl> - <dt><a href="/es/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a></dt> - <dd>Permite a las apps programar notificaciones.</dd> - <dd>También proporciona soporte para el lanzamiento de una aplicación de forma automática en un momento determinado.</dd> - <dt><a href="/en-US/docs/Apps" title="Apps">Apps API</a></dt> - <dd>La API de aplicaciones web abiertas permite soporte para instalar y administrar aplicaciones web. Y además, permite a las aplicaciones determinar información de pago.</dd> - <dt><a href="/en-US/docs/DOM/Using_the_Browser_API" title="DOM/Using_the_Browser_API"><strong>API de navegador</strong></a></dt> - <dd>Provee soporte para construir un navegador web usando tecnologías web completamente (en esencia, un navegador dentro de un navegador).</dd> -</dl> - -<dl> - <dt><a href="/en-US/docs/WebAPI/Idle" title="WebAPI/Device_Storage_API">Idle API</a></dt> - <dd>Permite a las apps recibir información cuando el usuario no está usando el dispositivo activamente.</dd> - <dt><a href="/en-US/docs/WebAPI/Permissions" title="WebAPI/Permissions">API de permisos</a></dt> - <dd>Administra permisos de las apps en una ubicación central. Usado por la app de Ajustes.</dd> - <dt><a href="/en-US/docs/WebAPI/Simple_Push" title="WebAPI/Push_Notifications">Simple Push API</a></dt> - <dd>Permite a la plataforma enviar mensajes de notificación a aplicaciones específicas.</dd> - <dt><a href="/en-US/docs/WebAPI/Time_and_Clock" title="WebAPI/Time_and_Clock">API de tiempo/reloj</a> {{NonStandardBadge}}</dt> - <dd>Provee soporte para ajustar el tiempo actual. La zona horaria es establecida usando la <a href="/en-US/docs/WebAPI/Settings" title="WebAPI/Settings">API de ajustes</a>.</dd> - <dt><a href="/en-US/docs/WebAPI/Web_Activities" title="WebAPI/Web_Activities">Web Activities</a> {{NonStandardBadge}}</dt> - <dd>Permite a una app delegar una actividad a otra app; por ejemplo, una app podría preguntar a otra app seleccionar (o crear) y devolver una foto. Normalmente el usuario es capaz de configurar que aplicaciones se utilizan para que actividad.</dd> - <dt><a href="/en-US/docs/Apps/Publishing/In-app_payments" title="Apps/Publishing/In-app_payments">WebPayment API</a> {{NonStandardBadge}}</dt> - <dd>Permite a contenido web iniciar pago y reembolsos por bienes virtuales.</dd> -</dl> - -<h2 class="Community" id="Community" name="Community">comunidad WebAPI</h2> - -<p>Si necesitas ayuda con estas APIs, existen varias maneras en la que puedes hablar con otros desarrolladores que las utilizan.</p> - -<ul> - <li>Consulta en el foro de WebAPI: {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}</li> - <li>Visita el canal de IRC de WebAPI: <a href="irc://irc.mozilla.org/webapi" title="irc://irc.mozilla.org/webapi">#webapi</a></li> -</ul> - -<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p> - -<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">temas Relacionados</h2> - -<ul> - <li>El <a href="/es/docs/DOM" title="Document Object Model (DOM)">Modelo de Objetos del Documento (DOM)</a> es la representación estructural del documento HTML.</li> - <li><a href="/es/docs/JavaScript" title="JavaScript">JavaScript</a> - Lenguaje de Script para la Web.</li> - <li><a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">Doc status</a>: Una lista de WebAPIs y el estado de su documentación.</li> -</ul> -</div> -</div> - -<p> </p> diff --git a/files/es/webapi/pointer_lock/index.html b/files/es/webapi/pointer_lock/index.html deleted file mode 100644 index 13a27d6d48..0000000000 --- a/files/es/webapi/pointer_lock/index.html +++ /dev/null @@ -1,284 +0,0 @@ ---- -title: API Pointer Lock -slug: WebAPI/Pointer_Lock -translation_of: Web/API/Pointer_Lock_API ---- -<p> </p> - -<p><strong>Pointer Lock </strong>(antes llamado Bloqueo del <em>Mouse</em>) proporciona métodos de entrada basados en el movimiento del ratón a traves del tiempo (es decir, deltas), no sólo la posición absoluta del cursor del <em>mouse</em>. Te da acceso al movimiento <span style="line-height: inherit;">puro </span><span style="line-height: inherit;">del <em>mouse</em>, bloquea el objetivo de los eventos del <em>mouse</em> a un solo elemento, elimina límites en cuanto a que tan lejos puedes mover el <em>mouse</em> en una sola dirección, y quita el cursor de la vista.</span></p> - -<p>Esta API es útil para aplicaciones que requieren bastantes acciones para controlar los movimientos del <em>mouse</em>, rotar objetos y cambiar las entradas. Es especialmente importante para aplicaciones altamente visuales, tales como los que utilizan la perspectiva en primera persona, así como vistas en 3D y modelado.</p> - -<p>Por ejemplo, puedes crear aplicaciones que permiten a los usuarios controlar el ángulo de visión con sólo mover el <em>mouse</em> sin ningún clic, permitiendo liberar <span style="line-height: inherit;">los clics</span><span style="line-height: inherit;"> para otras acciones. Este tipo de entrada del <em>mouse</em> es muy útil para ver mapas, imágenes de satélite, o escenas en primera persona (como en un juego o un vídeo embebido).</span></p> - -<p><strong>Pointer Lock</strong><span style="line-height: inherit;"> te permite acceder a los eventos del </span><em>mouse</em><span style="line-height: inherit;"> incluso cuando el cursor pasa por el límite de la pantalla del navegador. Por ejemplo, los usuarios pueden seguir girando o manipular un modelo 3D moviendo el </span><em>mouse</em><span style="line-height: inherit;"> sin fin. Sin </span><strong>Pointer Lock</strong><span style="line-height: inherit;">, la rotación o la manipulación se detiene en el momento en que el cursor alcanza el borde de la pantalla del navegador. Los jugadores se verán particularmente encantados con esta característica, ya que anciosamente pueden hacer clic en los botones y arrastrar el cursor del </span><em>mouse</em><span style="line-height: inherit;"> de un lado a otro sin tener que preocuparse por salir de la zona de juego ni de cliquear accidentalmente otra aplicación que podría llevar al </span><em>mouse</em><span style="line-height: inherit;"> fuera del juego. Una tragedia!</span></p> - -<h2 id="basics" name="basics">Conceptos Básicos</h2> - -<p><strong>Pointer Lock</strong><strong style="line-height: inherit;"> </strong><span style="line-height: inherit;">está relacionado con la <em>mouse capture</em>. </span><em>mouse capture </em><span style="line-height: inherit;">proporciona la entrega continua de eventos a un elemento de destino, mientras que el <em>mouse</em> se arrastra, pero se detiene cuando se suelta el clic. </span><strong>Pointer Lock</strong><span style="line-height: inherit;"> es diferente de </span><em>mouse capture </em><span style="line-height: inherit;">en las siguientes maneras:</span></p> - -<ul> - <li><span style="line-height: 1.5em;">Es persistente. <strong style="line-height: normal;">Pointer Lock</strong> no libera el <em>mouse</em> hasta que se haga una llamada explícita a la API o el usuario utilize un gesto concreto de lanzamiento.</span></li> - <li><span style="line-height: 1.5em;">No está limitado por los limites del navegador o la pantalla.</span></li> - <li>Envia continuamente eventos independientemente del estado del clic del <em>mouse</em>.</li> - <li>Oculta el cursor.</li> -</ul> - -<h2 id="example" name="example">Ejemplo</h2> - -<p>El siguiente es un ejemplo de cómo se puede configurar <strong>Pointer Lock</strong> en su página web.</p> - -<pre class="brush: js"><button onclick="lockPointer();">Lock it!</button> -<div id="pointer-lock-element"></div> -<script> -// Nota: Al momento de escribir esto, sólo Mozilla y WebKit apoyan Pointer Lock. - -// El elemento que servirá para pantalla completa y pointer lock. -var elem; - -document.addEventListener("mousemove", function(e) { - var movementX = e.movementX || - e.mozMovementX || - e.webkitMovementX || - 0, - movementY = e.movementY || - e.mozMovementY || - e.webkitMovementY || - 0; - - // Imprime los valores delta del movimiento del mouse - console.log("movementX=" + movementX, "movementY=" + movementY); -}, false); - -function fullscreenChange() { - if (document.webkitFullscreenElement === elem || - document.mozFullscreenElement === elem || - document.mozFullScreenElement === elem) { // Older API upper case 'S'. - // El elemento esta en pantalla completa, ahora podemos hacer el request de pointer lock - elem.requestPointerLock = elem.requestPointerLock || - elem.mozRequestPointerLock || - elem.webkitRequestPointerLock; - elem.requestPointerLock(); - } -} - -document.addEventListener('fullscreenchange', fullscreenChange, false); -document.addEventListener('mozfullscreenchange', fullscreenChange, false); -document.addEventListener('webkitfullscreenchange', fullscreenChange, false); - -function pointerLockChange() { - if (document.mozPointerLockElement === elem || - document.webkitPointerLockElement === elem) { - console.log("Pointer Lock was successful."); - } else { - console.log("Pointer Lock was lost."); - } -} - -document.addEventListener('pointerlockchange', pointerLockChange, false); -document.addEventListener('mozpointerlockchange', pointerLockChange, false); -document.addEventListener('webkitpointerlockchange', pointerLockChange, false); - -function pointerLockError() { - console.log("Error while locking pointer."); -} - -document.addEventListener('pointerlockerror', pointerLockError, false); -document.addEventListener('mozpointerlockerror', pointerLockError, false); -document.addEventListener('webkitpointerlockerror', pointerLockError, false); - -function lockPointer() { - elem = document.getElementById("pointer-lock-element"); - // Start by going fullscreen with the element. Current implementations - // require the element to be in fullscreen before requesting pointer - // lock--something that will likely change in the future. - elem.requestFullscreen = elem.requestFullscreen || - elem.mozRequestFullscreen || - elem.mozRequestFullScreen || // Older API upper case 'S'. - elem.webkitRequestFullscreen; - elem.requestFullscreen(); -} -</script> -</pre> - -<h2 id="method_overview" name="method_overview">Propiedades/Métodos</h2> - -<p>La API de bloque de puntero ,similar a la API de Fullscreen,extiende del elemento DOM agregando un nuevo método, <code>requestPointerLock</code>, la cual es dependiente del vendedor(del navegador). Puede escribirse como:</p> - -<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">element.webkitRequestPointerLock(); // para Chrome</span></span> - -element.mozRequestPointerLock(); // para Firefox -</pre> - -<p>Current implementations of <code>requestPointerLock</code> are tightly bound to <code>requestFullScreen</code> and the Fullscreen API. Before an element can be pointer locked, it must first enter the fullscreen state. As demonstrated above, the process of locking the pointer is asynchronous, with events (<code>pointerlockchange</code>, <code>pointerlockerror</code>) indicating the success or failure of the request. This matches how the Fullscreen API works, with its <code>requestFullScreen</code> method and <code>fullscreenchange</code> and <code>fullscreenerror</code> events.</p> - -<p>The Pointer lock API also extends the <code>document</code> interface, adding both a new property and a new method. The new property is used for accessing the currently locked element (if any), and is named <code>pointerLockElement</code>, which is vendor-prefixed for now. The new method on <code>document</code> is <code>exitPointerLock</code> and, as the name implies, it is used to exit Pointer lock.</p> - -<p>The <code>pointerLockElement</code> property is useful for determining if any element is currently pointer locked (e.g., for doing a boolean check) and also for obtaining a reference to the locked element, if any. Here is an example of both uses:</p> - -<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement || - document.mozPointerLockElement || - document.webkitPointerLockElement;</span></span> - -// 1) Used as a boolean check--are we pointer locked? -if (!!document.pointerLockElement) { - // pointer is locked -} else { - // pointer is not locked -} - -// 2) Used to access the pointer locked element -if (document.pointerLockElement === someElement) { - // someElement is currently pointer locked -} -</pre> - -<p>The <code>document</code>'s <code>exitPointerLock</code> method is used to exit pointer lock, and like requestPointerLock, works asynchrounously using the <code>pointerlockchange</code> and <code>pointerlockerror</code> events:</p> - -<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.exitPointerLock = document.exitPointerLock || - document.mozExitPointerLock || - document.webkitExitPointerLock;</span></span> - -function pointerLockChange() { - <span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement || - document.mozPointerLockElement || - document.webkitPointerLockElement;</span></span> - - if (!!document.pointerLockElement) { - console.log("Still locked."); - } else { - console.log("Exited lock."); - } -} - -document.addEventListener('pointerlockchange', pointerLockChange, false); -document.addEventListener('mozpointerlockchange', pointerLockChange, false); -document.addEventListener('webkitpointerlockchange', pointerLockChange, false); - -// Attempt to unlock -document.exitPointerLock(); -</pre> - -<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockchange event</h2> - -<p>When the Pointer lock state changes—for example, when calling <code>requestPointerLock</code>, <code>exitPointerLock</code>, the user pressing the ESC key, etc.—the <code>pointerlockchange</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p> - -<div class="note">This event is currently prefixed as <code>mozpointerlockchange</code> in Firefox and <code>webkitpointerlockchange</code> in Chrome. </div> - -<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockerror event</h2> - -<p>When there is an error caused by calling <code>requestPointerLock</code> or <code>exitPointerLock</code>, the <code>pointerlockerror</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p> - -<div class="note">This event is currently prefixed as <code>mozpointerlockerror</code> in Firefox and <code>webkitpointerlockerror</code> in Chrome. </div> - -<h2 id="extensions" name="extensions">Extensions to mouse events</h2> - -<p>The Pointer lock API extends the normal <code>MouseEvent</code> with movement attributes.</p> - -<pre class="idl"><span class="idlInterface" id="idl-def-MouseEvent">partial interface <span class="idlInterfaceID">MouseEvent</span> { -<span class="idlAttribute"> readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementX">movementX</a></span>;</span> -<span class="idlAttribute"> readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementY">movementY</a></span>;</span> -};</span></pre> - -<div class="note">The movement attributes are currently prefixed as <code>.mozMovementX</code> and <code>.mozMovementY</code> in Firefox, and<code>.webkitMovementX</code> and <code>.webkitMovementY</code> in Chrome.</div> - -<p>Two new parameters to mouse events—<code>movementX</code> and <code>movementY</code>—provide the change in mouse positions. The values of the parameters are the same as the difference between the values of <a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent"><code>MouseEvent</code></a> properties, <code>screenX</code> and <code>screenY</code>, which are stored in two subsequent <code>mousemove</code> events, <code>eNow</code> and <code>ePrevious</code>. In other words, the Pointer lock parameter <code>movementX = eNow.screenX - ePrevious.screenX</code>.</p> - -<h3 id="locked_state" name="locked_state">Locked state</h3> - -<p>When Pointer lock is enabled, the standard <code>MouseEvent</code> properties <code>clientX</code>, <code>clientY</code>, <code>screenX</code>, and <code>screenY</code> are held constant, as if the mouse is not moving. The <code>movementX</code> and <code>movementY</code> properties continue to provide the mouse's change in position. There is no limit to <code>movementX</code> and <code>movementY</code> values if the mouse is continuously moving in a single direction. The concept of the mouse cursor does not exist and the cursor cannot move off the window or be clamped by a screen edge.</p> - -<h3 id="unlocked_state" name="unlocked_state">Unlocked state</h3> - -<p>The parameters <code>movementX</code> and <code>movementY</code> are valid regardless of the mouse lock state, and are available even when unlocked for convenience.</p> - -<p>When the mouse is unlocked, the system cursor can exit and re-enter the browser window. If that happens, <code>movementX</code> and <code>movementY</code> could be set to zero.</p> - -<h2 id="iframe_limitations">iframe limitations</h2> - -<p>Pointer lock can only lock one iframe at a time. If you lock one iframe, you cannot try to lock another iframe and transfer the target to it; Pointer lock will error out. To avoid this limitation, first unlock the locked iframe, and then lock the other.</p> - -<p>While iframes work by default, "sandboxed" iframes block Pointer lock. The ability to avoid this limitation, in the form of the attribute/value combination <code><iframe sandbox="allow-pointer-lock"></code>, is expected to appear in Chrome soon.</p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Pointer Lock')}}</td> - <td>{{Spec2('Pointer Lock')}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> - -<p>{{ CompatibilityTable() }}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari (WebKit)</th> - </tr> - <tr> - <td>Basic support</td> - <td> - <p>Targeting 23{{ property_prefix("webkit") }}*</p> - - <p>See <a class="external" href="http://code.google.com/p/chromium/issues/detail?id=72754" title="http://code.google.com/p/chromium/issues/detail?id=72754">CR/72574</a></p> - </td> - <td> - <p>{{ CompatGeckoDesktop("14.0") }}</p> - - <p>{{bug("633602") }}</p> - </td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Phone</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - <td>{{ CompatNo() }}</td> - </tr> - </tbody> -</table> -</div> - -<p>* Requires the feature be enabled in <code>about:flags</code> or Chrome started with the <code>--enable-pointer-lock</code> flag.</p> - -<h2 id="See_also" name="See_also">See also</h2> - -<p><a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent">MouseEvent</a></p> diff --git a/files/es/webapi/using_geolocation/index.html b/files/es/webapi/using_geolocation/index.html deleted file mode 100644 index 6d50972f8b..0000000000 --- a/files/es/webapi/using_geolocation/index.html +++ /dev/null @@ -1,232 +0,0 @@ ---- -title: Uso de geolocalización -slug: WebAPI/Using_geolocation -tags: - - API - - Geolocalización - - Guía - - clearWatch - - watchPosition -translation_of: Web/API/Geolocation_API ---- -<p>{{securecontext_header}}{{APIRef("Geolocation API")}}</p> - -<p><span id="result_box" lang="es"><span class="hps">La</span> <strong><span class="hps">API de geolocalización</span></strong> <span class="hps">permite al</span> <span class="hps">usuario compartir su</span> <span class="hps">ubicación</span> <span class="hps">a las aplicaciones web</span> <span class="hps">si</span> <span class="hps">así lo desea.</span> <span class="hps">Por razones de privacidad</span><span>,</span> <span class="hps">al usuario</span> <span class="hps">se le pide que</span> <span class="hps">confirme el permiso</span> <span class="hps">para proporcionar información</span> <span class="hps">de ubicación.</span></span></p> - -<h2 id="El_objeto_geolocation">El objeto geolocation</h2> - -<p><span id="result_box" lang="es"><span class="hps">La API</span> <span class="hps">de geolocalización</span> <span class="hps">se publica</span> <span class="hps">a través del objeto </span></span>{{domxref("window.navigator.geolocation","navigator.geolocation")}}.</p> - -<p><span id="result_box" lang="es"><span class="hps">Si el objeto existe</span><span>,</span> <span class="hps">los servicios de geolocalización</span> <span class="hps">están disponibles.</span> <span class="hps">Se puede</span> <span class="hps">comprobar la presencia</span> <span class="hps">de la geolocalización</span> <span class="hps">de esta manera:</span></span></p> - -<pre class="brush: js">if ("geolocation" in navigator) { - /* la geolocalización está disponible */ -} else { - /* la geolocalización NO está disponible */ -} -</pre> - -<div class="blockIndicator note"> -<p>Nota: En Firefox 24 y versiones anteriores, <code>"geolocation" in navigator</code> siempre retornaba <code>true</code> incluso si la API se encontraba deshabilitada. Esto ha sido corregido en <a href="https://www.fxsitecompat.com/en-CA/versions/25/">Firefox 25</a> para cumplir con la especificación. ({{bug(884921)}}).</p> -</div> - -<h3 id="Obtención_de_la_ubicación_actual">Obtención de la ubicación actual</h3> - -<p><span lang="es"><span class="hps">Para</span> <span class="hps">obtener la ubicación</span> <span class="hps">actual del usuario</span><span>, puede llamar a</span><span class="atn hps">l método </span></span>{{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}<span lang="es"><span class="hps">.</span></span></p> - -<p><span lang="es"><span class="hps">Esto inicia</span> <span class="hps">una solicitud asíncrona</span> <span class="hps">para detectar</span> <span class="hps">la posición del usuario</span><span>, y</span> <span class="hps">consulta el</span> <span class="hps">hardware</span> <span class="hps">de posicionamiento para</span> <span class="hps">obtener</span><span class="hps"> información actualizada.</span> </span><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">se determina la posición</span><span>, se ejecuta la función</span> <span class="hps">de callback</span><span class="hps">.</span></span><span lang="es"> <span class="hps">Si lo desea,</span> <span class="hps">puede proporcionar otra función de callback</span><span class="hps"> que se</span> <span class="hps">ejecuta si</span> <span class="hps">se produce un error</span><span>.</span> <span class="hps">Un tercer</span> <span class="hps">parámetro</span> <span class="hps">opcional</span><span>, es un</span> <span class="hps">objeto de opciones</span> <span class="hps">donde se puede establecer</span> <span class="hps">la edad máxima de</span> <span class="hps">la</span> <span class="hps">posición devuelta</span><span>,</span> <span class="hps">el tiempo de espera</span> <span class="hps">para una solicitud</span> <span class="hps">y si se requiere</span> <span class="hps">una alta precisión</span> <span class="hps">para la posición.</span></span></p> - -<div class="note"> -<p><strong>Nota:</strong> Por defecto, {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} intenta responder tan rápido como sea posible con un resultado de baja precisión. Es útil cuando se necesita una respuesta rápida sin importar su exactitud. A los dispositivos con GPS, por ejemplo, les puede tomar más de un minuto obtener una posición, por lo que datos menos precisos (localización por IP o wifi) pueden ser devueltos por {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p> -</div> - -<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) { - haz_algo(position.coords.latitude, position.coords.longitude); -});</pre> - -<p>En el ejemplo anterior la función do_something() será ejecutada una vez que se obtiene la posición.</p> - -<h3 id="Rastreando_la_posición_actual">Rastreando la posición actual</h3> - -<p>Si los datos de ubicación cambian (si el dispositivo se mueve o información geográfica más precisa es recibida), puede definir una función de callback que se ejecuta al cambiar la posición. Esto se logra a través de la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}}, que recibe los mismos parámetros que {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}. La función de callback es ejecutada varias veces, permitiendo al navegador actualizar la ubicación cada vez que cambia, o proporcionar una posición con mayor exactitud utilizando distintas técnicas de geolocalización. La función de callback de error, la cual es opcional como en {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}, es llamada solo una vez, cuando nunca serán devueltos resultados correctos.</p> - -<div class="note"> -<p><strong>Nota:</strong> Es posible usar la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} sin haber ejecutado antes {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p> -</div> - -<pre class="brush: js">var watchID = navigator.geolocation.watchPosition(function(position) { - do_something(position.coords.latitude, position.coords.longitude); -});</pre> - -<p>El método {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} devuelve un número que se utiliza para identificar el rastreador de posición solicitado; este valor se utiliza junto con el método {{domxref("window.navigator.geolocation.clearWatch()","clearWatch()")}} para dejar de rastrear la posición del usuario.</p> - -<pre class="brush: js">navigator.geolocation.clearWatch(watchID); -</pre> - -<h3 id="Afinando_la_respuesta">Afinando la respuesta</h3> - -<p>Ambos métodos, {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} y {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} aceptan una función de callback en caso de éxito, una función callback opcional si ocurre algún error, y un objeto <code>PositionOptions</code> también opcional.</p> - -<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionOptions")}}</p> - -<p>Una llamada a {{domxref("window.navigator.geolocation.watchPosition()","watchPosition")}} luce como el siguiente ejemplo:</p> - -<pre class="brush: js">function geo_success(position) { - do_something(position.coords.latitude, position.coords.longitude); -} - -function geo_error() { - alert("Sorry, no position available."); -} - -var geo_options = { - enableHighAccuracy: true, - maximumAge : 30000, - timeout : 27000 -}; - -var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);</pre> - -<p><a id="fck_paste_padding">Demo de watchPosition: </a><a class="external" href="http://www.thedotproduct.org/experiments/geo/">http://www.thedotproduct.org/experiments/geo/</a><br> - <a id="fck_paste_padding"></a></p> - -<h2 id="Describiendo_una_posición">Describiendo una posición</h2> - -<p>La ubicación del usuario es descrita con un objeto <code>Position</code> referenciando a un objeto <code>Coordinates</code>.</p> - -<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Position")}}</p> - -<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Coordinates")}}</p> - -<h2 id="Manejo_de_errores">Manejo de errores</h2> - -<p>La función de callback de error, si existe cuando se llama a <code>getCurrentPosition()</code> o <code>watchPosition()</code>, recibe un objeto <code>PositionError</code> como su primer parámetro.</p> - -<pre class="brush: js">function errorCallback(error) { - alert('ERROR(' + error.code + '): ' + error.message); -}; -</pre> - -<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionError")}}</p> - -<h2 id="Ejemplo_de_geolocalización">Ejemplo de geolocalización</h2> - -<div class="hidden"> -<pre class="brush: css">body { - padding: 20px; - background-color:#ffffc9 -} - -p { margin : 0; } -</pre> -</div> - -<h3 id="Contenido_HTML">Contenido HTML</h3> - -<pre class="brush: html;"><p><button onclick="geoFindMe()">Show my location</button></p> -<div id="out"></div> -</pre> - -<h3 id="Contenido_JavaScript">Contenido JavaScript</h3> - -<pre class="brush: js;">function geoFindMe() { - var output = document.getElementById("out"); - - if (!navigator.geolocation){ - output.innerHTML = "<p>Geolocation is not supported by your browser</p>"; - return; - } - - function success(position) { - var latitude = position.coords.latitude; - var longitude = position.coords.longitude; - - output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>'; - - var img = new Image(); - img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false"; - - output.appendChild(img); - }; - - function error() { - output.innerHTML = "Unable to retrieve your location"; - }; - - output.innerHTML = "<p>Locating…</p>"; - - navigator.geolocation.getCurrentPosition(success, error); -} -</pre> - -<h3 id="Resultado">Resultado</h3> - -<p>{{ EmbedLiveSample('Geolocation_Live_Example',350,410) }}</p> - -<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2> - -<p>{{ CompatibilityTable() }}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Característica</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Soporte básico</td> - <td>5</td> - <td>{{CompatGeckoDesktop("1.9.1")}}</td> - <td>9</td> - <td>10.60</td> - <td>5</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Soporte básico</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatUnknown()}}</td> - <td>{{CompatGeckoMobile("4")}}</td> - <td>{{CompatUnknown()}}</td> - <td>10.60</td> - <td>{{CompatUnknown()}}</td> - </tr> - </tbody> -</table> -</div> - -<h3 id="Notas_sobre_Gecko">Notas sobre Gecko</h3> - -<p>Firefox incluye soporte para localizar basándose en información de redes inalámbricas, usando Google Location Services. En la transacción entre Firefox y Google, los datos son compartidos incluyendo información del punto de acceso inalámbrico, un token de acceso (similar a una cookie con duración de dos semanas), y la dirección IP del usuario. Para más información, por favor consulte la <a href="http://www.mozilla.com/en-US/legal/privacy/" title="http://www.mozilla.com/en-US/legal/privacy/">Política de Privacidad de Mozilla</a><span class="external"> y la</span> <a href="http://www.google.com/privacy-lsf.html" title="http://www.google.com/privacy-lsf.html">Política de Privacidad de Google</a>, dichos documentos cubren como estos datos pueden ser utilizados.</p> - -<p>En Firefox 3.6 (Gecko 1.9.2) fue añadido soporte para utilizar el servicio <a href="http://catb.org/gpsd/" title="http://catb.org/gpsd/">GPSD</a> para geolocalización en sistemas Linux.</p> - -<h2 id="Consultar_también">Consultar también</h2> - -<ul> - <li>{{domxref("window.navigator.geolocation","navigator.geolocation")}}</li> - <li><a href="http://www.w3.org/TR/geolocation-API/" title="http://www.w3.org/TR/geolocation-API/">API de Geolocalización en w3.org</a></li> - <li><a href="/en-US/demos/tag/tech:geolocation" title="/en-US/demos/tag/tech:geolocation">Demos que utilizan la API de Geolocalización</a></li> -</ul> - -<p> </p> |