aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/api/notification
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
commit4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch)
treed4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/de/web/api/notification
parent33058f2b292b3a581333bdfb21b8f671898c5060 (diff)
downloadtranslated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip
initial commit
Diffstat (limited to 'files/de/web/api/notification')
-rw-r--r--files/de/web/api/notification/index.html265
-rw-r--r--files/de/web/api/notification/permission/index.html187
2 files changed, 452 insertions, 0 deletions
diff --git a/files/de/web/api/notification/index.html b/files/de/web/api/notification/index.html
new file mode 100644
index 0000000000..aaf5188c37
--- /dev/null
+++ b/files/de/web/api/notification/index.html
@@ -0,0 +1,265 @@
+---
+title: Notification
+slug: Web/API/notification
+translation_of: Web/API/Notification
+---
+<div>{{APIRef("Web Notifications")}} {{ SeeCompatTable() }}</div>
+
+<div>Das Notification interface wird zum konfigurieren und Anzeigen von desktop notifications verwendet.</div>
+
+<h3 id="Permissions" name="Permissions">Permissions</h3>
+
+<p>Wenn Sie notifications in einer offenen web app verwenden, fügen sie die <span style="font-family: consolas,monaco,andale mono,monospace;">desktop-notification permission zu ihrem <a href="/de/docs/Apps/Manifest">manifest</a> file hinzu. </span>Notifications können für jedes permission level, hosted oder darüber verwendet werden.</p>
+
+<pre class="brush: json"><code><span class="str">"permissions"</span><span class="pun">:</span><span class="pln"> </span><span class="pun">{</span><span class="pln">
+ </span><span class="str">"desktop-notification"</span><span class="pun">:{}</span><span class="pln">
+</span><span class="pun">}</span></code></pre>
+
+<h2 id="Method_overview" name="Method_overview">Konstruktor</h2>
+
+<pre class="brush: js">var notification = new Notification(title, options);</pre>
+
+<h3 id="Parameter">Parameter</h3>
+
+<dl>
+ <dt><code>title</code></dt>
+ <dd>Titel der innerhalb der Notification angezeigt werden muss.</dd>
+ <dt><code>options</code> {{optional_inline}}</dt>
+ <dd>Ein Objekt das optionale Konfigurationsparamter enthält. Es kann die folgenden Einträge enthalten:
+ <ul>
+ <li><code>dir</code> : Die Ausrichtung des Textes; Verfügbar sind <code>auto</code>, <code>ltr</code>, oder <code>rtl</code>.</li>
+ <li><code>lang</code>:  Spezifiziere die verwendete Sprache. Dieser String muss ein valides <a href="http://tools.ietf.org/html/bcp47" title="http://tools.ietf.org/html/bcp47">BCP 47 language tag</a> sein.</li>
+ <li><code>body</code>:  Ein String, welcher jeglichen extra Inhalt einer notification beinhaltet.</li>
+ <li><code>tag</code>: Die ID einer gegebene notification, um diese abzurufen, zu löschen, zu ersetzen oder zu löschen. </li>
+ <li><code>icon</code>: Die Url für das verwendete Icon in einer notification.</li>
+ <li><code>data</code>: Ein Benutzerdefiniertes Datenfeld.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Properties">Properties</h2>
+
+<h3 id="Static_properties">Static properties</h3>
+
+<p>Diese Eigenschaften sind nur im Notification-Objekt selbst verfügbar.</p>
+
+<dl>
+ <dt>{{domxref("Notification.permission")}} {{readonlyinline}}</dt>
+ <dd>Eine Zeichenkette, die die aktuell gesetzten Berechtigungen Notifications anzuzeigen darstellt. Mögliche Werte sind: denied (der Nutzer erlaubt keine Benachrichtigungen), granted (der Nutzer akzeptiert, dass Benachrichtigungen angezeigt werden) oder default (die Nutzerwahl ist unbekannt, daher verhält sich der Browser wie bei denied).</dd>
+</dl>
+
+<h3 id="Instance_properties">Instance properties</h3>
+
+<p>Diese Eigenschaften sind nur in Instanzen des Notification-Objekts verfügbar.</p>
+
+<dl>
+ <dt>{{domxref("Notification.title")}} {{readonlyinline}}</dt>
+ <dd>Der Titel der Benachrichtigung der in den Parametern des Konstruktors spezifiziert wurde.</dd>
+ <dt>{{domxref("Notification.dir")}} {{readonlyinline}}</dt>
+ <dd>Textausrichtung der Benachrichtung welche in den Parametern des Konstruktors spezifiziert wurde.</dd>
+ <dt>{{domxref("Notification.lang")}} {{readonlyinline}}</dt>
+ <dd>Sprachcode der Benachrichtung welche in den Parametern des Konstruktors spezifiziert wurde.</dd>
+ <dt>{{domxref("Notification.body")}} {{readonlyinline}}</dt>
+ <dd>Textinhalt der Benachrichtung welche in den Parametern des Konstruktors spezifiziert wurde.</dd>
+ <dt>{{domxref("Notification.tag")}} {{readonlyinline}}</dt>
+ <dd>ID der Benachrichtung (if any) welche in den Parametern des Konstruktors spezifiziert wurde.</dd>
+ <dt>{{domxref("Notification.icon")}} {{readonlyinline}}</dt>
+ <dd>URL des Bildes welches als Icon der Benachrichtgung verwendet wird, wie in den Parametern des Konstruktors spezifiziert wurde</dd>
+ <dt>{{domxref("Notification.data")}} {{readonlyinline}}</dt>
+ <dd>Returns a structured clone of the notification’s data.</dd>
+</dl>
+
+<h4 id="Event_handlers">Event handlers</h4>
+
+<dl>
+ <dt>{{domxref("Notification.onclick")}}</dt>
+ <dd>A handler for the {{event("click")}} event. It is triggered each time the user clicks on the notification.</dd>
+ <dt>{{domxref("Notification.onshow")}}</dt>
+ <dd>A handler for the {{event("show")}} event. It is triggered when the notification is displayed.</dd>
+ <dt>{{domxref("Notification.onerror")}}</dt>
+ <dd>A handler for the {{event("error")}} event. It is triggered each time the notification encounters an error.</dd>
+ <dt>{{domxref("Notification.onclose")}}</dt>
+ <dd>A handler for the {{event("close")}} event. It is triggered when the user closes the notification.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<h3 id="Static_methods">Static methods</h3>
+
+<p>These methods are available only on the <code>Notification</code> object itself.</p>
+
+<dl>
+ <dt>{{domxref("Notification.requestPermission()")}}</dt>
+ <dd>Requests permission from the user to display notifications. This method must be called as the result of a user action (for example, an onclick event), and cannot be used without it.</dd>
+</dl>
+
+<h3 id="Instance_methods">Instance methods</h3>
+
+<p>These properties are available only on an instance of the <code>Notification</code> object or through its <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain" title="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain"><code>prototype</code></a>. The <code>Notification</code> objects also inherit from the {{domxref("EventTarget")}} interface.</p>
+
+<dl>
+ <dt>{{domxref("Notification.close()")}}</dt>
+ <dd>Programmatically closes a notification.</dd>
+</dl>
+
+<p>{{page("/en-US/docs/Web/API/EventTarget","Methods")}}</p>
+
+<h2 id="Example">Example</h2>
+
+<p>Assume this basic HTML:</p>
+
+<pre class="brush: html">&lt;button onclick="notifyMe()"&gt;Notify me!&lt;/button&gt;</pre>
+
+<p>It's possible to send a notification as follows:</p>
+
+<pre class="brush: js">function notifyMe() {
+ // Let's check if the browser supports notifications
+ if (!("Notification" in window)) {
+ alert("This browser does not support desktop notification");
+ }
+
+ // Let's check whether notification permissions have alredy been granted
+ else if (Notification.permission === "granted") {
+ // If it's okay let's create a notification
+ var notification = new Notification("Hi there!");
+ }
+
+ // Otherwise, we need to ask the user for permission
+ else if (Notification.permission !== 'denied') {
+ Notification.requestPermission(function (permission) {
+ // If the user accepts, let's create a notification
+ if (permission === "granted") {
+ var notification = new Notification("Hi there!");
+ }
+ });
+ }
+
+ // At last, if the user has denied notifications, and you
+ // want to be respectful there is no need to bother them any more.
+}</pre>
+
+<h3 id="See_the_live_result">See the live result</h3>
+
+<p>{{ EmbedLiveSample('Example', '100%', 30) }}</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Specification</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>Initial specification.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Chrome</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>5 {{ property_prefix("webkit") }} (see notes)<br>
+ 22</td>
+ <td>4.0 {{ property_prefix("moz") }} (see notes)<br>
+ 22</td>
+ <td>{{ CompatNo() }}</td>
+ <td>25</td>
+ <td>6 (see notes)</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Android</th>
+ <th>Android Webview</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>Firefox OS</th>
+ <th>IE Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ <th>Chrome for Mobile</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{ CompatUnknown() }}</td>
+ <td>
+ <p>{{CompatVersionUnknown}}</p>
+ </td>
+ <td>4.0 {{ property_prefix("moz") }} (see notes)<br>
+ 22</td>
+ <td>1.0.1 {{ property_prefix("moz") }} (see notes)<br>
+ 1.2</td>
+ <td>{{ CompatNo() }}</td>
+ <td>{{ CompatUnknown() }}</td>
+ <td>{{ CompatNo() }}</td>
+ <td>
+ <p>{{CompatVersionUnknown}}</p>
+ </td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Gecko_notes">Gecko notes</h3>
+
+<ul>
+ <li>Prior to Firefox 22 (Firefox OS &lt;1.2), the instantiation of a new notification must be done with the {{ domxref("window.navigator.mozNotification","navigator.mozNotification") }} object through its <code>createNotification</code> method.</li>
+ <li>Prior to Firefox 22 (Firefox OS &lt;1.2), the Notification was displayed when calling the <code>show</code> method and was supporting the <code>click</code> and <code>close</code> events only.</li>
+ <li>Nick Desaulniers has written a <a href="https://github.com/nickdesaulniers/fxos-irc/blob/master/js/notification.js">Notification shim</a> to cover both newer and older implementations.</li>
+ <li>One particular Firefox OS issue is that you can <a href="https://github.com/nickdesaulniers/fxos-irc/blob/0160cf6c3a2b5c9fe33822aaf6bcba3b7e846da9/my.js#L171">pass a path to an icon</a> to use in the notification, but if the app is packaged you cannot use a relative path like <code>/my_icon.png</code>. You also can't use <code>window.location.origin + "/my_icon.png"</code> because <code>window.location.origin</code> is null in packaged apps. The <a href="https://developer.mozilla.org/en-US/Apps/Developing/Manifest#origin">manifest origin field</a> fixes this, but it is only available in Firefox OS 1.1+. A potential solution for supporting Firefox OS &lt;1.1 is to <a href="https://github.com/nickdesaulniers/fxos-irc/blob/0160cf6c3a2b5c9fe33822aaf6bcba3b7e846da9/my.js#L168">pass an absolute URL to an externally hosted version of the icon</a>. This is less than ideal as the notification is displayed immediately with the icon missing, then the icon is fetched, but it works on all versions of Firefox OS.</li>
+</ul>
+
+<h3 id="Chrome_notes">Chrome notes</h3>
+
+<ul>
+ <li>Prior to Chrome 22, the support for notification was following an <a href="http://www.chromium.org/developers/design-documents/desktop-notifications/api-specification" title="http://www.chromium.org/developers/design-documents/desktop-notifications/api-specification">old prefixed version of the specification</a> and was using the {{domxref("window.navigator.webkitNotifications","navigator.webkitNotifications")}} object to instantiate a new notification.</li>
+ <li>Prior to Chrome 32, {{domxref("Notification.permission")}} was not supported.</li>
+</ul>
+
+<h3 id="Android_notes">Android notes</h3>
+
+<ul>
+ <li>The Android browser has been deprecated since Android 4.0. Newer versions use Chrome.</li>
+</ul>
+
+<h3 id="Safari_notes">Safari notes</h3>
+
+<ul>
+ <li>Safari started supporting notification with Safari 6 but only on Mac OSX 10.8+ (Mountain Lion).</li>
+</ul>
+
+<h2 id="Notes">Notes</h2>
+
+<p>{{ref("1")}} Deprecated since Android 4.0.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/WebAPI/Using_Web_Notifications" title="/en-US/docs/WebAPI/Using_Web_Notifications">Using Web Notifications</a></li>
+ <li><a class="external" href="https://github.com/soapdog/firefoxos-sample-app-image-uploader" title="Firefox OS Image Uploader Sample App">Firefox OS Image Uploader Sample App</a></li>
+</ul>
diff --git a/files/de/web/api/notification/permission/index.html b/files/de/web/api/notification/permission/index.html
new file mode 100644
index 0000000000..bd381fe34c
--- /dev/null
+++ b/files/de/web/api/notification/permission/index.html
@@ -0,0 +1,187 @@
+---
+title: Notification.permission
+slug: Web/API/notification/permission
+tags:
+ - API
+ - DOM
+ - Notifications
+ - Property
+ - Reference
+translation_of: Web/API/Notification/permission
+---
+<p>{{APIRef("Web Notifications")}}</p>
+
+<p>Die schreibgeschützte Berechtigungseigenschaft der Schnittstelle {{domxref ("Notificaton")}} gibt die aktuelle Berechtigung an, die der Benutzer für den aktuellen Ursprung zur Anzeige von Web-Benachrichtigungen erteilt hat.</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Syntax" name="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <em>permission</em> = Notification.permission;</pre>
+
+<h3 id="Return_Value" name="Return_Value">Value</h3>
+
+<p>Ein {{domxref ("DOMString")}} repräsentiert die aktuelle Berechtigung. Der Wert kann sein:</p>
+
+<ul>
+ <li><code>granted</code>: Der Benutzer hat explizit die Berechtigung für den aktuellen Ursprung zur Anzeige von Systembenachrichtigungen erteilt.</li>
+ <li><code>denied</code>: Der Benutzer hat die Berechtigung für den aktuellen Ursprung explizit abgelehnt, um Systembenachrichtigungen anzuzeigen.</li>
+ <li><code>default</code>: Die Benutzerentscheidung ist unbekannt; In diesem Fall wird die Anwendung so tun, als ob die Erlaubnis verweigert wurde.</li>
+</ul>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<p>Das folgende ziemlich ausführliche Snippet könnte verwendet werden, wenn Sie zuerst überprüfen möchten, ob Benachrichtigungen unterstützt werden, und prüfen Sie dann, ob für den aktuellen Ursprung die Erlaubnis für das Senden von Benachrichtigungen gewährt wurde, und fordern Sie dann bei Bedarf eine Genehmigung an, bevor Sie eine Benachrichtigung senden.</p>
+
+<pre class="brush: js">function notifyMe() {
+ // Let's check if the browser supports notifications
+ if (!("Notification" in window)) {
+ console.log("This browser does not support desktop notification");
+ }
+
+ // Let's check whether notification permissions have alredy been granted
+ else if (Notification.permission === "granted") {
+ // If it's okay let's create a notification
+ var notification = new Notification("Hi there!");
+ }
+
+ // Otherwise, we need to ask the user for permission
+ else if (Notification.permission !== 'denied' || Notification.permission === "default") {
+ Notification.requestPermission(function (permission) {
+ // If the user accepts, let's create a notification
+ if (permission === "granted") {
+ var notification = new Notification("Hi there!");
+ }
+ });
+ }
+
+ // 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="Spezifikationen">Spezifikationen</h2>
+
+<table>
+ <tbody>
+ <tr>
+ <th scope="col">Spezifikation</th>
+ <th scope="col">Status</th>
+ <th scope="col">Kommentar</th>
+ </tr>
+ <tr>
+ <td>{{SpecName("Web Notifications","#dom-notification-permission","permission")}}</td>
+ <td>{{Spec2('Web Notifications')}}</td>
+ <td>Lebensstandard</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkombatibilität">Browserkombatibilität</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Chrome</th>
+ <th>Edge</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari</th>
+ </tr>
+ <tr>
+ <td>Grundlegende Unterstützung</td>
+ <td>5 {{ property_prefix("webkit") }} (see notes)<br>
+ 22</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>4.0 {{ property_prefix("moz") }} (see notes)<br>
+ 22</td>
+ <td>{{ CompatNo() }}</td>
+ <td>25</td>
+ <td>6 (see notes)</td>
+ </tr>
+ <tr>
+ <td>Vorhanden in den Arbeitskräften</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatGeckoDesktop("41.0")}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Android</th>
+ <th>Android Webview</th>
+ <th>Edge</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>Firefox OS</th>
+ <th>IE Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ <th>Chrome for Android</th>
+ </tr>
+ <tr>
+ <td>
+ <p>Grundlegende Unterstützung</p>
+ </td>
+ <td>{{ CompatUnknown() }}</td>
+ <td>
+ <p>{{CompatVersionUnknown}}</p>
+ </td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>4.0 {{ property_prefix("moz") }} (see notes)<br>
+ 22</td>
+ <td>1.0.1 {{ property_prefix("moz") }} (see notes)<br>
+ 1.2</td>
+ <td>{{ CompatNo() }}</td>
+ <td>{{ CompatUnknown() }}</td>
+ <td>{{ CompatNo() }}</td>
+ <td>
+ <p>{{CompatVersionUnknown}}</p>
+ </td>
+ </tr>
+ <tr>
+ <td>Vorhanden in den Arbeitskräften</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatGeckoMobile(41.0)}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Firefox_OS_Notizen">Firefox OS Notizen</h3>
+
+<p id="Page(en-USdocsWebAPINotifications_API_Firefox_OS_notes)"><span style="color: #3b3c40; font-size: 14px; line-height: 1.5;">{{Page("/en-US/docs/Web/API/Notifications_API", "Firefox OS notes")}}</span></p>
+
+<h3 id="Chrome_Notizen">Chrome Notizen</h3>
+
+<p>{{Page("/en-US/docs/Web/API/Notifications_API", "Chrome notes")}}</p>
+
+<h3 id="Safari_Notizen">Safari Notizen</h3>
+
+<p>{{Page("/en-US/docs/Web/API/Notifications_API", "Safari notes")}}</p>
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API">Verwenden der Benachrichtigungs-API</a></li>
+ <li>{{domxref("Permissions_API","Permissions API")}}</li>
+</ul>