[SOLVED] Mouse Stuck with scroll view

Hi.

Scenario:
I have 150 buttons placed in a scroll view for opening levels.
When a button is pressed, the scroll view entity is disabled and the level entity is enabled.
When I come back from level, the mouse is now stuck with scroll view: moving mouse up and down moves scroll view without pressing on mouse left button.

Is there any way I can refresh scrollview to release any click event on it?

Are you doing the disabling the scroll view on mouse down or click event?

Yes

Which of the two events are you listening for?

On click event exactly like this: But it is not getting stuck here
https://playcanvas.com/editor/scene/1280104

Also you can reproduce here
https://launch.playcanvas.com/1239724?debug=true

The project has a weird issue that after a game, the browser window event ‘mouseup’ doesn’t fire when clicking on the game area. I can’t figure out why as it’s super weird.

Does something in the game changes/adds DOM element?

One thing I had is layers in UI and nothing edits DOM

Looking at the code:

SwipeEvent.prototype.onTouchStart = function(ev) {
    var touch = ev.changedTouches[0];
    this.touchId = touch.identifier;
    this.startDrag( ev.x, ev.y );
    ev.event.stopPropagation();
};

SwipeEvent.prototype.onTouchEnd = function(ev) {
    for(var i=0; i< ev.changedTouches.length; i++ ) 
    {
        var t = ev.changedTouches[i];
        if( t.id == this.touchId )
        {
            ev.event.stopImmediatePropagation();
            this.touchId = -1;
            this.endDrag( t.x, t.y );
            return;
        }
    }
};


SwipeEvent.prototype.onPressDown = function(ev) {
    ev.event.stopImmediatePropagation();
    this.startDrag(ev.x,ev.y);
};

SwipeEvent.prototype.onPressUp = function(ev) {
    ev.event.stopImmediatePropagation();
    this.endDrag(ev.x,ev.y);
};

When I get back to level screen, the mouse up event from here is still triggering when clicking on the map.

The ev.event.stopImmediatePropagation(); call prevents the level selector event listener for mouseup frome being called.

Whatever the entity that the SwipeEvent script is on is not getting destroyed so the event listeners aren’t being removed. Are the entities only being disabled instead?

Swipe event is in levels, is not on game. But does that makes any difference? As it is only to check levels

Yes because the mouseup event listener in SwipeEvent wasn’t removed when the person returns to the level select screen. This means that ev.event.stopImmediatePropagation() is being called and preventing the scroll view from listening to mouseup to stop dragging

Using simple stopPropagation will help? instead of immediate?

The fix would be to remove the mouseup event listener on SwipeEvent correctly. Is the entity it’s attached to disabled or destroyed when the user is returned to the main menu?

Yes, entity is disabled, as it is inside the level

Then it will need to add/remove the mouse/touch listeners on the disable and enable events.

https://developer.playcanvas.com/api/pc.ScriptType.html#event:disable

Oh ok, I got it let me do this in the way you told

Yes, fixed. Thanks a lot :slight_smile:

1 Like