Aplicación de iOS para Abades con gestión de datos en Google App Engine

Detalles de la aplicación para iOS

¿Para qué sirve?

  • Proporciona información de los establecimientos del Grupo Abades
  • Muestra las últimas noticias, promociones, eventos y tweets de las redes de la empresa
  • Se pueden conseguir puntos de Abades, con un número de puntos suficiente, el usuario puede canjear estos por regalos que cada establecimiento pone a disposición de clientes que los frecuentan.

 

Funcionalidades de la aplicación

1.- Información de los establecimientos de la empresa:

El proceso de funcionamiento de la aplicación del Grupo Abades es el siguiente: hay una caché de días en los que la base de datos no se actualiza a menos que el usuario lo requiera. La primera vez que se arranca este número de días y otros parámetros de configuración se ponen a 0, por lo que si entramos en el listado de establecimientos de un tipo: áreas de servicio, hoteles o restaurantes, se descargará de Google App Engine, los datos que se han guardado en el modelo de datos del servidor por los empleados de la empresa en formato XML y se insertarán en la base de datos local en alrededor de un minuto. A partir del momento en que se almacenan estos datos hay 6 dias en los que no se vuelven a actualizar al ser datos de un tipo distinto a las promociones/eventos, noticias o ficheros,  se mantienen actualizados con otra frecuencia distinta.  En el caso de ser una imagen, la primera vez que se descarga se guarda en una caché (* nota programadores: de ASIDownloadCache), que hemos visto en los cursos de programación de este blog, entonces se almacenarán durante el número de días configurado, 31 por defecto, ya que son más estables y no deberían cambiar a menudo. Veréis que hay mucha info que aparece en la aplicación que es replicada en la web, sin embargo hay secciones como los puntos de sitios de interés que es más completa en esta aplicación de iOS. Las subsecciones de esta funcionalidad son las  siguientes:

  1. Información:  es una réplica de la información de un establecimiento, dispone de un texto introductorio para colocar sobre el mapa, el título del establecimiento, su imagen en miniatura, una descripción ampliada junto con la información de los servicios que ofrece y las estrellas o rango establecido en función de lo que sea.
  2. Situación:  sólo abrir la pestaña de situación de un establecimiento encontraremos la posición GPS en el mapa de Google Maps para iPhone. De hecho, si pinchamos sobre la chincheta roja aparecerá un cartel indicando el nombre del establecimiento, su rango y su localización exacta de longitud y langitud en formato de coordenadas geodésicas de gmaps. El botón a la derecha con signo más (+) indica la posición actual del usuario y el de la flecha a la derecha (>) hace que el mapa se posicione donde se encuentra el establecimiento. Por último, sin pinchamos en el icono de información (i) aparece un menú para seleccionar un sitio de interés relacionado con la posición del establecimiento, al seleccionar uno de estos sitios, el mapa “volará” hasta su posición y colocará allí una chincheta violeta, esta, muestra un cartel con el nombre y un botón al pinchar sobre ella, este botón nos muestra un recuadro de información sobre el sitio de interés, que contiene un texto con enlaces que se abrirán en el navegador Safari para ampliar la información, calcular nuestra ruta,etc. El botón de la flecha nos llevará a la aplicación de Google Maps de iPhone para mostrarnos todos los establecimientos de la empresa y poder calcular rutas o realizar cualquier otra operación con dicha aplicación.
            
  3. Imágenes: al pinchar sobre la pestaña aparecería una galería de imágenes con sus respectivos títulos en la parte superior de la ventana, los botones anterior (|< ) y siguiente ( >| ) permiten navegar con transiciones por las distintas imágenes disponibles. El botón de Play ( |> ) hace que comience la reproducción de imágenes en secuencia, hasta que volvamos a pulsar sobre la imagen una vez. Si mantenemos el dedo presionado sobre la imagen unos segundos o pulsamos sobre el icono de compartir ( []=> ) aparecerá un menú que nos brinda la opción de poder guardar la imagen en nuestra galería de imágenes. Si se ejecuta una doble pulsación, agrandaremos la imagen y el gesto de peñizcarla además modificará su tamaño. Podemos arrastrar la imagen por la pantalla o girar el dispositivo para verla con una disposición distinta.
            
  4. Contacto:  esta sección de información de un establecimiento consiste en proporcionar al cliente toda la información referente a aquel, ya sea el teléfono, la web o el email con sus respectivos botones para acceder a estas funcionalidades, hasta la dirección, Fax y por último más información sobre el emplazamiento.
  5. Mediante el uso del botón refrescar en el listado de establecimientos podemos recargar manualmente los datos de la base de datos de estos.
  6. Las opciones de configuración de la aplicación para caché de imágenes, bases de datos, GPS, segundos entre cada pase de imágenes, y otras están en la aplicación de Ajustes de iOS -> Grupo Abades

