drart/flocking_isobel_nexus.html

## flocking_isobel_nexus.html
<!DOCTYPE html>
<head>
  <title>Nexus + Flocking</title>
  <script src="../node_modules/nexusui/dist/NexusUI.js"></script>
  <script src="../node_modules/flocking/dist/flocking-all.min.js"></script>
</head>

<body>

  <div id="panner"></div>
  <div id="l1"> </div>
  <div id="l2"> </div>
  <div id="l3"> </div>
  <div id="l4"> </div>
  <div id="l5"> </div>

  <script>

      flock.init({
          chans: 8
      });

      var synth = flock.synth({
          synthDef: [
            {
              id: "0",
              ugen: "flock.ugen.sinOsc",
              freq: 200,
              mul: 0
            },
            {
              id: "1",
              ugen: "flock.ugen.sinOsc",
              freq: 201,
              mul: 0
            },
            {
              id: "2",
              ugen: "flock.ugen.sinOsc",
              freq: 202,
              mul: 0
            },
            {
              id: "3",
              ugen: "flock.ugen.sinOsc",
              freq: 203,
              mul: 0
            },
            {
              id: "4",
              ugen: "flock.ugen.sinOsc",
              freq: 204,
              mul: 0
            }
          ]
      });

      const TWO_PI = Math.PI*2;

      var isobel = [];
      for (var i = 0 ; i < 5 ; i++){
        var rads = (i/5) * TWO_PI;
        var x = 0.5 * Math.cos( rads ) + 0.5;
        var y = 0.5 * Math.sin( rads ) + 0.5;
        var polk = [x, y];
        isobel.push(polk);
      }

      var panner = new Nexus.Pan2D("#panner", {
          'size' : [200,200],
          'range' : 0.9,
          'mode' : 'absolute',
          'speakers' :  isobel

      });

      panner.on("change", function(v){
            for (var i = 0 ; i < v.length; i ++){
                document.getElementById("l" + (i+1)).innerHTML = v[i];
                synth.set(i + '.mul', v[i]);
            }
      });
  </script>
</body>
</html>
	<!DOCTYPE html>
	<head>
	<title>Nexus + Flocking</title>
	<script src="../node_modules/nexusui/dist/NexusUI.js"></script>
	<script src="../node_modules/flocking/dist/flocking-all.min.js"></script>
	</head>

	<body>

	<div id="panner"></div>
	<div id="l1"> </div>
	<div id="l2"> </div>
	<div id="l3"> </div>
	<div id="l4"> </div>
	<div id="l5"> </div>

	<script>

	flock.init({
	chans: 8
	});

	var synth = flock.synth({
	synthDef: [
	{
	id: "0",
	ugen: "flock.ugen.sinOsc",
	freq: 200,
	mul: 0
	},
	{
	id: "1",
	ugen: "flock.ugen.sinOsc",
	freq: 201,
	mul: 0
	},
	{
	id: "2",
	ugen: "flock.ugen.sinOsc",
	freq: 202,
	mul: 0
	},
	{
	id: "3",
	ugen: "flock.ugen.sinOsc",
	freq: 203,
	mul: 0
	},
	{
	id: "4",
	ugen: "flock.ugen.sinOsc",
	freq: 204,
	mul: 0
	}
	]
	});

	const TWO_PI = Math.PI*2;

	var isobel = [];
	for (var i = 0 ; i < 5 ; i++){
	var rads = (i/5) * TWO_PI;
	var x = 0.5 * Math.cos( rads ) + 0.5;
	var y = 0.5 * Math.sin( rads ) + 0.5;
	var polk = [x, y];
	isobel.push(polk);
	}

	var panner = new Nexus.Pan2D("#panner", {
	'size' : [200,200],
	'range' : 0.9,
	'mode' : 'absolute',
	'speakers' : isobel

	});

	panner.on("change", function(v){
	for (var i = 0 ; i < v.length; i ++){
	document.getElementById("l" + (i+1)).innerHTML = v[i];
	synth.set(i + '.mul', v[i]);
	}
	});
	</script>
	</body>
	</html>