KilledByAPixel/LittleJS

bug: touchend event problem.

akira-cn opened this issue · 3 comments

The touchend event seems to be cancelable on mobile phones.

So the following code will prevent the page focus back sometime.

// try to enable touch mouse
if (isTouchDevice)
{
    // handle all touch events the same way
    let wasTouching, hadTouchInput;
    ontouchstart = ontouchmove = ontouchend = (e)=>
    {
        e.button = 0; // all touches are left click

        // check if touching and pass to mouse events
        const touching = e.touches.length;
        if (touching)
        {
            hadTouchInput || zzfx(0, hadTouchInput=1) ; // fix mobile audio, force it to play a sound the first time

            // set event pos and pass it along
            e.x = e.touches[0].clientX;
            e.y = e.touches[0].clientY;
            wasTouching ? onmousemove(e) : onmousedown(e);
        }
        else if (wasTouching)
            onmouseup(e);

        // set was touching
        wasTouching = touching;

        // prevent normal mouse events from being called
        return !e.cancelable; // 💥 touchend return false
    }
}

Maybe should not clearInput when touch devices lose focus?

function inputUpdate {
    // clear input when lost focus (prevent stuck keys)
    isTouchDevice || document.hasFocus() || clearInput();

    // update mouse world space position
    mousePos = screenToWorld(mousePosScreen);

    // update gamepads if enabled
    gamepadsUpdate();
}

Ok, I will look into it. Which phone do you know is having the problem?

The input needs to be cleared on focus lost to prevent keys from getting stuck. Do you think that is related?

fixed! it now returns true from the on touch events. this fixes a bunch of problems we were seeing on mobile devices.