TinyMCE: fix flickering inline toolbar when showing a tooltip. Take two.
Fixes #44911. git-svn-id: https://develop.svn.wordpress.org/trunk@45620 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
parent
ec2942e03e
commit
944595cb9d
@ -788,7 +788,8 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
|
|||||||
mceIframe = document.getElementById( editor.id + '_ifr' ),
|
mceIframe = document.getElementById( editor.id + '_ifr' ),
|
||||||
mceToolbar,
|
mceToolbar,
|
||||||
mceStatusbar,
|
mceStatusbar,
|
||||||
wpStatusbar;
|
wpStatusbar,
|
||||||
|
cachedWinSize;
|
||||||
|
|
||||||
if ( container ) {
|
if ( container ) {
|
||||||
mceToolbar = tinymce.$( '.mce-toolbar-grp', container )[0];
|
mceToolbar = tinymce.$( '.mce-toolbar-grp', container )[0];
|
||||||
@ -1104,6 +1105,9 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
|
|||||||
} );
|
} );
|
||||||
|
|
||||||
function hide( event ) {
|
function hide( event ) {
|
||||||
|
var win;
|
||||||
|
var size;
|
||||||
|
|
||||||
if ( activeToolbar ) {
|
if ( activeToolbar ) {
|
||||||
if ( activeToolbar.tempHide || event.type === 'hide' || event.type === 'blur' ) {
|
if ( activeToolbar.tempHide || event.type === 'hide' || event.type === 'blur' ) {
|
||||||
activeToolbar.hide();
|
activeToolbar.hide();
|
||||||
@ -1114,6 +1118,34 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
|
|||||||
event.type === 'resize' ||
|
event.type === 'resize' ||
|
||||||
event.type === 'scroll'
|
event.type === 'scroll'
|
||||||
) && ! activeToolbar.blockHide ) {
|
) && ! activeToolbar.blockHide ) {
|
||||||
|
// Showing a tooltip may trigger a `resize` event in Chromium browsers.
|
||||||
|
// That results in a flicketing inline menu; tooltips are shown on hovering over a button,
|
||||||
|
// which then hides the toolbar on `resize`, then it repeats as soon as the toolbar is shown again.
|
||||||
|
if ( event.type === 'resize' || event.type === 'resizewindow' ) {
|
||||||
|
win = editor.getWin();
|
||||||
|
size = win.innerHeight + win.innerWidth;
|
||||||
|
|
||||||
|
// Reset old cached size.
|
||||||
|
if ( cachedWinSize && ( new Date() ).getTime() - cachedWinSize.timestamp > 2000 ) {
|
||||||
|
cachedWinSize = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( cachedWinSize ) {
|
||||||
|
if ( size && Math.abs( size - cachedWinSize.size ) < 2 ) {
|
||||||
|
// `resize` fired but the window hasn't been resized. Bail.
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// First of a new series of `resize` events. Store the cached size and bail.
|
||||||
|
cachedWinSize = {
|
||||||
|
timestamp: ( new Date() ).getTime(),
|
||||||
|
size: size,
|
||||||
|
};
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
clearTimeout( timeout );
|
clearTimeout( timeout );
|
||||||
|
|
||||||
timeout = setTimeout( function() {
|
timeout = setTimeout( function() {
|
||||||
@ -1136,16 +1168,15 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
|
|||||||
// This will hide/reposition the toolbar on any scrolling in the document.
|
// This will hide/reposition the toolbar on any scrolling in the document.
|
||||||
document.addEventListener( 'scroll', hide, true );
|
document.addEventListener( 'scroll', hide, true );
|
||||||
} else {
|
} else {
|
||||||
editor.dom.bind( editor.getWin(), 'scroll', hide );
|
// Bind to the editor iframe and to the parent window.
|
||||||
|
editor.dom.bind( editor.getWin(), 'resize scroll', hide );
|
||||||
// For full height iframe editor.
|
|
||||||
editor.on( 'resizewindow scrollwindow', hide );
|
editor.on( 'resizewindow scrollwindow', hide );
|
||||||
}
|
}
|
||||||
|
|
||||||
editor.on( 'remove', function() {
|
editor.on( 'remove', function() {
|
||||||
document.removeEventListener( 'scroll', hide, true );
|
document.removeEventListener( 'scroll', hide, true );
|
||||||
editor.off( 'resizewindow scrollwindow', hide );
|
editor.off( 'resizewindow scrollwindow', hide );
|
||||||
editor.dom.unbind( editor.getWin(), 'scroll', hide );
|
editor.dom.unbind( editor.getWin(), 'resize scroll', hide );
|
||||||
} );
|
} );
|
||||||
|
|
||||||
editor.on( 'blur hide', hide );
|
editor.on( 'blur hide', hide );
|
||||||
|
Loading…
Reference in New Issue
Block a user