[Jderobot-dev] Interfaz Web para TrafficMonitor

Dom Abr 1 19:28:33 CEST 2012

Hola compañer en s,

Tras varias semanas invistigando sobre el tema y rastreando la web al final
encontré la solución (quizas hay otras, pero desde luego creo que es la más
sencilla). Para la parte de comunicar el servidor web con el TrafficMonitor
al final he utilizado PHP+Python y Ice. Cuando el usuario cambia algun
parametro de configuración, llamo a un script de PHP que a su vez llama a
un script de Python que se encarga de ejectuar la llamada Remota con ICE y
cambiar la configuración utlizando los nuevos datos recibidos. El script
PHP despude de ejecutar el script de Python, genera dinamicamente la nueva
configuración.

Para mostrar el video "enrequicido" (video recibido desde el cameraserver +
cosas que dibujo utilizando GDK) lo que hago es lo siguiente:

1) Guardar el buffer de dibujo de GDK utilizando el metodo "save" de la
clase PixBuff en una imagen jpeg, el codigo queda mas o menos como lo
siguiente:

         // Create a Gdk::Drawable from pixmap
         Glib::RefPtr< Gdk::Drawable > drawable(window);
         const colorspaces::Image& img = model.getImage();
         Glib::RefPtr<Gdk::Pixbuf> pix_buff = Gdk::Pixbuf::create(drawable,
                                                                  0,
                                                                  0,
                                                                  320,   //
tamaño de la iamgen
                                                                  240);  //

        pix_buff->save( "image.jpeg", "jpeg" );

Este código vuelta la imagen que hemos generado (con los dibujos y todo) al
fichero image.jpeg

Ahora queda la parte de generación del video y servirlo al navegador. Para
ello al final o que he utilizado es un formato llamado MJPEG, que es
básicamente un stream de video hecho a base de imagenes sucesivas JPEG.
Este formato se basa en el content-type "multipart".

http://en.wikipedia.org/wiki/Motion_JPEG
http://en.wikipedia.org/wiki/MIME#Multipart_messages

Para ver este "video" en una web basta con hacer lo siguiente:

   - En el HTML incluir un img src que como "src" llama a un script Python:

        <IMG id="myimage" src="/cgi-bin/get_picture.py" border="1"
width="640" heigth="480">

   - El script de Python get_picture.py tiene un bucle infinito, que
   básicamente lee la imagen y la sirve:

#!/usr/bin/python
import os
from time import sleep

img_path = path_de_la_imagen_generada

print "Content-Type: multipart/x-mixed-replace; boundary=CCT_Boundary\n"
while True:
    data = open(img_path, 'rb').read()
    print """
    --CCT_Boundary
    Content-Type: image/jpeg
    Content-length: %s\n""" % str(len(data))
    print data
    sleep(0.05)

Saludos,
Redo.

2012/2/19 redouane kachach <redo.robot en gmail.com>

> Buenos días compañer en s,
>
> Estos días estos explorando alternativas para desarrollar una interfaz web
> para la aplicación TrafficMonitor. La idea es desarrollar una interfaz web
> para facilitar el acceso a la aplicación desde cualquier sitio. Todo esto
> manteniendo la Gui existente de GTK.
>
> http://www.youtube.com/watch?v=MvPY1CBapE4
> http://www.jderobot.org/index.php/User:Redo
>
> La actual interfaz hecha en GTK consiste (como podéis ver en el vídeo) en
> un conjunto de checkboxes para hablitar/deshabilitar las diferentes
> funcionalidades de la aplicación, con alguno que otro slide. Para la
> parte de configuración tengo las siguientes dudas:
>
> 1) Como conectar el servidor Web con la applicación del TrafficMonitor: En
> este apartado habia pensado en utilizar CGI + PHP o Javascript para
> procesar la configuración y luego mandarla a la app del TrafficMonitor. En
> cuanto a la interfaz entre el script CGI y el TrafficMonitor no tengo claro
> que utilizar. En este caso se me occuren las siguientes alternativas:
>
>    - Una interfaz XML para describir los distintos parametros de
>    configuración
>    - Una interfaz propia con algun protocolo propio para mandar los
>    distintos parametros de configuración
>
>
> 2) La segunda duda que tengo es como mandar el video que genero para
> mostrarlo en la interfaz web). El video es básicamente el mismo que viene
> desde el cameraserver + cosas que dibujo por encima utilizando Cairo. Hasta
> el momento he conseguido volcar el video del DrawingArea a una imagen
> (JPEG, pero hay más formatos disponibles). Aqui no sé cual es la mejor
> opción:
>
>    - Utilizar el snapshot + algun opcion de refresco (javascript o PHP)
>    para forzar el servidor a que refreseque solo la imagen en la interfaz. He
>    hecho unas pruebas báscicas con esta opción y no me acaba de gustar. El
>    video "parpadea" por mucho que baje el rate de refresco. El problema
>    persiste incluso haciendo uso de dos imagenes con un link symbolico para
>    alternar entre una y otra a medida que se van construyendo.
>    - No sé si es posible generar un stream de video del snapshot que voy
>    guardando. Si esto es posible, se podra utilizar algun protocol standard de
>    streaming para mostrar el video en la interfaz Web.
>
>
> Otra alternativa que he visto por hay es utilizar Websevices (sobre todo
> para implementar la interfaz 1)). Ahora bien, no he entrado mucho en
> detalle para ver que cosas se pueden hacer con esta tecnologia.
>
> La solución eligida al final me gustaria que respete los siguientes
> criterios:
>
>    1. Lo más estandard posible y que dependa de tecnologias/SW
>    ampliamente soportado.
>    2. El cliente no tenga que instalar nada raro. Deberia poder acceder a
>    la interfaz con un simple browser.
>    3. Tiempo real (sobre todo para el video que se esta mostrando en la
>    web).
>    4. Los compnentes/modulos SW deberian esta disponible bajo la GPL o
>    una licenacia compatible.
>
>
> En cuanto al servidor Web pienso utilizar *lighthttpd *(
> http://www.lighttpd.net/) he liedo buena critica del mismo, lo he probado
> y la verdad el setup básico no requiere mucha configuración. Otra
> alternativa es Apache, pero quizas para lo que necesito no me hace falta
> tanta potencia.
>
> Cualquier ayuda/sugerencia/alternativa es más que bienvenida.
>
> Muchas gracias de antemano,
> Redo.
>
>
>
>
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: http://gsyc.escet.urjc.es/pipermail/jde-developers/attachments/20120401/249c632f/attachment.htm 