2.- Promociones y eventos:

los empleados de la empresa, a través de la herramienta web de administración de promociones, colocan en abades.com y sus otras webs una lista de promociones, esta lista es accesible por medio de un fichero XML,tal como en la funcionalidad anterior se almacena una caché temporal de estas que permite visualizar una lista con títulos, centros y una imagen asociada, al pinchar sobre cualquiera de ellas entraríamos en la presentación de la imagen de la promoción ampliada, un texto descriptivo de la misma así como la información de contacto: teléfono, web, mail, etc. Su fecha y el centro de emplazamiento de la promoción o el evento.
     

3.- Mi cuenta en Abades:

Esta sección de la aplicación se utiliza para crear una cuenta con la que poder reunir puntos y reservar, con el fin de,  luego, canjear regalos, que ofrece la empresa a sus clientes, agradeciendo la estancia de estos en sus establecimientos. Lo primero que debemos hacer es entrar en Mi cuenta -> Crear Cuenta , rellenar los datos de: e-mail, contraseña y tu nombre y pulsar en el botón “Crear Cuenta“. Hecho esto nos llegará un e-mail de activación en el que debemos buscar un enlace para activar la cuenta en la aplicación de google app engine. Una vez activada nuestra cuenta, podemos rellenar los datos en “Mi cuenta -> Tengo Cuenta”  y pinchar en “Entrar con mi cuenta“, si todo ha ido bien aparecerá una ventana con los datos de tu cuenta, e-mail, nombre y puntos abades.
Estos puntos se consiguen por medio de checkins usando una cuenta de Foursquare. Es un requisito fundamental ya que todos los establecimientos se encuentran asociados a la cuenta de foursquare. Ahora pincharemos en el activador ON/OFF de Foursquare e introducimos nuestro usuario (email/teléfono) y password de esta red. Al pinchar aceptar debe aparecer un botón “Cerrar sesión“, lo cual nos indica que hemos iniciado la sesión correctamente, podemos usar el icono de cerrar (x) para volver a los datos de nuestra cuenta y ahora el indicador on/off estará activado, ya podemos hacer checkins desde el Mapa de la aplicación.

4.- Mapa:

Esta funcionalidad de la aplicación del Grupo Abades se utiliza para colocar todos los establecimientos de la empresa sobre el mapa y poder encontrar el que esté más próximo a nosotros con objetivo de realizar un checkin (estoy aquí) y recibir los puntos que proporciona el establecimiento por hacerlo cada día.
Hay que tener en cuenta que el cálculo de la distancia se realiza en línea recta por lo que si queremos saber la verdadera medida de distancia para viajar al establecimiento debemos usar otro software de GPS, para eso podemos utilizar el botón Google Maps para ver las posiciones de los establecimientos sobre la aplicación Google Maps de iPhone y calcular una ruta óptima en coche, bici, transporte público o a pie desde nuestra posición actual. Sólo cargar el mapa aparece una chincheta roja y si pulsamos sobre ella veremos que refleja nuestra posición GPS actual,

     

