Commment activer, désactiver, configurer et utiliser le système de notification Notiflix de Voozanoo 4

Edit me

Introduction

Cet article décrit le système de notifications Notiflix mis à disposition dans Voozanoo 4 22w17 le 10/05/2022.

Ce système est basé sur la biliothèque Notiflix décrite ici : https://notiflix.github.io

Activation et désactivation

Il est possible de choisir le système de notification application par application à l’aide des directives suivantes dans l’application.ini :

Directive Type Valeur par défaut Description
voozanoo.notification.system string voozanoo Système de notifications à utiliser : voozanoo ou notiflix
lib.notiflix.url string Aucune Chemin vers la bibliothèque Notifix (/popups/notiflix par exemple), nécessaire uniquement si Notiflix est utilisé

Si Notiflix est activé :

  • Les plupart des notifications de Voozanoo 4 sont remplacées par une versions Notiflix (ShowDialog, ShowConfirmDialog, ShowAlert)
  • Les notifications Notiflix deviennent utilisables pour les développements spécifiques
  • Ces notifications sont personnalisables projet par projet (style essentiellement)

Exemple de notifications selon le système choisi

voozanoo.notification.system = "voozanoo" voozanoo.notification.system = "notiflix"
Exemple avec le système historique Exemple avec Notiflix

Configuration par projet

La configuration par module et projet

Notiflix propose 5 modules :

  • Notify : Notifications légères et non-bloquantes (pour confirmer à l’utilisateur que l’action a eu lieu par exemple)
  • Report : Notifications plus invasive et contenant des boutons (pour les messages qui doivent être lus)
  • Confirm : Fenêtre de question/réponse
  • Loading : Affiche un indicateur de chargement (au changement de page ou en attendant les réponses XHR par exemple)
  • Block : Permet de bloquer un composant de la page en attendant une réponse XHR par exemple

Chacun de ces modules peut être personnalisé projet par projet à l’aide de ressources Voozanoo 4. Il existe un type de ressource par module et chacun a un template correspondant au choix fait pour le noyau Voozanoo 4 :

Configuration par projet

A partir de sa version 1.25, Epicraft proposera aussi ces templates ce qui facilitera leur partag entre environnement pour un même projet.

Cette configuration est au format JSON et est basée sur la documentation de Notiflix disponible ici : https://notiflix.github.io/documentation

La syntaxe «ProjectMainColor[N]»

Dans les JSON de configuration Notiflix, il est possble d’utiliser la syntaxe <<ProjectMainColor[N]>> qui fait référence à la couleur principale du projet définie dans sa ressource de type Style.

N va de -10 à 10 avec :

  • <<ProjectMainColor[0]>> correspondant à la couleur prinipale du projet
  • <<ProjectMainColor[-10]>> tellement sombre qu’il est noir
  • <<ProjectMainColor[10]>> tellement clair qu’il est blanc

Il suffit donc de changer la couleur principale dans la ressource Style du projet pour que toutes les nottifications s’adaptent.

Confirmation en fonction de la couleur principale

Le développement

L’appel aux notifications reste disponible via l’objet Layout. C’est lui qui décide s’il faut utilser les notifications historiques de Voozanoo 4 ou bien celle de Notiflix en fonction de la directive voozanoo.notification.system. Le méthodes à utiliser restent ShowDialog, HideDialog, ShowConfirmDialog, HideConfirmDialog, etc.

De plus, une nouvelle classe NotiflixManager centralise les traitements spécifiques aux notifications Notiflix, y compris des choses impossibles avec les notifications historiques de Voozanoo 4 comme la gestion de la pile des notifications.