Tone.js/examples/panner.html

57 lines
No EOL
1.2 KiB
HTML

<html>
<head>
<title>PANNER</title>
<script type="text/javascript" src="../build/Tone.js"></script>
</head>
<body>
<button type="button">start</button>
<input type='range' value='50'>
<div id='left'>0</div>
<div id='right'>0</div>
<script type="text/javascript">
var pan = new Tone.Panner();
var sine = new Tone.Oscillator();
//connect it up
sine.connect(pan);
pan.toMaster();
//meters
var outputMeter = new Tone.Meter(2);
pan.connect(outputMeter);
//INTERFACE//
var button = document.querySelector("button");
button.onclick = function(){
if (!sine.started){
sine.start();
button.textContent = "stop";
} else {
sine.stop();
button.textContent = "start";
}
}
var left = document.querySelector("#left");
var right = document.querySelector("#right");
setInterval(function(){
left.textContent = "left: " + outputMeter.getDb(0).toFixed(2) + " db";
right.textContent = "right: " + outputMeter.getDb(1).toFixed(2) + " db";
}, 100);
var range = document.querySelector("input");
range.onchange = function(){
var val = range.value;
pan.setPan(val/100, "+.1");
}
</script>
</body>
</html>