initial commit

3 files changed, 246 insertions, 0 deletions

diff --git a/files/ja/web/api/trackevent/index.html b/files/ja/web/api/trackevent/index.html
new file mode 100644
index 0000000000..dbfefe98c3
--- /dev/null
+++ b/files/ja/web/api/trackevent/index.html
@@ -0,0 +1,116 @@
+---
+title: TrackEvent
+slug: Web/API/TrackEvent
+tags:
+  - API
+  - Audio
+  - HTML DOM
+  - Interface
+  - Media
+  - Reference
+  - TrackEvent
+  - Video
+translation_of: Web/API/TrackEvent
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p><span class="seoSummary">HTML DOM 仕様の一部である <strong><code>TrackEvent</code></strong> インターフェイスは、HTML メディア要素で使用可能なトラックのセットに対する変更を表すイベントに使用されます。 これらのイベントは {{event("addtrack")}} と {{event("removetrack")}} です。</span> <code>TrackEvent</code> を {{domxref("RTCPeerConnection")}} の一部であるトラックに使用される {{domxref("RTCTrackEvent")}} インターフェイスと混同しないでください。<br>
+  </p>
+
+<p><code>TrackEvent</code> に基づくイベントは、常に次のメディアトラックリストの種類のいずれかに送信されます。</p>
+
+<ul>
+ <li><span style="display: none;"> </span>動画トラックに関連するイベントは、常に {{domxref("HTMLMediaElement.videoTracks")}} にある {{domxref("VideoTrackList")}} に送信されます。</li>
+ <li>音声トラックに関連するイベントは、常に {{domxref("HTMLMediaElement.audioTracks")}} で指定された {{domxref("AudioTrackList")}} に送信されます。</li>
+ <li>テキストトラックに影響を与えるイベントは、{{domxref("HTMLMediaElement.textTracks")}} によって示される {{domxref("TextTrackList")}} オブジェクトに送信されます。</li>
+</ul>
+
+<dl>
+</dl>
+
+<h2 id="Constructor" name="Constructor">コンストラクタ</h2>
+
+<dl>
+ <dt>{{domxref("TrackEvent.TrackEvent", "TrackEvent()")}}</dt>
+ <dd>指定されたイベントタイプとオプションの追加プロパティで、新しい <code>TrackEvent</code> オブジェクトを作成して初期化します。</dd>
+</dl>
+
+<h2 id="Properties" name="Properties">プロパティ</h2>
+
+<p><em><code>TrackEvent</code> は {{domxref("Event")}} に基づいているため、<code>Event</code> のプロパティは <code>TrackEvent</code> オブジェクトでも利用できます。</em></p>
+
+<dl>
+ <dt>{{domxref("TrackEvent.track", "track")}} {{ReadOnlyInline}}</dt>
+ <dd>イベントが参照している DOM のトラックオブジェクト。 <code>null</code> でない場合、これは常にメディアトラックの種類のうちの1つのオブジェクト（{{domxref("AudioTrack")}}、{{domxref("VideoTrack")}}、または {{domxref("TextTrack")}}）です。</dd>
+</dl>
+
+<h2 id="Methods" name="Methods">メソッド</h2>
+
+<p><em><code>TrackEvent</code> には独自のメソッドはありません。 しかし、それは {{domxref("Event")}} に基づいているので、<code>Event</code> オブジェクトで利用可能なメソッドを提供します。</em></p>
+
+<h2 id="Example" name="Example">例</h2>
+
+<p>この例では、<code>handleTrackEvent()</code> 関数を設定します。 この関数は、文書内で見つかった最初の {{HTMLElement("video")}} 要素の {{event("addtrack")}} イベントまたは {{event("removetrack")}} イベントに対して呼び出されます。</p>
+
+<pre class="brush: js">var videoElem = document.querySelector("video");
+
+videoElem.videoTracks.addEventListener("addtrack", handleTrackEvent, false);
+videoElem.videoTracks.addEventListener("removetrack", handleTrackEvent, false);
+videoElem.audioTracks.addEventListener("addtrack", handleTrackEvent, false);
+videoElem.audioTracks.addEventListener("removetrack", handleTrackEvent, false);
+videoElem.textTracks.addEventListener("addtrack", handleTrackEvent, false);
+videoElem.textTracks.addEventListener("removetrack", handleTrackEvent, false);
+
+function handleTrackEvent(event) {
+  var trackKind;
+
+  if (event.target instanceof(VideoTrackList)) {
+    trackKind = "動画";
+  } else if (event.target instanceof(AudioTrackList)) {
+    trackKind = "音声";
+  } else if (event.target instanceof(TextTrackList)) {
+    trackKind = "テキスト";
+  } else {
+    trackKind = "不明な";
+  }
+
+  switch(event.type) {
+    case "addtrack":
+      console.log(trackKind + "トラックが追加されました。");
+      break;
+    case "removetrack":
+      console.log(trackKind + "トラックが取り除かれました。");
+      break;
+  }
+}
+</pre>
+
+<p>イベントハンドラは、JavaScript の <code><a href="/ja/docs/Web/JavaScript/Reference/Operators/instanceof">instanceof</a></code> 演算子を使用してイベントが発生したトラックの種類を判断し、それがどの種類のトラックであるか、および要素に追加されているのか、要素から取り除かれているのかを示すメッセージをコンソールに出力します。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">仕様</th>
+   <th scope="col">状態</th>
+   <th scope="col">コメント</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "media.html#the-trackevent-interface", "TrackEvent")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>初期定義</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "embedded-content-0.html#trackevent", "TrackEvent")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>初期定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+
+
+<p>{{Compat("api.TrackEvent")}}</p>
diff --git a/files/ja/web/api/trackevent/track/index.html b/files/ja/web/api/trackevent/track/index.html
new file mode 100644
index 0000000000..72a0f6f9c7
--- /dev/null
+++ b/files/ja/web/api/trackevent/track/index.html
@@ -0,0 +1,56 @@
+---
+title: TrackEvent.track
+slug: Web/API/TrackEvent/track
+tags:
+  - API
+  - Audio
+  - Event
+  - HTML DOM
+  - Media
+  - Property
+  - Read-only
+  - Reference
+  - TrackEvent
+  - Video
+  - track
+translation_of: Web/API/TrackEvent/track
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p><span class="seoSummary">{{domxref("TrackEvent")}} インターフェイスの読み取り専用の <strong><code>track</code></strong> プロパティは、イベントが適用されるメディアトラックオブジェクトを指定します。</span> これは {{domxref("AudioTrack")}}、{{domxref("VideoTrack")}}、または {{domxref("TextTrack")}} のオブジェクトになります。</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox"><em>track</em> = <em>TrackEvent</em>.track;</pre>
+
+<h3 id="Value" name="Value">値</h3>
+
+<p>トラックで表されるメディアの種類に応じて、{{domxref("AudioTrack")}}、{{domxref("VideoTrack")}}、または {{domxref("TextTrack")}} のいずれかの種類のオブジェクトです。 これは、イベントが適用されるトラックを識別します。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">仕様</th>
+   <th scope="col">状態</th>
+   <th scope="col">コメント</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "media.html#dom-trackevent-track", "TrackEvent.track")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>初期定義</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "embedded-content-0.html#dom-trackevent-track", "TrackEvent.track")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>初期定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+
+
+<p>{{Compat("api.TrackEvent.track")}}</p>
diff --git a/files/ja/web/api/trackevent/trackevent/index.html b/files/ja/web/api/trackevent/trackevent/index.html
new file mode 100644
index 0000000000..622f86dfbe
--- /dev/null
+++ b/files/ja/web/api/trackevent/trackevent/index.html
@@ -0,0 +1,74 @@
+---
+title: TrackEvent()
+slug: Web/API/TrackEvent/TrackEvent
+tags:
+  - API
+  - Audio
+  - Constructor
+  - HTML DOM
+  - Media
+  - Reference
+  - TrackEvent
+  - Tracks
+  - Video
+translation_of: Web/API/TrackEvent/TrackEvent
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p><span class="seoSummary"><code>TrackEvent()</code> コンストラクタは、トラックのリスト（{{domxref("AudioTrackList")}}、{{domxref("VideoTrackList")}}、または {{domxref("TextTrackList")}}）で発生したイベントを記述する新しい {{domxref("TrackEvent")}} オブジェクトを作成して返します。</span></p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox"><em>trackEvent</em> = new TrackEvent(<em>type</em>, <em>eventInfo</em>);</pre>
+
+<h3 id="Parameters" name="Parameters">パラメーター</h3>
+
+<dl>
+ <dt><code>type</code></dt>
+ <dd>オブジェクトによって記述されるトラックイベントの種類: <code>"addtrack"</code> または <code>"removetrack"</code>。</dd>
+ <dt><code>eventInfo</code> {{optional_inline}}</dt>
+ <dd>新しいイベントを構成する追加情報を提供するオプションの辞書。 次のフィールドを自由に組み合わせて含めることができます。
+ <dl>
+  <dt><code>track</code> {{optional_inline}}</dt>
+  <dd>イベントが参照するトラック。 これはデフォルトでは <code>null</code> ですが、トラックの種類に応じて {{domxref("VideoTrack")}}、{{domxref("AudioTrack")}}、または {{domxref("TextTrack")}} に設定する必要があります。</dd>
+  <dt><code>bubbles</code> {{optional_inline}}</dt>
+  <dd>イベントをバブリングするかどうかを示す Boolean。</dd>
+  <dt><code>cancelable</code> {{optional_inline}}</dt>
+  <dd>イベントをキャンセルできるかどうかを示す Boolean。</dd>
+  <dt><code>composed</code> {{optional_inline}}</dt>
+  <dd>イベントがシャドウルートの外側でリスナーをトリガーするかどうかを示す Boolean。 詳細については {{domxref("Event.composed")}} をご覧ください。</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h3 id="Return_value" name="Return_value">戻り値</h3>
+
+<p>新しく作成された {{domxref("TrackEvent")}} オブジェクト。 コンストラクタへの入力の説明に従って初期化されます。</p>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">仕様</th>
+   <th scope="col">状態</th>
+   <th scope="col">コメント</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "media.html#dom-trackevent-trackevent", "TrackEvent()")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>初期定義</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "semantics-embedded-content.html#dom-trackevent-trackevent", "TrackEvent()")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>初期定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+
+
+<p>{{Compat("api.TrackEvent.TrackEvent")}}</p>