dragresize over iframe fix function concept (#3157)
Fixes stuttering of conversejs overlayed dragresize UI elements over the iframes on the parent page.
This commit is contained in:
parent
6b365458f5
commit
c3c666e568
|
@ -7,6 +7,7 @@
|
|||
- Fix `autojoin` checkbox state in MUC bookmark form
|
||||
- Remove call to `api.confirm` in `@converse/headless`
|
||||
- Generate TypeScript declaration files into `dist/types`
|
||||
- #3156: Add function to prevent drag stutter effect over iframes when resize is called in overlay mode
|
||||
|
||||
## 10.1.2 (2023-02-17)
|
||||
|
||||
|
|
|
@ -67,8 +67,31 @@ converse.plugins.add('converse-dragresize', {
|
|||
document.removeEventListener('mouseup', onMouseUp);
|
||||
}
|
||||
|
||||
/**
|
||||
* This function registers mousedown and mouseup events hadlers to
|
||||
* all iframes in the DOM when converse UI resizing events are called
|
||||
* to prevent mouse drag stutter effect which is bad user experience.
|
||||
* @function dragresizeOverIframeHandler
|
||||
* @param {Object} e - dragging node element.
|
||||
*/
|
||||
function dragresizeOverIframeHandler (e) {
|
||||
const iframes = document.getElementsByTagName('iframe');
|
||||
for (let iframe of iframes) {
|
||||
e.addEventListener('mousedown', () => {
|
||||
iframe.style.pointerEvents = 'none';
|
||||
}, { once: true });
|
||||
|
||||
e.addEventListener('mouseup', () => {
|
||||
iframe.style.pointerEvents = 'initial';
|
||||
}, { once: true });
|
||||
}
|
||||
}
|
||||
|
||||
api.listen.on('registeredGlobalEventHandlers', registerGlobalEventHandlers);
|
||||
api.listen.on('unregisteredGlobalEventHandlers', unregisterGlobalEventHandlers);
|
||||
api.listen.on('beforeShowingChatView', view => view.initDragResize().setDimensions());
|
||||
api.listen.on('startDiagonalResize', dragresizeOverIframeHandler);
|
||||
api.listen.on('startHorizontalResize', dragresizeOverIframeHandler);
|
||||
api.listen.on('startVerticalResize', dragresizeOverIframeHandler);
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue