Yet another Freeboard widget plugin

freeboard-widget-plugins

Two new widget plugins are available for Freeboard.io

  1. Slider widget plugin
  2. Switch widget plugin

Freeboard

A damn-sexy, open source real-time dashboard builder for IOT and other web mashups.

What is It?

Freeboard is a turn-key HTML-based “engine” for dashboards. Besides a nice looking layout engine, it provides a plugin architecture for creating datasources (which fetch data) and widgets (which display data)— freeboard then does all the work to connect the two together. Another feature of freeboard is its ability to run entirely in the browser as a single-page static web app without the need for a server. The feature makes it extremely attractive as a front-end for embedded devices which may have limited ability to serve complex and dynamic web pages.

See it in action @ https://goo.gl/hbAXXU

All plugins are available for download from the following Github repository: https://github.com/onlinux/freeboard-plugins

Slider widget plugin for freeboard.io

slider

 

 

slider-settings

At each value change, a request is sent with the argument pattern %VALUE% replaced with the value set by the slider.

 

Switch widget plugin for freeboard.io

switch

 

switch-settings

Freeboard INSTALLATION

Follow the instructions from Freeboard github site

Freeboard can be run entirely from a local hard drive. Simply download/clone the repository and open index.html. When using Chrome, you may run into issues with CORS when accessing JSON based APIs if you load from your local hard-drive— in this case you can switch to using JSONP or load index.html and run from a local or remote web server.

 

  1. git clone https://github.com/Freeboard/freeboard.git
  2. npm install
  3. grunt

Then run a index.html or index-dev.html through a webserver.

 

PLUGIN INSTALLATION

Copy the plugin file  to your freeboard installation, for example:

$ cp ./slider.js /var/www/freeboard/plugins/

Edit the freeboard index.html file and add a link to the plugin near the end of the head.js script loader, like:

