Tone.js/examples/panner.html

65 lines
1.7 KiB
HTML
Raw Normal View History

2014-04-05 00:24:19 +00:00
<html>
<head>
<title>SIGNAL PROCESSING</title>
<link rel="stylesheet" type="text/css" href="../style/GUI.css">
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="../src/core/Tone.js"></script>
<script type="text/javascript" src="../src/signal/Signal.js"></script>
<script type="text/javascript" src="../src/signal/Scale.js"></script>
<script type="text/javascript" src="../src/signal/Invert.js"></script>
<script type="text/javascript" src="../src/signal/Mono.js"></script>
<script type="text/javascript" src="../src/signal/Stereo.js"></script>
<script type="text/javascript" src="../src/component/DryWet.js"></script>
<script type="text/javascript" src="../src/component/Panner.js"></script>
<script type="text/javascript" src="../src/component/Meter.js"></script>
<script type="text/javascript" src="../src/component/LFO.js"></script>
</head>
<body>
<style type="text/css">
</style>
<input type='range' value='50'>
<div id='left'>0</div>
<div id='right'>0</div>
<script type="text/javascript">
//panner
var pan = new Tone.Panner();
//input signals
var sine = Tone.context.createOscillator();
sine.start(0);
//connect it up
sine.connect(pan);
pan.toMaster();
//meters
var output = new Tone.Meter(2);
//meter the outputs
pan.connect(output);
var $left = $("#left");
var $right = $("#right");
setInterval(function(){
$left.html("left: " + output.getDb(0).toFixed(2) + " db");
$right.html("right: " + output.getDb(1).toFixed(2) + " db");
}, 100);
var range = $("input")[0];
range.onchange = function(){
var val = range.value;
var now = pan.now();
pan.setPan(val/50 - 1);
}
</script>
</body>
</html>