wp/wp-includes/js/tinymce/plugins/wordpress/plugin.js
changeset 9 177826044cd9
parent 7 cf61fcea0001
child 16 a86126ab1dd4
--- a/wp/wp-includes/js/tinymce/plugins/wordpress/plugin.js	Mon Oct 14 18:06:33 2019 +0200
+++ b/wp/wp-includes/js/tinymce/plugins/wordpress/plugin.js	Mon Oct 14 18:28:13 2019 +0200
@@ -12,54 +12,65 @@
 		__ = editor.editorManager.i18n.translate,
 		$ = window.jQuery,
 		wp = window.wp,
-		hasWpautop = ( wp && wp.editor && wp.editor.autop && editor.getParam( 'wpautop', true ) );
+		hasWpautop = ( wp && wp.editor && wp.editor.autop && editor.getParam( 'wpautop', true ) ),
+		wpTooltips = false;
 
 	if ( $ ) {
 		$( document ).triggerHandler( 'tinymce-editor-setup', [ editor ] );
 	}
 
 	function toggleToolbars( state ) {
-		var iframe, initial, toolbars,
-			pixels = 0;
+		var initial, toolbars, iframeHeight,
+			pixels = 0,
+			classicBlockToolbar = tinymce.$( '.block-library-classic__toolbar' );
 
-		initial = ( state === 'hide' );
+		if ( state === 'hide' ) {
+			initial = true;
+		} else if ( classicBlockToolbar.length && ! classicBlockToolbar.hasClass( 'has-advanced-toolbar' ) ) {
+			// Show the second, third, etc. toolbar rows in the Classic block instance.
+			classicBlockToolbar.addClass( 'has-advanced-toolbar' );
+			state = 'show';
+		}
 
 		if ( editor.theme.panel ) {
 			toolbars = editor.theme.panel.find('.toolbar:not(.menubar)');
 		}
 
-		if ( ! toolbars || toolbars.length < 2 || ( state === 'hide' && ! toolbars[1].visible() ) ) {
-			return;
-		}
+		if ( toolbars && toolbars.length > 1 ) {
+			if ( ! state && toolbars[1].visible() ) {
+				state = 'hide';
+			}
 
-		if ( ! state && toolbars[1].visible() ) {
-			state = 'hide';
+			each( toolbars, function( toolbar, i ) {
+				if ( i > 0 ) {
+					if ( state === 'hide' ) {
+						toolbar.hide();
+						pixels += 34;
+					} else {
+						toolbar.show();
+						pixels -= 34;
+					}
+				}
+			});
 		}
 
-		each( toolbars, function( toolbar, i ) {
-			if ( i > 0 ) {
-				if ( state === 'hide' ) {
-					toolbar.hide();
-					pixels += 30;
-				} else {
-					toolbar.show();
-					pixels -= 30;
-				}
+		// Resize editor iframe, not needed for iOS and inline instances.
+		// Don't resize if the editor is in a hidden container.
+		if ( pixels && ! tinymce.Env.iOS && editor.iframeElement && editor.iframeElement.clientHeight ) {
+			iframeHeight = editor.iframeElement.clientHeight + pixels;
+
+			// Keep min-height.
+			if ( iframeHeight > 50  ) {
+				DOM.setStyle( editor.iframeElement, 'height', iframeHeight );
 			}
-		});
+		}
 
-		if ( pixels && ! initial ) {
-			// Resize iframe, not needed in iOS
-			if ( ! tinymce.Env.iOS ) {
-				iframe = editor.getContentAreaContainer().firstChild;
-				DOM.setStyle( iframe, 'height', iframe.clientHeight + pixels );
-			}
-
+		if ( ! initial ) {
 			if ( state === 'hide' ) {
-				setUserSetting('hidetb', '0');
+				setUserSetting( 'hidetb', '0' );
 				wpAdvButton && wpAdvButton.active( false );
 			} else {
-				setUserSetting('hidetb', '1');
+				setUserSetting( 'hidetb', '1' );
 				wpAdvButton && wpAdvButton.active( true );
 			}
 		}
@@ -73,7 +84,7 @@
 		cmd: 'WP_Adv',
 		onPostRender: function() {
 			wpAdvButton = this;
-			wpAdvButton.active( getUserSetting( 'hidetb' ) === '1' ? true : false );
+			wpAdvButton.active( getUserSetting( 'hidetb' ) === '1' );
 		}
 	});
 
@@ -81,6 +92,8 @@
 	editor.on( 'PostRender', function() {
 		if ( editor.getParam( 'wordpress_adv_hidden', true ) && getUserSetting( 'hidetb', '0' ) === '0' ) {
 			toggleToolbars( 'hide' );
+		} else {
+			tinymce.$( '.block-library-classic__toolbar' ).addClass( 'has-advanced-toolbar' );
 		}
 	});
 
@@ -364,7 +377,7 @@
 		html += '</div>';
 
 		dialog = editor.windowManager.open( {
-			title: 'Keyboard Shortcuts',
+			title: editor.settings.classic_block_editor ? 'Classic Block Keyboard Shortcuts' : 'Keyboard Shortcuts',
 			items: {
 				type: 'container',
 				classes: 'wp-help',
@@ -426,9 +439,14 @@
 		stateSelector: 'code'
 	});
 
-	// Menubar
 	// Insert->Add Media
 	if ( wp && wp.media && wp.media.editor ) {
+		editor.addButton( 'wp_add_media', {
+			tooltip: 'Add Media',
+			icon: 'dashicon dashicons-admin-media',
+			cmd: 'WP_Medialib'
+		} );
+
 		editor.addMenuItem( 'add_media', {
 			text: 'Add Media',
 			icon: 'wp-media-library',
@@ -564,41 +582,6 @@
 				}
 			});
 		}
-
-		if ( editor.settings.wp_shortcut_labels && editor.theme.panel ) {
-			var labels = {};
-			var access = 'Shift+Alt+';
-			var meta = 'Ctrl+';
-
-			// For Mac: ctrl = \u2303, cmd = \u2318, alt = \u2325
-
-			if ( tinymce.Env.mac ) {
-				access = '\u2303\u2325';
-				meta = '\u2318';
-			}
-
-			each( editor.settings.wp_shortcut_labels, function( value, name ) {
-				labels[ name ] = value.replace( 'access', access ).replace( 'meta', meta );
-			} );
-
-			each( editor.theme.panel.find('button'), function( button ) {
-				if ( button && button.settings.tooltip && labels.hasOwnProperty( button.settings.tooltip ) ) {
-					// Need to translate now. We are changing the string so it won't match and cannot be translated later.
-					button.settings.tooltip = editor.translate( button.settings.tooltip ) + ' (' + labels[ button.settings.tooltip ] + ')';
-				}
-			} );
-
-			// listbox for the "blocks" drop-down
-			each( editor.theme.panel.find('listbox'), function( listbox ) {
-				if ( listbox && listbox.settings.text === 'Paragraph' ) {
-					each( listbox.settings.values, function( item ) {
-						if ( item.text && labels.hasOwnProperty( item.text ) ) {
-							item.shortcut = '(' + labels[ item.text ] + ')';
-						}
-					} );
-				}
-			} );
-		}
 	});
 
 	editor.on( 'SaveContent', function( event ) {
@@ -641,10 +624,8 @@
 			u: 'InsertUnorderedList',
 			o: 'InsertOrderedList',
 			m: 'WP_Medialib',
-			z: 'WP_Adv',
 			t: 'WP_More',
 			d: 'Strikethrough',
-			h: 'WP_Help',
 			p: 'WP_Page',
 			x: 'WP_Code'
 		}, function( command, key ) {
@@ -657,6 +638,31 @@
 			}
 		} );
 
