Download - Integracion de layar con drupal
![Page 1: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/1.jpg)
www.investic.net
INTEGRACIÓN DELAYAR CON DRUPAL
Mael Talebhttp://twitter.com/mael_
Drupal como gestor de contenido geoposicionado
DrupalCamp Barcelona27-02-2010
![Page 2: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/2.jpg)
www.investic.net
ÍNDICE
Layar (entorno de configuración, aplicación)
PorPOIse (server)
Drupal (Gestor de contenido)
Android, iPhone* (Plataformas de ejecución)
![Page 3: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/3.jpg)
www.investic.net
![Page 4: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/4.jpg)
www.investic.net
![Page 5: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/5.jpg)
Integración de Layar con Drupal 5
www.investic.net
Elementos que entran en funcionamiento
Cliente Layar (aplicación cliente)
Servicios Layar (elementos que aporta layar)
Drupal (gestor de puntos de interés)
PorPOIse (procesado de puntos de interés)
![Page 6: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/6.jpg)
www.investic.net
LAYAR
![Page 7: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/7.jpg)
Integración de Layar con Drupal 7
www.investic.net
Descripción
Desarrolladores holandeses SPRXmobile
Layar es un navegador de realidad aumentada
Superposición de contenido a la realidad que muestra la cámara
Soporta arquitectura (1D, 2D, 3D)
Aplicación para : Android, iPhone*
Navegador (Geoposición de POI's), definidos como capas
Actualmente dispone de más de 373 Layers (capas) publicadas
![Page 8: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/8.jpg)
Integración de Layar con Drupal 8
www.investic.net
Layar
![Page 9: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/9.jpg)
Integración de Layar con Drupal 9
www.investic.net
¿Como funciona Layar ?
LAYAR: su funcionamiento se basa en usar la información que proporciona el GPS, la cámara y la brújula del móvil para identificar su entorno y mostrar información acerca del mismo en pantalla en tiempo real.
Superponiendo, puntos, imágenes u objetos sobre la imagen que vemos.
Y también genera otros tipos de vista (mapa, lista, imagen)
![Page 10: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/10.jpg)
Integración de Layar con Drupal 10
www.investic.net
Funcionamiento básico
El cliente Layar realiza la conexión con el Servidor Layar
Envía la latitud y la longitud del cliente
El Servidor de Layar presenta al cliente las distintas capas disponibles
En modo desarrollador puedes cargar tus capas todavía no publicadas
Tras seleccionar una capa accedemos al servicio web gestionado por nuestro drupal
PorPOIse se encarga de gestionar la información de drupal y relacionarla con entorno Layar
![Page 11: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/11.jpg)
Integración de Layar con Drupal 11
www.investic.net
LAYAR:REQUEST
En la URL (mediante POST)
Datos Request:LatitudLongitud (localización del cliente)
Nombre de la capa
Filtros (opcionales)
Identificador y clave (caso de desarrolladores)
http://www.midominio.com/server/?countryCode=ES&lon=1.97822570801×tamp=1267085372929&userId=6f85d06929d160a7c8a3cc1ab4b54b87db99f74b&developerId=1111&developerHash=7e152170a2ee7711309be5696eece35a0a0c9b10&radius=500&lat=43.3221805166&layerName=gmk&phoneId=6f85d06929d160a7c8a3cc1ab4b54b87db99f74b&accuracy=100
![Page 12: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/12.jpg)
Integración de Layar con Drupal 12
www.investic.net
API: REQUEST
![Page 13: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/13.jpg)
Integración de Layar con Drupal 13
www.investic.net
![Page 14: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/14.jpg)
Integración de Layar con Drupal 14
www.investic.net
LAYAR: RESPONSE
Es proporcionada por el servidor PorPOIse, en nuestro caso
Formato JSON, para el paso de información
Información filtrada según lo definido en la interfaz aportada por la infraestructura de Layar
El cliente visualiza los POI's y la información definida en la capa de Layar
![Page 15: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/15.jpg)
Integración de Layar con Drupal 15
www.investic.net
RESPONSE (JSON)
![Page 16: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/16.jpg)
Integración de Layar con Drupal 16
www.investic.net
API: RESPONSE
![Page 17: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/17.jpg)
Integración de Layar con Drupal 17
www.investic.net
Cómo crear un capa (layer)
![Page 18: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/18.jpg)
Integración de Layar con Drupal 18
www.investic.net
Zona desarrolladores en Layar
![Page 19: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/19.jpg)
Integración de Layar con Drupal 19
www.investic.net
Listado de capas en desarrollo
![Page 20: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/20.jpg)
Integración de Layar con Drupal 20
www.investic.net
Distintos filtros aplicables a cada capa (layer)
![Page 21: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/21.jpg)
Integración de Layar con Drupal 21
www.investic.net
Entorno de prueba de capas (Layers)
![Page 22: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/22.jpg)
Integración de Layar con Drupal 22
www.investic.netInformación de los POIs, presentada por el entorno de test
www.midominio.com/
![Page 23: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/23.jpg)
Integración de Layar con Drupal 23
www.investic.net
Radio de búsqueda 2 km
![Page 24: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/24.jpg)
Integración de Layar con Drupal 24
www.investic.net
Filtrando por radio de búsqueda 300 m
![Page 25: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/25.jpg)
Integración de Layar con Drupal 25
www.investic.net
JSON generado por PorPOIse
![Page 26: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/26.jpg)
Integración de Layar con Drupal 26
www.investic.net
Características del navegador (cliente Layar)
Sección del momento, populares y locales
Función de búsqueda
Añadir la capa a los favoritos
Mapa y vista de lista
Ver la imagen cámara, reforzada con malla 3D
Precisión de la información
"Take Me There" acción (predefinida) de localización en el mapa
etc....
![Page 27: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/27.jpg)
Integración de Layar con Drupal 27
www.investic.net
Interfaz layar
![Page 28: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/28.jpg)
Integración de Layar con Drupal 28
www.investic.net
Características del dispositivo móvil
PlataformaAndroid
Iphone* (mínimo v3.1) y terminal 3Gs
Instalar aplicación LayarAppStore en caso de iPhone
Market de Android (versión oficial)
Para Android esta disponible en la página de Layar una versión para desarrolladores
Cliente (móvil)Conexión de datos
GPS (y cobertura).
Cámara
Acelerometro
![Page 29: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/29.jpg)
Integración de Layar con Drupal 29
www.investic.net
Aplicación LAYAR
Distintos modos de visualización:
Cámara (imagen real)
Mapa (Google maps)
Listado de puntos
Radar de ubicación de puntos
Distancia al punto
Información adicional
![Page 30: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/30.jpg)
Integración de Layar con Drupal 30
www.investic.net
Interfaz Layar
![Page 31: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/31.jpg)
Integración de Layar con Drupal 31
www.investic.net
Publicación de capas (Layer)
![Page 32: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/32.jpg)
www.investic.net
PorPOIse
![Page 33: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/33.jpg)
Integración de Layar con Drupal 33
www.investic.net
Introducción
Autor: Jens de Smit (licencia BSD).
Servidor de puntos de interés (POI's) para clientes Layar
Los datos son devueltos en JSON
Calcula distancia entre puntos
Versión actual 0.7a
Estructurado mediante el patrón de diseño “Factory” en PHP (instanciar objetos en tiempo de ejecución)
PorPOIse es un servidor para la gestión completa de puntos de interés desarrollado en php.
![Page 34: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/34.jpg)
Integración de Layar con Drupal 34
www.investic.net
Flujo de datos
ENTRADA:XML (en nuestro caso)
Fichero tab
SQL Datos almacenados en BBDD
SALIDA:Datos formateados en JSON (requeridos por cliente Layar)
Paginados de 10 en 10
![Page 35: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/35.jpg)
Integración de Layar con Drupal 35
www.investic.net
Actualmente el proyecto soporta:
Objetos en:1D puntos
2D imágenes
3D modelos(objetos).
Personalizar varias acciones
Crear filtros personalizados
Autenticación de los clientes Layar
El proyecto también tiene implementado un frontend donde visualizar y crear POI manualmente (fase de desarrollo).Aquí es donde a nosotros, Drupal nos ha resultado más potente.
![Page 36: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/36.jpg)
Integración de Layar con Drupal 36
www.investic.net
Para qué usamos PorPOIse?
Transforma los datos generados por Drupal (XML) en formato JSON interpretado por Layar
Calcula la distancia entre los puntos y el terminal (teléfono)
Genera respuesta al cliente con los puntos solicitados formateados en JSON
![Page 37: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/37.jpg)
www.investic.net
DRUPAL
![Page 38: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/38.jpg)
Integración de Layar con Drupal 38
www.investic.net
+ módulo (Layar)
![Page 39: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/39.jpg)
Integración de Layar con Drupal 39
www.investic.net
+ los comercios de GMK
![Page 40: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/40.jpg)
Integración de Layar con Drupal 40
www.investic.net
Requisitos de nuestro drupal
Módulos:
GMap (campo ubicación)
Ctools (formulario multistep)
layar (módulo en desarrollo)
La última versión de PorPOIse (disponible en http://code.google.com/p/porpoise/ )
![Page 41: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/41.jpg)
Integración de Layar con Drupal 41
www.investic.net
http://www.gipuzkoamarket.com
Desarrollo que está llevando a cabo Investic para la Cámara de Gipuzkoa , enfocado al marketing online.
![Page 42: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/42.jpg)
Integración de Layar con Drupal 42
www.investic.net
GipuzkoaMarket + layar (módulo en desarrollo)
![Page 43: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/43.jpg)
Integración de Layar con Drupal 43
www.investic.net
XML generados
![Page 44: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/44.jpg)
Integración de Layar con Drupal 44
www.investic.net
Recopilación de POI para crear fichero XML
![Page 45: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/45.jpg)
Integración de Layar con Drupal 45
www.investic.net
Datos de identificación para layar
![Page 46: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/46.jpg)
Integración de Layar con Drupal 46
www.investic.net
Eliminar ficheros XML almacenados
![Page 47: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/47.jpg)
Integración de Layar con Drupal 47
www.investic.net
Algunos comercios geoposicionados de GMK
![Page 48: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/48.jpg)
Integración de Layar con Drupal 48
www.investic.net
Y con la combinación de estos elementos obtenemos....
![Page 49: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/49.jpg)
Integración de Layar con Drupal 49
www.investic.net
Capturas de la aplicación Layar
![Page 50: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/50.jpg)
Integración de Layar con Drupal 50
www.investic.net
Videos, funcionamiento de Layar
http://blip.tv/file/3283456
http://blip.tv/file/3283401
![Page 51: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/51.jpg)
Integración de Layar con Drupal 51
www.investic.net
Enlaces de interés
http://code.google.com/p/porpoise/
http://www.gipuzkoamarket.com/
http://layar.com/
http://drupal.org/
http://www.android.com/
![Page 52: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/52.jpg)
Integración de Layar con Drupal 52
www.investic.net
¿Preguntas?
![Page 53: Integracion de layar con drupal](https://reader034.vdocuments.pub/reader034/viewer/2022052508/559f69831a28ab151e8b4617/html5/thumbnails/53.jpg)
Integración de Layar con Drupal 53
www.investic.net