ptsefton/katana-midi-controller.html

## katana-midi-controller.html
<script src="https://cdn.jsdelivr.net/npm/webmidi"></script>

<body>

        <style>
                body {
                  background-color: #000000;

                }
                button {
                    background-color: #FF00FF;
                    color: #FFFF00;
                    font-size: xx-large;
                }

                </style>
<script>
// mid = WebMidi.enable(function (err) {
//     console.log(WebMidi.inputs);
//     console.log(WebMidi.outputs);
//     console.log(output);
//     //output.sendReset();
//     //output.sendProgramChange(2);

// });


// var output = WebMidi.getOutputByName("KATANA");
// output.sendProgramChange(0);


// 6 2b
// 12 - panel


let midiOutput;
let button;

function setup() {
  //noCanvas();

  button = createButton("1: Dirty", width/2, height/2);
  button.mousePressed(button1Pressed);
}

function buttonPressed(num){
	if(midiOutput){
		// Play note "C2" on channel 10 for half a second and with 0.5 velocity
  	     // (a noteOff message will be sent in half a second)
		midiOutput.sendProgramChange(num);
	}
	else{
		console.log("Looks like there is no MIDI output device. Check if your Arduino is connected.");
	}

}

WebMidi.enable(function (err) {
  if (err) {
    console.log("WebMidi could not be enabled.", err);
  }

  // Print available MIDI outputs
  for(let i = 0; i < WebMidi.outputs.length; i++){
  	console.log(WebMidi.outputs[i].name);
  }

  // From the list on the console, pick an output name:
  // midiOutput = WebMidi.getOutputByName("IAC Driver IAC Bus 1");
  midiOutput = WebMidi.getOutputByName("KATANA");


});


</script>


<button onClick="buttonPressed(0)">1a: Clean Channel</button>
<button onClick="buttonPressed(1)">2a: Country Channel</button>
<button onClick="buttonPressed(2)">2b: Trippy Channel</button>
<button onClick="buttonPressed(3)">3b Dirty Blues Channel</button>
<button onClick="buttonPressed(4)">Front Panel Channel</button>
	<script src="https://cdn.jsdelivr.net/npm/webmidi"></script>

	<body>

	<style>
	body {
	background-color: #000000;

	}
	button {
	background-color: #FF00FF;
	color: #FFFF00;
	font-size: xx-large;
	}

	</style>
	<script>
	// mid = WebMidi.enable(function (err) {
	// console.log(WebMidi.inputs);
	// console.log(WebMidi.outputs);
	// console.log(output);
	// //output.sendReset();
	// //output.sendProgramChange(2);

	// });


	// var output = WebMidi.getOutputByName("KATANA");
	// output.sendProgramChange(0);



	// 6 2b
	// 12 - panel


	let midiOutput;
	let button;

	function setup() {
	//noCanvas();

	button = createButton("1: Dirty", width/2, height/2);
	button.mousePressed(button1Pressed);
	}

	function buttonPressed(num){
	if(midiOutput){
	// Play note "C2" on channel 10 for half a second and with 0.5 velocity
	// (a noteOff message will be sent in half a second)
	midiOutput.sendProgramChange(num);
	}
	else{
	console.log("Looks like there is no MIDI output device. Check if your Arduino is connected.");
	}

	}

	WebMidi.enable(function (err) {
	if (err) {
	console.log("WebMidi could not be enabled.", err);
	}

	// Print available MIDI outputs
	for(let i = 0; i < WebMidi.outputs.length; i++){
	console.log(WebMidi.outputs[i].name);
	}

	// From the list on the console, pick an output name:
	// midiOutput = WebMidi.getOutputByName("IAC Driver IAC Bus 1");
	midiOutput = WebMidi.getOutputByName("KATANA");


	});


	</script>


	<button onClick="buttonPressed(0)">1a: Clean Channel</button>
	<button onClick="buttonPressed(1)">2a: Country Channel</button>
	<button onClick="buttonPressed(2)">2b: Trippy Channel</button>
	<button onClick="buttonPressed(3)">3b Dirty Blues Channel</button>
	<button onClick="buttonPressed(4)">Front Panel Channel</button>