viernes, 31 de agosto de 2012

Cristalab

Cristalab

Cómo funciona la geolocalización por WiFi

Posted: 31 Aug 2012 09:20 AM PDT

La geolocalización es muy útil en aplicaciones web y móviles. Pero GPS no siempre está disponible. Gracias a un esfuerzo de empresas como Google, Apple, Microsoft y Skyhook, es posible obtener latitud y longitud muy acertada con sólo usar antenas wifi. Aquí te explicamos cómo funciona.


El demo


Entra a Geolocation de HTML5 Demos y si estás desde un laptop o un computador con antena wifi prendida dale "Aceptar" cuando el navegador te pida permiso. Verás que te ubica MUY cerca a donde estás, si no es que es exacto.

Geolocation de antenas wifi


La geolocalización funciona con HTML5 o con apps nativas móviles. La técnica es muy simple:

1. Capturar datos de routers y geolocalizarlos


Si tienes un teléfono Android o iPhone, al instalarlo te preguntó si querías "ayudar anonimamente" y al mismo tiempo hacer que la localización sea más veloz. Todos dicen que sí.


El teléfono prende la antena wifi y captura todas las redes inalambricas cercanas. NO importa que esté protegida, que sea WPA2 o que la clave tenga mil caracteres porque no usa el nombre de la red, ni los paquetes, sino la MAC Address del router. Este es un número único del router que nunca cambia, incluso si el router es formateado o la red cambia de nombre. Y siempre va en texto claro entre las ondas.

Tras capturar una lista de MAC de los routers cercanos, el teléfono prende el GPS tradicional, obtiene una latitud y longitud acertada y manda a los servers (Google Geolocation, Skyhook, Microsoft Bing Geocode, etc) esos datos. Los routers rara vez se mueven, así que la base de datos tiende a ser buena.

Los carros de fotos de Google Street View también hace lo mismo con GPS profesional y antenas wifi de alto poder.

2. Comparar routers cercanos con la DB pública


Cuando una aplicación pide geolocalizar por wifi, sea en un teléfono, tablet o laptop, la app se conecta a Google Geolocation, Skyhook o la empresa que use (los navegadores lo hacen automático), le envía al API una lista completa de las MAC Address de todos los routers que tu antena ve. El API compara esas direcciones con latitudes y longitudes, triangula y envía una latitud y longitud muy cercana a la realidad.


3. Hacer algo con la latitud y longitud


¿Quieres probarlo? Crea un archivo HTML y en etiquetas script, inserta este código:

Código :

navigator.geoLocation.getCurrentPosition(exito, fallo);  function exito(datos)  {     alert(datos.coords.latitude + "," + datos.coords.longitude);  }  function fallo(errorsh)  {     alert("Tarde o temprano ¬ ¬");  }

[nota:a26f27c43e]Atención: Lo tienes que probar en un server, aunque sea local, no te sirve si lo abres desde el disco.[/nota:a26f27c43e]
Al probarlo, te pedirá permiso para buscarte, usará geolocalización por wifi y te mostrará en pantalla tu latitud y longitud separado por una coma. Necesitas usar un navegador de verdad, eso sí. IE9 o superior.

Luego, puedes poner esos números en Google Maps y verás que, quizás, es tu casa. Si quieres usar esos datos para mostrar el mapa en un sitio web, puedes usar Gmaps.js o el API de Google Maps nativo.

La geolocalización wifi es increíble y funciona incluso en lugares muy remotos. Pública en los comentarios de donde eres y si te funcionó. O cuentale en un tweet a @cristalab.

Enviar comentario

Redes OSPF: comandos generales y debug en Packet Tracer

Posted: 31 Aug 2012 06:19 AM PDT

En este videotutorial de Redes, repasaremos los comandos de revisión básica, con los que hemos trabajado en los diferentes protocolos y configuraciones, para comprobar la asignación de las diferentes redes, solucionar errores y gracias a comandos específicos, testear información única de Ospf y los dispositivos que forman parte de la topología.

Empezaremos revisando la configuración de los dispositivos con las opciones del comando Show, mientras usamos comandos específicos de OSPF para obtener información exclusiva del protocolo y usamos el Debug para comprobar los mensajes generados.



Saludos.

Enviar comentario

Movimiento de profundidad a una imagen estática con After Effects

Posted: 13 Aug 2012 05:39 AM PDT

En este videotutorial de After Effects, aprenderemos a añadir características tridimensionales y de profundidad real a una fotografía plana de un paisaje, usando las máscara en la generación de varios niveles de profundidad, que ajustaremos y desplazaremos en el entorno tridimensional del programa, para poder incluir diferentes tomas de cámara sutiles que nos proporcionarán el material animado.

Comenzaremos con la importación de la fotografía, generando varios duplicados y ajustándolos para que puedan interactuar en el entorno de trabajo 3D.

Recortaremos las porciones de los duplicados que nos interesen, para conseguir el efecto deseado y crear los diferentes planos de la composición, sobre los que modificaremos posición y escala.

Para terminar, aplicaremos varios retoques y efectos, al mismo tiempo que animamos la cámara, para obtener la toma final.




Saludos.

Enviar comentario

Menú con XML y PHP

Posted: 13 Aug 2012 05:28 AM PDT

Que tal! Este es mi primer aporte y espero en verdad les sea de utilidad. En este tutorial les intentaré explicar sobre el manejo de un menú en XML, usando cada elemento como VAR.

Nos manejaremos de esta manera: por medio de PHP se cargan los elementos de mi menú como un array, lo que nos lleva sólo a ejecutar una acción en lugar de invocar cada elemento por separado.

