   @wcp: (n) ->
     floor((n + 7) / 12 * 7)
 
+  # the inverse of wcp: given a wcp number,
+  # translates to a midi key position.
+  @mcp: (n) ->
+    ceil(n / 7 * 12) - 7
+
   # A code for the shape of the key number.
   # C,D,E,F,G,A,B are 1,2,3,4,5,6,7 and
   # C#,D#,F#,G#,A# are 8,9,10,11,12.
   @keyshape: (n) ->
-    [1,8,2,9,3,4,10,5,11,6,12,7][n % 12]
+    [1,8,2,9,3,4,10,5,11,6,12,7][((n % 12) + 12) % 12]
 
   # A colorful color to use for the key number.
   @keycolor: (n) ->

    # Here we compute it exactly for white keys and get
    # the closest white key position for black keys.
    # Black keys will further modify startx below.
    startx = @hlw + @kw * Keyboard.wcp(n) - @horiz.left
    starty = @hlw
    ks = Keyboard.keyshape(n)
    # key shapes are modified for the lowest
    # and highest keys on the piano.

      return
    if not fillcolor?
      if Keyboard.keyshape(n) >= 8
        fillcolor = @blackColor
      else
        fillcolor = @color
    ctx = @canvas().getContext '2d'
    ctx.save()
    ctx.beginPath()
    @keyoutline(ctx, n)
    ctx.fillStyle = fillcolor
    ctx.strokeStyle = @lineColor
    ctx.lineWidth = @lineWidth
    ctx.fill()
    ctx.stroke()
    ctx.restore()