tal como reza el cartel superior derecho de Latitud y Longitud. En este mismo cartel podemos controlar el nivel de zoom del mapa con el deslizador dispuesto a tal efecto. Otros controles útiles son el centrador de posición ,con el botón “Mi posición“,  tendremos actualizada nuestra posición en todo momento, centrando el mapa en esta cada cierto número de segundos. Los botones Mapa|Sat|Híb modifican el formato de visualización de aquel de mapa a satélite o híbrido (mezcla de los dos primeros). Ahora, usaremos el botón con fondo azul y un radar blanco para que la aplicación busque el establecimiento más cercano a nuestra posición (si es que hemos permitido a esta el uso de nuestra localización,claro), y se mostraría una ventana con el título “El sitio más cercano es:” y el título y los kilómetros de distancia, al aceptar observaríamos que el mapa ahora está posicionado con el centro en dicho establecimiento y que pinchando sobre el icono de chincheta de Abades ([a]) aparece un recuadro con el título, categoría y un botón para mostrar una ventana que contiene información del sitio y un botón para hacer Checkin.

    
Al hacer checkin la aplicación intentará conectar con el servidor enviando los datos de nuestra cuenta y si hemos configurado que se muestren nuestros checkins en foursquare y redes sociales twitter y facebook aparecerá un mensaje del tipo “Chekin desde la app de Abades en el establecimiento…., obteniendo … puntos” con la información correspondiente, en estas redes sociales y en una ventana de información que nos confirma que todo ha ido correctamente, con nuestro nuevo saldo de puntos de Abades, ahora podemos consultar nuestra cuenta ,de la funcionalidad anterior y asegurarnos de que efectivamente tenemos esa cantidad de puntos de la que nos han informado. Lógicamente un usuario sólo puede hacer uso de una cuenta de Foursquare, en el momento en que la cuenta se utiliza para hacer un checkin en otra cuenta que no es la suya se borrarán todos los regalos reservados y puntos asociados.En el momento de hacer checkin además seremos informados de las últimas ofertas exclusivas para Foursquare y el Grupo Abades.

5.- Noticias y tweets:

este módulo consiste en la lectura del RSS generado por Yahoo! Pipes pasado a través de Feedburner para gestionar social media de todas las últimas noticias de todos los blogs y webs de la empresa, se muestra un listado de las últimas novedades y al pinchar en una de ellas aparece un resumen,  con título y fecha, podemos leer la noticia ampliada en la misma ventana mediante el icono del mundo o bien abrirla en el navegador Safari por medio del botón de “enviar a”  ([]=>). La sección de tweets accesible desde el logotipo de la empresa es exactamente igual en cuanto a funcionamiento pero sólo de la red Tweeter.
            

6.- Sección de regalos:

quizás la parte más interesante para los clientes, pues reciben algo físico a partir de su acción virtual. Consiste en reunir puntos de Abades por medio de checkins en los distintos establecimientos de la empresa, y ,tras consultar el listado donde aparece con un scroll horizontal, los diferentes premios
 
que podemos conseguir con estos puntos, seleccionamos el que deseemos y lo reservamos, después nos dirigimos al establecimiento donde se encuentra dicho item reservado y lo canjeamos en el punto habilitado para ello. En caso de cancelación se devolverían los puntos a la cuenta.

Para programadores:

El Reto

El reto de esta app consistió en poder crear una herramienta que sincronizara los datos de la web actual (abades.com) con los demás dominios (abadestriana.com, abadesnevadapalace.com) y appspot.com, y después crear un algoritmo para hacer un checkin válido así como sincronizar todos los elementos RSS en un único canal y adjuntarlo al programa de promociones actuales de las webs (blogs, noticias, etc. para cada idioma, inglés y español).

¿Qué usa la aplicación?

  • Un conjunto de servicios webs habilitados en una aplicación en Google App Engine para rellenar el contenido de la base de datos SQLite que trae (populate) instalada.
  • API de Foursquare para hacer checkin (con twitter y facebook habilitados)
  •  CoreLocation de iOS para comprobar la distancia al establecimiento más cercano, enviando si las condiciones se cumplen, un mensaje encriptado al servidor de appspot que los comprueba y aumenta los puntos de la cuenta de usuario que está utilizando la app.

¿Cómo se hizo?

La programación empezó donde véis el artículo de como crear una aplicación productiva y social, el esquema era el mismo, pero había que añadirle toda la parte de programación de servidor, ya que la empresa necesita tener actualizada la información que se comparte con los dispositivos y sus webs, la opción de crear un algoritmo en PHP era tentadora pero una aplicación de móbil necesita una buena respuesta y un servidor web no es precisamente una máquina en la que uno desee confiar plenamente, es decir, no siempre está operativa 100% porque tiene muchos usuarios desde la web, por lo que opté por un servidor de google app engine y usando Java creé todas las estructuras de datos donde almacenar la información de establecimientos como en las guías de los cursos de este blog, después lancé los servicios web que permiten dar de alta todos estos datos, y que son capturados por los analizadores sintácticos de la aplicación móvil, más adelante configuré efectos gráficos, mejoré el diseño y añadí la API de Foursquare gracias a frameworks ya disponibles en la red.

