TinyMCE:

- Fix the inline toolbar on images in iOS, move it out of the way so the default inline toolbar is not over it.
- Fix selecting images on touch in the editor (iOS Safari fails to select them most of the time).

Fixes #34557.
Built from https://develop.svn.wordpress.org/trunk@35607


git-svn-id: http://core.svn.wordpress.org/trunk@35571 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-includes/js/tinymce/plugins/wordpress/plugin.js

@@ -739,32 +739,40 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
 					spaceBottom = windowHeight - iframeRect.top - selection.bottom - blockedBottom,
 					editorHeight = windowHeight - blockedTop - blockedBottom,
 					className = '',
+					iosOffsetTop = 0,
+					iosOffsetBottom = 0,
 					top, left;
 
 				if ( spaceTop >= editorHeight || spaceBottom >= editorHeight ) {
 					return this.hide();
 				}
 
+				// Add offset in iOS to move the menu over the image, out of the way of the default iOS menu.
+				if ( tinymce.Env.iOS && currentSelection.nodeName === 'IMG' ) {
+					iosOffsetTop = 54;
+					iosOffsetBottom = 46;
+				}
+
 				if ( this.bottom ) {
 					if ( spaceBottom >= spaceNeeded ) {
 						className = ' mce-arrow-up';
-						top = selection.bottom + iframeRect.top + scrollY;
+						top = selection.bottom + iframeRect.top + scrollY - iosOffsetBottom;
 					} else if ( spaceTop >= spaceNeeded ) {
 						className = ' mce-arrow-down';
-						top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin;
+						top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin + iosOffsetTop;
 					}
 				} else {
 					if ( spaceTop >= spaceNeeded ) {
 						className = ' mce-arrow-down';
-						top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin;
+						top = selection.top + iframeRect.top + scrollY - toolbarHeight - margin + iosOffsetTop;
 					} else if ( spaceBottom >= spaceNeeded && editorHeight / 2 > selection.bottom + iframeRect.top - blockedTop ) {
 						className = ' mce-arrow-up';
-						top = selection.bottom + iframeRect.top + scrollY;
+						top = selection.bottom + iframeRect.top + scrollY - iosOffsetBottom;
 					}
 				}
 
 				if ( typeof top === 'undefined' ) {
-					top = scrollY + blockedTop + buffer;
+					top = scrollY + blockedTop + buffer + iosOffsetBottom;
 				}
 
 				left = selectionMiddle - toolbarWidth / 2 + iframeRect.left + scrollX;
@@ -784,6 +792,11 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
 					left = selection.right - toolbarWidth + iframeRect.left + scrollX;
 				}
 
+				// No up/down arrows on the menu over images in iOS.
+				if ( tinymce.Env.iOS && currentSelection.nodeName === 'IMG' ) {
+					className = className.replace( / ?mce-arrow-(up|down)/g, '' );
+				}
+
 				toolbar.className = toolbar.className.replace( / ?mce-arrow-[\w]+/g, '' ) + className;
 
 				DOM.setStyles( toolbar, {

wp-includes/js/tinymce/plugins/wpeditimage/plugin.js

@@ -1,6 +1,6 @@
 /* global tinymce */
 tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
-	var toolbar, serializer,
+	var toolbar, serializer, touchOnImage,
 		each = tinymce.each,
 		trim = tinymce.trim,
 		iOS = tinymce.Env.iOS;
@@ -79,13 +79,28 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
 		}
 	} );
 
-	// Safari on iOS fails to select image nodes in contentEditoble mode on touch/click.
+	// Safari on iOS fails to select images in contentEditoble mode on touch.
 	// Select them again.
 	if ( iOS ) {
-		editor.on( 'click', function( event ) {
+		editor.on( 'init', function() {
+			editor.on( 'touchstart', function( event ) {
 				if ( event.target.nodeName === 'IMG' ) {
+					touchOnImage = true;
+				}
+			});
+
+			editor.dom.bind( editor.getDoc(), 'touchmove', function( event ) {
+				if ( event.target.nodeName === 'IMG' ) {
+					touchOnImage = false;
+				}
+			});
+
+			editor.on( 'touchend', function( event ) {
+				if ( touchOnImage && event.target.nodeName === 'IMG' ) {
 					var node = event.target;
 
+					touchOnImage = false;
+
 					window.setTimeout( function() {
 						editor.selection.select( node );
 						editor.nodeChanged();
@@ -94,6 +109,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
 					toolbar.hide();
 				}
 			});
+		});
 	}
 
 	function parseShortcode( content ) {

wp-includes/version.php

@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.4-beta3-35606';
+$wp_version = '4.4-beta3-35607';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.