OpenLayers – How to Temporarily Disable Map Click Event

eventsjavascriptopenlayers

How can I disable map click event?
My idea is to disable it when I am positioned with mouse over my popup container. After I move mouse out of it, I want that event to be enabled again. Something like this:

container=document.getElementById('popup')
container.addEventListener('mouseover',function(){
                 //disable map click event
}

container.addEventListener('mouseout,function(){
                 //enable it again
}

Is this possible?

Best Answer

I had a similar issue with a search box (which for historical reasons wasn't a control, simply a div above the map). Mouse interactions on features were easy to disable and re-enable, but for map click events I resorted to setting and testing a mouseOver var.

var mouseOver = false;

searchBox.onmouseover = function() {
    map.getInteractions().forEach(function(interaction){interaction.setActive(false);});
    mouseOver = true;
};

searchBox.onmouseout = function() {
    map.getInteractions().forEach(function(interaction){interaction.setActive(true);});
    mouseOver = false;
};

map.on('singleclick', function(evt) {

    if (mouseOver) { return; }

    ...
    ...
    ...

};