El analizador sintáctico es NSXMLparser, el framework ASIHttp permite descargar imágenes con caché de forma síncrona o asíncrona, el scroll view de regalos usa una caché para poder crear todos los que hagan falta, el modelo de datos es sencillo, contiene elementos transformables para almacenar listas, estas listas en Google App Engine con DataStore son persistentes y embebidas en clases que permiten la serialización de objetos, etc.

En cuanto a los mapas no hay mucho que contar, es lo que se suele hacer, una clase para las anotaciones, se captura el evento del dibujado para dibujar un icono distinto e intercalar un botón en recuadro que se muestra al pulsar sobre una chincheta o anotación, y las animaciones están hechas con QuartzCore, es decir UVAnimation con cambios entre transiciones de opacidad, tamaño y posición,…lo sé ,aún se puede mejorar :)

Puedes descargar la aplicación desde su sección: aquí.

Aplicación para iPhone: Carta Astral

Esta aplicación surgió como un proyecto personal a partir de la necesidad de crear cartas astrales.

El reto comenzó con la forma en que se han realizar los cálculos de una carta astral. Por suerte, hay un software escrito en C, de los alemanes Dieter Koch and Alois Treindl y Astrodienst Zurich llamado SWISSEPH, conecté por consola ssh con mi servidor, utilicé wget con la última versión ( 1.76 ) y tras el make probé Swetest que a partir de una serie de argumentos de entrada muestra por pantalla un “ephemeris”, el resultado de leer una base de datos de posiciones de planetas, asteroides, estrellas, etc. y devolver las posiciones para cada una de las casas de dicha fecha y hora en el lugar especificado por longitud y latitud.Este programa además lanza una serie de datos para generar gráficas como “spreadsheets”.

Usando estos datos y un pequeño script:

