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/mediastream | |
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/mediastream')
-rw-r--r-- | files/ja/web/api/mediastream/active/index.html | 105 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/addtrack/index.html | 132 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/clone/index.html | 91 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/getaudiotracks/index.html | 68 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/gettrackbyid/index.html | 109 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/getvideotracks/index.html | 111 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/id/index.html | 99 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/index.html | 131 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/mediastream/index.html | 73 | ||||
-rw-r--r-- | files/ja/web/api/mediastream/onaddtrack/index.html | 111 |
10 files changed, 1030 insertions, 0 deletions
diff --git a/files/ja/web/api/mediastream/active/index.html b/files/ja/web/api/mediastream/active/index.html new file mode 100644 index 0000000000..b6e058b07b --- /dev/null +++ b/files/ja/web/api/mediastream/active/index.html @@ -0,0 +1,105 @@ +--- +title: active +slug: Web/API/MediaStream/active +translation_of: Web/API/MediaStream/active +--- +<p>{{APIRef("Media Capture and Streams")}}</p> + +<p>{{domxref("MediaStream")}}インタフェースの<strong><code>active</code></strong>は読み取り専用のプロパティであり、ストリームが現在アクティブであれば<code>true</code>を返し、それ以外の場合は<code>false</code>を返します。少なくとも一つのトラックの状態が{{domxref("MediaStreamTrack.ended")}}でない場合、ストリームがアクティブであるとみなされます。すべでのトラックが終了すると、このストリームの<code>active</code>プロパティは<code>false</code>になります。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox">var <em>isActive</em> = <em>MediaStream</em>.active;</pre> + +<h3 id="値">値</h3> + +<p>このストリームが現在アクティブな場合は<code>true</code>を返します。それ以外は<code>false</code>を返します。</p> + +<h2 id="例">例</h2> + +<p>この例では、{{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}を用いて、要求されたユーザーのローカルのカメラとマイクロフォンをソースとする新しいストリームを取得しています。ストリームが有効になると(ここでは、{{jsxref("Promise")}}がfulfilledの状態になった時)、ストリームが現在アクティブであるかどうかに応じてページにあるボタンの状態が更新されます。</p> + +<pre class="brush: js">var promise = navigator.mediaDevices.getUserMedia({ + audio: true, + video: true +}); + +promise.then(function(stream) { + var startBtn = document.querySelector('#startBtn'); + startBtn.disabled = stream.active; +});</pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Media Capture', '#widl-MediaStream-active', 'active')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</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>Microsoft Edge</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(52)}}</td> + <td>{{CompatUnknown}}</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>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>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(52)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/ja/web/api/mediastream/addtrack/index.html b/files/ja/web/api/mediastream/addtrack/index.html new file mode 100644 index 0000000000..c8c5ee241c --- /dev/null +++ b/files/ja/web/api/mediastream/addtrack/index.html @@ -0,0 +1,132 @@ +--- +title: MediaStream.addTrack() +slug: Web/API/MediaStream/addTrack +translation_of: Web/API/MediaStream/addTrack +--- +<p>{{APIRef("Media Capture and Streams")}}</p> + +<p><strong><code>MediaStream.addTrack()</code></strong>メソッドはストリームへ新しいトラックを追加するメソッドです。パラメータとして渡されるこのトラックの型は{{domxref("MediaStreamTrack")}}です。</p> + +<div class="note"> +<p>If the specified track is already in the stream's track set, this method has no effect.</p> +</div> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox"><em>stream</em>.addTrack(<em>track</em>); +</pre> + +<h3 id="パラメータ">パラメータ</h3> + +<dl> + <dt><code>track</code></dt> + <dd>このストリームへ追加する{{domxref("MediaStreamTrack")}}です。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<p>{{jsxref("undefined")}}</p> + +<h2 id="例">例</h2> + +<p> </p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table" style="height: 49px; width: 1000px;"> + <thead> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('Media Capture','#widl-MediaStream-addTrack-void-MediaStreamTrack-track','addTrack()') }}</td> + <td>{{ Spec2('Media Capture') }}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop">{{ CompatUnknown() }} +<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>Basic support</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoDesktop(34) }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td><code>addTrack()</code> and {{domxref("removeTrack()")}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoDesktop(44)}}</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>Chrome for Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(34) }}</td> + <td>{{ CompatNo() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td><code>addTrack()</code> and {{domxref("removeTrack()")}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatGeckoDesktop(44)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="関連項目">関連項目</h2> + +<ul> + <li>{{domxref("MediaStream")}}インタフェース</li> +</ul> diff --git a/files/ja/web/api/mediastream/clone/index.html b/files/ja/web/api/mediastream/clone/index.html new file mode 100644 index 0000000000..8769325d73 --- /dev/null +++ b/files/ja/web/api/mediastream/clone/index.html @@ -0,0 +1,91 @@ +--- +title: MediaStream.clone() +slug: Web/API/MediaStream/clone +translation_of: Web/API/MediaStream/clone +--- +<p>{{APIRef("Media Capture and Streams")}}</p> + +<p>{{domxref("MediaStream")}}インタフェースの<strong><code>clone()</code></strong>メソッドは、その<code>MediaStream</code>の複製を作成します。この新しい<code>MediaStream</code>オブジェクトは、新しい固有の{{domxref("MediaStream.id", "id")}}を持ち、<code>MediaStream</code>に含まれる{{domxref("MediaStreamTrack")}}もそれぞれ<code>clone()</code>を呼び出して得られたものになります。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox">var <em>stream</em> = <em>MediaStream</em>.clone();</pre> + +<h3 id="パラメータ">パラメータ</h3> + +<p>なし。</p> + +<h3 id="戻り値">戻り値</h3> + +<p>新しい{{domxref("MediaStream")}}インスタンスを返します。このインスタンスは新しい固有IDを持ち、<code>MediaStream</code>に含まれる全ての{{domxref("MediaStreamTrack")}}を含みます。この{{domxref("MediaStreamTrack")}}はそれぞれ<code>clone()</code>によって呼び出されたものになります。</p> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Media Capture', '#widl-MediaStream-clone-MediaStream', 'MediaStream.clone()')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</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>{{ CompatVersionUnknown }}</td> + <td>{{CompatGeckoDesktop(48) }}</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>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatGeckoMobile(48) }}</td> + <td>{{CompatGeckoMobile(48) }}</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatVersionUnknown }}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/ja/web/api/mediastream/getaudiotracks/index.html b/files/ja/web/api/mediastream/getaudiotracks/index.html new file mode 100644 index 0000000000..467ef43f40 --- /dev/null +++ b/files/ja/web/api/mediastream/getaudiotracks/index.html @@ -0,0 +1,68 @@ +--- +title: MediaStream.getAudioTracks() +slug: Web/API/MediaStream/getAudioTracks +translation_of: Web/API/MediaStream/getAudioTracks +--- +<p>{{APIRef("Media Capture and Streams")}}</p> + +<p>{{domxref("MediaStream")}} インタフェースの<strong><dfn><code>getAudioTracks()</code></dfn></strong> メソッドは、そのストリームの<code><a href="https://www.w3.org/TR/mediacapture-streams/#track-set">track set</a></code>の中から、{{domxref("MediaStreamTrack.kind")}}が<code>audio</code>である{{domxref("MediaStreamTrack")}} を表すオブジェクトの配列を返します。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox notranslate">var <em>mediaStreamTracks</em> = <em>mediaStream</em>.getAudioTracks()</pre> + +<h3 id="引数">引数</h3> + +<p>なし。</p> + +<h3 id="戻り値">戻り値</h3> + +<p>ストリームに含まれるオーディオトラックである{{domxref("MediaStreamTrack")}}オブジェクトの配列。オーディオトラックとは{{domxref("MediaStreamTrack.kind", "kind")}}プロパティが <code>audio</code>のトラックです。ストリーム内にオーディオトラックがない場合はこの配列は空になります。</p> + +<div class="note"> +<p><strong>注意:</strong> トラックの順番は仕様では定義されておらず、実際、<code>getAudioTracks()</code>を呼び出すたびに変わりえます。</p> +</div> + +<p>このAPIの初期バージョンでは、オーディオストリーム内の要素の型として使われていた特別な<code>AudioStreamTrack</code>インタフェースを含んでいました。しかし、こちらは後ほど、{{domxref("MediaStreamTrack")}}インタフェース内に統合されました。</p> + +<h2 id="例">例</h2> + +<p>この例では、Webカメラの音声とビデオを{{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}を使ってストリームとして取得し、そのストリームを{{HTMLElement("video")}}要素に設定します。その後、終了時にストリーム内の最初のオーディオトラックを停止するタイマーを設定します。</p> + +<pre class="brush: js notranslate">navigator.mediaDevices.getUserMedia({audio: true, video: true}) +.then(mediaStream => { + document.querySelector('video').srcObject = mediaStream; + // Stop the audio stream after 5 seconds + setTimeout(() => { + const tracks = mediaStream.getAudioTracks() + tracks[0].stop() + }, 5000) +}) +</pre> + +<h2 id="仕様">仕様</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('Media Capture','#dom-mediastream-getaudiotracks','getAudioTracks()')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.MediaStream.getAudioTracks")}}</p> diff --git a/files/ja/web/api/mediastream/gettrackbyid/index.html b/files/ja/web/api/mediastream/gettrackbyid/index.html new file mode 100644 index 0000000000..37300ca3b9 --- /dev/null +++ b/files/ja/web/api/mediastream/gettrackbyid/index.html @@ -0,0 +1,109 @@ +--- +title: MediaStream.getTrackById() +slug: Web/API/MediaStream/getTrackById +translation_of: Web/API/MediaStream/getTrackById +--- +<p>{{APIRef("Media Capture and Streams")}}</p> + +<p><strong><code>MediaStream.getTrackById()</code></strong>メソッドは、指定されたID文字列を持つトラックを表現する{{domxref("MediaStreamTrack")}}オブジェクトを返します。指定したIDを持つトラックが存在しない場合は、<code>null</code>を返します。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox">var <em>track</em> = <em>MediaStream</em>.getTrackById(<em>id</em>); +</pre> + +<h3 id="パラメータ">パラメータ</h3> + +<dl> + <dt><code>id</code></dt> + <dd>取得したいトラックを識別する{{domxref("DOMString")}}です。</dd> +</dl> + +<h3 id="戻り値">戻り値</h3> + +<p>パラメータで指定した<code>id</code>の文字列と同じ{{domxref("MediaStreamTrack.id")}}を持つトラックが見つかった場合は、その{{domxref("MediaStreamTrack")}}オブジェクトを返します。それ以外の場合は、<code>null</code>を返します。</p> + +<h2 id="例">例</h2> + +<p>この例では、ビデオに含まれるコメンタリートラックを有効にしています。メインのオーディオトラックの音量を50%にしてから、コメンタリートラックを有効にしています。</p> + +<pre class="brush: js">stream.getTrackById("primary-audio-track").applyConstraints({ volume: 0.5 }); +stream.getTrackById("commentary-track").enabled = true;</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table" style="height: 49px; width: 1000px;"> + <thead> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('Media Capture','#widl-MediaStream-getTrackById-MediaStreamTrack-DOMString-trackId','getTrackById()') }}</td> + <td>{{ Spec2('Media Capture') }}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</h2> + +<p>{{ CompatibilityTable }}</p> + +<div id="compat-desktop">{{ CompatUnknown }} +<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>{{ CompatUnknown }}</td> + <td>{{ CompatGeckoDesktop(49) }}</td> + <td>{{ CompatNo }}</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>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatGeckoMobile(49) }}</td> + <td>{{ CompatNo }}</td> + <td>{{ CompatUnknown }}</td> + <td>{{ CompatUnknown }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="関連項目">関連項目</h2> + +<ul> + <li>{{domxref("MediaStream")}}</li> + <li>{{domxref("MediaStreamTrack.id")}}</li> +</ul> diff --git a/files/ja/web/api/mediastream/getvideotracks/index.html b/files/ja/web/api/mediastream/getvideotracks/index.html new file mode 100644 index 0000000000..758e65fcef --- /dev/null +++ b/files/ja/web/api/mediastream/getvideotracks/index.html @@ -0,0 +1,111 @@ +--- +title: MediaStream.getVideoTracks() +slug: Web/API/MediaStream/getVideoTracks +translation_of: Web/API/MediaStream/getVideoTracks +--- +<p>{{APIRef("Media Capture and Streams")}}{{SeeCompatTable}}</p> + +<p>{{domxref("MediaStream")}}インタフェースの<strong><code>getVideoTracks()</code></strong>は、このストリームに含まれるビデオトラックを表現する{{domxref("MediaStreamTrack")}}オブジェクトの配列を返します。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox">var <em>mediaStreamTracks[]</em> = <em>mediaStream</em>.getVideoTracks()</pre> + +<h3 id="パラメータ">パラメータ</h3> + +<p>なし。</p> + +<h3 id="戻り値"><span style='font-family: x-locale-heading-primary,zillaslab,Palatino,"Palatino Linotype",x-locale-heading-secondary,serif; font-size: 1.375rem;'>戻り値</span></h3> + +<p>{{domxref("MediaStreamTrack")}}の配列。</p> + +<h3 id="例外">例外</h3> + +<h2 id="例">例</h2> + +<p>次の例は、<a href="https://googlechrome.github.io/samples/image-capture/photo-resolution.html">Chrome's Image Capture / Photo Resolution Sample</a> (英語)から抜粋したものであり、<code>getVideoTracks()</code>を用いて取得したトラックを{{domxref("ImageCapture.ImageCapture", "ImageCapture()")}}コンストラクタへ渡しています。</p> + +<pre class="brush: js"><code>const input = document.querySelector('input[type="range"]'); + +var imageCapture; + +navigator.mediaDevices.getUserMedia({video: true}) +.then(mediaStream => { + document.querySelector('video').srcObject = mediaStream; + + const track = mediaStream.getVideoTracks()[0]; + imageCapture = new ImageCapture(track); + + return imageCapture.getPhotoCapabilities(); +})</code></pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Media Capture','#dom-mediastream-getvideotracks','getVideoTracks()')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</h2> + +<div>{{CompatibilityTable}}</div> + +<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 (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android Webview</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/ja/web/api/mediastream/id/index.html b/files/ja/web/api/mediastream/id/index.html new file mode 100644 index 0000000000..8eff5ae3c1 --- /dev/null +++ b/files/ja/web/api/mediastream/id/index.html @@ -0,0 +1,99 @@ +--- +title: MediaStream.id +slug: Web/API/MediaStream/id +translation_of: Web/API/MediaStream/id +--- +<p>{{APIRef("WebRTC")}}</p> + +<p><code><strong>MediaStream.id</strong></code>は読み取り専用プロパティであり、このオブジェクトの固有識別子(GUID)である36文字で表現される{{domxref("DOMString")}}を返します。</p> + +<h2 id="Syntax" name="Syntax">文法</h2> + +<pre class="syntaxbox">var <em>id</em> = <em>mediaStream</em>.id; +</pre> + +<h2 id="例">例</h2> + +<pre class="brush: js"><code class="language-html">var p = navigator.mediaDevices.getUserMedia({ audio: true, video: true }); + +p.then(function(stream) { + console.log(stream.id); +};) +</code></pre> + +<h2 id="仕様">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Media Capture', '#widl-MediaStream-id', 'MediaStream.id')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザ互換性</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>Basic support</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoDesktop(41) }}</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>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatGeckoMobile(41) }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="関連項目">関連項目</h2> + +<ul> + <li>{{domxref("MediaStream")}}インタフェース</li> +</ul> diff --git a/files/ja/web/api/mediastream/index.html b/files/ja/web/api/mediastream/index.html new file mode 100644 index 0000000000..ec0b8b67c0 --- /dev/null +++ b/files/ja/web/api/mediastream/index.html @@ -0,0 +1,131 @@ +--- +title: MediaStream +slug: Web/API/MediaStream +tags: + - API + - Interface + - Media Streams API + - MediaStream + - Reference + - WebRTC + - インターフェイス +translation_of: Web/API/MediaStream +--- +<div>{{APIRef("Media Capture and Streams")}}</div> + +<p><span class="seoSummary"><strong><code>MediaStream</code></strong> インターフェイスは、メディアコンテンツのストリームを表します。ストリームは動画や音声など複数の<strong>トラック</strong>から成ります。それぞれのトラックは {{domxref("MediaStreamTrack")}} のインスタンスとして定義されます。</span> MediaStream オブジェクトを取得するには、コンストラクターを使用するか {{domxref("MediaDevices.getUserMedia()")}} を呼び出すかします。</p> + +<p>ユーザーエージェントによってはこのインターフェイスを {{domxref("CanvasCaptureMediaStream")}} のようにサブクラス化して、より詳細な情報や機能を提供しています。</p> + +<h2 id="Constructor" name="Constructor">コンストラクター</h2> + +<dl> + <dt>{{domxref("MediaStream.MediaStream", "MediaStream()")}}</dt> + <dd>新しい MediaStream オブジェクトを作成して返します。空のストリーム、既存のストリームに基づいたストリーム、 ({{domxref("MediaStreamTrack")}} オブジェクトの配列として指定して) 特定のトラックのリストを含むストリームを作成することができます。</dd> +</dl> + +<h2 id="Properties" name="Properties">プロパティ</h2> + +<p><em>このインターフェイスは親である {{domxref("EventTarget")}} からプロパティを継承しています。</em></p> + +<dl> + <dt>{{domxref("MediaStream.active")}} {{readonlyinline}}</dt> + <dd>論理値で、 <code>true</code> は <code>MediaStream</code> がアクティブな時、 <code>false</code> はそうでない場合です。</dd> + <dt>{{domxref("MediaStream.ended")}} {{readonlyInline}} {{obsolete_inline()}}</dt> + <dd>論理値で、ストリームの終わりに達した場合は <code>true</code> に設定されます。これは仕様書から削除されました。代わりに再生が終了したことを書くにしたい場合は、代わりに再生が終了したことを確認したいトラックの {{domxref("MediaStreamTrack.readyState")}} の値をチェックして確認してください。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.id")}} {{readonlyInline}}</dt> + <dd>{{domxref("DOMString")}} で36文字のオブジェクトの汎用一意識別子 (UUID) を表す文字列が入ります。</dd> +</dl> + +<h3 id="Event_handlers" name="Event_handlers">イベントハンドラー</h3> + +<dl> + <dt>{{domxref("MediaStream.onaddtrack")}}</dt> + <dd>{{domxref("EventHandler")}} で、新しい {{domxref("MediaStreamTrack")}} オブジェクトが追加され、 {{domxref("MediaStream/addtrack_event", "addtrack")}} イベントが発生したときに実行される動作です。</dd> + <dt>{{domxref("MediaStream.onremovetrack")}}</dt> + <dd>{{domxref("EventHandler")}} で、 {{domxref("MediaStreamTrack")}} オブジェクトが削除され、 {{domxref("MediaStream/removetrack_event", "removetrack")}} イベントが発生したときに実行される動作です。</dd> +</dl> + +<h2 id="Methods" name="Methods">メソッド</h2> + +<p><em>このインターフェイスは親である {{domxref("EventTarget")}} からメソッドを継承しています。</em></p> + +<dl> + <dt>{{domxref("MediaStream.addTrack()")}}</dt> + <dd>引数で指定された {{domxref("MediaStreamTrack")}} のコピーを格納します。トラックが既に <code>MediaStream</code> オブジェクトに追加されていた場合は、何も起こりません。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.clone()")}}</dt> + <dd><code>MediaStream</code> オブジェクトの複製を返します。ただし、複製は固有の {{domxref("MediaStream.id", "id")}} の値を持ちます。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.getAudioTracks()")}}</dt> + <dd>{{domxref("MediaStreamTrack")}} オブジェクトのリストで、 <code>MediaStream</code> オブジェクトに格納されているものの中で <code>kind</code> 属性が <code>audio</code> に設定されているものを返します。順序は未定義であり、ブラウザーによって異なるばかりでなく、呼び出し毎に異なる可能性もあります。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.getTrackById()")}}</dt> + <dd>引数 <code>trackid</code> で与えられた ID を持つトラックを返します。引数が与えられなかった場合や、その ID を持つトラックが存在しなかった場合は、 <code>null</code> を返します。複数のトラックが同じ ID を持っている場合は、最初の一つを返します。</dd> + <dt>{{domxref("MediaStream.getTracks()")}}</dt> + <dd>{{domxref("MediaStreamTrack")}} オブジェクトのリストで、 <code>MediaStream</code> オブジェクトに格納されているものをすべて、 <code>kind</code> 属性の値に関わらず返します。順序は未定義であり、ブラウザーによって異なるばかりでなく、呼び出し毎に異なる可能性もあります。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.getVideoTracks()")}}</dt> + <dd>{{domxref("MediaStreamTrack")}} オブジェクトのリストで、 <code>MediaStream</code> オブジェクトに格納されているものの中で <code>kind</code> 属性が <code>video</code> に設定されているものを返します。順序は未定義であり、ブラウザーによって異なるばかりでなく、呼び出し毎に異なる可能性もあります。</dd> +</dl> + +<dl> + <dt>{{domxref("MediaStream.removeTrack()")}}</dt> + <dd>引数として与えられた {{domxref("MediaStreamTrack")}} を除去します。もしトラックが MediaStream オブジェクトの一部として登録されていなかったり、トラックが終了状態(最後まで到達している場合)だと、INVALID_STATE_RAISE が発生します。</dd> +</dl> + +<h2 id="Events" name="Events">イベント</h2> + +<dl> + <dt>{{domxref("MediaStream/addtrack_event", "addtrack")}}</dt> + <dd>新しい {{domxref("MediaStreamTrack")}} オブジェクトが追加されたときに発生します。<br> + {{domxref("MediaStream/onaddtrack", "onaddtrack")}} プロパティから利用することもできます。</dd> + <dt>{{domxref("MediaStream/removetrack_event", "removetrack")}}</dt> + <dd>{{domxref("MediaStreamTrack")}} オブジェクトが削除されたときに発生します。<br> + {{domxref("MediaStream/onremovetrack", "onremovetrack")}} プロパティから利用することもできます。</dd> +</dl> + +<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('Media Capture', '#dom-mediastream', 'MediaStream')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td></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.MediaStream")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>Using the MediaStream API</li> + <li><a href="/ja/docs/Web/API/WebRTC_API">WebRTC API</a></li> + <li><a href="/ja/docs/Web/API/Web_Audio_API">Web Audio API</a></li> + <li>{{domxref("MediaStreamTrack")}}</li> +</ul> diff --git a/files/ja/web/api/mediastream/mediastream/index.html b/files/ja/web/api/mediastream/mediastream/index.html new file mode 100644 index 0000000000..42b655066d --- /dev/null +++ b/files/ja/web/api/mediastream/mediastream/index.html @@ -0,0 +1,73 @@ +--- +title: MediaStream() +slug: Web/API/MediaStream/MediaStream +tags: + - API + - Audio + - Constructor + - Media + - Media Capture and Streams + - Media Capture and Streams API + - MediaStream + - Reference + - Streams + - Tracks + - Video + - WebRTC + - streaming +translation_of: Web/API/MediaStream/MediaStream +--- +<div>{{APIRef("Media Capture and Streams")}}</div> + +<p><span class="seoSummary"><strong><code>MediaStream()</code></strong> はコンストラクターで、新しく生成された {{domxref("MediaStream")}} を返し、これはそれぞれが {{domxref("MediaStreamTrack")}} オブジェクトで表されるメディアトラックのコレクションとして機能します。</span>何か引数が与えられた場合は、指定されたトラックが新しいストリームに追加されます。そうでなければ、ストリームはトラックを持ちません。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>newStream</var> = new MediaStream(); +<var>newStream</var> = new MediaStream(<var>stream</var>); +<var>newStream</var> = new MediaStream(<var>tracks[]</var>); +</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>stream</var></code></dt> + <dd>様々な {{domxref("MediaStream")}} オブジェクトで、そのトラックが新しく生成されたストリームに自動的に追加されます。トラックは元のストリームから除去されないので、二つのストリームで強要されることになります。</dd> + <dt><code><var>tracks</var></code></dt> + <dd>{{domxref("MediaStreamTrack")}} オブジェクトの {{jsxref("Array")}} で、それぞれがストリームに追加するトラックです。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>生成された {{domxref("MediaStream")}} オブジェクトで、空のトラック、もしくは指定されたトラックを持つ。</p> + +<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('Media Capture', '#mediastream', 'MediaStream')}}</td> + <td>{{Spec2('Media Capture')}}</td> + <td> </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.MediaStream.MediaStream")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{domxref("MediaStream")}}</li> +</ul> diff --git a/files/ja/web/api/mediastream/onaddtrack/index.html b/files/ja/web/api/mediastream/onaddtrack/index.html new file mode 100644 index 0000000000..21fb05ccda --- /dev/null +++ b/files/ja/web/api/mediastream/onaddtrack/index.html @@ -0,0 +1,111 @@ +--- +title: MediaStream.onaddtrack +slug: Web/API/MediaStream/onaddtrack +translation_of: Web/API/MediaStream/onaddtrack +--- +<p>{{APIRef("Media Streams API")}}</p> + +<p><span class="seoSummary"><strong><code>MediaStream.onaddtrack</code></strong> プロパティは、{{domxref("EventHandler")}}であり、{{domxref("MediaStream")}}インスタンスで{{event("addtrack")}}イベントが発生した時に呼び出される関数です。このイベントは、メディアストリームへ新しいトラックが追加された時に発生します。</span>このイベントはブラウザがストリームへ新しいトラックを追加した時に発生します。たとえば、{{domxref("RTCPeerConnection")}}が再交渉された時や、{{domxref("HTMLMediaElement.captureStream()")}}を用いてキャプチャーが開始されたストリームが、新しいトラックを取得した時です。</p> + +<p>JavaScriptのコードによって明示的にストリームへトラックを追加した場合({{domxref("MediaStream.addTrack", "addTrack()")}}の呼び出しによるもの)は、<code>addtrack</code>イベントは発生しません。</p> + +<h2 id="文法">文法</h2> + +<pre class="syntaxbox"><em>MediaStream</em>.onaddtrack = <em>eventHandler</em>; +</pre> + +<h3 id="値">値</h3> + +<p>どのトラックで{{event("addtrack")}}イベントが発生したのかを表現するための{{domxref("MediaStreamTrackEvent")}}オブジェクトを引数として受け取る関数を設定してください。追加されたトラックは、イベントの{{domxref("MediaStreamTrackEvent.track", "track")}}プロパティで表されます。</p> + +<h2 id="例">例</h2> + +<p>この例では、新しいトラックがストリームへ追加された時に、トラックのリストへ新しいアイテムを追加しています。新しいアイテムには、トラックの<code>kind</code>(<code>"audio"<font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">または</span></font></code><code>"video"</code>)と<code>label</code>が表示されます。</p> + +<pre class="brush: js">stream.onaddtrack = function(event) { + let trackList = document.getElementById("tracks"); + let label = document.createElement("li"); + + label.innerHTML = event.track.kind + ": " + event.track.label; + trackList.appendChild(label); +}; +</pre> + +<h2 id="仕様">仕様</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('Media Capture', '#event-mediastream-addtrack', 'MediaStream.onaddtrack') }}</td> + <td>{{ Spec2('Media Capture') }}</td> + <td>初版</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ互換性">ブラウザ互換性</h2> + +<div>{{CompatibilityTable}}</div> + +<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 (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(50)}}</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>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatGeckoMobile(50)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="関連項目">関連項目</h2> + +<ul> + <li>{{event("addtrack")}}イベントおよび、その型である{{domxref("MediaStreamTrackEvent")}}</li> +</ul> |