initial commit

1 files changed, 197 insertions, 0 deletions

diff --git a/files/ja/web/api/audiocontext/createmediastreamsource/index.html b/files/ja/web/api/audiocontext/createmediastreamsource/index.html
new file mode 100644
index 0000000000..23911f427d
--- /dev/null
+++ b/files/ja/web/api/audiocontext/createmediastreamsource/index.html
@@ -0,0 +1,197 @@
+---
+title: AudioContext.createMediaStreamSource()
+slug: Web/API/AudioContext/createMediaStreamSource
+translation_of: Web/API/AudioContext/createMediaStreamSource
+---
+<p>{{ APIRef("Web Audio API") }}</p>
+
+<div>
+<p>インターフェースの<code>createMediaStreamSource()</code>メソッドは、指定のメディアストリームから(言い換えると{{ domxref("navigator.getUserMedia") }}インスタンスから){{ domxref("MediaStreamAudioSourceNode") }}オブジェクトを生成します。ここからの音声は再生や編集ができます。</p>
+</div>
+
+<p>メディアストリームオーディオソースノードの詳細は{{ domxref("MediaStreamAudioSourceNode") }}のページを参照してください。</p>
+
+<h2 id="構文">構文</h2>
+
+<pre class="brush: js">var audioCtx = new AudioContext();
+var source = audioCtx.createMediaStreamSource(stream);</pre>
+
+<h3 id="引数">引数</h3>
+
+<dl>
+ <dt>stream</dt>
+ <dd>操作のためにオーディオグラフに加えたい{{domxref("MediaStream")}}オブジェクト。</dd>
+</dl>
+
+<h3 id="戻り値">戻り値</h3>
+
+<p>{{domxref("MediaStreamAudioSourceNode")}}</p>
+
+<h2 id="例">例</h2>
+
+<p>この例では、メディア(音声+映像)ストリームを{{ domxref("navigator.getUserMedia") }}から獲得し、それを{{ htmlelement("video") }}要素に渡し、映像は再生しますが音声は再生しないようにします。音声は{{ domxref("MediaStreamAudioSourceNode") }}に渡します。次に、音声をローパスフィルタ{{ domxref("BiquadFilterNode") }}(低音を強めるように働きます)に渡し、そして{{domxref("AudioDestinationNode") }}に渡します。</p>
+
+<p>{{ htmlelement("video") }}要素の下のスライダーはローパスフィルタの増幅量を操作します—スライダーで値を大きくすると、より低音が強くなります!</p>
+
+<div class="note">
+<p><strong>注:</strong> <a href="http://mdn.github.io/stream-source-buffer/">この例の実行</a>と<a href="https://github.com/mdn/stream-source-buffer">ソースの閲覧</a>もできます。</p>
+</div>
+
+<pre class="brush: js;highlight[46]">// プレフィックスが必要な場合を考慮して、getUserMediaはブラウザのバージョンごとに分ける
+
+navigator.getUserMedia = (navigator.getUserMedia ||
+                          navigator.webkitGetUserMedia ||
+                          navigator.mozGetUserMedia ||
+                          navigator.msGetUserMedia);
+
+// 他の変数を定義する
+
+var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
+var myAudio = document.querySelector('audio');
+var pre = document.querySelector('pre');
+var video = document.querySelector('video');
+var myScript = document.querySelector('script');
+var range = document.querySelector('input');
+
+// マウスポインタのY座標と、画面の高さを格納する変数を定義する
+var CurY;
+var HEIGHT = window.innerHeight;
+
+// getUserMediaのブロック - ストリームを得る
+// MediaStreamAudioSourceNodeに渡す
+// 映像はvideo要素に出力する
+
+if (navigator.getUserMedia) {
+   console.log('getUserMedia supported.');
+   navigator.getUserMedia (
+      // 制約: このアプリで音声と映像を有効にする
+      {
+         audio: true,
+         video: true
+      },
+
+      // 成功時のコールバック
+      function(stream) {
+         video.src = (window.URL &amp;&amp; window.URL.createObjectURL(stream)) || stream;
+         video.onloadedmetadata = function(e) {
+            video.play();
+            video.muted = 'true';
+         };
+
+         // MediaStreamAudioSourceNodeを生成し、それにHTMLMediaElementを渡す
+         var source = audioCtx.createMediaStreamSource(stream);
+
+          // 二次フィルターを生成する
+          var biquadFilter = audioCtx.createBiquadFilter();
+          biquadFilter.type = "lowshelf";
+          biquadFilter.frequency.value = 1000;
+          biquadFilter.gain.value = range.value;
+
+          // AudioBufferSourceNodeをgainNodeに、そしてgainNodeをdestinationに接続する
+          // これでマウスを動かすことで音楽のボリュームを調整することができる
+          source.connect(biquadFilter);
+          biquadFilter.connect(audioCtx.destination);
+
+          // マウスが動いたとき新しい座標を得る
+          // そして増幅量を更新する
+
+          range.oninput = function() {
+              biquadFilter.gain.value = range.value;
+          }
+
+      },
+
+      // エラー時のフィードバック
+      function(err) {
+         console.log('The following gUM error occured: ' + err);
+      }
+   );
+} else {
+   console.log('getUserMedia not supported on your browser!');
+}
+
+// pre要素にスクリプトを書き出す
+
+pre.innerHTML = myScript.innerHTML;</pre>
+
+<div class="note">
+<p><strong>注:</strong> <code>createMediaStreamSource()</code>の呼び出しによるメディアストリームの音声は、再び<code>AudioContext</code>の処理グラフに再び入ります。よって、ストリームの再生/停止は、まだメディアAPIとプレイヤーの操作で行えます。</p>
+</div>
+
+<h2 id="仕様">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Audio API', '#widl-AudioContext-createMediaStreamSource-MediaStreamAudioSourceNode-MediaStream-mediaStream', 'createMediaStreamSource()')}}</td>
+   <td>{{Spec2('Web Audio API')}}</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>{{CompatChrome(10.0)}}{{property_prefix("webkit")}}</td>
+   <td>{{CompatGeckoDesktop(25.0)}} </td>
+   <td>{{CompatNo}}</td>
+   <td>15.0{{property_prefix("webkit")}}<br>
+    22 (unprefixed)</td>
+   <td>6.0{{property_prefix("webkit")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</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>{{CompatUnknown}}</td>
+   <td>26.0</td>
+   <td>1.2</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>33.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="参考">参考</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web_Audio_API/Using_Web_Audio_API">Using the Web Audio API</a></li>
+</ul>