//Analizar sintácticamente la fecha,hora,longitud y latitud
exec ("swetest -edir../src/ -b$utdatenow -ut$utnow -p0123456789
-eswe -house$longitud,$latitud, -fPlj -g, -head", $salida);
 foreach ($salida as $key =&gt; $linea)
      {
        $row = explode(',',$linea);
        $pl_name[$key] = $row[0];
        $longitude[$key] = $row[1];
        $house_pos[$key] = $row[3];
      };

Donde cada línea de salida de swetest se divide en arrays $row, con los elementos:0 = planeta,1 = longitud,2 = posición de casa, planetas en 0 – 9, cúspides en 10 – 21. Los nombres de los componentes,empiezan por 0 = Sol, que es la estrella del sistema solar,junto con la Luna=1 y Mercurio = 2 hasta Plutón = 9, los símbolos serían del 1 = Aries hasta 12 = Piscis. Para asociar la longitud y latitud al signo se hace una regla de 30 que limita la longitud y la combina con la casa asociada que devuelve el programa, de esta forma, podemos generar una imagen con instrucciones de dibujado geométrico (círculos, líneas, símbolos como texto)…Podéis ver un ejemplo aquí.

Para generar textos más completos he utilizado webs que los devuelven gratuitamente a partir de los datos, como grupovenus.
Finalmente, con un script en Python dentro de Google App Engine se crean todas las consultas en segundo plano, se construye el XML con HTML+CSS embebido, imágenes, etc. y se guardan, previo análisis sintáctico mediante la clase NSXMLParser en la base de datos SQlite asociada al Modelo de Datos, tal como vimos en los cursos.

Las animaciones de la app: las transiciones están hechas en OpenGL (HMGLTransition) y con las clases CAAnimation. El menú giratorio es una extensión de la clase UIGestureRecognizer ( KTOneFingerRotationGestureRecognizer ) modificada adaptando cada sección a un ángulo con una animación UIView…

Para la base de datos, primero se genera el modelo de datos, luego se compila y ejecuta la aplicación para que el mismo SDK cree el fichero SQlite así, tenemos la base sobre la que insertar los datos, una vez hemos rellenado todas las tablas, copiamos el fichero sqlite al proyecto y con un código como este:

 

NSString *storePath = [[self applicationDocumentsDirectory]
stringByAppendingPathComponent:
 @"Carta_Astral.sqlite"];
 
// Set up the store.
// For the sake of illustration, provide a pre-populated default store.
 
NSFileManager *fileManager = [NSFileManager defaultManager];
// If the expected store doesn’t exist, copy the default store.
if (![fileManager fileExistsAtPath:storePath]) {
NSString *defaultStorePath = [[NSBundle mainBundle]
pathForResource:@"Carta_Astral" ofType:@"sqlite"];
if (defaultStorePath) {
[fileManager copyItemAtPath:defaultStorePath
toPath:storePath error:NULL];
}
}

la primera vez que se ejecuta la aplicación, se copia al directorio de Documentos y ahí es donde se graban los datos del usuario, hago especial énfasis en que los tipos de datos complejos como Arrays de imágenes, textos y nombres se guardan en un tipo de dato del Modelo de Datos de Cocoa llamado Transformable.

En la sección de manuales hay tres tipos de manuales, los vídeos de youtube que se cargan sobre un objeto WebView, los textos con imagen que se cargan sobre una vista a mano y los pdf’s que se descargan a una caché con ASIHttp DownloadCache…Para paginar todos los documentos, libros, vídeos he usado una clase que crea un número infinito (gracias Andreas Katzian) de ScrollViews y los guarda en una caché de vistas para no tener que ir generándolos cada vez que se cambia de página, de forma que sólo se consulta una vez a la base de datos, se guarda una caché de tuplas y luego una caché de vistas con sus correspondientes botones, etc., así es mucho más eficiente y sencillo.
Para compartir textos e imágenes se utilizó ShareKit.

Veréis que las barras de navegación y las barras botones (tab) tienen una textura de fondo, esto se hace sobrecargando la clase correspondiente, en concreto el método de dibujado, para hacer que pinte una imagen por debajo y luego el resto del contenido.

La aplicación está siendo desarrollada

Aplicaciones web multiplataforma con XSL y XML: un reto SEO

Gracias al uso de XSL vamos a transformar un XML para lo que nos convenga.

Lo primero, la utilidad, una aplicación en PHP o Java o cualquier otro lenguaje, como por ejemplo un juego o un TPV, una tienda, un portal…, cualquier tipo de aplicación puede compartir datos como hemos visto en los cursos y talleres de servicios web, pero podemos avanzar un poco más: si comprendemos el uso de una plantilla XSLT que transforme un fichero XML, siendo este la salida de nuestra aplicación, en un fichero XHTML que el navegador interpreta, sea en un móvil, un ordenador de escritorio o cualquier otro formato que necesitemos…entonces, las posibilidades son ilimitadas.

Para nosotros como webmasters, programadores, diseñadores…, un XSLT es un fichero que sirve para dar formato HTML a un fichero XML.
http://es.wikipedia.org/wiki/Extensible_Stylesheet_Language_Transformations
¿Cómo?
En español, si abres un fichero .XML con el navegador, éste lee la cabecera buscando de qué manera interpretarlo, aquí entra en juego el esquema XSLT, donde la T es de template, o sea, plantilla, en nuestro caso, una plantilla XHTML.
Bueno, vamos a los ejemplos, éste en concreto es de la W3C:
http://www.w3schools.com/xml/simplexsl.xml
como ves, es una dirección .XML que interpreta el navegador, incluso el IE6 :-).
Esto lo hace gracias a que en la cabecera aparece:

<?xml-stylesheet type=”text/xsl” href=”simple.xsl” ?>
entonces, usa la hoja de estilos o plantilla para dar formato que está en la misma dirección pero con distinta extensión:
http://www.w3schools.com/xml/simple.xsl
como ves, este fichero se basa en un esquema de TRANSFORMACIÓN

, lo que quiere decir que va a tomar el contenido del fichero inicial .XML y usando las reglas del XSL va a convertir las etiquetas con nombres comunes, en el ejemplo, son elementos del desayuno, ej.) “<breakfast_menu>” , en divisiones del tipo:
——-
<div style=”..”>
<span>
<!–etc.–>
</span>
</div>
——-
En concreto, esta regla es :
________________________________
<xsl:for-each select=”breakfast_menu/food”>
[CODIGO XHTML]
</xsl:for-each>
________________________________
para extraer los valores de un elemento de un nodo xml, se utiliza <xsl:value-of select=”RUTA/NOMBRE_NODO”/>
que es lo que se utiliza en el ejemplo para el precio, nodo <price> (que está dentro de <food>, que está dentro del menú <breakfast_menu>, que es la raíz o root del documento).
Para mostrar el valor de un atributo, por ejemplo,si a cada nodo <price> le añadimos la moneda:
<price currency=”dollar”>8.50</price>
en la plantilla xslt ,el valor se sacaría, así:
<xsl:value-of select=”price/@currency”/>
ya que estamos dentro de un bucle (o loop) que recorre todos los elementos del tipo
breakfast_menu/food
es decir, todos los <food>, dentro tienen un <price> y sacamos el atributo currency con la @.

