     bgColor = "rgb(#{Math.round(x * 255)}, 40, #{Math.round(y * 255)})"
     document.body.style.backgroundColor = bgColor
 
+  getXYFromEvent = (e) ->
+    if e.touches?
+      touch =  e.touches[0]
+      rawX = touch.pageX
+      rawY = touch.pageY
+    else
+      rawX = e.pageX
+      rawY = e.pageY
+    x = rawX / window.innerWidth
+    y = rawY / window.innerHeight
+    return rawX: rawX, rawY: rawY, x: x, y: y
+
   Template.controller.events
     'mousedown .controller, touchstart .controller, touchmove .controller': \
         (e) ->
-      if e.touches?
-        touch =  e.touches[0]
-        rawX = touch.pageX
-        rawY = touch.pageY
-      else
-        rawX = e.pageX
-        rawY = e.pageY
-      x = rawX / window.innerWidth
-      y = rawY / window.innerHeight
-      sendChat x: x, y: y
+      e.preventDefault()
+      {rawX, rawY, x, y} = getXYFromEvent(e)
+      sendChat x: x, y: y, noteOn: true
       if window.innerWidth != canvas.width
         canvas.width = window.innerWidth
         canvas.height = window.innerHeight

    noteFrequencyHz = 27.5 * Math.pow(2, (midiNoteNumber - 21) / 12)
    @vco.frequency.value = noteFrequencyHz
    @vca.gain.value = 1
    window.setTimeout((=>
      @vca.gain.value = 0), 50)

  _createVco: ->
    vco = @audioContext.createOscillator()


IMAGE_SIZE = 64
FACE_SIZE = 128
NUM_KEYBOARD_NOTES = 127
KEYBOARD_START = 0

rgb2Color = (r,g,b) ->
  "rgb(#{r},#{g},#{b})"
