diff options
author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:24 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
commit | 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch) | |
tree | 30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/notification | |
parent | c05efa8d7ae464235cf83d7c0956e42dc6974103 (diff) | |
download | translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2 translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip |
convert content to md
Diffstat (limited to 'files/fr/web/api/notification')
25 files changed, 564 insertions, 898 deletions
diff --git a/files/fr/web/api/notification/actions/index.md b/files/fr/web/api/notification/actions/index.md index e65543b120..7d161e703d 100644 --- a/files/fr/web/api/notification/actions/index.md +++ b/files/fr/web/api/notification/actions/index.md @@ -11,48 +11,33 @@ tags: - actions translation_of: Web/API/Notification/actions --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>actions</code></strong> en lecture seule de l'interface {{domxref ("Notification")}} renvoie la liste des {{domxref ("NotificationAction")}} objets définis à l'aide de l'option <code>actions</code> lors de la création de la notification à l'aide du constructeur {{domxref("Notification.Notification","Notification()")}}.</p> +La propriété **`actions`** en lecture seule de l'interface {{domxref ("Notification")}} renvoie la liste des {{domxref ("NotificationAction")}} objets définis à l'aide de l'option `actions` lors de la création de la notification à l'aide du constructeur {{domxref("Notification.Notification","Notification()")}}. -<p>Il s'agit d'une liste des actions définies par l'application que l'utilisateur peut choisir de prendre directement depuis le contexte d'une notification.</p> +Il s'agit d'une liste des actions définies par l'application que l'utilisateur peut choisir de prendre directement depuis le contexte d'une notification. -<div class="blockIndicator note"> -<p><strong>Note:</strong> Le périphérique et l'agent utilisateur peuvent ne pouvoir afficher qu'un nombre limité d'actions (en raison, par exemple, d'un espace d'écran limité). Cette limite peut être déduite de {{DOMxRef ("Notification.maxActions")}}.</p> -</div> +> **Note :** Le périphérique et l'agent utilisateur peuvent ne pouvoir afficher qu'un nombre limité d'actions (en raison, par exemple, d'un espace d'écran limité). Cette limite peut être déduite de {{DOMxRef ("Notification.maxActions")}}. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.actions</pre> + Notification.actions -<h3 id="Value">Valeur</h3> +### Valeur -<p>Un tableau en lecture seule d'objets {{domxref ("NotificationAction")}}, chacun décrivant une action unique que l'utilisateur peut choisir dans une notification.</p> +Un tableau en lecture seule d'objets {{domxref ("NotificationAction")}}, chacun décrivant une action unique que l'utilisateur peut choisir dans une notification. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-actions','actions')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------------------ | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-actions','actions')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.actions")}}</p> +{{Compat("api.Notification.actions")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> - <li>{{DOMxRef("Notification.maxActions")}}</li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) +- {{DOMxRef("Notification.maxActions")}} diff --git a/files/fr/web/api/notification/badge/index.md b/files/fr/web/api/notification/badge/index.md index 319ba58bb9..b5663529fb 100644 --- a/files/fr/web/api/notification/badge/index.md +++ b/files/fr/web/api/notification/badge/index.md @@ -10,35 +10,24 @@ tags: - Reference translation_of: Web/API/Notification/badge --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>badge</code></strong> de l'interface {{domxref ("Notification")}} renvoie l'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même.</p> +La propriété **`badge`** de l'interface {{domxref ("Notification")}} renvoie l'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox">const url = Notification.badge</pre> + const url = Notification.badge -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref('USVString')}} contenant une URL.</p> +Une {{domxref('USVString')}} contenant une URL. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-badge','badge')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Web Notifications','#dom-notification-badge','badge')}} | {{Spec2('Web Notifications')}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.badge")}}</p> +{{Compat("api.Notification.badge")}} diff --git a/files/fr/web/api/notification/body/index.md b/files/fr/web/api/notification/body/index.md index e19c579157..387db947c8 100644 --- a/files/fr/web/api/notification/body/index.md +++ b/files/fr/web/api/notification/body/index.md @@ -11,42 +11,28 @@ tags: - Reference translation_of: Web/API/Notification/body --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>body</code></strong> de l'interface {{domxref ("Notification")}} est la chaîne de caractères qui correspond au corps de la notification, comme définis à l'aide de l'option <code>body</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}.</p> +La propriété en lecture seule **`body`** de l'interface {{domxref ("Notification")}} est la chaîne de caractères qui correspond au corps de la notification, comme définis à l'aide de l'option `body` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.body -</pre> + Notification.body -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref("DOMString")}} contenant le corps de la notification.</p> +Une {{domxref("DOMString")}} contenant le corps de la notification. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-body','body')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Web Notifications','#dom-notification-body','body')}} | {{Spec2('Web Notifications')}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.body")}}</p> +{{Compat("api.Notification.body")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/close/index.md b/files/fr/web/api/notification/close/index.md index 359bf36dda..2a41b8cee9 100644 --- a/files/fr/web/api/notification/close/index.md +++ b/files/fr/web/api/notification/close/index.md @@ -12,69 +12,55 @@ tags: - fermeture translation_of: Web/API/Notification/close --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La méthode <code>close()</code> de l'interface {{domxref("Notification")}} est utilisée pour fermer / supprimer une notification précédemment affichée.</p> +La méthode `close()` de l'interface {{domxref("Notification")}} est utilisée pour fermer / supprimer une notification précédemment affichée. -<div class="note"> -<p><strong>Note:</strong> Cette API ne doit pas être utilisée uniquement pour supprimer la notification de l'écran après un délai fixe, car cette méthode supprimera également la notification de toute barre de notification, empêchant ainsi les utilisateurs d'interagir avec elle après son affichage initial. Une utilisation valable de cette API serait de supprimer une notification qui n'est plus pertinente (par exemple, l'utilisateur a déjà lu la notification sur la page Web dans le cas d'une application de messagerie ou la chanson suivante est déjà en cours de lecture dans une application musicale).</p> -</div> +> **Note :** Cette API ne doit pas être utilisée uniquement pour supprimer la notification de l'écran après un délai fixe, car cette méthode supprimera également la notification de toute barre de notification, empêchant ainsi les utilisateurs d'interagir avec elle après son affichage initial. Une utilisation valable de cette API serait de supprimer une notification qui n'est plus pertinente (par exemple, l'utilisateur a déjà lu la notification sur la page Web dans le cas d'une application de messagerie ou la chanson suivante est déjà en cours de lecture dans une application musicale). -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox">Notification.close()</pre> + Notification.close() -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<p>Aucun.</p> +Aucun. -<h3 id="Returns">Returns</h3> +### Returns -<p>Void.</p> +Void. -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>Dans l'extrait de code suivant, nous avons une simple fonction qui, lorsqu'elle est appelée, crée un objet <code>options</code>, puis de celui-ci une nouvelle notification. À la fin de la fonction, elle appelle également <code>close()</code> dans une fonction {{domxref ("EventTarget.addEventListener", "addEventListener ()")}} pour supprimer la notification lorsque le contenu pertinent a été lu sur la page Web.</p> +Dans l'extrait de code suivant, nous avons une simple fonction qui, lorsqu'elle est appelée, crée un objet `options`, puis de celui-ci une nouvelle notification. À la fin de la fonction, elle appelle également `close()` dans une fonction {{domxref ("EventTarget.addEventListener", "addEventListener ()")}} pour supprimer la notification lorsque le contenu pertinent a été lu sur la page Web. -<pre class="brush:js">function spawnNotification(theBody, theIcon, theTitle) { +```js +function spawnNotification(theBody, theIcon, theTitle) { const options = { body: theBody, icon: theIcon } const n = new Notification(theTitle, options) - document.addEventListener('visibilitychange', () => { + document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible') { // The tab has become visible so clear the now-stale Notification. n.close() } }) } -</pre> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Notification.close")}}</p> - -<h2 id="Voir_également">Voir également</h2> - -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +``` + +## Spécifications + +| Spécification | Status | Comment | +| -------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications')}} | {{Spec2('Web Notifications')}} | Living standard | + +## Compatibilité des navigateurs + +{{Compat("api.Notification.close")}} + +## Voir également + +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/data/index.md b/files/fr/web/api/notification/data/index.md index 22b3b01747..efddb360b1 100644 --- a/files/fr/web/api/notification/data/index.md +++ b/files/fr/web/api/notification/data/index.md @@ -11,44 +11,30 @@ tags: - données translation_of: Web/API/Notification/data --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>data</code></strong> de l'interface {{domxref ("Notification")}} renvoie un clone structuré des données de la notification, comme définis à l'aide de l'option <code>data</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification() ")}}.</p> +La propriété en lecture seule **`data`** de l'interface {{domxref ("Notification")}} renvoie un clone structuré des données de la notification, comme définis à l'aide de l'option `data` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification() ")}}. -<p>Les données de la notification peuvent être des données arbitraires, sans restriction de format que vous souhaitez associer à la notification.</p> +Les données de la notification peuvent être des données arbitraires, sans restriction de format que vous souhaitez associer à la notification. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.data -</pre> + Notification.data -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Un clone structuré.</p> +Un clone structuré. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-data','data')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | -------------------- | +| {{SpecName('Web Notifications','#dom-notification-data','data')}} | {{Spec2('Web Notifications')}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.data")}}</p> +{{Compat("api.Notification.data")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/dir/index.md b/files/fr/web/api/notification/dir/index.md index 7fed8f84dd..3c3fac0055 100644 --- a/files/fr/web/api/notification/dir/index.md +++ b/files/fr/web/api/notification/dir/index.md @@ -11,52 +11,34 @@ tags: - direction translation_of: Web/API/Notification/dir --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>dir</code></strong> de l'interface {{domxref ("Notification")}} indique le sens du texte de la notification, définis à l'aide de l'option <code>dir</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}.</p> +La propriété en lecture seule **`dir`** de l'interface {{domxref ("Notification")}} indique le sens du texte de la notification, définis à l'aide de l'option `dir` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="eval"><var>Notification</var>.dir -</pre> + Notification.dir -<h3 id="Value">Valeur</h3> +### Valeur -<p>Une {{domxref ("DOMString")}} spécifiant la direction du texte. Les valeurs possibles sont:</p> +Une {{domxref ("DOMString")}} spécifiant la direction du texte. Les valeurs possibles sont: -<ul> - <li><code>auto</code>: adopte le comportement de réglage de la langue du navigateur (par défaut).</li> - <li><code>ltr</code>: de gauche à droite.</li> - <li><code>rtl</code> : de droite à gauche.</li> -</ul> +- `auto`: adopte le comportement de réglage de la langue du navigateur (par défaut). +- `ltr`: de gauche à droite. +- `rtl` : de droite à gauche. -<div class="note"> -<p><strong>Note :</strong> La plupart des navigateurs semblent ignorer les paramètres explicites de ltr et rtl, et utilisent simplement le paramètre à l'échelle du navigateur.</p> -</div> +> **Note :** La plupart des navigateurs semblent ignorer les paramètres explicites de ltr et rtl, et utilisent simplement le paramètre à l'échelle du navigateur. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-dir','dir')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------ | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-dir','dir')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.dir")}}</p> +{{Compat("api.Notification.dir")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/icon/index.md b/files/fr/web/api/notification/icon/index.md index 8b25811ea0..c9b7945863 100644 --- a/files/fr/web/api/notification/icon/index.md +++ b/files/fr/web/api/notification/icon/index.md @@ -11,42 +11,28 @@ tags: - Reference translation_of: Web/API/Notification/icon --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>icon</code></strong> de l'interface {{domxref ("Notification")}} contient l'URL d'une icône à afficher dans le cadre de la notification, comme définis à l'aide de l'option <code>icon</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}.</p> +La propriété en lecture seule **`icon`** de l'interface {{domxref ("Notification")}} contient l'URL d'une icône à afficher dans le cadre de la notification, comme définis à l'aide de l'option `icon` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.icon -</pre> + Notification.icon -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref("USVString")}}.</p> +Une {{domxref("USVString")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-icon','icon')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-icon','icon')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.icon")}}</p> +{{Compat("api.Notification.icon")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/image/index.md b/files/fr/web/api/notification/image/index.md index fa57345f6e..f37b623597 100644 --- a/files/fr/web/api/notification/image/index.md +++ b/files/fr/web/api/notification/image/index.md @@ -11,41 +11,28 @@ tags: - Reference translation_of: Web/API/Notification/image --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <code><strong>image</strong></code> de l'interface {{domxref ("Notification")}} contient l'URL d'une image à afficher dans le cadre de la notification, comme définis à l'aide de l'option <code>image</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}.</p> +La propriété en lecture seule **`image`** de l'interface {{domxref ("Notification")}} contient l'URL d'une image à afficher dans le cadre de la notification, comme définis à l'aide de l'option `image` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.image</pre> + Notification.image -<h3 id="Value">Valeur</h3> +### Valeur -<p>Une {{domxref("USVString")}}.</p> +Une {{domxref("USVString")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#image-resource','image')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| -------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#image-resource','image')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.image")}}</p> +{{Compat("api.Notification.image")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/index.md b/files/fr/web/api/notification/index.md index f732fae408..107076fd64 100644 --- a/files/fr/web/api/notification/index.md +++ b/files/fr/web/api/notification/index.md @@ -9,115 +9,106 @@ tags: - Reference translation_of: Web/API/Notification --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> - -<p>L'interface Notification de l'<a href="/fr/docs/Web/API/Notifications_API">API Notifications</a> est utilisée pour configurer et afficher les notifications de bureau à l'utilisateur. L'apparence et les fonctionnalités spécifiques de ces notifications varient selon les plates-formes, mais elles permettent généralement de fournir des informations de manière asynchrone à l'utilisateur.</p> - -<h2 id="Constructeur">Constructeur</h2> - -<dl> - <dt>{{domxref("Notification.Notification", "Notification()")}}</dt> - <dd>Créer une nouvelle instance de l'object <code>Notification</code>.</dd> -</dl> - -<h2 id="Propriétés">Propriétés</h2> - -<h3 id="Propriétés_statiques">Propriétés statiques</h3> - -<p><em>Ces propriétés ne sont disponibles que sur l'objet </em><code>Notification</code> <em>lui-même.</em></p> - -<dl> - <dt>{{domxref("Notification.permission")}} {{readonlyinline}}</dt> - <dd><p>Une chaîne représentant l'autorisation actuelle d'afficher les notifications. Les valeurs possibles sont:</p> - <ul> - <li><code>denied</code> — L'utilisateur refuse d'afficher des notifications.</li> - <li><code>granted</code> — L'utilisateur accepte d'afficher des notifications.</li> - <li><code>default</code> — Le choix de l'utilisateur est inconnu et donc le navigateur agira comme si la valeur était refusée.</li> - </ul> - </dd> - <dt>{{domxref("Notification.maxActions")}} {{readonlyinline}}</dt> - <dd>Le nombre maximal d'actions pris en charge par l'appareil et l'agent utilisateur.</dd> -</dl> - -<h3 id="Propriétés_de_linstance">Propriétés de l'instance</h3> - -<p><em>Ces propriétés ne sont disponibles que sur les instances de l'objet </em><code>Notification</code><em>.</em></p> - -<dl> - <dt>{{domxref("Notification.actions")}} {{readonlyinline}}</dt> - <dd>Tableau d'actions de la notification comme spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.badge")}} {{readonlyinline}}</dt> - <dd>L'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même.</dd> - <dt>{{domxref("Notification.body")}} {{readonlyinline}}</dt> - <dd>Une chaîne représentant le corps de la notification telle que spécifiée dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.data")}} {{readonlyinline}}</dt> - <dd>Renvoie un clone structuré des données de la notification.</dd> - <dt>{{domxref("Notification.dir")}} {{readonlyinline}}</dt> - <dd>La direction du texte de la notification comme spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.lang")}} {{readonlyinline}}</dt> - <dd>Code de langue de la notification tel que spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.tag")}} {{readonlyinline}}</dt> - <dd>L'ID de la notification (le cas échéant) tel que spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.icon")}} {{readonlyinline}}</dt> - <dd>L'URL de l'image utilisée comme icône de la notification comme spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.image")}} {{readonlyinline}}</dt> - <dd>L'URL d'une image à afficher dans le cadre de la notification, comme spécifié dans le paramètre <code>options</code> du constructeur.</dd> - <dt>{{domxref("Notification.renotify")}} {{readonlyinline}}</dt> - <dd>Spécifie si l'utilisateur doit être averti après qu'une nouvelle notification remplace l'ancienne.</dd> - <dt>{{domxref("Notification.requireInteraction")}} {{readonlyinline}}</dt> - <dd>Un {{jsxref ("Boolean")}} indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement.</dd> - <dt>{{domxref("Notification.silent")}} {{readonlyinline}}</dt> - <dd>Spécifie si la notification doit être silencieuse, c'est-à-dire qu'aucun son ou vibration ne doit être émis, quels que soient les paramètres de l'appareil.</dd> - <dt>{{domxref("Notification.timestamp")}} {{readonlyinline}}</dt> - <dd>Spécifie l'heure à laquelle une notification est créée ou applicable (passée, présente ou future).</dd> - <dt>{{domxref("Notification.title")}} {{readonlyinline}}</dt> - <dd>Le titre de la notification tel que spécifié dans le premier paramètre du constructeur.</dd> - <dt>{{domxref("Notification.vibrate")}} {{readonlyinline}}</dt> - <dd>Spécifie un modèle de vibration pour les périphériques dotés d'un matériel de vibration à émettre.</dd> -</dl> - -<h3 id="Gestionnaires_dévénements">Gestionnaires d'événements</h3> - -<dl> - <dt>{{domxref("Notification.onclick")}}</dt> - <dd>Un gestionnaire pour l'événement {{domxref ("Element/click_event", "click")}}. Il est déclenché à chaque fois que l'utilisateur clique sur la notification.</dd> - <dt>{{domxref("Notification.onclose")}}</dt> - <dd>Un gestionnaire pour l'événement {{domxref ("HTMLDialogElement/close_event", "close")}}. Il est déclenché lorsque l'utilisateur ferme la notification.</dd> - <dt>{{domxref("Notification.onerror")}}</dt> - <dd>Un gestionnaire pour l'événement {{domxref ("HTMLElement/error_event", "error")}}. Il est déclenché chaque fois que la notification rencontre une erreur.</dd> - <dt>{{domxref("Notification.onshow")}}</dt> - <dd>Un gestionnaire pour l'événement {{domxref ("Element/show_event", "show")}}. Il est déclenché lorsque la notification est affichée.</dd> -</dl> - -<h2 id="Méthodes">Méthodes</h2> - -<h3 id="Méthodes_statiques">Méthodes statiques</h3> - -<p><em>Ces méthodes ne sont disponibles que sur l'objet </em><code>Notification</code> <em>lui-même.</em></p> - -<dl> - <dt>{{domxref("Notification.requestPermission()")}}</dt> - <dd>Demande l'autorisation à l'utilisateur d'afficher les notifications.</dd> -</dl> - -<h3 id="Méthodes_dinstance">Méthodes d'instance</h3> - -<p><em>Ces propriétés ne sont disponibles que sur une instance de l'objet </em><code>Notification</code><em> ou via son </em><a href="/fr/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">prototype</a><em>. L'objet </em><code>Notification</code><em> hérite également de l'interface {{domxref ("EventTarget")}}.</em></p> - -<dl> - <dt>{{domxref("Notification.close()")}}</dt> - <dd>Ferme programmatiquement une instance de notification.</dd> -</dl> - -<h2 id="Exemples">Exemples</h2> - -<p>Supposons ce HTML de base:</p> - -<pre class="brush: html"><button onclick="notifyMe()">Notifie moi !</button></pre> - -<p>Il est possible d'envoyer une notification comme suit - nous présentons ici un ensemble de code assez détaillé et complet que vous pourriez utiliser si vous vouliez d'abord vérifier si les notifications sont prises en charge, puis vérifiez si l'autorisation a été accordée pour l'{{glossary("Origin","origine")}} actuelle d'envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification.</p> - -<pre class="brush: js">function notifyMe() { +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} + +L'interface Notification de l'[API Notifications](/fr/docs/Web/API/Notifications_API) est utilisée pour configurer et afficher les notifications de bureau à l'utilisateur. L'apparence et les fonctionnalités spécifiques de ces notifications varient selon les plates-formes, mais elles permettent généralement de fournir des informations de manière asynchrone à l'utilisateur. + +## Constructeur + +- {{domxref("Notification.Notification", "Notification()")}} + - : Créer une nouvelle instance de l'object `Notification`. + +## Propriétés + +### Propriétés statiques + +_Ces propriétés ne sont disponibles que sur l'objet_ `Notification` _lui-même._ + +- {{domxref("Notification.permission")}} {{readonlyinline}} + + - : Une chaîne représentant l'autorisation actuelle d'afficher les notifications. Les valeurs possibles sont: + + - `denied` — L'utilisateur refuse d'afficher des notifications. + - `granted` — L'utilisateur accepte d'afficher des notifications. + - `default` — Le choix de l'utilisateur est inconnu et donc le navigateur agira comme si la valeur était refusée. + +- {{domxref("Notification.maxActions")}} {{readonlyinline}} + - : Le nombre maximal d'actions pris en charge par l'appareil et l'agent utilisateur. + +### Propriétés de l'instance + +_Ces propriétés ne sont disponibles que sur les instances de l'objet_ `Notification`_._ + +- {{domxref("Notification.actions")}} {{readonlyinline}} + - : Tableau d'actions de la notification comme spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.badge")}} {{readonlyinline}} + - : L'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même. +- {{domxref("Notification.body")}} {{readonlyinline}} + - : Une chaîne représentant le corps de la notification telle que spécifiée dans le paramètre `options` du constructeur. +- {{domxref("Notification.data")}} {{readonlyinline}} + - : Renvoie un clone structuré des données de la notification. +- {{domxref("Notification.dir")}} {{readonlyinline}} + - : La direction du texte de la notification comme spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.lang")}} {{readonlyinline}} + - : Code de langue de la notification tel que spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.tag")}} {{readonlyinline}} + - : L'ID de la notification (le cas échéant) tel que spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.icon")}} {{readonlyinline}} + - : L'URL de l'image utilisée comme icône de la notification comme spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.image")}} {{readonlyinline}} + - : L'URL d'une image à afficher dans le cadre de la notification, comme spécifié dans le paramètre `options` du constructeur. +- {{domxref("Notification.renotify")}} {{readonlyinline}} + - : Spécifie si l'utilisateur doit être averti après qu'une nouvelle notification remplace l'ancienne. +- {{domxref("Notification.requireInteraction")}} {{readonlyinline}} + - : Un {{jsxref ("Boolean")}} indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. +- {{domxref("Notification.silent")}} {{readonlyinline}} + - : Spécifie si la notification doit être silencieuse, c'est-à-dire qu'aucun son ou vibration ne doit être émis, quels que soient les paramètres de l'appareil. +- {{domxref("Notification.timestamp")}} {{readonlyinline}} + - : Spécifie l'heure à laquelle une notification est créée ou applicable (passée, présente ou future). +- {{domxref("Notification.title")}} {{readonlyinline}} + - : Le titre de la notification tel que spécifié dans le premier paramètre du constructeur. +- {{domxref("Notification.vibrate")}} {{readonlyinline}} + - : Spécifie un modèle de vibration pour les périphériques dotés d'un matériel de vibration à émettre. + +### Gestionnaires d'événements + +- {{domxref("Notification.onclick")}} + - : Un gestionnaire pour l'événement {{domxref ("Element/click_event", "click")}}. Il est déclenché à chaque fois que l'utilisateur clique sur la notification. +- {{domxref("Notification.onclose")}} + - : Un gestionnaire pour l'événement {{domxref ("HTMLDialogElement/close_event", "close")}}. Il est déclenché lorsque l'utilisateur ferme la notification. +- {{domxref("Notification.onerror")}} + - : Un gestionnaire pour l'événement {{domxref ("HTMLElement/error_event", "error")}}. Il est déclenché chaque fois que la notification rencontre une erreur. +- {{domxref("Notification.onshow")}} + - : Un gestionnaire pour l'événement {{domxref ("Element/show_event", "show")}}. Il est déclenché lorsque la notification est affichée. + +## Méthodes + +### Méthodes statiques + +_Ces méthodes ne sont disponibles que sur l'objet_ `Notification` _lui-même._ + +- {{domxref("Notification.requestPermission()")}} + - : Demande l'autorisation à l'utilisateur d'afficher les notifications. + +### Méthodes d'instance + +_Ces propriétés ne sont disponibles que sur une instance de l'objet_ `Notification` _ou via son_ [prototype](/fr/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain)_. L'objet_ `Notification` _hérite également de l'interface {{domxref ("EventTarget")}}._ + +- {{domxref("Notification.close()")}} + - : Ferme programmatiquement une instance de notification. + +## Exemples + +Supposons ce HTML de base: + +```html +<button onclick="notifyMe()">Notifie moi !</button> +``` + +Il est possible d'envoyer une notification comme suit - nous présentons ici un ensemble de code assez détaillé et complet que vous pourriez utiliser si vous vouliez d'abord vérifier si les notifications sont prises en charge, puis vérifiez si l'autorisation a été accordée pour l'{{glossary("Origin","origine")}} actuelle d'envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification. + +```js +function notifyMe() { // Vérifions si le navigateur prend en charge les notifications if (!('Notification' in window)) { alert('Ce navigateur ne prend pas en charge la notification de bureau') @@ -131,7 +122,7 @@ translation_of: Web/API/Notification // Sinon, nous devons demander la permission à l'utilisateur else if (Notification.permission !== 'denied') { - Notification.requestPermission().then((permission) => { + Notification.requestPermission().then((permission) => { // Si l'utilisateur accepte, créons une notification if (permission === 'granted') { const notification = new Notification('Salut toi!') @@ -142,37 +133,22 @@ translation_of: Web/API/Notification // Enfin, si l'utilisateur a refusé les notifications, et que vous // voulez être respectueux, il n'est plus nécessaire de les déranger. } -</pre> +``` -<p>Nous ne montrons plus d'exemple en direct sur cette page, car Chrome et Firefox n'autorisent plus les demandes de notification des {{htmlelement ("iframe")}}s d'origine croisée, avec d'autres navigateurs à suivre. Pour voir un exemple en action, consultez notre <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">exemple de liste de tâches</a> (voir également l'<a href="https://mdn.github.io/to-do-notifications/">application en cours d'exécution</a>.)</p> +Nous ne montrons plus d'exemple en direct sur cette page, car Chrome et Firefox n'autorisent plus les demandes de notification des {{htmlelement ("iframe")}}s d'origine croisée, avec d'autres navigateurs à suivre. Pour voir un exemple en action, consultez notre [exemple de liste de tâches](https://github.com/mdn/to-do-notifications/tree/gh-pages) (voir également l'[application en cours d'exécution](https://mdn.github.io/to-do-notifications/).) -<div class="note"> -<p><strong>Note :</strong> Dans l'exemple ci-dessus, nous générons des notifications en réponse à un geste de l'utilisateur (en cliquant sur un bouton). Il ne s'agit pas seulement d'une bonne pratique - vous ne devriez pas envoyer de spam aux utilisateurs avec des notifications qu'ils n'acceptent pas - mais les navigateurs suivants interdiront explicitement les notifications non déclenchées en réponse à un geste de l'utilisateur. Firefox le fait déjà depuis la version 72, par exemple.</p> -</div> +> **Note :** Dans l'exemple ci-dessus, nous générons des notifications en réponse à un geste de l'utilisateur (en cliquant sur un bouton). Il ne s'agit pas seulement d'une bonne pratique - vous ne devriez pas envoyer de spam aux utilisateurs avec des notifications qu'ils n'acceptent pas - mais les navigateurs suivants interdiront explicitement les notifications non déclenchées en réponse à un geste de l'utilisateur. Firefox le fait déjà depuis la version 72, par exemple. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| -------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification")}}</p> +{{Compat("api.Notification")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/lang/index.md b/files/fr/web/api/notification/lang/index.md index 3a409d72ff..01e7375221 100644 --- a/files/fr/web/api/notification/lang/index.md +++ b/files/fr/web/api/notification/lang/index.md @@ -10,44 +10,30 @@ tags: - Reference translation_of: Web/API/Notification/lang --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>lang</code></strong> de l'interface {{domxref ("Notification")}} indique la langue utilisée dans la notification, comme définis à l'aide de l'option <code>lang</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}.</p> +La propriété en lecture seule **`lang`** de l'interface {{domxref ("Notification")}} indique la langue utilisée dans la notification, comme définis à l'aide de l'option `lang` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}. -<p>La langue elle-même est spécifiée à l'aide d'un {{domxref ("DOMString")}} représentant <a href="http://www.rfc-editor.org/rfc/bcp/bcp47.txt">une balise de langue BCP 47</a>. Consultez la page des <a href="http://www.sitepoint.com/web-foundations/iso-2-letter-language-codes/">codes de langue à 2 lettres ISO</a> de Sitepoint pour une référence simple.</p> +La langue elle-même est spécifiée à l'aide d'un {{domxref ("DOMString")}} représentant [une balise de langue BCP 47](http://www.rfc-editor.org/rfc/bcp/bcp47.txt). Consultez la page des [codes de langue à 2 lettres ISO](http://www.sitepoint.com/web-foundations/iso-2-letter-language-codes/) de Sitepoint pour une référence simple. -<h2 id="Syntaxz">Syntaxz</h2> +## Syntaxz -<pre class="syntaxbox"><var>N</var><var>otification</var>.lang -</pre> + Notification.lang -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref("DOMString")}} spécifiant la balise de langue.</p> +Une {{domxref("DOMString")}} spécifiant la balise de langue. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-lang','lang')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-lang','lang')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Browser_compatibility">Browser compatibility</h2> +## Browser compatibility -<p>{{Compat("api.Notification.lang")}}</p> +{{Compat("api.Notification.lang")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/maxactions/index.md b/files/fr/web/api/notification/maxactions/index.md index df61031657..105754d3b0 100644 --- a/files/fr/web/api/notification/maxactions/index.md +++ b/files/fr/web/api/notification/maxactions/index.md @@ -11,53 +11,38 @@ tags: - actions translation_of: Web/API/Notification/maxActions --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>L'attribut <strong><code>maxActions</code></strong> de l'interface {{domxref ("Notification")}} renvoie le nombre maximal d'actions prises en charge par l'appareil et l'agent utilisateur. En effet, c'est le nombre maximum d'éléments dans le tableau {{domxref ("Notification.actions")}} qui seront respectés par l'agent utilisateur.</p> +L'attribut **`maxActions`** de l'interface {{domxref ("Notification")}} renvoie le nombre maximal d'actions prises en charge par l'appareil et l'agent utilisateur. En effet, c'est le nombre maximum d'éléments dans le tableau {{domxref ("Notification.actions")}} qui seront respectés par l'agent utilisateur. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.maxActions -</pre> + Notification.maxActions -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Un entier {{JSxRef ("Number")}} qui indique le plus grand nombre d'actions de notification pouvant être présentées à l'utilisateur par l'agent utilisateur et l'appareil.</p> +Un entier {{JSxRef ("Number")}} qui indique le plus grand nombre d'actions de notification pouvant être présentées à l'utilisateur par l'agent utilisateur et l'appareil. -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>L'extrait de code suivant enregistre le nombre maximal d'actions prises en charge.</p> +L'extrait de code suivant enregistre le nombre maximal d'actions prises en charge. -<pre class="brush: js">const { maxActions } = Notification +```js +const { maxActions } = Notification console.log(`This device can display at most ${maxActions} actions on each notification.`); -</pre> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("Web Notifications")}}</td> - <td>{{Spec2("Web Notifications")}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Notification.maxActions")}}</p> - -<h2 id="Voir_également">Voir également</h2> - -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> - <li>{{domxref("Notification.actions")}}</li> -</ul> +``` + +## Spécifications + +| Spécification | Status | Comment | +| -------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName("Web Notifications")}} | {{Spec2("Web Notifications")}} | Living standard | + +## Compatibilité des navigateurs + +{{Compat("api.Notification.maxActions")}} + +## Voir également + +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) +- {{domxref("Notification.actions")}} diff --git a/files/fr/web/api/notification/notification/index.md b/files/fr/web/api/notification/notification/index.md index 0e9a988e55..959523eaf0 100644 --- a/files/fr/web/api/notification/notification/index.md +++ b/files/fr/web/api/notification/notification/index.md @@ -8,75 +8,74 @@ tags: - Notification - Notifications - Reference -browser-compat: api.Notification.Notification translation_of: Web/API/Notification/Notification +browser-compat: api.Notification.Notification --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> - -<p>Le constructeur <strong><code>Notification()</code></strong> crée une nouvelle instance d'objet <a href="/fr/docs/Web/API/notification"><code>Notification</code></a>, qui représente une notification utilisateur.</p> - -<h2 id="Syntaxe">Syntaxe</h2> - -<pre class="brush: js">const <var>myNotification</var> = new Notification(<var>title</var>, <var>options</var>)</pre> - -<h3 id="Paramètres">Paramètres</h3> - -<dl> - <dt><code><var>title</var></code></dt> - <dd>Définit un titre pour la notification, qui s'affiche en haut de la fenêtre de notification.</dd> - <dt><code><var>options</var></code> {{optional_inline}}</dt> - <dd>Un objet d'options contenant tous les paramètres personnalisés que vous souhaitez appliquer à la notification. Les options possibles sont: - <ul> - <li><code>dir</code>: La direction dans laquelle afficher la notification. La valeur par défaut est <code>auto</code>, qui adopte simplement le comportement du paramètre de langue du navigateur, mais vous pouvez remplacer ce comportement en définissant les valeurs de <code>ltr</code> et <code>rtl</code> (bien que la plupart des navigateurs semblent ignorer ces paramètres.)</li> - <li><code>lang</code>: La langue de la notification, telle que spécifiée à l'aide d'un <a href="/fr/docs/Web/API/DOMString"><code>DOMString</code></a> représentant une <a href="https://www.rfc-editor.org/rfc/bcp/bcp47.txt">balise de langue BCP 47</a>. Consultez la page des <a href="https://www.sitepoint.com/web-foundations/iso-2-letter-language-codes/">codes de langue à 2 lettres ISO</a> de Sitepoint pour une référence simple.</li> - <li><code>badge</code>: Un <a href="/fr/docs/Web/API/USVString"><code>USVString</code></a> contenant l'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même.</li> - <li><code>body</code>: Un <a href="/fr/docs/Web/API/DOMString"><code>DOMString</code></a> représentant le corps du texte de la notification, qui est affiché sous le titre.</li> - <li><code>tag</code>: Un <a href="/fr/docs/Web/API/DOMString"><code>DOMString</code></a> représentant un tag d'identification pour la notification.</li> - <li><code>icon</code>: Une <a href="/fr/docs/Web/API/USVString"><code>USVString</code></a> contenant l'URL d'une icône à afficher dans la notification.</li> - <li><code>image</code>: Une <a href="/fr/docs/Web/API/USVString"><code>USVString</code></a> contenant l'URL d'une image à afficher dans la notification.</li> - <li><code>data</code>: Données arbitraires que vous souhaitez associer à la notification. Elles peuvent être de n'importe quel type de données.</li> - <li><code>vibrate</code>: Un <a href="/fr/docs/Web/Guide/API/Vibration#Vibration_patterns">modèle de vibration</a> que le matériel de vibration de l'appareil émet avec la notification.</li> - <li><code>renotify</code>: Un <a href="/fr/docs/Web/API/Boolean"><code>Boolean</code></a> spécifiant si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne. La valeur par défaut est <code>false</code>, ce qui signifie qu'ils ne seront pas notifiés.</li> - <li><code>requireInteraction</code>: Un <a href="/fr/docs/Web/API/Boolean"><code>Boolean</code></a> indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. La valeur par défaut est <code>false</code>.</li> - <li><code>actions</code>: Un tableau de <a href="/fr/docs/Web/API/NotificationAction"><code>NotificationAction</code></a> représentant les actions disponibles pour l'utilisateur lorsque la notification est présentée. Ce sont des options parmi lesquelles l'utilisateur peut choisir pour agir sur l'action dans le contexte de la notification elle-même. Le nom de l'action est envoyé au gestionnaire de notifications du service worker pour lui faire savoir que l'action a été sélectionnée par l'utilisateur.</li> - <li><code>silent</code>: Un <a href="/fr/docs/Web/API/Boolean"><code>Boolean</code></a> spécifiant si la notification est silencieuse (aucun son ni vibration émis), quels que soient les paramètres de l'appareil. La valeur par défaut est <code>false</code>, ce qui signifie qu'il ne sera pas silencieux.</li> - </ul> - </dd> -</dl> - -<h2 id="Exemple">Exemple</h2> - -<p>Dans notre <a href="https://chrisdavidmills.github.io/emogotchi/">démo Emogotchi</a> (<a href="https://github.com/mdn/emogotchi">voir le code source</a>), nous exécutons une fonction <code>spawnNotification()</code> lorsque nous voulons déclencher une notification. La fonction reçoit des paramètres pour spécifier le corps, l'icône et le titre souhaités, puis elle crée l'objet <code>options</code> nécessaire et déclenche la notification à l'aide du constructeur <code>Notification()</code>.</p> - -<pre class="brush: js">function spawnNotification(body, icon, title) { +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} + +Le constructeur **`Notification()`** crée une nouvelle instance d'objet [`Notification`](/fr/docs/Web/API/notification), qui représente une notification utilisateur. + +## Syntaxe + +```js +const myNotification = new Notification(title, options) +``` + +### Paramètres + +- `title` + - : Définit un titre pour la notification, qui s'affiche en haut de la fenêtre de notification. +- `options` {{optional_inline}} + + - : Un objet d'options contenant tous les paramètres personnalisés que vous souhaitez appliquer à la notification. Les options possibles sont: + + - `dir`: La direction dans laquelle afficher la notification. La valeur par défaut est `auto`, qui adopte simplement le comportement du paramètre de langue du navigateur, mais vous pouvez remplacer ce comportement en définissant les valeurs de `ltr` et `rtl` (bien que la plupart des navigateurs semblent ignorer ces paramètres.) + - `lang`: La langue de la notification, telle que spécifiée à l'aide d'un [`DOMString`](/fr/docs/Web/API/DOMString) représentant une [balise de langue BCP 47](https://www.rfc-editor.org/rfc/bcp/bcp47.txt). Consultez la page des [codes de langue à 2 lettres ISO](https://www.sitepoint.com/web-foundations/iso-2-letter-language-codes/) de Sitepoint pour une référence simple. + - `badge`: Un [`USVString`](/fr/docs/Web/API/USVString) contenant l'URL de l'image utilisée pour représenter la notification lorsqu'il n'y a pas assez d'espace pour afficher la notification elle-même. + - `body`: Un [`DOMString`](/fr/docs/Web/API/DOMString) représentant le corps du texte de la notification, qui est affiché sous le titre. + - `tag`: Un [`DOMString`](/fr/docs/Web/API/DOMString) représentant un tag d'identification pour la notification. + - `icon`: Une [`USVString`](/fr/docs/Web/API/USVString) contenant l'URL d'une icône à afficher dans la notification. + - `image`: Une [`USVString`](/fr/docs/Web/API/USVString) contenant l'URL d'une image à afficher dans la notification. + - `data`: Données arbitraires que vous souhaitez associer à la notification. Elles peuvent être de n'importe quel type de données. + - `vibrate`: Un [modèle de vibration](/fr/docs/Web/Guide/API/Vibration#Vibration_patterns) que le matériel de vibration de l'appareil émet avec la notification. + - `renotify`: Un [`Boolean`](/fr/docs/Web/API/Boolean) spécifiant si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne. La valeur par défaut est `false`, ce qui signifie qu'ils ne seront pas notifiés. + - `requireInteraction`: Un [`Boolean`](/fr/docs/Web/API/Boolean) indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. La valeur par défaut est `false`. + - `actions`: Un tableau de [`NotificationAction`](/fr/docs/Web/API/NotificationAction) représentant les actions disponibles pour l'utilisateur lorsque la notification est présentée. Ce sont des options parmi lesquelles l'utilisateur peut choisir pour agir sur l'action dans le contexte de la notification elle-même. Le nom de l'action est envoyé au gestionnaire de notifications du service worker pour lui faire savoir que l'action a été sélectionnée par l'utilisateur. + - `silent`: Un [`Boolean`](/fr/docs/Web/API/Boolean) spécifiant si la notification est silencieuse (aucun son ni vibration émis), quels que soient les paramètres de l'appareil. La valeur par défaut est `false`, ce qui signifie qu'il ne sera pas silencieux. + +## Exemple + +Dans notre [démo Emogotchi](https://chrisdavidmills.github.io/emogotchi/) ([voir le code source](https://github.com/mdn/emogotchi)), nous exécutons une fonction `spawnNotification()` lorsque nous voulons déclencher une notification. La fonction reçoit des paramètres pour spécifier le corps, l'icône et le titre souhaités, puis elle crée l'objet `options` nécessaire et déclenche la notification à l'aide du constructeur `Notification()`. + +```js +function spawnNotification(body, icon, title) { const options = { body: body, icon: icon }; const n = new Notification(title, options); -}</pre> +} +``` -<h2 id="specifications">Spécifications</h2> +## Spécifications {{Specifications}} -<h2 id="browser_compatibility">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat}}</p> +{{Compat}} -<h3 id="Notes_Chrome">Notes Chrome</h3> +### Notes Chrome -<p>À partir de Chrome 49, les notifications ne fonctionnent pas en mode navigation privée.</p> +À partir de Chrome 49, les notifications ne fonctionnent pas en mode navigation privée. -<p>Chrome pour Android lance une erreur <code>TypeError</code> lors de l'appel du constructeur <code>Notification</code>. Il ne prend en charge que la création de notifications à partir d'un service worker. Consultez le <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=481856">Chromium issue tracker</a> pour plus de détails.</p> +Chrome pour Android lance une erreur `TypeError` lors de l'appel du constructeur `Notification`. Il ne prend en charge que la création de notifications à partir d'un service worker. Consultez le [Chromium issue tracker](https://bugs.chromium.org/p/chromium/issues/detail?id=481856) pour plus de détails. -<h3 id="Notes_Internet_Explorer">Notes Internet Explorer</h3> +### Notes Internet Explorer -<p>La version 38.14352 et celles supérieure de MS Edge prend en charge l'<code>API Notification</code>. <a href="https://en.wikipedia.org/wiki/Microsoft_Edge#Release_history">Wikipédia - MS Edge</a><br> - IE 11 et inférieur n'est pas pris en charge.</p> +La version 38.14352 et celles supérieure de MS Edge prend en charge l'`API Notification`. [Wikipédia - MS Edge](https://en.wikipedia.org/wiki/Microsoft_Edge#Release_history) +IE 11 et inférieur n'est pas pris en charge. -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/onclick/index.md b/files/fr/web/api/notification/onclick/index.md index b1561a4fe9..b338aa8813 100644 --- a/files/fr/web/api/notification/onclick/index.md +++ b/files/fr/web/api/notification/onclick/index.md @@ -10,54 +10,38 @@ tags: - onclick translation_of: Web/API/Notification/onclick --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>onclick</code></strong>, rattachée à l'interface {{domxref("Notification")}}, définit un gestionnaire d'évènement à déclencher lorsque la notification recçoit un évènement {{event("click")}} (qui se produit lorsqu'un utilisateur clique sur la notification).</p> +La propriété **`onclick`**, rattachée à l'interface {{domxref("Notification")}}, définit un gestionnaire d'évènement à déclencher lorsque la notification recçoit un évènement {{event("click")}} (qui se produit lorsqu'un utilisateur clique sur la notification). -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>Notification</em>.onclick = function(event) { ... }; -</pre> + Notification.onclick = function(event) { ... }; -<p>Le comportement par défaut consiste à déplacer le focus sur la zone d'affichage (<em>viewport</em>) du <a href="https://html.spec.whatwg.org/multipage/browsers.html#browsing-context">contexte de navigation</a> de la notification. Pour éviter ce comportement, on pourra appeler la méthode <code><a href="/fr/docs/Web/API/Event/preventDefault">preventDefault()</a></code> sur l'objet représentant l'évènement.</p> +Le comportement par défaut consiste à déplacer le focus sur la zone d'affichage (_viewport_) du [contexte de navigation](https://html.spec.whatwg.org/multipage/browsers.html#browsing-context) de la notification. Pour éviter ce comportement, on pourra appeler la méthode [`preventDefault()`](/fr/docs/Web/API/Event/preventDefault) sur l'objet représentant l'évènement. -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>Dans l'exemple qui suit, on utilise le gestionnaire d'évènement <code>onclick</code> pour ouvrir une page dans un nouvel onglet (avec le paramètre <code>'_blank'</code>) lorsqu'on clique sur la notification :</p> +Dans l'exemple qui suit, on utilise le gestionnaire d'évènement `onclick` pour ouvrir une page dans un nouvel onglet (avec le paramètre `'_blank'`) lorsqu'on clique sur la notification : -<pre class="brush: js">notification.onclick = function(event) { +```js +notification.onclick = function(event) { event.preventDefault(); // empêcher le navigateur de passer le focus sur l'onglet de la navigation window.open('http://www.mozilla.org', '_blank'); -}</pre> +} +``` -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-onclick','onclick')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Standard évolutif</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------ | ---------------------------------------- | ----------------- | +| {{SpecName('Web Notifications','#dom-notification-onclick','onclick')}} | {{Spec2('Web Notifications')}} | Standard évolutif | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs +{{Compat("api.Notification.onclick")}} +## Voir aussi -<p>{{Compat("api.Notification.onclick")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{domxref("Notification")}}</li> - <li><a href="/fr/docs/Web/API/notification/Using_Web_Notifications">Utiliser l'API Notifications</a></li> -</ul> +- {{domxref("Notification")}} +- [Utiliser l'API Notifications](/fr/docs/Web/API/notification/Using_Web_Notifications) diff --git a/files/fr/web/api/notification/onclose/index.md b/files/fr/web/api/notification/onclose/index.md index 5dddd078f3..6de5318d51 100644 --- a/files/fr/web/api/notification/onclose/index.md +++ b/files/fr/web/api/notification/onclose/index.md @@ -11,23 +11,20 @@ tags: - onclose translation_of: Web/API/Notification/onclose --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>onclose</code></strong> de l'interface {{domxref ("Notification")}} définit un écouteur d'événements pour recevoir les événements {{domxref ("HTMLDialogElement/close_event", "close")}}. Ces événements se produisent lorsqu'une {{domxref ("Notification")}} est fermée.</p> +La propriété **`onclose`** de l'interface {{domxref ("Notification")}} définit un écouteur d'événements pour recevoir les événements {{domxref ("HTMLDialogElement/close_event", "close")}}. Ces événements se produisent lorsqu'une {{domxref ("Notification")}} est fermée. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.onclose = function(event) { ... } -Notification.onclose = (event) => { ... } -</pre> + Notification.onclose = function(event) { ... } + Notification.onclose = (event) => { ... } -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.onclose")}}</p> +{{Compat("api.Notification.onclose")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li>{{domxref("Notification")}}</li> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- {{domxref("Notification")}} +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/onerror/index.md b/files/fr/web/api/notification/onerror/index.md index af9115de5b..9d6228aa59 100644 --- a/files/fr/web/api/notification/onerror/index.md +++ b/files/fr/web/api/notification/onerror/index.md @@ -11,42 +11,26 @@ tags: - onerror translation_of: Web/API/Notification/onerror --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>onerror</code></strong> de l'interface {{domxref ("Notification")}} spécifie un écouteur d'événements pour recevoir les événements {{domxref ("HTMLElement/error_event", "error")}}. Ces événements se produisent lorsque quelque chose ce déroule mal avec une {{domxref ("Notification")}} (dans de nombreux cas, une erreur qui empêche l'affichage de la notification.)</p> +La propriété **`onerror`** de l'interface {{domxref ("Notification")}} spécifie un écouteur d'événements pour recevoir les événements {{domxref ("HTMLElement/error_event", "error")}}. Ces événements se produisent lorsque quelque chose ce déroule mal avec une {{domxref ("Notification")}} (dans de nombreux cas, une erreur qui empêche l'affichage de la notification.) -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.onerror = function(event) { ... } -<var>Notification</var>.onerror = (even) => { ... } -</pre> + Notification.onerror = function(event) { ... } + Notification.onerror = (even) => { ... } -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-onerror','onerror')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------- | +| {{SpecName('Web Notifications','#dom-notification-onerror','onerror')}} | {{Spec2('Web Notifications')}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.onerror")}}</p> +{{Compat("api.Notification.onerror")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li>{{domxref("Notification")}}</li> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- {{domxref("Notification")}} +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/onshow/index.md b/files/fr/web/api/notification/onshow/index.md index a0a38caf41..83f739f73e 100644 --- a/files/fr/web/api/notification/onshow/index.md +++ b/files/fr/web/api/notification/onshow/index.md @@ -11,23 +11,20 @@ tags: - onshow translation_of: Web/API/Notification/onshow --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété <strong><code>onshow</code></strong> de l'interface {{domxref ("Notification")}} définit un écouteur d'événements pour recevoir des événements {{domxref ("Element/show_event", "show")}}. Ces événements se produisent lorsqu'une {{domxref ("Notification")}} est affiché.</p> +La propriété **`onshow`** de l'interface {{domxref ("Notification")}} définit un écouteur d'événements pour recevoir des événements {{domxref ("Element/show_event", "show")}}. Ces événements se produisent lorsqu'une {{domxref ("Notification")}} est affiché. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.onshow = function() { ... } -<var>Notification</var>.onshow = () => { ... } -</pre> + Notification.onshow = function() { ... } + Notification.onshow = () => { ... } -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.onshow")}}</p> +{{Compat("api.Notification.onshow")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li>{{domxref("Notification")}}</li> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- {{domxref("Notification")}} +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/permission/index.md b/files/fr/web/api/notification/permission/index.md index 603a7cdb3c..fca52d13af 100644 --- a/files/fr/web/api/notification/permission/index.md +++ b/files/fr/web/api/notification/permission/index.md @@ -10,29 +10,28 @@ tags: - Reference translation_of: Web/API/Notification/permission --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>permission</code></strong> de l'interface {{domxref ("Notification")}} indique l'autorisation actuelle accordée par l'utilisateur à l'origine actuelle pour afficher des notifications.</p> +La propriété en lecture seule **`permission`** de l'interface {{domxref ("Notification")}} indique l'autorisation actuelle accordée par l'utilisateur à l'origine actuelle pour afficher des notifications. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox">Notification.permission</pre> + Notification.permission -<h3 id="Return_Value">Valeur</h3> +### Valeur -<p>Une {{domxref("DOMString")}} représentant l'autorisation actuelle. La valeur peut être:</p> +Une {{domxref("DOMString")}} représentant l'autorisation actuelle. La valeur peut être: -<ul> - <li><code>granted</code>: L'utilisateur a explicitement accordé l'autorisation à l'origine actuelle d'afficher les notifications système.</li> - <li><code>denied</code>: L'utilisateur a explicitement refusé l'autorisation pour l'origine actuelle d'afficher les notifications système.</li> - <li><code>default</code>: La décision de l'utilisateur est inconnue; dans ce cas, l'application agira comme si l'autorisation était <code>denied</code>.</li> -</ul> +- `granted`: L'utilisateur a explicitement accordé l'autorisation à l'origine actuelle d'afficher les notifications système. +- `denied`: L'utilisateur a explicitement refusé l'autorisation pour l'origine actuelle d'afficher les notifications système. +- `default`: La décision de l'utilisateur est inconnue; dans ce cas, l'application agira comme si l'autorisation était `denied`. -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>L'extrait suivant peut être utilisé si vous souhaitez d'abord vérifier si les notifications sont prises en charge, puis vérifier si l'autorisation a été accordée pour l'origine actuelle pour envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification.</p> +L'extrait suivant peut être utilisé si vous souhaitez d'abord vérifier si les notifications sont prises en charge, puis vérifier si l'autorisation a été accordée pour l'origine actuelle pour envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification. -<pre class="brush: js">function notifyMe() { +```js +function notifyMe() { // Let's check if the browser supports notifications if (!('Notification' in window)) { console.log('This browser does not support desktop notification') @@ -49,7 +48,7 @@ translation_of: Web/API/Notification/permission Notification.permission !== 'denied' || Notification.permission === 'default' ) { - Notification.requestPermission((permission) => { + Notification.requestPermission((permission) => { // If the user accepts, let's create a notification if (permission === 'granted') { const notification = new Notification('Hi there!') @@ -60,34 +59,21 @@ translation_of: Web/API/Notification/permission // At last, if the user has denied notifications, and you // want to be respectful there is no need to bother them any more. } -</pre> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName("Web Notifications","#dom-notification-permission","permission")}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Notification.permission")}}</p> - -<h2 id="Voir_également">Voir également</h2> - -<ul> - <li><a href="/docs/Web/API/Notifications_API">API de notifications</a></li> - <li><a href="/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> - <li><a href="/en-US/docs/Web/API/Permissions_API">Permissions d'API</a></li> - <li><a href="/en-US/docs/Web/API/Permissions_API/Using_the_Permissions_API">Utilisation des permissions d'API</a></li> -</ul> +``` + +## Spécifications + +| Spécification | État | Commentaire | +| -------------------------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName("Web Notifications","#dom-notification-permission","permission")}} | {{Spec2('Web Notifications')}} | Living standard | + +## Compatibilité des navigateurs + +{{Compat("api.Notification.permission")}} + +## Voir également + +- [API de notifications](/docs/Web/API/Notifications_API) +- [Utilisation de l'API Notifications](/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API) +- [Permissions d'API](/en-US/docs/Web/API/Permissions_API) +- [Utilisation des permissions d'API](/en-US/docs/Web/API/Permissions_API/Using_the_Permissions_API) diff --git a/files/fr/web/api/notification/renotify/index.md b/files/fr/web/api/notification/renotify/index.md index ebd7bb4492..1edc3cc380 100644 --- a/files/fr/web/api/notification/renotify/index.md +++ b/files/fr/web/api/notification/renotify/index.md @@ -13,44 +13,28 @@ tags: - renotify translation_of: Web/API/Notification/renotify --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>renotify</code></strong> de l'interface {{domxref ("Notification")}} spécifie si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne, comme spécifié comme définis à l'aide de l'option <code>renotify</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}.</p> +La propriété en lecture seule **`renotify`** de l'interface {{domxref ("Notification")}} spécifie si l'utilisateur doit être notifié après qu'une nouvelle notification remplace l'ancienne, comme spécifié comme définis à l'aide de l'option `renotify` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification"," Notification()")}}. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.renotify -</pre> + Notification.renotify -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Un {{domxref("Boolean")}}. <code>false</code> est la valeur par défaut; <code>true</code> oblige la notification à renotifier l'utilisateur.</p> +Un {{domxref("Boolean")}}. `false` est la valeur par défaut; `true` oblige la notification à renotifier l'utilisateur. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-renotify','renotify')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------------------ | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-renotify','renotify')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.renotify")}}</p> +{{Compat("api.Notification.renotify")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/requestpermission/index.md b/files/fr/web/api/notification/requestpermission/index.md index e8d71e4a90..63b5be9617 100644 --- a/files/fr/web/api/notification/requestpermission/index.md +++ b/files/fr/web/api/notification/requestpermission/index.md @@ -10,55 +10,50 @@ tags: - Reference translation_of: Web/API/Notification/requestPermission --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<div class="note"> -<p><strong>Note:</strong> Cette fonctionnalité n'est pas disponible dans {{domxref("SharedWorker")}}</p> -</div> +> **Note :** Cette fonctionnalité n'est pas disponible dans {{domxref("SharedWorker")}} -<div class="note"> -<p><strong>Note :</strong> Safari utilise toujours la syntaxe de function de rappel (callback ) pour obtenir l'autorisation. Lisez <a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a> pour un bon exemple de la fonctionnalité de détection et d'exécution du code le cas échéant.</p> -</div> +> **Note :** Safari utilise toujours la syntaxe de function de rappel (callback ) pour obtenir l'autorisation. Lisez [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) pour un bon exemple de la fonctionnalité de détection et d'exécution du code le cas échéant. -<p>La méthode <strong><code>requestPermission()</code></strong> de l'interface {{domxref ("Notification")}} demande l'autorisation à l'utilisateur pour l'origine actuelle d'afficher des notifications.</p> +La méthode **`requestPermission()`** de l'interface {{domxref ("Notification")}} demande l'autorisation à l'utilisateur pour l'origine actuelle d'afficher des notifications. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<p>La dernière spécification a mis à jour cette méthode avec une syntaxe basée sur une promesse qui fonctionne comme ceci:</p> +La dernière spécification a mis à jour cette méthode avec une syntaxe basée sur une promesse qui fonctionne comme ceci: -<pre class="notranslate">Notification.requestPermission() - .then((permission) => { ... })</pre> + Notification.requestPermission() + .then((permission) => { ... }) -<p>Auparavant, la syntaxe était basée sur un simple rappel; cette version est désormais obsolète:</p> +Auparavant, la syntaxe était basée sur un simple rappel; cette version est désormais obsolète: -<pre class="notranslate">Notification.requestPermission(<var>callback</var>);</pre> + Notification.requestPermission(callback); -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<dl> - <dt><code><var>callback</var></code> {{optional_inline}} {{deprecated_inline("gecko46")}}</dt> - <dd>Une fonction de rappel facultative qui est appelée avec la valeur d'autorisation. Déconseillé en faveur de la valeur de retour de la promesse.</dd> -</dl> +- `callback` {{optional_inline}} {{deprecated_inline("gecko46")}} + - : Une fonction de rappel facultative qui est appelée avec la valeur d'autorisation. Déconseillé en faveur de la valeur de retour de la promesse. -<h3 id="Retour">Retour</h3> +### Retour -<p>Une {{jsxref ("Promise", "Promesse")}} qui se résout en une {{domxref ("DOMString")}} avec la permission choisie par l'utilisateur. Les valeurs possibles pour cette chaîne sont:</p> +Une {{jsxref ("Promise", "Promesse")}} qui se résout en une {{domxref ("DOMString")}} avec la permission choisie par l'utilisateur. Les valeurs possibles pour cette chaîne sont: -<ul> - <li><code>granted</code></li> - <li><code>denied</code></li> - <li><code>default</code></li> -</ul> +- `granted` +- `denied` +- `default` -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>Supposons ce HTML de base:</p> +Supposons ce HTML de base: -<pre class="brush: html"><button onclick="notifyMe()">Notifie moi !</button></pre> +```html +<button onclick="notifyMe()">Notifie moi !</button> +``` -<p>Il est possible d'envoyer une notification comme suit - nous présentons ici un ensemble de code assez détaillé et complet que vous pourriez utiliser si vous vouliez d'abord vérifier si les notifications sont prises en charge, puis vérifiez si l'autorisation a été accordée pour l'origine actuelle d'envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification.</p> +Il est possible d'envoyer une notification comme suit - nous présentons ici un ensemble de code assez détaillé et complet que vous pourriez utiliser si vous vouliez d'abord vérifier si les notifications sont prises en charge, puis vérifiez si l'autorisation a été accordée pour l'origine actuelle d'envoyer des notifications, puis demander l'autorisation si nécessaire, avant d'envoyer une notification. -<pre class="brush: js">function notifyMe() { +```js +function notifyMe() { // Vérifions si le navigateur prend en charge les notifications if (!('Notification' in window)) { alert('Ce navigateur ne prend pas en charge la notification de bureau') @@ -72,7 +67,7 @@ translation_of: Web/API/Notification/requestPermission // Sinon, nous devons demander la permission à l'utilisateur else if (Notification.permission !== 'denied') { - Notification.requestPermission().then((permission) => { + Notification.requestPermission().then((permission) => { // Si l'utilisateur accepte, créons une notification if (permission === 'granted') { const notification = new Notification('Salut toi!') @@ -83,37 +78,22 @@ translation_of: Web/API/Notification/requestPermission // Enfin, si l'utilisateur a refusé les notifications, et que vous // voulez être respectueux, il n'est plus nécessaire de les déranger. } -</pre> +``` -<p>Nous ne montrons plus d'exemple en direct sur cette page, car Chrome et Firefox n'autorisent plus les demandes de notification des {{htmlelement ("iframe")}}s d'origine croisée, avec d'autres navigateurs à suivre. Pour voir un exemple en action, consultez notre <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">exemple de liste de tâches</a> (voir également l'<a href="https://mdn.github.io/to-do-notifications/">application en cours d'exécution</a>.)</p> +Nous ne montrons plus d'exemple en direct sur cette page, car Chrome et Firefox n'autorisent plus les demandes de notification des {{htmlelement ("iframe")}}s d'origine croisée, avec d'autres navigateurs à suivre. Pour voir un exemple en action, consultez notre [exemple de liste de tâches](https://github.com/mdn/to-do-notifications/tree/gh-pages) (voir également l'[application en cours d'exécution](https://mdn.github.io/to-do-notifications/).) -<div class="note"> -<p><strong>Note :</strong> Dans l'exemple ci-dessus, nous générons des notifications en réponse à un geste de l'utilisateur (en cliquant sur un bouton). Il ne s'agit pas seulement d'une bonne pratique - vous ne devriez pas envoyer de spam aux utilisateurs avec des notifications qu'ils n'acceptent pas - mais les navigateurs suivants interdiront explicitement les notifications non déclenchées en réponse à un geste de l'utilisateur. Firefox le fait déjà depuis la version 72, par exemple.</p> -</div> +> **Note :** Dans l'exemple ci-dessus, nous générons des notifications en réponse à un geste de l'utilisateur (en cliquant sur un bouton). Il ne s'agit pas seulement d'une bonne pratique - vous ne devriez pas envoyer de spam aux utilisateurs avec des notifications qu'ils n'acceptent pas - mais les navigateurs suivants interdiront explicitement les notifications non déclenchées en réponse à un geste de l'utilisateur. Firefox le fait déjà depuis la version 72, par exemple. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | Status | Comment | +| -------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.requestPermission")}}</p> +{{Compat("api.Notification.requestPermission")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/requireinteraction/index.md b/files/fr/web/api/notification/requireinteraction/index.md index 80eacf5f84..042d875ae3 100644 --- a/files/fr/web/api/notification/requireinteraction/index.md +++ b/files/fr/web/api/notification/requireinteraction/index.md @@ -12,41 +12,30 @@ tags: - requireInteraction translation_of: Web/API/Notification/requireInteraction --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>requireInteraction</code></strong> de l'interface {{domxref ("Notification")}} renvoie un {{jsxref ("Boolean")}} indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. Ceci peut être défini à l'aide de l'option <code>requireInteraction</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification()")}}.</p> +La propriété en lecture seule **`requireInteraction`** de l'interface {{domxref ("Notification")}} renvoie un {{jsxref ("Boolean")}} indiquant qu'une notification doit rester active jusqu'à ce que l'utilisateur clique dessus ou la rejette, plutôt que de se fermer automatiquement. Ceci peut être défini à l'aide de l'option `requireInteraction` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification()")}}. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="brush: js">Notification.requireInteraction</pre> +```js +Notification.requireInteraction +``` -<h3 id="Return_Value">Valeur</h3> +### Valeur -<p>Un {{jsxref("Boolean")}}.</p> +Un {{jsxref("Boolean")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-requireinteraction','requireInteraction')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------- | ---------------- | +| {{SpecName('Web Notifications','#dom-notification-requireinteraction','requireInteraction')}} | {{Spec2('Web Notifications')}} | Living standard. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.requireInteraction")}}</p> +{{Compat("api.Notification.requireInteraction")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/silent/index.md b/files/fr/web/api/notification/silent/index.md index d97cde7bd4..5f31229f85 100644 --- a/files/fr/web/api/notification/silent/index.md +++ b/files/fr/web/api/notification/silent/index.md @@ -13,42 +13,28 @@ tags: - silent translation_of: Web/API/Notification/silent --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>silent</code></strong> de l'interface {{domxref ("Notification")}} spécifie si la notification doit être silencieuse, c'est-à-dire qu'aucun son ou vibration ne doit être émis, quels que soient les paramètres de l'appareil. Ceci est comme définis à l'aide de l'option <code>silent</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()")}}.</p> +La propriété en lecture seule **`silent`** de l'interface {{domxref ("Notification")}} spécifie si la notification doit être silencieuse, c'est-à-dire qu'aucun son ou vibration ne doit être émis, quels que soient les paramètres de l'appareil. Ceci est comme définis à l'aide de l'option `silent` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()")}}. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.silent -</pre> + Notification.silent -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Un {{domxref("Boolean")}}. <code>false</code> est la valeur par défaut; <code>true</code> rend la notification silencieuse.</p> +Un {{domxref("Boolean")}}. `false` est la valeur par défaut; `true` rend la notification silencieuse. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-silent','silent')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| -------------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-silent','silent')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.silent")}}</p> +{{Compat("api.Notification.silent")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/tag/index.md b/files/fr/web/api/notification/tag/index.md index 7c5196d714..49518f4fdd 100644 --- a/files/fr/web/api/notification/tag/index.md +++ b/files/fr/web/api/notification/tag/index.md @@ -12,44 +12,30 @@ tags: - tag translation_of: Web/API/Notification/tag --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <code><strong>tag</strong></code> de l'interface {{domxref ("Notification")}} correspond à une balise d'identification pour la notification, comme définis à l'aide de l'option <code>tag</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}.</p> +La propriété en lecture seule **`tag`** de l'interface {{domxref ("Notification")}} correspond à une balise d'identification pour la notification, comme définis à l'aide de l'option `tag` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()" )}}. -<p>L'idée des balises de notification est que plusieurs notifications peuvent partager la même balise, les reliant entre elles. Une notification peut ensuite être programmatiquement remplacée par une autre pour éviter que l'écran des utilisateurs ne soit rempli d'un grand nombre de notifications similaires.</p> +L'idée des balises de notification est que plusieurs notifications peuvent partager la même balise, les reliant entre elles. Une notification peut ensuite être programmatiquement remplacée par une autre pour éviter que l'écran des utilisateurs ne soit rempli d'un grand nombre de notifications similaires. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.tag -</pre> + Notification.tag -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref("DOMString")}}.</p> +Une {{domxref("DOMString")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-tag','tag')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------ | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-tag','tag')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.tag")}}</p> +{{Compat("api.Notification.tag")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/timestamp/index.md b/files/fr/web/api/notification/timestamp/index.md index 8218d858d6..44d6b4484b 100644 --- a/files/fr/web/api/notification/timestamp/index.md +++ b/files/fr/web/api/notification/timestamp/index.md @@ -12,43 +12,30 @@ tags: - timeStamp translation_of: Web/API/Notification/timestamp --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>timestamp</code></strong> de l'interface {{domxref ("Notification")}} renvoie un {{domxref ("DOMTimeStamp")}}, comme définis à l'aide de l'option <code>timestamp</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()")}}.</p> +La propriété en lecture seule **`timestamp`** de l'interface {{domxref ("Notification")}} renvoie un {{domxref ("DOMTimeStamp")}}, comme définis à l'aide de l'option `timestamp` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()")}}. -<p>L'horodatage de la notification peut représenter le moment, en millisecondes depuis 00:00:00 UTC le 1er janvier 1970, de l'événement pour lequel la notification a été créée, ou il peut s'agir d'un horodatage arbitraire que vous souhaitez associer à la notification. Par exemple, un horodatage pour une réunion à venir pourrait être défini dans le futur, tandis qu'un horodatage pour un message manqué pourrait être défini dans le passé.</p> +L'horodatage de la notification peut représenter le moment, en millisecondes depuis 00:00:00 UTC le 1er janvier 1970, de l'événement pour lequel la notification a été créée, ou il peut s'agir d'un horodatage arbitraire que vous souhaitez associer à la notification. Par exemple, un horodatage pour une réunion à venir pourrait être défini dans le futur, tandis qu'un horodatage pour un message manqué pourrait être défini dans le passé. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.timestamp</pre> + Notification.timestamp -<h3 id="Return_Value">Valeur</h3> +### Valeur -<p>Un {{domxref("DOMTimeStamp")}}.</p> +Un {{domxref("DOMTimeStamp")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-timestamp','timestamp')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-timestamp','timestamp')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.timestamp")}}</p> +{{Compat("api.Notification.timestamp")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/title/index.md b/files/fr/web/api/notification/title/index.md index ba07a05630..e367dece95 100644 --- a/files/fr/web/api/notification/title/index.md +++ b/files/fr/web/api/notification/title/index.md @@ -12,41 +12,28 @@ tags: - Titre translation_of: Web/API/Notification/title --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>title</code></strong> de l'interface {{domxref ("Notification")}} indique le titre de la notification, comme définis à l'aide de l'option <code>silent</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()") }} constructeur.</p> +La propriété en lecture seule **`title`** de l'interface {{domxref ("Notification")}} indique le titre de la notification, comme définis à l'aide de l'option `silent` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification()") }} constructeur. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.title</pre> + Notification.title -<h3 id="Valeur">Valeur</h3> +### Valeur -<p>Une {{domxref("DOMString")}}.</p> +Une {{domxref("DOMString")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-title','title')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ---------------------------------------------------------------------------------------- | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-title','title')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.title")}}</p> +{{Compat("api.Notification.title")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) diff --git a/files/fr/web/api/notification/vibrate/index.md b/files/fr/web/api/notification/vibrate/index.md index d9bae90120..385661af6f 100644 --- a/files/fr/web/api/notification/vibrate/index.md +++ b/files/fr/web/api/notification/vibrate/index.md @@ -13,42 +13,28 @@ tags: - vibrate translation_of: Web/API/Notification/vibrate --- -<p>{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}}</p> +{{APIRef("Web Notifications")}}{{AvailableInWorkers}}{{securecontext_header}} -<p>La propriété en lecture seule <strong><code>vibrate</code></strong> de l'interface {{domxref ("Notification")}} spécifie un modèle de vibration que le matériel de vibration de l'appareil doit émettre lorsque la notification se déclenche. Ceci est comme définis à l'aide de l'option <code>vibrate</code> lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification ()")}}.</p> +La propriété en lecture seule **`vibrate`** de l'interface {{domxref ("Notification")}} spécifie un modèle de vibration que le matériel de vibration de l'appareil doit émettre lorsque la notification se déclenche. Ceci est comme définis à l'aide de l'option `vibrate` lors de la création de la notification à l'aide du constructeur {{domxref ("Notification.Notification", "Notification ()")}}. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><var>Notification</var>.vibrate -</pre> + Notification.vibrate -<h3 id="Return_Value">Valeur</h3> +### Valeur -<p>Un <a href="/fr/docs/Web/Guide/API/Vibration#Vibration_patterns">modèle de vibration</a>, tel que spécifié dans la spécification de l'{{domxref ("Vibration_API", "Api de Vibration")}}.</p> +Un [modèle de vibration](/fr/docs/Web/Guide/API/Vibration#Vibration_patterns), tel que spécifié dans la spécification de l'{{domxref ("Vibration_API", "Api de Vibration")}}. -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-notification-vibrate','vibrate')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Living standard</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------------------ | ---------------------------------------- | --------------- | +| {{SpecName('Web Notifications','#dom-notification-vibrate','vibrate')}} | {{Spec2('Web Notifications')}} | Living standard | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Notification.vibrate")}}</p> +{{Compat("api.Notification.vibrate")}} -<h2 id="Voir_également">Voir également</h2> +## Voir également -<ul> - <li><a href="/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API">Utilisation de l'API Notifications</a></li> -</ul> +- [Utilisation de l'API Notifications](/fr/docs/Web/API/Notifications_API/Using_the_Notifications_API) |