La lista completa de referencias de XSL con templates está en:
http://www.w3schools.com/XSL/xsl_w3celementref.asp

Este es un ejemplo sencillo porque no incluye ningún DTD o definición de datos (en lenguaje XTiger), este se suele utilizar para hacer las cosas bien como ingenieros, …este DTD es un fichero que está por debajo del XML y es el que determina cómo se debe construir el árbol DOM completo, es decir, si no se siguen las reglas del DTD base, el fichero XML no es válido. Pero esto ya es pa nota jeje…hace unos años escribí un generador de código php+xhtml+jscript+css en php-gtk que creaba el esqueleto de una web en función a un xml ,el vídeo está aquí:

Resumiendo, podemos tener una aplicación que genere el mismo código XML para todas las plataformas pero cambiando sólo el esquema XSLT le diremos a la aplicación final que interpreta dicho XML cómo ha de hacerlo. Para el caso de móviles utilizaremos su lenguaje propio, al igual que si fuera una aplicación externa que necesitamos conectar/adaptar con nuestra aplicación, pudiendo usar servicios web como ya vimos en otros tutoriales si necesitamos algo más avanzado.

Para editar XSLT tienes editores a patadas :] ( Amaya )

Más tutoriales:

y más cosas habrá por ahi…

¿Quién está usando XML y XSLT hoy en día?: Blizzard lo utilizó en su primera versión de su web de Starcraft 2 ( XML , XSL -en este caso usan un script PHP que define el idioma y lo coloca en el atributo lang que se interpreta en la plantilla XSL- ), supongo que mantenía una base de datos interna en la empresa y quería reutilizarla por lo que le dió una salida xml y creó un esquema xslt bastante chulo, no me extrañaría que fuera la misma aplicación que usaran para gestionar el trabajo de los empleados… Otras empresas lo utilizan, Microsoft para su Office, OpenOffice también,…las universidades quieren pasar todo a XML, en Sun, digo, Oracle, todo se quiere hacer en función a XML para poder traspasar todas las fronteras y si no pueden usar un xslt para transformar de un lado a otro con facilidad.

Las ventajas de usar XML como código fuente es que podremos ocultar un poco mejor el XHTML final de posibles plagios e intentos de ataque, la información mostrada es muy fácil de leer, esto es bueno para la web semántica (web 3.0!), bueno para el posicionamiento (SEO),claro, de hecho Google anunció que una página en XML y XSLT iría a la cabeza antes que otra en XHTML, las arañas, webbots ,spiders, como queráis llamarlas, graban mejor información en XML y hacen las transformaciones a XHTML…además es un buen reto construir una web en XML,

¿O no?

 

Aplicación web de anuncios con mapas de Google Maps

Hace unos años estuve realizando pruebas con aplicaciones web simbióticas usando mapas de Google Maps, finalmente algunos clientes me pidieron productos basados en dichas pruebas, en el vídeo mostrado a continuación se muestra una de ellas, del dominio inmorusticas.com, está en fase muy beta aunque las críticas son bien recibidas, como siempre…, pero se puede dislumbrar lo fácil que es construir sin un equipo de diseño, sólo con mi trabajo como programador un sitio web como los que actualmente están “dando caña” en internet.

Está optimizado para SEO  (posicionamiento) aunque siempre se puede mejorar, por ejemplo, las direcciones amigables google se pueden optimizar más aún.

Los puntos fuertes de una aplicación de este tipo,son

  • la mayor parte hecha en AJAX con Php y MySQL
  • tiene un generador interno de formularios basado en plantillas
  • se pueden añadir categorías, subcategorías
  • inmuebles con una interminable lista de campos a rellenar, entre los que cuentan: la posición en el mapa con coordenadas de latitud y longitud, imágenes que aparecen animadas, datos de varios tipos como requisitos de la información de la propiedad
  • varias formas de indexar los elementos: filtros a medida, por provincia, categoría, subcategoría, precio,etc.
  • una administración interna para dar de alta/modificar/eliminar/aceptar las fichas en cada categoría así como los servicios e información del sitio web.
  • sindicación de contenidos por RSS: compartir los anuncios para con otros servicios web con XML

y seguramente me dejo algo más pero es sólo para dar una idea de lo que se puede hacer, básicamente todos los sitios de anuncios utilizan este tipo de estructura y arquitectura de la información, además de los mapas de Google Maps, claro.

