<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!--[if lt IE 9]>
<![endif]-->
</head>
<body>
<div>
<button type="button" class="btn btn-default btn-lg initUserMedia">initUserMedia</button>
<button type="button" class="btn btn-default btn-lg clearUserMedia">clearUserMedia</button>
<button type="button" class="btn btn-default btn-lg playAudio">playAudio</button>
<button type="button" class="btn btn-default btn-lg stopAudio">stopAudio</button>
</div>
<div class="audioList">
<audio class="simple" loop>
<source src="game_maoudamashii_5_village10.ogg" type="audio/ogg">
</audio>
</div>
<script>
navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia;
mediaStream = null;
// UserMediaの設定
function initUserMedia()
{
console.log('initUserMedia:');
navigator.getUserMedia({audio: true}, function(stream){
console.log(' getUserMedia: stream');
mediaStream = stream;
},
function(error){
console.log(' getUserMedia: error: ', error);
});
}
// UserMediaのクリア
function clearUserMedia()
{
console.log('clearUserMedia:');
if (mediaStream)
{
mediaStream.stop();
mediaStream = null;
}
}
// 音声の再生
function simplePlay(audioSelector)
{
console.log('simplePlay:');
if ($(audioSelector).get(0).currentTime)
$(audioSelector).get(0).currentTime = 0;
$(audioSelector).get(0).play();
}
// 音声の停止
function simplePause(audioSelector)
{
console.log('simplePause:');
$(audioSelector).get(0).pause();
}
// ボタン操作
$(function(){
$('.initUserMedia').on('click', function(){ initUserMedia() });
$('.clearUserMedia').on('click', function(){ clearUserMedia() });
$('.playAudio').on('click', function(){ simplePlay('.simple') });
$('.stopAudio').on('click', function(){ simplePause('.simple') });
});
</script>
</body>
</html>