+		// Alt+Shift+Z removes a block in the Block Editor, don't add it to the Classic Block.
+		if ( ! editor.settings.classic_block_editor ) {
+			editor.addShortcut( 'access+z', '', 'WP_Adv' );
+		}
+
+		// Workaround for not triggering the global help modal in the Block Editor by the Classic Block shortcut.
+		editor.on( 'keydown', function( event ) {
+			var match;
+
+			if ( tinymce.Env.mac ) {
+				match = event.ctrlKey && event.altKey && event.code === 'KeyH';
+			} else {
+				match = event.shiftKey && event.altKey && event.code === 'KeyH';
+			}
+
+			if ( match ) {
+				editor.execCommand( 'WP_Help' );
+				event.stopPropagation();
+				event.stopImmediatePropagation();
+				return false;
+			}
+
+			return true;
+		});
+
 		if ( window.getUserSetting( 'editor_plain_text_paste_warning' ) > 1 ) {
 			editor.settings.paste_plaintext_inform = false;
 		}
@@ -678,6 +684,95 @@
 		}
 	});
 
+	editor.on( 'beforerenderui', function() {
+		if ( editor.theme.panel ) {
+			each( [ 'button', 'colorbutton', 'splitbutton' ], function( buttonType ) {
+				replaceButtonsTooltips( editor.theme.panel.find( buttonType ) );
+			} );
+
+			addShortcutsToListbox();
+		}
+	} );
+
+	function prepareTooltips() {
+		var access = 'Shift+Alt+';
+		var meta = 'Ctrl+';
+
+		wpTooltips = {};
+
+		// For MacOS: ctrl = \u2303, cmd = \u2318, alt = \u2325
+		if ( tinymce.Env.mac ) {
+			access = '\u2303\u2325';
+			meta = '\u2318';
+		}
+
+		// Some tooltips are translated, others are not...
+		if ( editor.settings.wp_shortcut_labels ) {
+			each( editor.settings.wp_shortcut_labels, function( value, tooltip ) {
+				var translated = editor.translate( tooltip );
+
+				value = value.replace( 'access', access ).replace( 'meta', meta );
+				wpTooltips[ tooltip ] = value;
+
+				// Add the translated so we can match all of them.
+				if ( tooltip !== translated ) {
+					wpTooltips[ translated ] = value;
+				}
+			} );
+		}
+	}
+
+	function getTooltip( tooltip ) {
+		var translated = editor.translate( tooltip );
+		var label;
+
+		if ( ! wpTooltips ) {
+			prepareTooltips();
+		}
+
+		if ( wpTooltips.hasOwnProperty( translated ) ) {
+			label = wpTooltips[ translated ];
+		} else if ( wpTooltips.hasOwnProperty( tooltip ) ) {
+			label = wpTooltips[ tooltip ];
+		}
+
+		return label ? translated + ' (' + label + ')' : translated;
+	}
+
+	function replaceButtonsTooltips( buttons ) {
+
+		if ( ! buttons ) {
+			return;
+		}
+
+		each( buttons, function( button ) {
+			var tooltip;
+
+			if ( button && button.settings.tooltip ) {
+				tooltip = getTooltip( button.settings.tooltip );
+				button.settings.tooltip = tooltip;
+
+				// Override the aria label wiht the translated tooltip + shortcut.
+				if ( button._aria && button._aria.label ) {
+					button._aria.label = tooltip;
+				}
+			}
+		} );
+	}
+
+	function addShortcutsToListbox() {
+		// listbox for the "blocks" drop-down
+		each( editor.theme.panel.find( 'listbox' ), function( listbox ) {
+			if ( listbox && listbox.settings.text === 'Paragraph' ) {
+				each( listbox.settings.values, function( item ) {
+					if ( item.text && wpTooltips.hasOwnProperty( item.text ) ) {
+						item.shortcut = '(' + wpTooltips[ item.text ] + ')';
+					}
+				} );
+			}
+		} );
+	}
+
 	/**
 	 * Experimental: create a floating toolbar.
 	 * This functionality will change in the next releases. Not recommended for use by plugins.
@@ -712,6 +807,7 @@
 
 			each( buttons, function( item ) {
 				var itemName;
+				var tooltip;
 
 				function bindSelectorChanged() {
 					var selection = editor.selection;
@@ -802,6 +898,12 @@
 								item.size = settings.toolbar_items_size;
 							}
 
+							tooltip = item.tooltip || item.title;
+
+							if ( tooltip ) {
+								item.tooltip = getTooltip( tooltip );
+							}
+
 							item = Factory.create( item );
 
 							buttonGroup.items.push( item );
@@ -1038,12 +1140,20 @@
 			}
 		}
 
-		// For full height editor.
-		editor.on( 'resizewindow scrollwindow', hide );
-		// For scrollable editor.
-		editor.dom.bind( editor.getWin(), 'resize scroll', hide );
+		editor.dom.bind( editor.getWin(), 'resize', hide );
+
+		if ( editor.inline ) {
+			// Enable `capture` for the event.
+			// This will hide/reposition the toolbar on any scrolling in the document.
+			document.addEventListener( 'scroll', hide, true );
+		} else {
+			editor.dom.bind( editor.getWin(), 'scroll', hide );
+			// For full height iframe editor.
+			editor.on( 'resizewindow scrollwindow', hide );
+		}
 
 		editor.on( 'remove', function() {
+			document.removeEventListener( 'scroll', hide, true );
 			editor.off( 'resizewindow scrollwindow', hide );
 			editor.dom.unbind( editor.getWin(), 'resize scroll', hide );
 		} );