Ejemplo de Aplicaciones para iPhone, iPad, iPod – 2D, 3D – juegos

Este juego se está realizando como proyecto personal, mientras realizo el resto de aplicaciones para clientes; se trata de un juego de rol multijugador online, se paga por tener una cuenta, durante la fase beta (ahora mismo se encuentra en fase pre-alfa) se podrá jugar a la primera pantalla de un mundo con dos personajes.
Está construido con lenguaje LUA sobre el motor Shiva de Stonetrip.com, la comunicación con el servidor se realiza mediante PHP y el protocolo HTTP usando paquetes de información encriptados en XML generados a partir de los datos cotejados de la base de datos MySQL con una aplicación web en PHP con el framework zenphp.
El punto fuerte del juego es el algoritmo generador de mundos que permite reiniciar el juego manteniendo los personajes o usando unos nuevos pero con una experiencia nueva para el jugador.
Los gráficos se están realizando por la empresa BlueShadowGames de Granada.
Este video muestra el progreso de la fase pre-alfa del juego:

Creación de un paquete de servicios web para un modelo de datos JAVA

Una vez creado nuestro paquete con la aplicación Java para interactuar con los servicios web como hemos visto en la lección anterior, vamos a realizar las tareas que habíamos dicho paso por paso. Es decir, vamos a crear un servicio web con una operación para añadir un usuario con su nombre de usuario, password, un nombre de piloto y una nave con su cantidad de armamento, otro para obtener una lista de usuarios con pilotos y naves y otro para hacer un login con usuario y password, para ello:

CREAR DIRECTORIO DE XML:

  1. Dentro de las propiedades del Proyecto Java Web “Excalibur” en la categoría de Sources  -> Package Folder -> Add Folder -> creamos el directorio “XML” dentro de “src” y de etiqueta (label) ponemos “XML”. Aquí vamos a colocar nuestros ficheros WSDL para ver como se construyen servicios web a partir de estos, pero primero el método sencillo…ahora se puede añadir al esquema de forma gráfica cualquier dato y se formatea por el sistema ,podemos crear un servicio web a partir del fichero…

CREAR SERVICIO WEB

  1. En el paquete “es.ugr.battlegalactica.servicios” -> botón derecho  -> New -> Web services -> Web Service -> “construccionNexus”. Añadir el constructor de la clase y la variable estática Nexus nexus de ésta clase, que se incializa en dicho constructor…

CREAR OPERACIÓN PARA AÑADIR UN USUARIO CON SUS PILOTOS Y SUS NAVES ASOCIADAS

  1. Segundo botón en el código dentro de la clase “construccionNexus” -> “Insert Code…” -> “Add Web Service Operation” -> le llamamos “crearUsuarioConPilotosYnaves”
  2. En return type (tipos devueltos) ponemos java.lang.Long y así, si es -1 ha ocurrido un error y en otro caso es el ID del nuevo usuario
  3. Para los parámetros necesitamos que tenga: un nombre y password de usuario,un nombre de piloto  y un nombre de nave; por lo que empezamos por añadir el primer campo con name: “datos_usuario” , type: Choose -> find type -> buscamos “usuario” y seleccionamos el del modelo de datos de BSGModelo, ahora hacemos lo propio para “datos_piloto” -> Piloto y “datos_nave” -> Viper. Pinchamos en “OK” y se genera el código en Java, sólo hemos de meter los datos correspondientes que nos pasa tan amablemente el servicio web a la base de datos de Nexus ,tal como hacíamos en Prueba.java…
    la función de la operación debe quedar así:

    @WebMethod(operationName = "crearUsuarioConPilotosYnaves")
    public Long crearUsuarioConPilotosYnaves(@WebParam(name = "datos_usuario")
    Usuario datos_usuario, @WebParam(name = "datos_piloto")
    Piloto datos_piloto, @WebParam(name = "datos_nave")
    Viper datos_nave) {
     
    if (nexus.obtenerUsuario(datos_usuario.getUsuario())!=null ){
    //El usuario ya existe, salir!
    return new Long(-1);
    }
     
    //Añadir Viper
    Viper v  = null;
    try { //Buscar viper:
    v = nexus.obtenerViper(datos_nave.getNombre());
    } catch (ViperNoEncontradoException ex){
    //La nave no existe, la añadimos
    v = new Viper(datos_nave.getNombre());
    v.setArmamento(datos_nave.getArmamento());
    } finally {
    //En otro caso, la nave es la misma?
    if (!v.getId().equals(datos_nave.getId())){
    //No es la misma, error
    return new Long(-1);
    }
    }
     
    //Añadir piloto:
    Piloto p = null;
    try {
    p = nexus.obtenerPiloto(datos_piloto.getId());
    } catch (PilotoNoEncontradoException ex){
    //NO Existe el piloto, crearlo
    p = new Piloto(datos_piloto.getNombre(), datos_piloto.getDestreza(),
    v.getId());
    nexus.guardarPiloto(p);
    } finally {
    //El piloto existe, tiene la misma ID?
    if (!p.getId().equals(datos_piloto.getId())){
    return new Long(-1);
    }
    }
    ArrayList<Long> lista_pilotos = new ArrayList<Long>();
    lista_pilotos.add(p.getId());
     
    //Añadir el usuario con los datos almacenados ya en Nexus:
    Usuario u = new Usuario(
    datos_usuario.getUsuario(),
    datos_usuario.getPassword(),
    lista_pilotos );
     
    nexus.guardarUsuario(u);
     
    return u.getId();
    }

    Para probarla primero hacemos click con el segundo botón del ratón en el proyecto Excalibur > Deploy ,esto instalará la aplicación web con la nueva operación compilada, ahora vamos a la lista de servicios web y pulsamos en test Web Service, ya podemos añadir usuarios con un piloto y una nave

