addTouch.js

$.getScript('https://github.com/gilmoreorless/jquery-nearest/raw/master/jquery.nearest.min.js');
$('#stdKeyboard').hide()
$('#stenoKeyboard').css({
    width: '95%',
    height: '50%',
    left: '1%'
});

function sendKey(keyDiv, dir) {
    var e = $.Event(dir);
    e.which = $(keyDiv).attr('class').replace(/^\D*code(\d+).*$/, '$1');
    $(document).trigger(e);
}

var oldKeys = $();

function updateKeys(touches, r) {
    var newKeys = $()
    $.map(touches, function (t) {
        newKeys = newKeys.add($('.stenoKey').touching({
            x: t.pageX - r,
            y: t.pageY - r,
            w: 2 * r,
            h: 2 * r
        }))
    });
    console.log(newKeys);
    newKeys.not(oldKeys).each(function () {
        sendKey(this, 'keydown')
    });
    oldKeys.not(newKeys).each(function () {
        sendKey(this, 'keyup')
    });
    oldKeys = newKeys;
    return newKeys.length;
}

$('#stenoKeyboard').bind('touchstart touchmove touchend', function (e) {
    updateKeys(e.originalEvent.touches, ($(this).width() / 100));
    e.preventDefault();
});