Espero lo comprendan un poco mas con estas líneas.

Código :

<item id="MN_CURSOS" text="Cursos">        <item id="MNCTSS_AREAS" text="Areas">              <userdata name="url">                 <!--  Declaracion del elemento VAR:   -->                 <VAR:WSCATALOGOSAREAS/>                  <!--  Para el catalogo de Areas  -->              </userdata>              <userdata name="qs">                 <VAR:LOADFORM/>              </userdata>           </item>        <item id="MNCTSS_CURSOS" text="Admon de Cursos">              <userdata name="url">                 <VAR:WSCATALOGOSCURSOS/>              </userdata>              <userdata name="qs">                 <VAR:LOADFORM/>              </userdata>        </item>        <item id="MNCTSS_DOCENTES" text="Admon de Docentes">              <userdata name="url">                 <VAR:WSCATALOGOSDOCENTES/>              </userdata>              <userdata name="qs">                 <VAR:LOADFORM/>              </userdata>        </item>     </item>


[nota:cfbb5853f9]En la línea 4 "VAR:WSCATALOGOSAREAS" puse un pequeño comentario sólo en esta parte, sin embargo en las demás líneas aparecen otras variables que uso de igual forma.[/nota:cfbb5853f9]

A continuación pasamos a la parte de PHP que es donde se carga el Array, en mi caso lo hago con un Switch dependiendo de la petición que se obtenga de otra de las peticiones que se efectúan en mi framework (cosa que espero poder compartir más adelante). Para este caso sólo pondré el Switch con el Case que quiero explicar:

Código :

  switch ($oGET->do) {        case 'load_menu' : {           header ("Content-Type:text/xml");                      $oTpl->load(FS_ADMIN . 'menu.xml');           $oTpl->setVar(              array(                 'LOGOUT' => encodeQueryString(array('do' => 'logout')),                 'LOADFORM' => encodeQueryString(array('do' => 'load_form')),                 'WSCATALOGOSPERFILES' => WS_CATALOGOS_PERFILES,                 'WSCATALOGOSAREAS' => WS_CATALOGOS_AREAS,                 'WSCATALOGOSUSUARIOS' => WS_CATALOGOS_USUARIOS,                 'WSCATALOGOSCURSOS' => WS_CATALOGOS_CURSOS,                 'WSCATALOGOSDOCENTES' => WS_CATALOGOS_DOCENTES,                )           );             $xml = $oPerfil->parseDHTMLXMenu($oTpl->publish(true));                      echo $xml;                      break;        }


El objeto "$oGET" es un elemento global que uso para el manejo del Frame, este objeto ejecuta la acción "do" a la acción "load_menu". Dentro de este se encuentra el objeto "$oTpl" (ObjectTemplate) que es usado como plantilla, después carga con la acción "load" el menu.xml, la variable "FS_ADMIN" es sólo la dirección de la carpeta, esto con el fin de no tener que estar poniendo las rutas cada vez que quiera cargar algo, sólo use un archivo de constantes, esto es de mucha utilidad ya que evita pérdida de tiempo innecesaria en especificar las rutas.

Continuando, una vez cargado el menu.xml, el objeto "$oTpl" carga las variables de nuestro menu.xml, estas variables ya están definidas en mi archivo de constantes.

Esta es la parte para esta variable, "constantes.php" y cada uno de ellos es sólo el direccionamiento de las carpetas.

Código :

  //Constantes para catalogo de Areas  define('WS_CATALOGOS_AREAS', WS_CATALOGOS . 'areas/');  define('FS_CATALOGOS_AREAS', FS_CATALOGOS . 'areas/');  define('FS_CATALOGOS_AREAS_GRID', FS_CATALOGOS_AREAS . 'grid/');  define('FS_CATALOGOS_AREAS_CONSULTA', FS_CATALOGOS_AREAS . 'editar/');  define('FS_CATALOGOS_AREAS_NUEVO', FS_CATALOGOS_AREAS . 'agregar/');


Una vez que se carga el Array lo asigno al objeto $xml, por ahí se observa lo siguiente:

Código :

$xml = $oPerfil->parseDHTMLXMenu($oTpl->publish(true));


Partiendo esta línea de derecha a izquierda sería:

Código :

$oTpl->publish(true)

Esto no tiene mucha ciencia, es sólo la acción de "publicar" el objeto $oTpl.

Código :

$oPerfil->parseDHTMLXMenu($oTpl->publish(true));

Aquí solo se pasa al modo de DHTMLX cuya referencia dejo aquí: http://docs.dhtmlx.com/doku.php

El objeto $oPerfil, lo uso para que dependiendo del perfil del usuario, se carguen o no las opciones del menú, por medio de validaciones y permisos asignados.

Este es un complemento para que nuestros menúes tengan cierta presentación y algunas animaciones.

Y LISTO! una vez que se genera esta variable $xml, sólo se le hace un "echo" y se hace un "break" para especificar que la petición ha sido terminada.

Yo les llamo OBJETOS entendiendo que ya se sabe que una variable puede ser manejada como tal.

Espero sus comentarios y espero que esto les sirva, aquí he aprendido mucho y espero seguir aportando.

Enviar comentario

Oh nuestro webmaster!

Posted: 13 Apr 2006 05:00 PM PDT

Nos prohibieron publicar este comic. Era lo mejor. Nos dijeron "Hagan algo impactante". Pero algo terriblemente malo paso. Ahora, una orden judicial nos obliga a mostrarlo. Contra nuestra voluntad.
Publicado por en

No hay comentarios:

Publicar un comentario

Suscribirse a: Enviar comentarios (Atom)