CREAR OPERACIÓN PARA HACER UN LOGIN CON USUARIO Y PASSWORD

  1. Una vez creado un usuario en la base de datos la función para hacer un login es tan simple como esta:
    @WebMethod(operationName = "hacerLogin")
    public String operation(@WebParam(name = "usuario")
    String nombre_usuario, @WebParam(name ="password") String contrasena) {
    //TODO write your implementation code here:
    Usuario u = nexus.obtenerUsuario(nombre_usuario);
    if (u==null) return "El usuario no existe";
    else if (u.getPassword().equals(contrasena)){
    return "Acceso concedido";
    } else {
    return "Contraseña inválida";
    }
    }

    Recordar que para testear los servicios podemos hacerlo en SOAP UI:

CREAR OPERACIÓN PARA OBTENER UN LISTADO DE USUARIOS

  1. Es simplemente crear un listado a partir de recorrer el array de estos y devolverlo para que lo analice sintácticamente el sistema y devuelva la construcción XML correspondiente:
    public List<Usuario> listadoUsuarios() {
    List<Usuario> listado = null;
    for (Iterator<Usuario> iter = nexus.listarUsuarios(); iter.hasNext(); ){
    listado.add(iter.next());
    }
    return listado;
    }

Buenas prácticas de programación: Los servicios web son un tipo de comunicación, añadir lógica de programación resulta en algo no-generalizable y por lo tanto ,no reutilizable. Resumiento: hay que hacer una conversión de los datos de un modelo de datos en un modelo de datos de un servicio web,i.e.,las clases con su lógica de programación en Java a un modelo del servicio y luego el paso inverso. Entre medias están las páginas web u otros clientes que los utilizan con su propia lógica. Por ello se recomienda diseñar los servicios web lo último, cuando ya tenemos todo lo que necesitamos en cuanto a datos y lógica interna con ellos, separar cada fichero WSDL para cada servicio es recomendable por si necesitamos cambiar algo y nos cuesta menos trabajo.

CREAR CLIENTES PARA CONECTARSE A LOS SERVICIOS WEB

  1. En el proyecto “Excalibur” creamos el paquete “es.ugr.battlegalactica.servicios” y dentro de este -> segundo botón del ratón-> New -> Other -> Web Services -> Web Service Client -> seleccionamos del proyecto “Excalibur” el Servicio Web “construccionNexus” -> OK ; y ahora en package ponemos “es.ugr.battlegalactica.clientes”. Esto debe crearnos todas las clases Java para comunicarse con las operaciones del Servicio Web. Pero para saber que funcionan usamos un JUnit Test , creamos un paquete llamado “es.ugr.battlegalactica.clientes” y dentro un nuevo JUnit Test para clases existentes, elegimos la clase a testear y hacemos como en la primera lección las unidades de prueba.

< Volver al curso de Arquitectura de Servicios Web con JAVA y PHP

Página 1 de 3123
footer
jbelon © | sitemap.xml