JQuery мобильных нескольких событий, таких как Keyup/ KeyDown

Question

В настоящее время я занимаюсь разработкой html5-игры как для мобильных, так и для мобильных устройств.

Пользовательский интерфейс работает прямо сейчас для мобильных устройств, когда вы удерживаете правую часть экрана, персонаж перемещается вправо. Удерживая левый конец, персонаж уходит влево. Нажмите на середину экрана, чтобы стрелять и проведите вверх, чтобы прыгать. Все это отлично работает.

Тем не менее, я хотел бы, чтобы при движении вправо пользователь мог коснуться экрана, чтобы сделать снимок, или проведите пальцем, чтобы прыгать. Например, в немобильной версии, удерживая нажатой клавишу со стрелкой вправо, если вы одновременно нажмете верхнюю стрелку, вы будете прыгать при движении вправо. События не блокируют друг друга. Тем не менее, с сенсорными событиями кажется, что вы можете стрелять только по одному за раз. Если я держу правую сторону, чтобы бежать, а затем нажмите, плохо остановить бег. На самом деле, я тоже не буду стрелять, так что, похоже, два события просто отменяют друг друга.

Я не уверен, является ли это семантической ошибкой, или если это невозможно, но любые предложения / помощь будут высоко оценены. Если это невозможно сделать с помощью событий jQuery, возможно, есть какой-то изобретательный способ, которым я мог бы сделать это с помощью JS или фреймворка?

Вот код для событий, если он помогает вообще:

$(document).on('touchstart', '#game', function(e) {
                        //x coordinate of touch
                        var touchX = e.originalEvent.touches[0].pageX;
                    `enter code here`    //what part of the canvas are we touching?
                        var leftSide = touchX <= .10 * width; //left 10% of width
                        var rightSide = touchX >= .90 * width; //right 10% of width
                        if (leftSide || rightSide) {
                            //if they are jumping or shooting they cant do anything but jump unless they are in the air
                            if ((player.currentAction !== 'jumping' || (player.currentAction === 'jumping' && (player.y === groundLocation || !noObstacleCollisions(player))))) {
                                var action;
                                if (leftSide) action = 'moving left';
                                else if (rightSide) action = 'moving right';
                                player.action(action);
                                player.lastAction = action;
                                //dont add duplicate actions, since keyup is constantly called when held down
                                if (!inArray(player.currentActions, action)) {
                                    player.currentActions.push(action);
                                }
                            }
                        }
                    });
                    //when tap is released update current actions
                    $(document).on('touchend', '#game', function() {
                        //if we're moving left or right stop when we let go of the key
                        //also make sure we're either on the ground or on a platform when we do that
                        //we dont want to break midair trajectory
                        var movingLeftOrRight = player.vx !== 0;
                        if (movingLeftOrRight && (!noObstacleCollisions(player) || player.y === groundLocation)) {
                            player.action('standing'); //stop player
                        }
                        //remove action associated with key
                        if (player.vx > 0) removeFromArray(player.currentActions, 'moving right');
                        if (player.vx < 0) removeFromArray(player.currentActions, 'moving left');
                        if (movingLeftOrRight) player.lastAction = null;
                    });
                    //jump up when swiping up
                    $(document).on('swipeup', '#game', function() {
                        if ((player.currentAction !== 'jumping' || (player.currentAction === 'jumping' && (player.y === groundLocation || !noObstacleCollisions(player)))))
                            player.action('jumping');
                    });
                    //fire on middle screen tap (not touchstart to not conflict with jumping)
                    $(document).on('tap', '#game', function(e) {
                        var leftSide = e.pageX <= .10 * width; //left 10% of width
                        var rightSide = e.pageX >= .90 * width; //right 10% of width
                        if (!(leftSide || rightSide)) {
                            player.action('shooting');
                        }
                    });

Спасибо!