diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
|---|---|---|
| committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
| commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
| tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/web/api/notificationevent | |
| parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
| download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip | |
initial commit
Diffstat (limited to 'files/ja/web/api/notificationevent')
4 files changed, 300 insertions, 0 deletions
diff --git a/files/ja/web/api/notificationevent/action/index.html b/files/ja/web/api/notificationevent/action/index.html new file mode 100644 index 0000000000..0f1f7bf62f --- /dev/null +++ b/files/ja/web/api/notificationevent/action/index.html @@ -0,0 +1,64 @@ +--- +title: NotificationEvent.action +slug: Web/API/NotificationEvent/action +tags: + - API + - Experimental + - NotificationEvent + - Notifications + - Property + - Reference + - Service Workers + - ServiceWorker + - action + - プロパティ + - 通知 +translation_of: Web/API/NotificationEvent/action +--- +<p>{{APIRef("Web Notifications")}}</p> + +<p>ユーザーがクリックした通知ボタンの文字列 ID を返します。ユーザーがアクションボタン以外の場所で通知をクリックした場合、または通知にボタンがない場合、この値は空の文字列を返します。通知 ID は、アクション配列属性を介した通知の作成中に設定され、通知が置き換えられない限り変更することはできません。</p> + +<h2 id="Returns" name="Returns">返値</h2> + +<p>{{domxref("DOMString")}} オブジェクト。</p> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js notranslate" id="example-50e7c86c">self.registration.showNotification("New articles available", { + actions: [{action: "get", title: "Get now."}] +}); + +self.addEventListener('notificationclick', function(event) { + event.notification.close(); + if (event.action === 'get') { + synchronizeReader(); + } else { + clients.openWindow("/reader"); + } +}, false);</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Web Notifications','#dom-notification-actions','action')}}</td> + <td>{{Spec2('Web Notifications')}}</td> + <td>Living standard</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("api.NotificationEvent.action")}}</p> diff --git a/files/ja/web/api/notificationevent/index.html b/files/ja/web/api/notificationevent/index.html new file mode 100644 index 0000000000..64fa156443 --- /dev/null +++ b/files/ja/web/api/notificationevent/index.html @@ -0,0 +1,97 @@ +--- +title: NotificationEvent +slug: Web/API/NotificationEvent +tags: + - API + - Interface + - NotificationEvent + - Reference + - Service Workers + - ServiceWorker +translation_of: Web/API/NotificationEvent +--- +<p>{{APIRef("Web Notifications")}}</p> + +<p>{{domxref("ServiceWorkerGlobalScope.onnotificationclick", "onnotificationclick")}} ハンドラーに渡される引数である <code>NotificationEvent</code> インターフェイスは、 {{domxref("ServiceWorker")}} の {{domxref("ServiceWorkerGlobalScope")}} で配信される通知クリックイベントを表します。</p> + +<p>このインターフェイスは {{domxref("ExtendableEvent")}} インターフェイスを継承しています。</p> + +<h2 id="Constructor" name="Constructor">コンストラクター</h2> + +<dl> + <dt>{{domxref("NotificationEvent.NotificationEvent","NotificationEvent()")}}</dt> + <dd>新しい <code>NotificationEvent</code> オブジェクトを作成します。</dd> +</dl> + +<h2 id="Properties" name="Properties">プロパティ</h2> + +<p><em>祖先である {{domxref("Event")}} からプロパティを継承しています。</em></p> + +<dl> + <dt>{{domxref("NotificationEvent.notification")}} {{readonlyInline}}</dt> + <dd>イベントを発生させるためにクリックされた通知を表す {{domxref("Notification")}} オブジェクトを返します。</dd> + <dt>{{domxref("NotificationEvent.action")}} {{readonlyinline}}</dt> + <dd>ユーザーがクリックした通知ボタンの文字列 ID を返します。ユーザーがアクションボタン以外の場所で通知をクリックした場合、または通知にボタンがない場合、この値は空の文字列を返します。</dd> +</dl> + +<h2 id="Methods" name="Methods">メソッド</h2> + +<p><em>親の {{domxref("ExtendableEvent")}} からメソッドを継承しています。</em></p> + +<dl> + <dt>{{domxref("ExtendableEvent.waitUntil", "ExtendableEvent.waitUntil()")}}</dt> + <dd> + <p>イベントの存続期間を延長します。作業が進行中であることをブラウザーに伝えます。</p> + </dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js notranslate">self.addEventListener('notificationclick', function(event) { + console.log('On notification click: ', event.notification.tag); + event.notification.close(); + + // これは、現在のページが既に開いているかどうかを確認し、 + // そうならばフォーカスします + event.waitUntil(clients.matchAll({ + type: "window" + }).then(function(clientList) { + for (var i = 0; i < clientList.length; i++) { + var client = clientList[i]; + if (client.url == '/' && 'focus' in client) + return client.focus(); + } + if (clients.openWindow) + return clients.openWindow('/'); + })); +}); +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Web Notifications','#notificationevent','NotificationEvent')}}</td> + <td>{{Spec2('Web Notifications')}}</td> + <td>Living standard.</td> + </tr> + </tbody> +</table> + +<div class="note"> +<p><strong>注</strong>: このインターフェイスは <a href="/ja/docs/Web/API/Notifications_API">Notifications API</a> で定義されていますが、{{domxref("ServiceWorkerGlobalScope")}} を介してアクセスします。</p> +</div> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("api.NotificationEvent")}}</p> diff --git a/files/ja/web/api/notificationevent/notification/index.html b/files/ja/web/api/notificationevent/notification/index.html new file mode 100644 index 0000000000..b27d50a6f3 --- /dev/null +++ b/files/ja/web/api/notificationevent/notification/index.html @@ -0,0 +1,75 @@ +--- +title: NotificationEvent.notification +slug: Web/API/NotificationEvent/notification +tags: + - API + - Experimental + - NotificationEvent + - Notifications + - Property + - Reference + - Service Workers + - ServiceWorker + - プロパティ + - 通知 +translation_of: Web/API/NotificationEvent/notification +--- +<p>{{APIRef("Web Notifications")}}</p> + +<p><code>notification</code> は {{domxref("NotificationEvent")}} インターフェイスの読取専用プロパティで、クリックされてイベントを発行した {{domxref("Notification")}} のインスタンスを返します。 {{domxref("Notification")}} は <code>tag</code> や <code>data</code> 属性など、 Notification のインスタンス化時に設定された多くのプロパティへの読み取り専用アクセスを提供しており、あとで <code>notificationclick</code> イベントで使用するための情報を保存することができます。</p> + +<h2 id="Returns" name="Returns">返値</h2> + +<p>{{domxref("Notification")}} オブジェクト。</p> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js notranslate">self.addEventListener('notificationclick', function(event) { + console.log('On notification click'); + + // Data can be attached to the notification so that you + // can process it in the notificationclick handler. + console.log('Notification Tag:', event.notification.tag); + console.log('Notification Data:', event.notification.data); + event.notification.close(); + + // This looks to see if the current is already open and + // focuses if it is + event.waitUntil(clients.matchAll({ + type: "window" + }).then(function(clientList) { + for (var i = 0; i < clientList.length; i++) { + var client = clientList[i]; + if (client.url == '/' && 'focus' in client) + return client.focus(); + } + if (clients.openWindow) + return clients.openWindow('/'); + })); +}); +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Web Notifications','#dom-notificationevent-notification','notification')}}</td> + <td>{{Spec2('Web Notifications')}}</td> + <td>Living standard</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("api.NotificationEvent.notification")}}</p> diff --git a/files/ja/web/api/notificationevent/notificationevent/index.html b/files/ja/web/api/notificationevent/notificationevent/index.html new file mode 100644 index 0000000000..ce6cd34424 --- /dev/null +++ b/files/ja/web/api/notificationevent/notificationevent/index.html @@ -0,0 +1,64 @@ +--- +title: NotificationEvent.NotificationEvent() +slug: Web/API/NotificationEvent/NotificationEvent +tags: + - API + - Constructor + - Experimental + - NotificationEvent + - Notifications + - Reference + - Service Workers + - ServiceWorker + - コンストラクター + - 通知 +translation_of: Web/API/NotificationEvent/NotificationEvent +--- +<p>{{APIRef("Web Notifications")}}{{draft}}</p> + +<p><strong><code>NotificationEvent()</code></strong> コンストラクターは、新しい {{domxref("NotificationEvent")}} オブジェクトを生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate">var myNotificationEvent = new NotificationEvent(type, NotificationEventInit);</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>type</code></dt> + <dd>TBD</dd> + <dt><code>NotificationEventInit</code> {{optional_inline}}</dt> + <dd>イベントが配信される通知として使用される {{domxref("Notification")}} オブジェクトを含む辞書オブジェクト。この仕様書の後の草稿では、このパラメータはオプションではありません。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js notranslate">var n = new Notification('Hello'); +var init = { notification: n }; +var myNotificationEvent = new NotificationEvent(type, init); +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Web Notifications','#dom-notificationevent-notificationevent','NotificationEvent() constructor')}}</td> + <td>{{Spec2('Web Notifications')}}</td> + <td>Living standard</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("api.NotificationEvent.NotificationEvent")}}</p> |
