Simulate mouse event using touch on threejs

i’m creating this app https://custom.speedjersey.com/designer/index.html?token=OUlDNC9EVXErTEhOTkNjRDVCekZRZz09 for designing a jersey. Now, it’s working just fine using desktop, but i wanted to make it work on mobile too. Selecting the text and logo is fine,but i can’t move the text and logo around.

here’s how i try to move the object

    if (e.target !== this.upperCanvasEl) {
        var positionOnScene;
        if (isMobile == true) {
            positionOnScene = getPositionOnSceneTouch(raycastContainer, e);
            if (positionOnScene) {
                pointer.x = positionOnScene.x;
                pointer.y = positionOnScene.y;
            }
        } else {
            positionOnScene = getPositionOnScene(raycastContainer, e);
            if (positionOnScene) {
                pointer.x = positionOnScene.x;
                pointer.y = positionOnScene.y;
            }
        }
    }

on desktop it’s working since its event was mousemove but on mobile the event was touchmove but it didn’t move.

here’s how i get the position of an object on mobile

function getPositionOnSceneTouch(sceneContainer, evt) {
    var array = getMousePosition(sceneContainer, evt.changedTouches[0].clientX, evt.changedTouches[0].clientY);
    onClickPosition.fromArray(array);
    var intersects = getIntersects(onClickPosition, object.children);
    if (intersects.length > 0 && intersects[0].uv) {
        var uv = intersects[0].uv;
        intersects[0].object.material.map.transformUv(uv);
        return {
            x: getRealPosition("x", uv.x),
            y: getRealPosition("y", uv.y),
        };
    }
    return null;
}

and here’s on desktop

function getPositionOnScene(sceneContainer, evt) {
    var array = getMousePosition(sceneContainer, evt.clientX, evt.clientY);
    onClickPosition.fromArray(array);
    var intersects = getIntersects(onClickPosition, object.children);
    if (intersects.length > 0 && intersects[0].uv) {
        var uv = intersects[0].uv;
        intersects[0].object.material.map.transformUv(uv);
        return {
            x: getRealPosition("x", uv.x),
            y: getRealPosition("y", uv.y),
        };
    }
    return null;
}

the difference is only on clientX & Y value.

i was thinking that here’s the problem begins

function onTouch(evt) {
    evt.preventDefault();
    const positionOnScene = getPositionOnSceneTouch(raycastContainer, evt);
    if (positionOnScene) {
        const canvasRect = canvas._offset;
        const simEvt = new MouseEvent(evt.type, {
            clientX: canvasRect.left + positionOnScene.x,
            clientY: canvasRect.top + positionOnScene.y,
        });
        canvas.upperCanvasEl.dispatchEvent(simEvt);
    }
}

here i use touch but i register the event as mouseevent. Should i change it to touchevent? any thought would be very helpful