Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda

1 Equation Chapter 1 Section 1 Trabajo Fin de Grado Grado en Ingeniería de las Tecnologías de Telecomunicación Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda Autor: Sara Callejón Sánchez Tutor: Jesús Iván Maza Alcañiz Dpto. Ingeniería de Sistemas y Automática Escuela Técnica Superior de Ingeniería Universidad de Sevilla Sevilla, 2021 2 Trabajo Fin de Grado Grado en Ingeniería de las Tecnologías de Telecomunicación Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda Autor: Sara Callejón Sánchez Tutor: Jesús Iván Maza Alcañiz Dpto. Ingeniería de Sistemas y Automática Escuela Técnica Superior de Ingeniería Universidad de Sevilla Sevilla, 2021 4 Proyecto Fin de Carrera: Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda Autor: Sara Callejón Sánchez Tutor: Jesús Iván Maza Alcañiz El tribunal nombrado para juzgar el Proyecto arriba indicado, compuesto por los siguientes miembros: Presidente: Vocales: Secretario: Acuerdan otorgarle la calificación de: Sevilla, 2021 El Secretario del Tribunal 6 “El esfuerzo constante, no la fuerza o la inteligencia, es la clave para liberar nuestro potencial.” Winston Churchill 8 Agradecimientos A todas esas personas que estuvieron en mi vida durante mi etapa universitaria y me ayudaron durante la misma, compañeros de clase, amigos, familia, compañeros de trabajo, profesores y profesoras, todas aquellas personas que con un simple gesto o palabra me animaban para acabar este maratón intelectual. En especial a Jorge, por todos esos días eternos en la ETSI intentando hacer la misma “magia” que nos mostraban en clase, gracias a tus explicaciones y a esos ratitos de desconexión que nos daban la vida entre tanto estudio. 16 4.2.1 Z-Stick Gen5 de Aeotec 45 4.2.2 Motion Sensor de Fibaro 46 4.2.3 Flood Sensor de Fibaro 46 4.3 Instalación de los dispositivos Z-wave en OpenHAB 3 46 5 INTERFAZ DE USUARIO 52 5.1 Plano de la vivienda en 3D 52 5.1.1 HABpanel 52 5.1.2 Sweet Home 3D 54 5.2 Creación de la interfaz en 3D 54 5.2.1 Instalación del plano de Sweet Home 3D en HABpanel 54 5.2.2 Asociar un Item a un dispositivo virtual del plano 57 5.3 IU Basic 59 5.4 Creación de la interfaz en IU Basic 59 6 CONCLUSIONES Y LÍNEAS DE FUTURO 62 Referencias 63 Anexo 64 ÍNDICE DE TABLAS Tabla 1. Estados de un Thing. 25 Tabla 2. Tipos de Item 26 Tabla 3. Tipos de elementos en Sitemap 27 Tabla 4. Tipos de Widgets 53 18 ÍNDICE DE FIGURAS Ilustración 1. Logotipo de la iniciativa OpenHAB 24 Ilustración 2. Comunicación openHAB con los dispositivos 24 Ilustración 3. Relación entre conceptos esenciales de openHAB 28 Ilustración 4. Raspberry Pi 4B 28 Ilustración 5. Proceso de instalación OpenHABian 29 Ilustración 6. Pantalla inicial OpenHABian 29 Ilustración 7. Menú de configuración OpenHABian 30 Ilustración 8. Pantalla para crear el primer administrador 30 Ilustración 9. Pantalla de inicio de openHAB 3 31 Ilustración 10. Miniserver Gen.1 33 Ilustración 11. Touch tree 33 Ilustración 12. Dimmer Tree RGBW 33 Ilustración 13. Tira Led 33 Ilustración 14. Sensor de movimiento y luminosidad tree 34 Ilustración 15. Contacto de Puerta/Ventana 34 Ilustración 16. Extension Air 34 Ilustración 17. Contacto Puerta/Ventana Air 34 Ilustración 18. Pantalla de Configuración 35 Ilustración 19. Pantalla de Binding instalados 35 Ilustración 20. Instalación Binding de Loxone 36 Ilustración 21. Pantalla de Binding con Loxone instalado 36 Ilustración 22. Pantalla de Things instalados 37 Ilustración 23. Elección del Binding para instalar un Thing 37 Ilustración 24. Pantalla para añadir un Thing de Loxone 38 Ilustración 25. Configuración de Loxone Miniserver 1 38 Ilustración 26. Configuración de Loxone Miniserver 2 39 Ilustración 27. Pantalla de Things instalados con el Miniserver de Loxone 39 Ilustración 28. Activación del Thing del Miniserver 40 Ilustración 29. Estado Online del Thing del Miniserver 40 Ilustración 30. Channels del Miniserver 41 Ilustración 31. Creación de un Item 41 Ilustración 32. Channel con un Item asociado 42 Ilustración 33. Item Lámpara de Color 42 Ilustración 34. Items Loxone 43 20 Ilustración 35. Z-Stick Gen5 Aeotec 45 Ilustración 36. Motion Sensor Fibaro 46 Ilustración 37. Flood Sensor Fibaro 46 Ilustración 38. Instalación del Binding de Z-wave 47 Ilustración 39 Creación del Thing del Controlador de Z-wave 47 Ilustración 40. Selección del Serial Port del Stick 48 Ilustración 41. Thing del controlador de Z-wave instalado 48 Ilustración 42. Búsqueda de dispositivos Z-wave 49 Ilustración 43. Añadiendo el Motion Sensor 49 Ilustración 44. Configuración de parámetros del Motion Sensor 50 Ilustración 45. Channels del Motion Sensor 50 Ilustración 46. Creación del Item de Temperatura 51 Ilustración 47. Items Z-wave 51 Ilustración 48. Terminología de entidades de HABpanel 52 Ilustración 49. Activación de Samba 54 Ilustración 50. Contenido de la carpeta "sweethome3d" 55 Ilustración 51. Colocar plano en 3D en la carpera correspondiente 55 Ilustración 52. Pantalla inicial de HABpanel 56 Ilustración 53. Dashboard para la interfaz 3D 56 Ilustración 54. Agregación del widget Modelo 56 Ilustración 55. Importación de "3d-view.tpl.html" 57 Ilustración 56. Editar widget 57 Ilustración 57. Modificación de la ruta de los archivos 57 Ilustración 58. Ejemplo de un Item asociado a una lámpara 58 Ilustración 59. Visualización del control de la luminaria 58 Ilustración 60. Selección del tipo de widget 59 Ilustración 61. Widget para las persianas 60 Ilustración 62. Widget para el sensor de movimiento 60 Ilustración 63. Interfaz UI Basic 61 21 1 INTRODUCCIÓN 1.1 Motivación Desde el principio de los tiempos el ser humano siempre ha utilizado la ciencia y la tecnología para usarla en su propio beneficio, ya sea para crear robots para la automatización de las fábricas hasta la creación de la lavadora para no perder su tiempo en algunas tareas tediosas. Actualmente el ser humano va más allá y busca la automatización inteligente de su hogar o de cualquier edificio para ahorrar dinero y no perder su tiempo en encender una luz o bajar las persianas. Debido al nuevo auge de querer automatizar lo que nos rodea, nos encontramos con multitud de sistemas domóticos diferentes, los cuales no son compatibles unos con otros, ya que cada cual tiene su propio protocolo de comunicación por lo que es necesario un sistema con el que poder automatizar una vivienda independientemente de los dispositivos usados y del sistema de comunicación que estos necesiten. Esta necesidad puede ser solventada por OpenHAB, un software que nos permite el uso de dispositivos diferentes, independientemente de su protocolo de comunicación. En este proyecto se demuestra como mediante OpenHAB se puede crear un sistema domótico en el que se controlan dispositivos Loxone y Z-wave en perfecta armonía y desde una misma interfaz. 1.2 Objetivos Los cuatro objetivos principales de este trabajo son los siguientes: - Integrar el sistema Loxone en OpenHAB 3 y poder controlar sus dispositivos mediante la interfaz de OpenHAB 3 sin dificultad. - Integrar dispositivos Z-wave en OpenHAB 3 y poder controlarlos mediante la interfaz de OpenHAB 3 correctamente. - Demostrar la posibilidad de tener dispositivos Loxone y Z-wave mediante OpenHAB 3 dentro de un marco común de reglas de automatización. - Manejar todos estos dispositivos mediante una interfaz gráfica 3D que simule la vivienda en la que estarían instalados. 1.3 Estructura de la memoria En este apartado se resume la estructura de la presente memoria y se hace una breve descripción de cada uno de los capítulos. La estructura de este proyecto está basada en seis capítulos: ➢ Capítulo 1. Introducción. Se comenta la motivación para realizar este proyecto, los objetivos que se quieren cumplir y la estructura de este. 23 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda ➢ Capítulo 2. OpenHAB 3. Se explica qué es OpenHAB y sus características. Se describen los dispositivos usados para su instalación y por ultimo los pasos seguidos para instalar el sistema operativo OpenHABian. ➢ Capítulo 3. Loxone. Aquí se introduce el sistema Loxone y se comenta su funcionamiento. Se describen los dispositivos Loxone usados en este proyecto y se indican los pasos para poder hacer uso de ellos desde OpenHAB 3. ➢ Capítulo 4. Z-wave. En este capítulo se presenta el sistema Z-wave y se explica su funcionamiento. Se describen los dispositivos Z-wave usados en este proyecto y se indican los pasos para poder hacer uso de ellos desde OpenHAB 3. ➢ Capítulo 5. Interfaz de usuario. Aquí se explican las diferentes interfaces de usuario utilizadas para mostrar el correcto funcionamiento de los dispositivos mencionados anteriormente una vez están asociados a OpenHAB 3. Se indican los pasos seguidos para su creación. ➢ Capítulo 6. Conclusiones y líneas de desarrollo futuro. Finalmente se explican las concusiones obtenidas durante la realización del proyecto y las futuras líneas de investigación que serían interesante abordar. 2 OPENHAB 3 n este capítulo se describe qué es openHAB 3 y se explican conceptos fundamentales del mismo. Posteriormente se describen los dispositivos usados, así como los pasos seguidos para la instalación de OpenHABian. 2.1 Introducción OpenHAB [1] es un software, de código abierto, que nos permite integrar diferentes sistemas de automatización de viviendas, dispositivos y tecnologías. Su logotipo se muestra en la Ilustración 1. Es independiente del proveedor, del hardware y del protocolo de comunicación que integre, siendo este uno de sus puntos fuertes, ya que nos permite integrar dispositivos de diferente fabricante bajo un mismo software. Funciona en múltiples plataformas como Linux, Windows y OS X permitiendo su instalación en dispositivos de bajo coste como la Raspberry Pi. Está desarrollado en Java y usa Apache Karaf junto con Eclipse Equinox para crear un entorno de ejecución OSGi convirtiéndolo en un software altamente modular que se extiende mediante add-ons, los cuales, le dan una amplia gama de competencias, desde la capacidad de crear interfaces de usuario, hasta la de interactuar con un gran número de dispositivos. La comunicación de openHAB con los dispositivos, representada en la Ilustración 2, se realiza de forma asíncrona a través de un bus de eventos o puede haber comunicaciones con estado. E Ilustración 1. Logotipo de la iniciativa OpenHAB Ilustración 2. Comunicación openHAB con los dispositivos 25 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda Una de las modificaciones de openHAB 3 con respecto a las versiones anteriores es la posibilidad de hacer la configuración mediante una interfaz de usuario y no solo de forma textual, por lo que usaremos este nuevo modo para el desarrollo de este proyecto. 2.2 Conceptos A continuación, se explican diferentes conceptos esenciales de openHAB para comprender su funcionamiento. 2.2.1 Bindings Son enlaces que permiten el envío y recepción de comandos y actualizaciones de estado de los Things a través del bus de eventos de openHAB. Se puede considerar como un adaptador de software que permite que los Things estén disponibles para el sistema. 2.2.2 Things Son entidades que pueden ser agregadas a nuestro sistema, ya sean dispositivos físicos, servicios web o cualquier fuente de información o funcionalidad que se pueda integrar. Pueden proporcionar más de una función dependiendo del Thing. Cada Thing tiene un estado y en la Tabla 1 se describen cada uno de sus posibles estados. Estado Descripción Uninitialized Es el estado inicial de un Thing al agregarse o iniciar el sistema. También es el estado cuando falla el proceso de iniciación o el Binding no está disponible por lo que los comandos enviados a sus Channels no se procesarán. Initializing Es el estado cuando el Thing se está iniciando. Los comandos siguen sin procesarse. Unknown El controlador está inicializado, pero debido al dispositivo o servicio representado, todavía no se sabe si el Thing está Online u Offline. Online El dispositivo o servicio representado por un Thing funciona correctamente y puede procesar comandos. Offline El dispositivo o servicio representado por un Thing no funciona correctamente y puede que no procese los comandos. Removing El dispositivo o servicio representado por un Thing debe eliminarse, pero el Binding aún no ha confirmado la eliminación. Removed Indica que el dispositivo o servicio representado por un Thing se eliminó del sistema externo después de que el sistema iniciara la eliminación. Tabla 1. Estados de un Thing 3 LOXONE n este capítulo se describe el sistema Loxone y se explican conceptos fundamentales del mismo. Posteriormente se describen los dispositivos usados para controlarlos mediante openHAB 3, así como los pasos seguidos para la vinculación de dichos dispositivos con openHAB 3. 3.1 Introducción Loxone [2] es una empresa creada en 2009 en Austria dedicada a la automatización de edificios. Su sistema domótico, denominado Smart Home, tiene su propio protocolo de comunicación, cuenta con servidor web integrado y lenguaje de programación abierto. Su sistema Smart Home es un sistema centralizado, donde los datos de los dispositivos son enviados al Miniserver y son procesados en él, así como todas las ordenes son enviadas desde el Miniserver hacia los diferentes dispositivos que integran el sistema. Dispone de muchos dispositivos propios, como luminarias o pulsadores, y también es compatible con dispositivos de otros fabricantes, ya que es posible su comunicación con otros protocolos como por ejemplo KNX o Modbus. Loxone dispone de dos tecnologías para la instalación de sus dispositivos: Tecnología Tree: Sus dispositivos son alimentados y conectados al Miniserver bajo un mismo cable formado por 6 hilos, 2 hilos para la comunicación con el Miniserver, 2 hilos para la alimentación de dispositivos de muy bajo consumo, como por ejemplo sus pulsadores, y otros 2 hilos para la alimentación de dispositivos de mayor consumo, como son las luminarias. Esta conexión puede ser realizada en topología estrella, línea, árbol o bus. La información por el bus de datos esta encriptada y la comunicación es bidireccional. Mediante este bus el Miniserver realiza la búsqueda de sus dispositivos para su integración hasta un máximo de 50 dispositivos por rama. Al hacer la instalación con esta tecnología de forma total en una vivienda se reduce la instalación de cableado un 80 % respecto a una instalación eléctrica estándar. Tecnología Air: La comunicación de los dispositivos con el Miniserver se realiza de forma inalámbrica en la frecuencia 868 MHz. Cada dispositivo que recibe tensión de forma permanente tiene una función repetidora por lo que se crea una red Mesh. La información se envía encriptada evitando posibles conflictos entre Miniservers. Tiene un máximo de 128 dispositivos por extensión Air. Esta tecnología está pensada fundamentalmente para hacer rehabilitaciones en edificios o viviendas, ya que se usa la red eléctrica cableada existente para alimentar los dispositivos. E 33 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 3.2 Dispositivos Loxone 3.2.1 Miniserver Gen. 1 Es el encargado de comunicar los sistemas y dispositivos que componen el sistema Loxone entre sí. Se representa en la ilustración 10. Tiene un procesador de 400 MHz y 64MB de memoria RAM, de la que usa unos 10 MB para el sistema operativo LoxOS con servidor Web. Está formado por: ➢ 8 entradas digitales 8VDC – 24VDC ➢ 4 entradas analógicas 0-10V ➢ 4 salidas analógicas 0-10V (máx. 20mA) ➢ 8 salidas digitales 250V/5A ➢ Ranura para tarjetas SD ➢ Puerto LAN ➢ Puerto KNX/EIB ➢ Loxone Link ➢ Entrada de alimentación a 24VDC A través del Loxone Link, el Miniserver puede conectarse con hasta 30 extensiones que le permiten ampliar el sistema y comunicarse con otros protocolos. 3.2.2 Touch tree Es un pulsados capacitivo con 5 puntos de contacto, con un sensor de temperatura y otro de humedad integrado. Se conecta mediante el cable Tree y se alimenta a 24 V. Se representa en la ilustración 11. 3.2.3 Dimmer Tree RGBW y Tira Led El Dimmer Tree RGBW es un dimmer para el control de la intensidad y el color de la tira Led. Diseñado para montarlo en un carril DIN, se alimenta a 24V y tiene 4 salidas PWM. Se representa su conexionado en la ilustración 13. La tira led se alimenta a 24V y ofrece cualquier color e intensidad deseada con un ángulo de haz de 120º y una temperatura de color de 3300K. Se pueden cortar cada 10cm o 6 LEDs. Se representa en la ilustración 12. Ilustración 10. Miniserver Gen.1 Ilustración 11. Touch tree Ilustración 12. Tira Led Ilustración 13. Dimmer Tree RGBW 3.2.4 Sensor de Movimiento y Luminosidad tree Permite la detección del movimiento, presencia y luminosidad. Cuenta con un ángulo de detección de 360° horizontalmente y 110° verticalmente, en un diámetro de 8 metros (con una altura de techo de 3 metros). Dispone de sensor acústico ajustable para la detección de presencia. Se representa en la ilustración 14. 3.2.5 Contacto de Puerta/Ventana Nos permite conocer el estado de las ventanas o puertas donde esté instalado. Está formado por un contacto Reed, que se coloca en el marco de la ventana o de la puerta, y un imán colocado en la parte móvil. Se conecta a una entrada digital del Miniserver. Se representa en la ilustración 15. 3.2.6 Extension Air Se trata de una pasarela que recibe los mensajes enviados por los dispositivos Loxone Air y envía estos mensajes al Miniserver a través de la conexión Link que tiene con él, a la vez, recibe del Miniserver mensajes que tiene que enviar al dispositivo Air correspondiente. Soporta un total de 128 dispositivos y se comunica con los dispositivos por la frecuencia 868MHz (EU). Se instala en un carril DIN. Se representa en la ilustración 16. 3.2.7 Contacto de Puerta/Ventana Air Al igual que el anterior contacto de Puerta/Ventana nos permite saber el estado de la puerta o ventana donde este instalado, pero comunica esta información vía Air, por la frecuencia 868MHz (SRD Band Europe), al Miniserver. Se alimenta con una pila botón CR2032. Se representa en la ilustración 17. Ilustración 14. Sensor de presencia Ilustración 15. Contacto de Puerta/Ventana Ilustración 16. Extension Air Ilustración 17. Contacto Puerta/Ventana Air 35 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 3.3 Instalación de los dispositivos Loxone en OpenHAB 3 Estos son los pasos seguidos para la instalación de los dispositivos Loxone en OpenHAB 3. 1. Se selecciona en el menú de la izquierda “Configuración” y aparece la pantalla representada en la ilustración 18 donde se selecciona “Bindings”. Ilustración 18. Pantalla de Configuración 2. Una vez dentro de Bindings (ver ilustración 19), se pulsa en el botón de azul situado abajo a la derecha para añadir un nuevo add-ons. Ilustración 19. Pantalla de Bindings instalados 3. Aparecerá una pantalla con una lista de todos los binding add-ons disponibles, se busca el de Loxone y se selecciona “Install” para instalarlo, tal como aparece en la ilustración 20. Ilustración 20. Instalación Binding de Loxone 4. Una vez instalado aparece la pantalla representada por la ilustración 21, donde queda confirmada su instalación. Ilustración 21. Pantalla de Binding con Loxone instalado 37 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 5. Posteriormente se selecciona el apartado “Things” del menú de la izquierda (aparecerá la pantalla representada en la ilustración 22) para lograr en primer lugar la conexión de OpenHAB con el Miniserver de Loxone. Ilustración 22. Pantalla de Things instalados 6. Se pulsa en el botón azul situado abajo a la derecha y aparece la siguiente página, representada en la ilustración 23, en la que se pulsa sobre “Loxone Binging”. Ilustración 23. Elección del binding para instalar un Thing 7. Según se ve en la ilustración 24, se puede obtener de dos formas la comunicación con el Miniserver, ya sea pulsando “Scan” para escanear la red y lograr la comunicación de forma automática o añadiendo el Miniserver de forma manual. Ilustración 24. Pantalla para añadir un Thing de Loxone 8. Usando el formato manual aparece la pantalla representada por la Ilustraciones 25 y 26, y hay que rellenar los siguientes campos: i) Unique ID: Se escribe el número de serie del Miniserver. ii) Host: Se escribe la IP del Miniserver. Ilustración 25. Configuración de Loxone Miniserver 1 39 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda iii) User: Se escribe el nombre de usuario con el que acceso al Miniserver. iv) Password: Se escribe la contraseña de dicho usuario. 9. Se pulsa el botón azul del final de la página para crear el Thing del Miniserver y aparece la pantalla representada en la ilustración 27, en la que se ve el primer Thing creado. Ilustración 27. Pantalla de Things instalados con el Miniserver de Loxone Ilustración 26. Configuración de Loxone Miniserver 2 10. Al crearlo, su “Status” aparece como DISABLED. Para que se conecte hay que pulsar sobre Loxone Miniserver y en la siguiente página, representada por la ilustración 28, se pulsa sobre el icono de pausa. Ilustración 28. Activación del Thing del Miniserver El “Status” pasa a ser ONLINE, como se representa en la ilustración 29, por lo que la conexión entre openHAB 3 y el Miniserver está lista y ya se puede comenzar a crear Links entre los Channels que nos ofrece el Miniserver y los Item que queramos tener para poder hacer uso de estos Channels. Ilustración 29. Estado Online del Thing del Miniserver 41 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 11. Al pulsar en la pestaña del medio llamada “Channels” se ven todas las funcionalidades ofrecidas por el Miniserver que se pueden controlar mediante Items (ver ilustración 30). Para poder usarlos hay que pulsar sobre el que se quiera agregar y seleccionar “Add Link to Item…”. Ilustración 30. Channels del Miniserver Aparece una pantalla, representada en la ilustración 31, en la que se marca “Create a new Item” y se rellenan los siguientes campos: - Name: Un nombre cualquiera. - Label: Se utiliza para describir un Item de una manera legible. - Type: Mencionados en el punto 2.2.4 Items. - Category: Para seleccionar el icono asociado al Item. Ilustración 31. Creación de un Item 3. Una vez seleccionado el controlador Z-wave, aparece la pantalla representada por la ilustración 40, en la que se debe seleccionar el Serial Port asignado al stick y pulsar sobre “Create Thing”. Ilustración 40. Selección del Serial Port del Stick 4. Unos segundos después aparece el controlador como “Online” y ya estará listo para añadir el resto de los dispositivos Z-wave. Para ello se pulsa sobre el apartado “Things” para seleccionar el Binding de Z-wave como aparece en la ilustración 41. Ilustración 41. Thing del controlador de Z-wave instalado 49 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 5. A diferencia de lo realizado anteriormente con Loxone, es necesario crear un Thing por cada dispositivo Z-wave a integrar. Una vez seleccionado el binding de Z-wave hay que pulsar en escanear y esperar a que encuentre los dispositivos Z-wave ya configurados con el controlador instalado anteriormente. En la ilustración 42 aparece el dispositivo Motion Sensor de Z-wave. Ilustración 42. Búsqueda de dispositivos Z-wave 6. Tal y como aparece en la ilustración 43, al pulsar sobre el dispositivo que encontró nos da la opción de añadirlo como Thing. Ilustración 43. Añadiendo el Motion Sensor 7. Al pulsar sobre el Thing del dispositivo, en este caso, el sensor de movimiento, temperatura y luminosidad de Z-wave, se pueden configurar todos sus parámetros, al contrario que en los dispositivos Loxone. Algunos de estos parámetros están representados en la lustración 44. Ilustración 44. Configuración de parámetros del Motion Sensor 8. Pulsar en “Channel” para ver las funcionalidades que ofrece el dispositivo, representadas en la ilustración 45. Ilustración 45. Channel del Motion Sensor 51 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 9. Al igual que con Loxone, se enlazan Items nuevos a cada “Channel” que se desee. En el siguiente ejemplo, representado en la ilustración 46, se crea un Item para el “Channel” que proporciona la información de la temperatura. Ilustración 46. Creación del Item de Temperatura 10. En la ilustración 47 se representan los Items creados a partir de las funcionalidades que ofrecen los dispositivos Z-wave utilizados. Ilustración 47. Items Z-wave 5 INTERFAZ DE USUARIO n este capítulo se describirán las dos interfaces que se usarán para la visualización y manejo de los ítems creados en openHAB 3. Se describen los pasos seguidos para su creación. 5.1 Plano de la vivienda en 3D 5.1.1 HABpanel HABpanel [4] es una interfaz de panel que permite crear interfaces desde el dispositivo destino de forma interactiva y sin necesidad de usar ningún Sitemap. Se instala de forma predeterminada al instalar openHAB 3. En la ilustración 48 se representan las entidades que componen HABpanel. Ilustración 48. Terminología de entidades de HABpanel ➢ Panel Registry: Almacena todos los Panel Configuration. ➢ Panel Configuration: Contiene un Panel junto con su configuración y las definiciones de los widgets personalizados que se hayan creado en dicho Panel. Cada dispositivo en el que se ejecute HABpanel tiene una configuración de panel activada y muestra el Panel Configuration que está asociada a él. E 53 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda ➢ Panel: Está compuesto de Dashboards. Normalmente se usa un Panel por planta para tener una separación de la vivienda. ➢ Dashboards: Está compuesto por widgets. Se usa normalmente un Dashboards por estancia. ➢ Widgets: Son los componentes del Dashboards que permiten hacer uso de los ítems creados en openHAB o incluso servicios externos como Google Calendar. En la Tabla 4 se recogen los tipos de widgets que se pueden usar. Tipo Descripción Button Al pulsar sobre él realizará una acción, como enviar comandos a un Item o navegar a otro Dashboards. También puede ajustar sus colores según el estado del Item subyacente. Chart Puede aprovechar los servicios de persistencia de openHAB para trazar series numéricas durante un período de tiempo. También puede mostrar imágenes de gráficos generadas por el servidor. Clock Muestra un reloj analógico o digital. También se puede utilizar para mostrar la fecha actual. Color Picker Ofrece varias formas de mostrar y actualizar el estado de un Item (o grupo) de color. Dummy Muestra el estado actual de un elemento sin ninguna interactividad, junto con una etiqueta y un icono opcional. Frame Muestra una página web externa en HTML. Slider Refleja el estado y actualiza elementos numéricos dentro de un rango de valores. Hay varias opciones disponibles para modificar su apariencia y comportamiento. Knob Es similar en esencia al Slider, pero de forma giratoria. También ofrece una amplia capacidad de configuración sobre su apariencia y comportamiento. Label Muestra un texto fijo y tiene algunas opciones de apariencia (color, fuente). Selection Abre un menú o una cuadrícula de opciones configuradas automática o manualmente para enviar comandos a este elemento. Hay varias opciones de visualización disponibles. Image Puede mostrar una imagen y actualizarla a intervalos regulares. Switch Controla un Item de tipo Switch. Informa de su estado y puede alternarlo entre On y Off. Timeline Puede mostrar varios "carriles" de elementos con sectores codificados por colores que representan sus cambios de estado durante el período seleccionado. Muestran detalles sobre el estado del Item en un momento seleccionado. Template Permite renderizar y alojar una plantilla HTML AngularJS configurada por el usuario. Tabla 4. Tipos de Widgets Aparte de los widgets ya definidos podemos crear otros personalizados que podremos reutilizar, compartir y configurar. Se crean mediante una plantilla de AngularJS y podrán ser añadidos al Dashboards. La definición de estos widgets se almacena en el registro del Panel Configuration por lo que serán específicos de dicho Panel Configuration. 5.1.2 Sweet Home 3D Sweet Home 3D [5] es un software de código abierto para realizar diseño de interiores que permite diseñar planos de casas y organizar muebles, cuadros, ventanas, etc. Realiza modelos virtuales en un plano 2D y ofrece una vista previa en 3D. La aplicación tiene una gran variedad de elementos prediseñados y permite importar modelos creados por usuarios o por uno mismo, siempre y cuando estos modelos sean creados mediante un software capaz de generar ficheros en formato OBJ, DAE / Collada, KMZ o 3DS. Este software está disponible en múltiples idiomas y puede ser ejecutado en Windows, Mac OS X 10.4 / 10.12, Gnu/Linux y Solaris mediante su instalación o usar su versión online sin necesidad de instalarlo. Para este proyecto se usa un modelo de ejemplo de la galería de Sweet Home 3D, ya que diseñar el plano de una vivienda no es uno de los objetivos del proyecto. 5.2 Creación de la interfaz en 3D En este apartado se describen los pasos seguidos para usar un plano 3D creado con Sweet Home 3D en OpenHAB 3 y usar sus elementos para interactuar con los Items creados. 5.2.1 Instalación del plano de Sweet Home 3D en HABpanel Los pasos seguidos para esta instalación son los siguientes: 1. Instalación de Samba, como se representa en la ilustración 49, desde la herramienta de configuración de OpenHABian que aparece al ejecutar “sudo openhabian-config” en la consola. Ilustración 49. Activación de Samba 2. Descarga de Sweet Home 3D JS Viewer [8] y su extracción a una subcarpeta denominada “sweethome3d” dentro de la carpeta “conf/html” de la instancia de openHAB 3, ubicada en la instalación de OpenHABian en la Raspberry Pi, accediendo a la misma gracias a la activación de Samba. 55 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda Ilustración 50. Contenido de la carpeta "sweethome3d" El contenido de esta carpeta está representado por la ilustración 50 y es el siguiente: • /sweethome3d/lib - contiene las bibliotecas de JavaScript adicionales para mostrar la vista WebGL. • /sweethome3d/default.sh3d - contenido del diseño. • /sweethome3d/SweetHome3DJSViewer.html - página de prueba. • /sweethome3d/SweetHome3DJSViewerInOverlay.html - página de prueba con una superposición. 3. Descargar los archivos “sweethome3d.directive.js” [9] y “3d-view.tpl.html” [10] y colocarlos en “conf/html”. 4. Colocar el archivo.sh3d de la vivienda a controlar en “conf/html”, como se representa en la ilustración 51. Ilustración 51. Colocar el plano en 3D en la carpeta correspondiente 5. Abrir HABpanel, crear un dashboard y agregar un widget del tipo Template (Modelo) tal y como se representa en las ilustraciones 52,53 y 54. Ilustración 52. Pantalla inicial de HABpanel Ilustración 53. Dashboard para la interfaz 3D Ilustración 54. Agregación del widget Modelo 57 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda 6. Editar este widget (como aparece en la ilustración 55), elegir la opción de “importar desde archivo”, referenciada en la ilustración 56, y seleccionar el archivo “3d-view.tpl.html”. 7. Finalmente modificamos la ruta de “lib-url” y “sh3d-url” hacia la carpeta “conf/html” que es donde está el archivo .sh3d de la vivienda a controlar, añadiendo “/static” antes de la ruta donde están los archivos, como aparece en la ilustración 57. Ilustración 57. Modificación de la ruta de los archivos 5.2.2 Asociar un Item a un dispositivo virtual del plano Gracias a la incorporación de la vista WebGL 3D del visor Sweet Home 3D JS en los paneles de HABpanel creada por Yannick Schaus podemos asociar Items a objetos virtuales del plano en 3D. Para asociar un Item con un objeto virtual usamos esta plantilla para cada dispositivo: < script type = " text / ng-template " id = " sweethome3d / My Object " > Tu plantilla . . . </ script > Ilustración 55. Editar widget Ilustración 56. Importación de "3d-view.tpl.html " ANEXO Código usado para la asociación de los Items con los diferentes objetos virtuales del plano en 3D: <style> .sweethome3d-modal .modal-dialog { width: 200px; } .sweethome3d-modal .modal-content { background-color: black; } </style> <!--Estado del Sensor de Agua--> <script type="text/ng-template" id="sweethome3d/Container"> <div> <div class="box dummy" style="width: 200px; height: 200px;"> <div class="dummy-content" style="font-size: 25px"> <dt> Sensor de agua </dt> <widget-icon iconset="'eclipse-smarthome-classic'" icon="'water'" size="60" center="true"> </widget-icon> <div class="value" style="font-size: 36pt"> {{(itemState('ZWaveFloodAlarm',true) == 'ON') ? 'Alarma' : 'Ok'}} </div> </div> </div> </div> </script> 65 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda <!--El reloj nos da la fecha actual y la hora--> <script type="text/ng-template" id="sweethome3d/Clock"> <div style="min-height: 100px;" ng-init="Reloj={name: 'Hora y Fecha Actual', item: 'HoraLocal_Date', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic',icon: 'time', icon_size: 75 }"> <div class="box" style="width: 350px; height: 200px;"> <div> <div> <widget-dummy ng-model="Reloj" style="font-size: 22pt;"></widget-dummy> </div> </div> </div> </div> </script> <!--Lampara del cuadro en Habitación para elegir el color de la misma así como la intensidad--> <script type="text/ng-template" id="sweethome3d/Wall lamp artwork"> <div ng-init="piker={item: 'Loxone_Color', style:'aCKolor'}"> <div class="box-dummy" style="width: 200px; height: 150px; "> <div class="dummy-content" style ="font-size:25px; background: DarkSlateGray; color: LightSkyBlue;" > <dt > Lampara de Colores </dt> <widget-colorpicker style= "position:absolute; left: 60px; top: 70px;" ng-model="piker"></widgetcolorpicker > </div> </div> </div> </script> <!--Lampara del techo Salón y Baño, elección de Escenas--> <script type="text/ng-template" id="sweethome3d/Pendant lamp"> <div class="box dummy" style="width: 445.5px; height: 50px; background: DarkSlateBlue;"> <div class="dummy-content" style="font-size: 30px"> <dt> Ambientes</dt> <div class="box dummy" style="width: 445.4px; height: 40px;"> <div class="btn-group btn-group-lg"> <button type="button" class="btn btn-primary btn-lg" ng-click="sendCmd ('Loxone_ControlIluminacion', '777')">Encendido</button> <button type="button" class="btn btn-primary btn-lg" ng-click="sendCmd ('Loxone_ControlIluminacion', '1')">General</button> <button type="button" class="btn btn-primary btn-lg" ng-click="sendCmd ('Loxone_ControlIluminacion', '2')">Creativa</button> <button type="button" class="btn btn-primary btn-lg" ng-click="sendCmd ('Loxone_ControlIluminacion', '3')">Relax</button> <button type="button" class="btn btn-primary btn-lg" ng-click="sendCmd ('Loxone_ControlIluminacion', '778')">Off</button> <div style="width: 445.5px; height: 150px; background: DarkSlateBlue;" ng-init="luz= {name:'Nivel de Luminosidad', item: 'ZWaveSensorluminance'}"> <widget-dummy ng-model="luz" style="font-size: 15pt; position:absolute; left: 110px; top: 60px;"></widget-dummy> </div> </div> </div> </div> </div> </script> 67 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda <!--Mover cortinas--> <script type="text/ng-template" id="sweethome3d/Curtain"> <div class="box dummy" style="width: 300px; height: 200px;"> <div class="dummy-content" style="font-size: 25pt; "> Persiana <div class="shutterWidget"><span> <button style="size: 20; background-color: LightSkyBlue" ng-click="sendCmd ('LoxoneMiniserver_SalonPersianaAutomatica', 'UP')" > <i class="glyphicon glyphicon-menu-up"></i></button> <button ng-click="sendCmd('LoxoneMiniserver_SalonPersianaAutomatica', 'STOP')"> <widget-icon iconset="'eclipse-smarthome-classic'" icon="'blinds'" size="125" center="true" state="itemValue('LoxoneMiniserver_SalonPersianaAutomatica')" /></button> <button style="margin-right: 0; size: 20; background-color: LightSkyBlue" ng-click="sendCmd ('LoxoneMiniserver_SalonPersianaAutomatica', 'DOWN')"> <i class="glyphicon glyphicon-menu-down"></i></button> </span> </div> </div> </div> </script> <!--Radiadores Eléctricos marca la temperatura actual (Z-wave) --> <script type="text/ng-template" id="sweethome3d/Electric radiator"> <div style="min-height: 200px" ng-init="model={name: 'Temperatura', item: 'ZWave_temperature', unit:'°', 'subTextEnabled': true, 'step': 0.5, 'min': 12, 'max': 30, 'readOnly': true}"> <div class="box" style="width: 300px; height: 300px;"> <div> <div> <widget-knob ng-model="model"></widget-knob> </div> </div> </div> </div> </script> <!--Ventana Exterior, temperatura, humedad, velocidad del viento, probabilidad de lluvia y estado del tiempo exterior--> <script type="text/ng-template" id="sweethome3d/Fixed window"> <div style="min-height: 50px; position:absolute; left: 20px; top: 20px;" ng-init="Temp={name: 'Temperatura Ext', item: 'OneCallAPIweatherandforecast_OutdoorTemperature', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic',icon: 'temperature', icon_size: 75 }"> <div style="min-height: 50px; position:absolute; left: 20px; top: 20px;" ng-init="Hum={name: 'Humedad Ext', item: 'OneCallAPIweatherandforecast_AtmosphericHumidity', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic',icon: 'humidity', icon_size: 75 }"> <div style="min-height: 50px; position:absolute; left: 20px; top: 120px;" ng-init="Lluvia={name: 'Probabilidad de lluvia', item: 'OneCallAPIweatherandforecast_Rain', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic', icon: 'rain', icon_size: 75 }"> <div style="min-height: 50px; position:absolute; left: 200px; top: 120px;" ng-init="Viento= {name: 'Velocidad del Viento', item: 'OneCallAPIweatherandforecast_WindSpeed', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic',icon: 'wind', icon_size: 75 }"> <div style="min-height: 50px; position:absolute; left: 100px; top: 220px;" ng-init="Estado= {name: 'Estado del tiempo', item: 'OneCallAPIweatherandforecast_WeatherCondition', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipse-smarthome-classic',icon: 'sun_clouds', icon_size: 75 }"> <div class="box" style="width: 600px; height: 720px; position:absolute; right: 100px; bottom: 1px;"> <div> <div> <widget-dummy ng-model="Temp" style="font-size: 22pt; position:absolute; left: 50px; top: 155px; "></widget-dummy> <widget-dummy ng-model="Hum" style="font-size: 22pt; position: absolute; left: 350px; top: 155px; "></widget-dummy> <widget-dummy ng-model="Lluvia" style="font-size: 22pt; position: absolute; left: 20px; top: 320px; "></widget-dummy> <widget-dummy ng-model="Estado" style="font-size: 22pt; position: absolute; left: 330px; top: 320px;"></widget-dummy> <widget-dummy ng-model="Viento" style="font-size: 22pt; position: absolute; left: 10px; top: 500px; "></widget-dummy> </div> </div> </div> </div> </div> </div> </div> </div> </script> 69 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda <!--Radiador del Baño marca la temperatura actual y la humedad--> <script type="text/ng-template" id="sweethome3d/Radiator"> <div style="min-height: 100px; position:absolute; left: 20px; top: 20px;" ng-init="Temp={name: 'Temperatura', item: 'Loxone_Temperatura', 'subTextEnabled': true, 'readOnly': true, iconset:'eclipsesmarthome-classic',icon: 'temperature', icon_size: 75 }"> <div style="min-height: 100px; position:absolute; left: 200px; top: 20px;" ng-init="Hum={name: 'Humedad', item: 'Loxone_Humedad', unit:'%', 'subTextEnabled': true, 'readOnly': true,iconset:'eclipsesmarthome-classic',icon: 'humidity', icon_size: 75 }"> <div class="box" style="width: 400px; height: 220px;"> <div> <div> <widget-dummy ng-model="Temp" style="font-size: 22pt; position:absolute; left: 20px; top: 20px; "></widget-dummy> <widget-dummy ng-model="Hum" style="font-size: 22pt; position: absolute; left: 220px; top: 20px; "></widget-dummy> </div> </div> </div> </div> </div> </script> <!--Pulsador Baño para activar o desactivar el sensor de movimiento--> <script type="text/ng-template" id="sweethome3d/Light switch"> <div style="min-height: 75px" ng-init="onoff={name: 'On/Off Sensor Movimiento', item: 'Loxone_SensordeMovimientoOnOff', hidelabel: 'true', hideonoff: 'true', iconset:'eclipse-smarthome- classic',icon: 'motion', icon_size: 75 }"> <div ng-style="{'background-color': (itemState('Loxone_SensordeMovimientoOnOff')=='ON') ? 'Cornsilk' : 'DarkSlateGray' } " style="width: 300px; height: 100px;"> <div class="value" style="font-size: 32pt; width: 300px; height: 100px;"> {{(itemState('Loxone_SensordeMovimientoOnOff',true) == 'ON') ? 'Activado' : 'Desactivado'}} <div class="box switch" style="width: 300px; height: 100px;"> <div class="switch-content"> <widget-switch ng-model="onoff"></widget-switch> </div> </div> </div> </div> </div> </script> <!--Lamparitas de las mesitas de noche On/Off--> <script type="text/ng-template" id="sweethome3d/Lamp"> <div style="min-height: 100px" ng-init="onoff={name: 'Lampara Salon', item: 'LoxoneMiniserver_SalonLamparaSalon', hidelabel: 'false', hideonoff: 'false', iconset:'eclipse-smarthome- classic',icon: 'light', icon_size: 75 }"> <div ng-style="{'background-color': (itemState('LoxoneMiniserver_SalonLamparaSalon')=='ON') ? 'LightGoldenRodYellow' : 'DarkSlateGray' }" style="width: 200px; height: 75px;"> <div class="value" style="font-size: 32pt;"> {{(itemState('LoxoneMiniserver_SalonLamparaSalon',true) == 'ON') ? 'Encendido' : 'Apagado'}} <div class="box switch" style="width: 200px; height: 100px;"> <div class="switch-content"> <widget-switch ng-model="onoff"></widget-switch> </div> </div> </div> </div> </div> </script> <!--Estado de las Ventanas--> <script type="text/ng-template" id="sweethome3d/Slider window"> <div> <div class="box dummy" style="width: 300px; height: 300px;"> <div class="dummy-content"> <dt> Ventana del Salón </dt> <widget-icon iconset="'eclipse-smarthome-classic'" icon="'window'" size="200" center="true" state="(itemState('LoxoneMiniserver_SalonContactodeventana') == 'OFF') ? 'OPEN' : 'CLOSED'"></widget-icon> <div class="value" style="font-size: 36pt"> {{(itemState('LoxoneMiniserver_SalonContactodeventana', true) == 'OFF') ? 'Abierta' : 'Cerrada'}} </div> </div> </div> </div> </script> 71 Integración de dispositivos domóticos Loxone y Z-wave sobre OpenHAB 3 y desarrollo de una interfaz gráfica 3D común para el control de una vivienda <!--Estado de la Puerta Exterior--> <script type="text/ng-template" id="sweethome3d/Exterior door"> <div> <div class="box dummy" style="width: 300px; height: 300px;"> <div class="dummy-content"> Entry Door <widget-icon iconset="'eclipse-smarthome-classic'" icon="'door'" size="200" state= "(itemState('LoxoneMiniserver_SalonContactoPuerta') == 'OFF') ? 'OPEN' : 'CLOSED'"></widget-icon> <div class="value" style="font-size: 36pt"> {{(itemState('LoxoneMiniserver_SalonContactoPuerta',true) == 'OFF') ? 'Abierta' : 'Cerrada'}} </div> </div> </div> </div> </script> <!--Cambio de la intensidad de la luz de la pared--> <script type="text/ng-template" id="sweethome3d/Wall uplight"> <div style="min-height: 200px" ng-init="model={name: 'Wall light', item: 'LoxoneMiniserver_SalonLamparaSalon', vertical: true, step: 10, showticks: true}"> <div class="box" style="width: 300px; height: 300px;"> <widget-slider ng-model="model"></widget-slider> </div> </div> </script> <div oc-lazy-load="'/static/sweethome3d.directive.js'"> <sweet-home-3d style="position: absolute; left: 0; right: 0; top: 0; bottom: 0" lib-url="/static/sweethome3d/lib" sh3d-url="/static/SweetHome3DExample5.sh3d"> </sweet-home-3d> </div>