updated polymer version, added touch and pointer debugging switching

rowild · Nov 11, 2013 · 0446f0d · 0446f0d
1 parent af830c2
commit 0446f0d
Show file tree

Hide file tree

Showing 6 changed files with 80 additions and 75 deletions.
diff --git a/index.html b/index.html
@@ -6,7 +6,7 @@
 	<title>Web Audio MIDI Synthesizer</title>
 	<link href='http://fonts.googleapis.com/css?family=Syncopate:400,700' rel='stylesheet' type='text/css'>
     <link rel="stylesheet" type="text/css" href="styles/main.css">
-    <script src="js/polymer.min.js"></script>
+    <script src="js/polymer-v0.0.20131107.min.js"></script>
     <link rel="import" href="webcomponents/controls.html">
 
     <!-- Set up Web MIDI polyfill -->

diff --git a/js/midi.js b/js/midi.js
@@ -68,6 +68,7 @@ function onMIDISystemError( err ) {
 
 //init: start up MIDI
 window.addEventListener('load', function() {   
-  navigator.requestMIDIAccess().then( onMIDIStarted, onMIDISystemError );
+  if (navigator.requestMIDIAccess)
+    navigator.requestMIDIAccess().then( onMIDIStarted, onMIDISystemError );
 
 });
diff --git a/js/polymer-v0.0.20131107.min.js b/js/polymer-v0.0.20131107.min.js
diff --git a/js/polymer.min.js b/js/polymer.min.js
diff --git a/js/synth.js b/js/synth.js
@@ -674,7 +674,9 @@ function touchcancel( ev ) {
 
 function pointerDown( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointer down: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointer down: id: " + ev.pointerId
+			+ " target: " + ev.target.id + " note:" + note );
 	if (!isNaN(note)) {
 		noteOn( note + 12*(3-currentOctave), 0.75 );
 		var keybox = document.getElementById("keybox")
@@ -685,11 +687,9 @@ function pointerDown( ev ) {
 
 function pointerMove( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointer move: id: " + ev.pointerId 
-		+ " target: " + ev.target.id
-		+ " currentTarget: " + ev.currentTarget.id
-		+ " srcElement: " + ev.srcElement.id
-		+ " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointer move: id: " + ev.pointerId 
+			+ " target: " + ev.target.id + " note:" + note );
 	if (!isNaN(note) && pointers[ev.pointerId] && pointers[ev.pointerId]!=note) {
 		if (pointers[ev.pointerId])
 			noteOff(pointers[ev.pointerId] + 12*(3-currentOctave));
@@ -701,42 +701,45 @@ function pointerMove( ev ) {
 
 function pointerUp( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointer up: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointer up: id: " + ev.pointerId + " note:" + note );
 	if (note != NaN)
 		noteOff( note + 12*(3-currentOctave) );
 	pointers[ev.pointerId]=null;
 	var keybox = document.getElementById("keybox")
 	ev.preventDefault();
 }
 
-
-/*
 function pointerOver( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointerover: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointerover: id: " + ev.pointerId + " note:" + note );
 	ev.preventDefault();
 }
 function pointerOut( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointerout: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointerout: id: " + ev.pointerId + " note:" + note );
 	ev.preventDefault();
 }
 function pointerEnter( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointerenter: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointerenter: id: " + ev.pointerId + " note:" + note );
 	ev.preventDefault();
 }
 function pointerLeave( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointerleave: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointerleave: id: " + ev.pointerId + " note:" + note );
 	ev.preventDefault();
 }
 function pointerCancel( ev ) {
 	var note = parseInt( ev.target.id.substring( 1 ) );
-	console.log( "pointercancel: id: " + ev.pointerId + " note:" + note );
+	if (pointerDebugging)
+		console.log( "pointercancel: id: " + ev.pointerId + " note:" + note );
 	ev.preventDefault();
 }
-*/
 
 function onChangeOctave( ev ) {
 	currentOctave = ev.target.selectedIndex;

diff --git a/js/ui.js b/js/ui.js
@@ -1,4 +1,5 @@
 var synthBox = null;
+var pointerDebugging = false;
 
 function testChange(e) {
 	console.log("test");
@@ -68,8 +69,11 @@ function createDropdown( id, label, x, y, values, selectedIndex, onChange ) {
 	var select = document.createElement( "select" );
 	select.className = "dropdownSelect";
 	select.id = id;
-	for (var i=0; i<values.length; i++)
-		select.options[i] = new Option(values[i]);
+	for (var i=0; i<values.length; i++) {
+		var opt = document.createElement("option");
+		opt.appendChild(document.createTextNode(values[i]));
+		select.appendChild(opt);
+	}
 	select.selectedIndex = selectedIndex;
 	select.onchange = onChange;
 	container.appendChild( select );
@@ -147,25 +151,21 @@ function setupSynthUI() {
 	synthBox.appendChild( master );
 
 	keybox = document.getElementById("keybox");
-/*
-	keybox.addEventListener('touchstart', touchstart);
-	keybox.addEventListener('touchmove', touchmove);
-	keybox.addEventListener('touchend', touchend);
-*/
-	keybox.addEventListener('pointerdown', pointerDown);
-	keybox.addEventListener('pointermove', pointerMove);
-	keybox.addEventListener('pointerup', pointerUp);
 
-/*
-	keybox.addEventListener('pointerover', pointerOver);
-	keybox.addEventListener('pointerout', pointerOut);
-	keybox.addEventListener('pointerenter', pointerEnter);
-	keybox.addEventListener('pointerleave', pointerLeave);
-	keybox.addEventListener('pointercancel', pointerCancel);
-*/
-	var keys = document.querySelectorAll( ".key" );
-	for (var i=0; i<keys.length; i++) {
-//		keys[i].addEventListener('pointerdown', pointerDown);
-//		keys[i].addEventListener('pointerup', pointerUp);
+	if (window.location.search.substring(1) == "touch") {
+		keybox.addEventListener('touchstart', touchstart);
+		keybox.addEventListener('touchmove', touchmove);
+		keybox.addEventListener('touchend', touchend);
+	} else {
+		keybox.addEventListener('pointerdown', pointerDown);
+		keybox.addEventListener('pointermove', pointerMove);
+		keybox.addEventListener('pointerup', pointerUp);
+		keybox.addEventListener('pointerover', pointerOver);
+		keybox.addEventListener('pointerout', pointerOut);
+		keybox.addEventListener('pointerenter', pointerEnter);
+		keybox.addEventListener('pointerleave', pointerLeave);
+		keybox.addEventListener('pointercancel', pointerCancel);
+		if (window.location.search.substring(1) == "dbgptr")
+			pointerDebugging = true;
 	}
 }