From df65776f88cae81118273a45767a78e2a9ddaef7 Mon Sep 17 00:00:00 2001
From: Helen Hou-Sandi <helen@git.wordpress.org>
Date: Fri, 6 Mar 2015 15:02:08 +0000
Subject: [PATCH] Media: UI tweaks for Insert from URL.

"Title" field is now labeled as "Link Text", to reflect how it's actually used. It's also hidden whenever the embed is updating, to make it clearer that something is happening. Embed dimension fields are shown below the preview, much like image property fields are shown below.

fixes #29476, see #31139.


git-svn-id: https://develop.svn.wordpress.org/trunk@31642 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-includes/js/media/views.js            |  5 +++--
 src/wp-includes/js/media/views/embed/link.js |  5 +++--
 src/wp-includes/media-template.php           | 12 ++++++------
 3 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/wp-includes/js/media/views.js b/src/wp-includes/js/media/views.js
index cad0b871c9..3aee9fbaec 100644
--- a/src/wp-includes/js/media/views.js
+++ b/src/wp-includes/js/media/views.js
@@ -4605,6 +4605,7 @@ EmbedLink = Settings.extend({
 
 		// clear out previous results
 		this.$('.embed-container').hide().find('.embed-preview').html('');
+		this.$( '.setting' ).hide();
 
 		// only proceed with embed if the field contains more than 6 characters
 		if ( url && url.length < 6 ) {
@@ -4641,7 +4642,7 @@ EmbedLink = Settings.extend({
 	},
 
 	renderFail: function () {
-		this.$( '.setting' ).hide().filter( '.title' ).show();
+		this.$( '.setting' ).hide().filter( '.link-text' ).show();
 	},
 
 	renderoEmbed: function( response ) {
@@ -4650,7 +4651,7 @@ EmbedLink = Settings.extend({
 			opts = { silent: true };
 
 		this.$( '.setting' ).hide()
-			.filter( '.title' )[ html ? 'hide' : 'show' ]();
+			.filter( '.link-text' )[ html ? 'hide' : 'show' ]();
 
 		if ( response && response.attr ) {
 			attr = response.attr;
diff --git a/src/wp-includes/js/media/views/embed/link.js b/src/wp-includes/js/media/views/embed/link.js
index f29108da46..bfdc8974be 100644
--- a/src/wp-includes/js/media/views/embed/link.js
+++ b/src/wp-includes/js/media/views/embed/link.js
@@ -28,6 +28,7 @@ EmbedLink = Settings.extend({
 
 		// clear out previous results
 		this.$('.embed-container').hide().find('.embed-preview').html('');
+		this.$( '.setting' ).hide();
 
 		// only proceed with embed if the field contains more than 6 characters
 		if ( url && url.length < 6 ) {
@@ -64,7 +65,7 @@ EmbedLink = Settings.extend({
 	},
 
 	renderFail: function () {
-		this.$( '.setting' ).hide().filter( '.title' ).show();
+		this.$( '.setting' ).hide().filter( '.link-text' ).show();
 	},
 
 	renderoEmbed: function( response ) {
@@ -73,7 +74,7 @@ EmbedLink = Settings.extend({
 			opts = { silent: true };
 
 		this.$( '.setting' ).hide()
-			.filter( '.title' )[ html ? 'hide' : 'show' ]();
+			.filter( '.link-text' )[ html ? 'hide' : 'show' ]();
 
 		if ( response && response.attr ) {
 			attr = response.attr;
diff --git a/src/wp-includes/media-template.php b/src/wp-includes/media-template.php
index d5dae3f184..4bbbfc1609 100644
--- a/src/wp-includes/media-template.php
+++ b/src/wp-includes/media-template.php
@@ -815,10 +815,13 @@ function wp_print_media_templates() {
 	</script>
 
 	<script type="text/html" id="tmpl-embed-link-settings">
-		<label class="setting title">
-			<span><?php _e( 'Title' ); ?></span>
-			<input type="text" class="alignment" data-setting="title" />
+		<label class="setting link-text">
+			<span><?php _e( 'Link Text' ); ?></span>
+			<input type="text" class="alignment" data-setting="link-text" />
 		</label>
+		<div class="embed-container" style="display: none;">
+			<div class="embed-preview"></div>
+		</div>
 		<div class="embed-link-dimensions">
 			<label class="setting width">
 				<span><?php _e( 'Maximum Width' ); ?></span>
@@ -829,9 +832,6 @@ function wp_print_media_templates() {
 				<input type="text" class="alignment" data-setting="height" />
 			</label>
 		</div>
-		<div class="embed-container" style="display: none;">
-			<div class="embed-preview"></div>
-		</div>
 	</script>
 
 	<script type="text/html" id="tmpl-embed-image-settings">