tai2 · November 14, 2014 11:25
diff --git a/webaudio_test.html b/webaudio_test.html
 <!DOCTYPE html>
 <html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Web Audio Test</title>
    </head>
    <body>
        <h1>Web Audio Test</h1>
        <div>
            <audio id="music1" src="http://1.ice1.firststreaming.com:8000/gndr_fm.mp3" loop></audio>
            <audio id="music2" src="http://144.76.39.90:8000/albayane.mp3" loop></audio>
        </div>
        <button id="button1">play music1</button>
        <button id="button2">play music2</button>
        <script>
            (function() {
                var music1 = document.getElementById('music1');
                var music2 = document.getElementById('music2');
                music1.isPlayed = false;
                music2.isPlayed = false;

                window.AudioContext = window.AudioContext || window.webkitAudioContext;
                var audioContext = new AudioContext();

                var convolver = audioContext.createConvolver();
                convolver.buffer = impulseResponse(4, 4, false);

                var distortion = audioContext.createWaveShaper();
                distortion.curve = makeDistortionCurve(400);

                var media1 = audioContext.createMediaElementSource(music1);
                var media2 = audioContext.createMediaElementSource(music2);

                music1.readyState < 3 ?
                    music1.addEventListener('canplay', connect) :
                    connect();

                var button1 = document.getElementById('button1');
                button1.addEventListener('click', function(event) {
                    if (music1.isPlayed) {
                        music1.pause();
                        music1.isPlayed = false;
                    } else {
                        music1.play();
                        music1.isPlayed = true;
                    }
                });

                var button2 = document.getElementById('button2');
                button2.addEventListener('click', function(event) {
                    if (music2.isPlayed) {
                        music2.pause();
                        music2.isPlayed = false;
                    } else {
                        music2.play();
                        music2.isPlayed = true;
                    }
                });

                function connect() {
                    console.log('connect');

                    media1.connect(distortion);
                    distortion.connect(audioContext.destination);

                    media2.connect(convolver);
                    convolver.connect(audioContext.destination);
                }

                // c.f. http://stackoverflow.com/a/22538980
                function impulseResponse(duration, decay, reverse) {
                    var sampleRate = audioContext.sampleRate;
                    var length = sampleRate * duration;
                    var impulse = audioContext.createBuffer(2, length, sampleRate);
                    var impulseL = impulse.getChannelData(0);
                    var impulseR = impulse.getChannelData(1);

                    if (!decay)
                        decay = 2.0;
                    for (var i = 0; i < length; i++){
                        var n = reverse ? length - i : i;
                        impulseL[i] = (Math.random() * 2 - 1) * Math.pow(1 - n / length, decay);
                        impulseR[i] = (Math.random() * 2 - 1) * Math.pow(1 - n / length, decay);
                    }
                    return impulse;
                }

                // c.f. http://stackoverflow.com/a/22313408
                function makeDistortionCurve(amount) {
                    var k = typeof amount === 'number' ? amount : 50,
                        n_samples = 44100,
                        curve = new Float32Array(n_samples),
                        deg = Math.PI / 180,
                        i = 0,
                        x;
                    for ( ; i < n_samples; ++i ) {
                        x = i * 2 / n_samples - 1;
                        curve[i] = ( 3 + k ) * x * 20 * deg / ( Math.PI + k * Math.abs(x) );
                    }
                    return curve;
                };

            })();
        </script>
    </body>
 </html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>Web Audio Test</title>
	</head>
	<body>
	<h1>Web Audio Test</h1>
	<div>
	<audio id="music1" src="http://1.ice1.firststreaming.com:8000/gndr_fm.mp3" loop></audio>
	<audio id="music2" src="http://144.76.39.90:8000/albayane.mp3" loop></audio>
	</div>
	<button id="button1">play music1</button>
	<button id="button2">play music2</button>
	<script>
	(function() {
	var music1 = document.getElementById('music1');
	var music2 = document.getElementById('music2');
	music1.isPlayed = false;
	music2.isPlayed = false;

	window.AudioContext = window.AudioContext \|\| window.webkitAudioContext;
	var audioContext = new AudioContext();

	var convolver = audioContext.createConvolver();
	convolver.buffer = impulseResponse(4, 4, false);

	var distortion = audioContext.createWaveShaper();
	distortion.curve = makeDistortionCurve(400);

	var media1 = audioContext.createMediaElementSource(music1);
	var media2 = audioContext.createMediaElementSource(music2);

	music1.readyState < 3 ?
	music1.addEventListener('canplay', connect) :
	connect();

	var button1 = document.getElementById('button1');
	button1.addEventListener('click', function(event) {
	if (music1.isPlayed) {
	music1.pause();
	music1.isPlayed = false;
	} else {
	music1.play();
	music1.isPlayed = true;
	}
	});

	var button2 = document.getElementById('button2');
	button2.addEventListener('click', function(event) {
	if (music2.isPlayed) {
	music2.pause();
	music2.isPlayed = false;
	} else {
	music2.play();
	music2.isPlayed = true;
	}
	});

	function connect() {
	console.log('connect');

	media1.connect(distortion);
	distortion.connect(audioContext.destination);

	media2.connect(convolver);
	convolver.connect(audioContext.destination);
	}

	// c.f. http://stackoverflow.com/a/22538980
	function impulseResponse(duration, decay, reverse) {
	var sampleRate = audioContext.sampleRate;
	var length = sampleRate * duration;
	var impulse = audioContext.createBuffer(2, length, sampleRate);
	var impulseL = impulse.getChannelData(0);
	var impulseR = impulse.getChannelData(1);

	if (!decay)
	decay = 2.0;
	for (var i = 0; i < length; i++){
	var n = reverse ? length - i : i;
	impulseL[i] = (Math.random() * 2 - 1) * Math.pow(1 - n / length, decay);
	impulseR[i] = (Math.random() * 2 - 1) * Math.pow(1 - n / length, decay);
	}
	return impulse;
	}

	// c.f. http://stackoverflow.com/a/22313408
	function makeDistortionCurve(amount) {
	var k = typeof amount === 'number' ? amount : 50,
	n_samples = 44100,
	curve = new Float32Array(n_samples),
	deg = Math.PI / 180,
	i = 0,
	x;
	for ( ; i < n_samples; ++i ) {
	x = i * 2 / n_samples - 1;
	curve[i] = ( 3 + k ) * x * 20 * deg / ( Math.PI + k * Math.abs(x) );
	}
	return curve;
	};

	})();
	</script>
	</body>
	</html>
No results found