head.js(
  'js/freeboard_plugins.min.js',
  'plugins/slider.js',
  'plugins/switch.js',
  $(function() {
    //DOM Ready
    freeboard.initialize(true);
  })

 

How to control your Domoticz SmartVirtualThermostat (SVT) from your linux desktop or your Raspberry Pi with python and pygame

Smart Virtual Thermostat Plugin for domoticz is provided by Logread 999LV (SVT Domoticz repository : https://github.com/999LV/SmartVirtualThermostat.git ). Many thanks to him!

This utility  will help you to control from internet your domoticz virtual thermostat from a Raspberry Pi equipped with a TFT screen or from any linux PC.

Screenshot_20181229_155406 Screenshot_20181229_155153 Screenshot_20181229_155611

Screenshot_20181229_155515

 

Install libraries:

$ git clone https://github.com/onlinux/thermostat-domoticz.git

run:

$ cd thermostat-domoticz
$ sh setup.sh

Configuration

Modify config.ini

[secret]
server= # Enter your domoticz server name
ip_domoticz=
port= 
username=  # Enter username if exists
password=  # Enter password to access your domoticz server

Start Thermostat Domoticz

$ source venv/bin/activate

Start  linux desktop script:

$ python z.py

Or start  raspberryPi with TFT script

$ python z-pi.py

‘Alt-PageDown’ key or ‘n’ key to roll over the 4 available displays Click to change Meteo Station when displaying forecasts. Meteo Stations are defined within z.py

tlocations = (
				{'code': 'FRXX0099' , 'color': BLACK},
				{'code': 'FRXX4269' , 'color': BLACK},
				{'code': 'FRXX3651' , 'color': BLACK},
				{'code': 'BRXX3505' , 'color': DARKGREEN}
)

Zibase-thermostat

Accéder au thermostat zibase depuis un pc linux ou raspberryPi avec python

Screenshot_20181229_155406

Bien que le futur de notre bonne vieille zibase soit peut être compromis très bientôt, je voulais vous faire partager une application que j’ai développée il y a déjà presque cinq ans (2014), et que je viens de remettre à jour et déposer sur github.

C’est une version wan qui peut-être accédée depuis l’internet ou le réseau local.

Sur le raspberrypi, l’application s’affiche sur un écran TFT tactile dans mon salon. La version RaspberryPi  TFT avec accès aux boutons GPIO n’est pas encore publiée.

La version présentée aujourd’hui et disponible sur le dépot Github , est une version qui tourne sous linux sous environnement X. Tous les commentaires et ‘issues’ sont bienvenues sur github.

Il est peut être possible de l’adapter aux plateformes Windows.

Screenshot_20181229_155515 Screenshot_20181229_155611 Screenshot_20181229_155153

Installation des bibliothèque :

$ git clone https://github.com/onlinux/zibase-thermostat.git
$ cd zibase-thermostat

Installer  python-pip s’il n’est pas déjà installé:

$ sudo apt-get install python-pip

Installation de pywapi

Télécharger la dernière version de la bibliothèque pywapi depuis : <https://launchpad.net/python-weather-api/trunk/0.3.8/+download/pywapi-0.3.8.tar.gz>

Untar les sources et installer :

$ tar xvfz pywapi-0.3.8.tar.gz

$ cd pywapi-0.3.8

$ python setup.py build

$ sudo python setup.py install

$ cd ../zibase-thermostat/

# Installation de la bibliothèque pygame

$ sudo apt-get install python-pygame

Configuration

 

thermostat_variables

Set [global] thermostat variables as specified within zibase interface

Modifier le fichier  config.ini

L’exemple du thermostat zibase ci-dessus devrait donner un fichier config.ini ainsi:

[secret]
 zibaseid = ZiBASE00xxxx
 tokenid  = 00xxxxxx
 [global]
 tempvariable= 28
 setpointdayvariable= 29
 setpointnightvariable= 30
 modevariable= 31
 statevariable= 13
 thermostatscenario= 32

# Lancer Thermostat Zibase

python z.py

Alt-PageDown key to roll over the 4 available displays

Click to change Meteo Station when displaying forecasts.

Meteo Stations are defined within z.py

tlocations = (
				{'code': 'FRXX0099' , 'color': BLACK},
				{'code': 'FRXX4269' , 'color': BLACK},
				{'code': 'FRXX3651' , 'color': BLACK},
				{'code': 'BRXX3505' , 'color': DARKGREEN}
)

Visualiser le flux vidéo des caméras ZMODO ZH.IXY1D, ZMODO SH75D0001

zmodo-zh-ixy1dDéterminer l’adresse ip de la caméra

Avant tout, il faut connaître l’adresse IP de la caméra et pour cela se reporter au post précédent: Déterminer l’adresse IP de la caméra

Visualiser le flux avec mplayer

Flux vidéo 1280×720

#! /bin/bash
#
#  https://blog.onlinux.fr/
#
IP_CAMERA=192.168.0.210
dir=/tmp
keep_pipe_open=$dir/keep_pipe_open
touch $keep_pipe_open
(echo -ne '\x55\x55\xaa\xaa\x00\x00\x00\x00\x00\x00\x00\x50'; \
 while [ -f $keep_pipe_open ]; \
 do sleep 1; done ) | \
 netcat ${IP_CAMERA} 8000 | \
 mplayer -fps 24.976 -demuxer h264es - 

Pour le flux vidéo 320×240 remplacer ‘\x55\x55\xaa\xaa\x00\x00\x00\x00\x00\x00\x00\x50’ par

‘\x55\x55\xaa\xaa\x00\x00\x00\x00\x00\x00\x02\x90’

Visualiser le flux vidéo avec tinycam

Tinycam est une application Android. download (1)

 

 

Entrer l’adresse IP de la caméra

Et choisir comme Paramètres:
Zmodo ZP-NE-14S
Port: 8000
User:admin
Password:111111

On obtiendra le flux 320*240

Android Alerte Météorologique

L’application Alerte météorologique est une application qui vous renseigne sur les conditions d’alerte météorologique en France métropolitaine pour les prochaines 24h et envoie une notification sur votre téléphone mobile par technologie Push.

Cette notification est émise dès lors qu’au moins un département métropolitain est en alerte orange ou rouge. Une notification est émise à chaque nouveau département qui bascule en alerte orange ou rouge. Néanmoins, vous pouvez spécifier une liste de départements pour lesquels vous restreignez les notifications.

Les données météorologiques affichées dans l’application sont fournies par les services de Météo-France.

Les données météorologiques affichées dans le widget sont fournies par https://openweathermap.org

Le service de géocodage inversé, service  qui permet d’obtenir les conditions météorologiques ciblées sur votre commune, est fourni par le site https://geo.api.gouv.fr

Version 4.0

Le 4/6/2020, Météo-France a installé un nouveau système de vigilance. Les accès aux données disponibles ont été modifiées et certaines d’entres elles ne sont plus disponibles au grand public. Une nouvelle version 4.0 a été déployée et prend en compte ces modifications.

Version 3.4.78

  • Mise à jour imposée par Google pour prise en compte Android Pie 9.0 [API level 28]

Version 3.4.71

  • 05/04/2019 Changement de nom suite conflit avec marques déposées.

Version 3.4.70

  • Mise à jour imposée par Google pour prise en compte Android Oreo

Version 3.3.64

download (1)

  • Ajoutez des localités à la liste des favoris avec un clic long (plus de 2 secondes) dans le mode MAP
  • Effacez des localités de la liste des favoris en cliquant sur les marqueurs bleus dans le mode MAP
  • Visualisez les conditions d’alerte météorologiques  et les prévisions  en faisant glisser vers la droite la WebView.

Version 3.3.57

ic_launcher

Nouveau logo

Correction bug mineur sur certains type de mobiles au niveau du paramètre ‘vibreur’ pour les notifications.

Version 3.3.54

Nettoyage systématique du cache de la Webview afin d’occuper le moins d’espace de stockage.

Modification du message de notification lors d’un passage en alerte orange ou rouge pour le code ’75’. Ce code correspond à Paris et la petite couronne, ce qui couvre au total 4 départements. Précédemment il n’était comptabilisé que comme un seul département. La petite couronne est la zone constituée des trois départements limitrophes de la ville de Paris : les Hauts-de-Seine (92), la Seine-Saint-Denis (93) et le Val-de-Marne (94).

Version 3.3.51

Le Mode Carte

Ce mode permet d’obtenir les prévisions sur 24h ainsi que le suivi de la vigilance météo pour une localité qui est choisie en cliquant sur la carte de France. Cette option est accessible depuis le menu dans la barre d’action Android.

L’option ‘Partager’

Accessible depuis le menu de la barre d’action, cette option permet d’envoyer un lien à vos contacts afin de partager et d’installer l’application.

Paramètres

Optimisation de  l’affichage des paramètres de notification depuis l’application ou le widget XL.

Version 3.3.50

Il n’est plus nécessaire d’obtenir une clé API Open Weather Map pour afficher les données météo du Widget XL dans cette version.

L’application :

  1. Tableau de  Suivi de Vigilance pour les prochaines 24h par phénomènes pour votre localité.
  2. Prévisions  météo 24H issues des services de Météo-France pour votre localité.
  3. Menu paramètres de notification (son, vibreur, filtre départements).

Version 3.3.48

  1. download (1)Notifications par Push.
  2. Mise à jour de la carte de vigilance par Push.
  3. Intégration du mode DOZE pour les versions Android M et N

 Version 3.3

  1. Ajout d’un panneau d’aide à l’installation du widget
  2. Ajout d’un panneau d’aide pour les options de configuration
  3. Ajout d’un filtre pour les notifications. Il est possible désormais de sélectionner une liste de départements pour lesquels vous voulez une notification lors du passage en vigilance orange ou rouge.
  4. Ajout de la vitesse et direction du vent
  5. Mise à jour automatique des données météo et de la carte toutes les 60 minutes

 Alertes Météorologiques

L’application fournit 2 widgets que vous pouvez installer sur un bureau d’accueil.

Les widgets sont des extensions d’applications conçues pour fournir en permanence un service ou une fonctionnalité directement à l’écran sans besoin de démarrer l’application elle-même. Deux widgets sont disponibles. Le widget XL et le widget S.

Le widget S

mn_previewLe widget S(mall) est plutôt destiné aux possesseurs de mobile à faible résolution d’écran. Il permet essentiellement d’avoir un aperçu des alertes et d’installer la mécanique de notification.

Le widget XLScreenshots_2017-01-12-16-35-49

Ce widget est redimensionnable en hauteur et en largeur.

Ce widget affiche la carte des alertes météorologiques en cours, la localité et les données météo pour cette localité. Le widget est mise à jour toutes les 60 minutes ou par push lors d’une nouvelle publication de la carte.

Un clic sur la carte renvoie sur le site de  Météo-France ou l’on peut accéder aux bulletins en cours.
Un clic sur la localité affiche les conditions d’alerte de la localité, un accès direct aux bulletins ainsi que les prévisions Météo-France à 24h.

On peut activer/désactiver les options d’affichage ou de notification depuis le panneau de configuration du widget lors de l’installation de celui-ci.

Installation du widget

Remarque : partant du fait que le système d’exploitation mobile évolue au fil des versions, il y a des options qui se voient déplacées et/ou modifiées. En somme, ceci explique pourquoi il y a plusieurs méthodes pour ajouter un widget à l’écran d’accueil de son appareil mobile sous Android, en plus de l’écran de verrouillage pour certains d’entre eux.

Où trouver les widgets une fois téléchargés ?

Pour android KitKat ou une version plus récente consultez  la Documentation google “Ajouter des widgets, des raccourcis et des applications aux écrans d’accueil

Pour Android Jelly Bean ou une version plus ancienne:

  1. Appuyez sur l’icône Applications depuis l’écran d’accueil.
  2. Appuyez ensuite sur l’onglet Widgets en haut de l’écran.
  3. Touchez le widget à ajouter en maintenant le doigt dessus,
  4. puis glissez-le jusqu’à l’emplacement de votre choix et relâchez-le.

Remarque : Si le widget est trop grand pour l’emplacement choisi, votre appareil mobile cherchera l’emplacement disponible le plus proche pour y déposer le widget.

Screenshots_2017-01-12-16-35-49

Une notification est créée à chaque passage en alerte orange ou rouge, indiquant le nombre de départements métropolitains en alerte orange ou rouge. Un accès direct aux bulletins de votre localité est fourni en cliquant sur le nom de la commune en haut à gauche. download (1)

En cliquant sur la carte, vous êtes dirigés vers la page vigilance.meteofrance.com

Obtenir les données météo de votre localité

Pour obtenir les données météorologiques affichées pour votre localité, il est nécessaire de fournir une clé API (API key) qui est fournie gratuitement par les services d‘open weather map.

owm-api-key

Il  Suffit de s’enregistrer à l’adresse https://openweathermap.org/appid.

Les instructions en français pour obtenir une clé Api sont disponibles ici: https://blog.onlinux.fr/comment-obtenir-une-cle-api-openweathermap/

Un fois enregistré auprès de leurs  services, Open Weather Map vous attribuera une clé API. Copier/Coller ensuite cette clé dans le panneau de configuration du widget.

Comment Obtenir une clé API OpenWeatherMap?

Page d’inscription OpenWeatherMap

Pour les personnes qui ne comprennent pas l’anglais, voici les étapes pour obtenir sa clé API afin d’obtenir les données météo de votre localité sur le widget Alertes Météorologiques.google-play-badge

 

 

 

 

 

Lorsque vous cliquez sur le bouton ”JE M’INSCRIS POUR OBTENIR MA CLÉ” depuis le panneau  de configuration  du widget Alertes Météorologiques, vous ouvrez la page d’inscription (sign up) du site OpenWeatherMap.

dynamic-highcharts-plugin-7

 

 

  1. Entrez un nom d’utilisateur qui qualifiera votre compte dans le champ Username
  2. Entrez votre adresse mél (messagerie électronique) dans le champ Enter Email
  3. Entrez un mot de passe dans le champ Password. Ce mot de passe doit être composé d’au moins 8 caractères alphanumériques. Ce mot de passe n’est pas nécessairement votre mot de passe de votre compte email. Il ne sera lié qu’à vodynamic-highcharts-plugin-8tre compte Api OpenWeatherMap.
  4. Confirmez à nouveau de mot de passe dans le champ Repeat Password
  5. Cliquez dans le petit carré où il est écrit ‘I agree to The Terms of Service and Privacy Policy’ afin d’accepter les conditions d’utilisation.
  6. Pour finir cliquez dans le carré où il est inscrit ‘Je ne suis pas un Robot’
  7. Ensuite sur le bouton Create Account( Création de compte).

 

Arrivé à cette étape vous obtenez la page suivante:

Cliquez sur la case Cancel de la fenêtre qui s’affiche en superposition.

dynamic-highcharts-plugin-9

 

Vous tombez alors sur la page suivante:
Encore quelques clics et ouf, vous obtenez votre clé.
dynamic-highcharts-plugin-10

Tout en haut de la page, cliquez sur l’onglet API keys et vous obtiendrez votre clé API.

dynamic-highcharts-plugin-11
Votre clé API est la suite de caractères alphanumériques qui se trouve dans l’encadré sous le mot Key. Je vous suggère de faire un copier/coller depuis votre mobile (clic long sur la clé -> puis copier).
Dans le panneau de configuration du widget, il ne reste plus qu’à coller la clé (clic long dans le champ ‘Entrer la clé API’ -> puis coller).

L’activation de la clé peut prendre 10 minutes.
Vous pouvez générer autant de clé qu’il vous est nécessaire ( Champ Name -> puis Generate).

Dynamic Highcharts plugin for freeboard.io

Freeboard

A damn-sexy, open source real-time dashboard builder for IOT and other web mashups.

What is It?

Freeboard is a turn-key HTML-based “engine” for dashboards. Besides a nice looking layout engine, it provides a plugin architecture for creating datasources (which fetch data) and widgets (which display data)— freeboard then does all the work to connect the two together. Another feature of freeboard is its ability to run entirely in the browser as a single-page static web app without the need for a server. The feature makes it extremely attractive as a front-end for embedded devices which may have limited ability to serve complex and dynamic web pages.

Dynamic Highcharts widget plugin for freeboard.io

This widget plugin is  based on the highcharts widget plugin created by Hugo Sequeira.

Github repository: https://github.com/onlinux/freeboard-dynamic-highcharts-plugin

See it in action @ https://goo.gl/hbAXXU

dynamic-highcharts-plugin-4

dynamic-highcharts-plugin-1

dynamic-highcharts-plugin-2

INSTALLATION

Copy the file (plugin_highcharts.js from https://github.com/onlinux/freeboard-dynamic-highcharts-plugin) to your freeboard installation, for example:

$ cp ./plugin_highcharts.js /freeboard/plugins/thirdparty

Edit the freeboard index.html file and add a link to the plugin near the end of the head.js script loader, like:

head.js(
  'js/freeboard_plugins.min.js',
  'plugins/thirdparty/plugin_highcharts.js',
  $(function() {
    //DOM Ready
    freeboard.initialize(true);
  })

 

Actuator widget plugin for freeboard.io

Freeboard

A damn-sexy, open source real-time dashboard builder for IOT and other web mashups.

What is It?

Freeboard is a turn-key HTML-based “engine” for dashboards. Besides a nice looking layout engine, it provides a plugin architecture for creating datasources (which fetch data) and widgets (which display data)— freeboard then does all the work to connect the two together. Another feature of freeboard is its ability to run entirely in the browser as a single-page static web app without the need for a server. The feature makes it extremely attractive as a front-end for embedded devices which may have limited ability to serve complex and dynamic web pages.

Actuator widget plugin for freeboard.io

This widget plugin is based on the interactive-indicator created by Stufisher.

See it in action @ https://goo.gl/hbAXXU

Actuator Widget

Actuator Widget

 

Github repository: https://github.com/onlinux/freeboard-plugins

 

I modified it  mainly to fit my needs. It merely links the states ON and OFF to URLs.

actuator-2A click on the indicator switches the state ON/OFF of the actuator which is bound to a http request.

INSTALLATION

Copy the plugin (actuator.js  from https://github.com/onlinux/freeboard-actuator-plugin) to your freeboard installation, for example:

$ cp ./actuator.js /freeboard/plugins/

Edit the freeboard index.html file and add a link to the plugin near the end of the head.js script loader, like:

head.js(
  'js/freeboard_plugins.min.js',
  'plugins/actuator.js',
  $(function() {
    //DOM Ready
    freeboard.initialize(true);
  })

 

Activer l’accès FTP des caméras ZMODO ZH.IXY1D, ZMODO SH75D0001

zmodo-zh-ixy1dDéterminer l’adresse IP de la caméra

L’adresse MAC de la caméra doit commencer par 7c:c7:09 qui correspond à la compagnie Shenzhen

basic hardware information
Device mac address: 7C:C7:09 Base16 encoding: 7CC709
vendor name: Shenzhen RF-LINK Elec&Technology.,Ltd

vendor address:
Bldg56A, 6/F, Baotian Rd3
Baoan
Shenzhen Guangdong 518100
CHINA

 Plusieurs solutions sont disponibles

Installer l’application gratuite Android Fing

https://play.google.com/store/apps/details?id=com.overlook.android.fing&hl=fr

Un scan de votre réseau indiquera l’adresse IP de la caméra dont l’adresse MAC commence par  7c:c7:09

fing-snapshot

Par commande arp sous windows/linux

Sous linux:

nmap-zmodo-linux

windows:

Un scan de votre réseau indiquera l’adresse IP de la caméra dont l’adresse MAC commence par  7c-c7-09, ici  on trouve 192.168.0.116

windows-arp

Une fois l’adresse ip de la caméra connue, une analyse des ports ouverts sur la caméra nous indique que l’on peut y accéder via telnet (port 23/tcp)

snapshot2

Accès telnet (root et password vide)

A présent, nous sommes connectés root sur la caméra.

telnet-zmodo

Activer l’accès ftp

Entrez la commande

tcpsvd -vE 0.0.0.0 21 ftpd -w / &

Vous avez validé l’accès ftp ( pas de compte  ni de mot de passe)

ftp-zmodo

Depuis une machine distante accédez à la caméra par ftp:

ftp2-zmodo1

Voilà! Vous pouvez à présent explorer l’ensemble des fichiers du système de la caméra.

A suivre

Accès au flux vidéo avec mplayer sous linux.

Remarque: Le flux vidéo est déjà accessible sous Windows IExplorer via le port 80 , sans compte MeShare

 

Dynamic Highcharts plugin for freeboard.io – Add New Area style

Plugin

Dynamic Highcharts widget plugin for freeboard.io

NEW: Two styles available dynamic-highcharts-plugin-4 spline or area

Github repository: https://github.com/onlinux/freeboard-dynamic-highcharts-plugin

See it in action @  https://goo.gl/hbAXXU

 INSTALLATION

dynamic-highcharts-plugin-1

INSTALLATION

Copy the file (plugin_highcharts.js from https://github.com/onlinux/freeboard-dynamic-highcharts-plugin) to your freeboard installation, for example:

$ cp ./plugin_highcharts.js /freeboard/plugins/thirdparty

Edit the freeboard index.html file and add a link to the plugin js file near the end of the head.js script loader, like:

head.js(
  'js/freeboard_plugins.min.js',
  'plugins/actuator.js',
  $(function() {
    //DOM Ready
    freeboard.initialize(true);
  })head.js(
 'js/freeboard_plugins.min.js',
 'plugins/thirdparty/plugin_highcharts.js',
 $(function() {
 //DOM Ready
 freeboard.initialize(true);
 })

actuator-1