Skip to main content

1.2 Boîtes de message et notifications

Il est possible d’afficher des boîtes de message et des notifications dans une application Ontomantics. Une boîte de message est une fenêtre de type popup permettant d’informer l’utilisateur d’un événement, ou d’obtenir une information de sa part.

 

1.2.1 Gestion des boitesboîtes de message

La première étape consiste à créer la boîte de message. Dans la liste des projets, cliquer sur l’application souhaitée, puis cliquer sur Conception. Cliquer sur l’icône (Gérer les boîtes de message et les notifications). Cliquer ensuite sur le bouton puis sur Nouvelle boîte de message.

 

Boite_message_nouvelle.png

 

Sélectionner le type de la boîte de message souhaité :

  • Boîte de message OK : boîte de message avec un unique bouton OK

  • Boîte de message OK Annuler : boîte de message avec un bouton OK et un bouton Annuler

  • Boîte de message Oui Non Annuler : boîte de message avec un bouton Oui, un bouton Non et un bouton Annuler

  • Boîte de message Oui Non : boîte de message avec un bouton Oui et un bouton Non

  • Boîte de message Réessayer Annuler : boîte de message avec un bouton Réessayer et un bouton Annuler

Le formulaire suivant apparaît :

 

Boite_message_form.png

 

Le champ Titre est le nom de la boîte de message. Le champ Titre de la boîte de message est le titre qui apparaît dans l’entête de la boîte. Le champ Message correspond au contenu affiché dans la boîte. Le champ Icône permet de choisir l’icône associée (question, succès, information, etc.). L’option Modale (bloquante), si cochée, requière que l’utilisateur réponde avant de poursuivre le programme. Une fois le formulaire complété et validé, un aperçu de la boîte de message est affiché (onglet Aperçu) :

 

Boite_message_apercu.png

 

Une boîte ne peut pas contenir de contrôles.

Ensuite, il est possible de rattacher des comportements aux boutons de la boîte de dialogue :

 

Boite_message_declencheurs.png

 

Faire un clic droit sur le déclencheur OK ou Annuler et créer ou rattacher le comportement (la création de comportement est décrite plus loin dans cette documentation).

 

Boite_message_declencheurs_1.png

 

La boîte de message est maintenant créée.

Cliquer sur un bouton de la boîte de message entraîne sa fermeture.

 

1.2.2 Gestion des notifications

Les notifications sont des infobulles affichant différentes informations en bas à droite de l’écran de l’utilisateur lorsqu’une action est réalisée.

 

Notif.png

 

Pour créer une notification, cliquer sur l’icône fa-solid-comment-alt.png (Gérer les boîtes de message et les notifications) depuis l’onglet fa-solid-pencil-ruler.png Conception. Cliquer ensuite sur le bouton fa-solid-plus.png puis sur Nouvelle notification.

 

Notif_nouvelle.png

 

Renseigner le titre, puis le champ Titre de la notification (c’est ce texte qui est affiché dans le titre qui apparaît au sein de la notification, et non celui du champ Titre). Renseigner le champ Message avec le contenu de la notification. Choisir ensuite le type de notification (succès, information, avertissement, etc.), la classe de style utilisée, ainsi que l’icône. Par défaut, les notifications ne disparaissent qu’en cliquant dessus ou en cliquant ailleurs dans l’application. Il est possible de définir un temps avant qu’elle ne disparaisse, en cochant la case Masquer automatiquement après et en spécifiant une durée en secondes. Cliquer sur Sauvegarder pour terminer la création de la notification.

Les notifications peuvent être appelées depuis un comportement, via l’action Afficher une boîte de message ou de notification.

 

Notif_action.png

 

1.2.3 Gestion des notifications Push

Les notifications Push sont des notifications qui apparaissent sans intervention de la part de l’utilisateur. Sur mobile (et sous certaines conditions sur certains navigateurs de bureau), elles utilisent le système de notification natif du système (comme les notifications Android par exemple).

Pour pouvoir utiliser les notifications Push, il faut impérativement les trois conditions suivantes :

  • Être en HTTPS (Microsoft Edge permet néanmoins l’installation de n’importe quel site sans contrainte)

  • Le certificat HTTPS doit être valide

  • Avoir un navigateur compatible : cf. liste ci-dessous

  • Les navigateurs de bureau (hors Safari) doivent être démarrés pour recevoir les notifications

Sur Android, tous les navigateurs supportent les notifications Push. Sur les navigateurs de bureau, Firefox, EdgeLegacy 17, Chrome, Opera et leurs dérivés sont compatibles (support désactivé dans les version ESR de Firefox 60 et antérieures). Sur Mac, les notifications fonctionnent sur Safari uniquement à partir des versions 16.1 du navigateur sur MacOS 13 Ventura. Sur iOS 16.4 et supérieur, les notifications sont disponibles mais uniquement pour les applications PWA installées sur l’écran d’accueil.

Pour créer une notification Push, cliquer sur l’icône fa-solid-comment-alt.png (Gérer les boîtes de message et les notifications) depuis l’onglet fa-solid-pencil-ruler.png Conception. Cliquer ensuite sur le bouton fa-solid-plus.png puis sur Nouvelle notification Push.

 

NotifPush_nouvelle.png

 

Renseigner le titre, puis le champ Titre de la notification (c’est ce texte qui est affiché dans le titre qui apparaît au sein de la notification, et non celui du champ Titre). Renseigner le champ Message avec le contenu de la notification. Les différents champs de saisie sont accompagnés d’une icône fa-solid-question-circle.png affichant une infobulle d’aide.

L’option Notification affichée jusqu’à l’interaction de l’utilisateur, qui évite que la notification disparaisse au bout de 20 secondes, n’est pas prise en compte sur la version bureau de Firefox, sauf si la propriété dom.webnotifications.requireinteraction.enabled est activée dans about:config. À noter également que Firefox version bureau ne gère pas l’affichage d’une photo dans les notifications Push.

Avant de pouvoir envoyer une notification Push, il faut utiliser l’action Demander la permission d’envoyer des notifications dans le comportement associé.

 

NotifPush_00.png

 

Le Jeu de donnée prédéfini Liste des notification Push en cours permet de voir si les notifications on été affichées, fermées ou cliquées par l’utilisateur. Les notifications sont retirées de ce tableau une minute après leur expiration.