sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

wpLink: replace the "Title" field with a "Text" field and populate it with the link text when editing an existing link or with the selected text if any. 

Props iseulde. See #28206.

git-svn-id: https://develop.svn.wordpress.org/trunk@31713 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2015-03-11 02:39:02 +00:00
parent 62c89ae8b5
commit bfbcfe3e6a
4 changed files with 139 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/wp-includes/class-wp-editor.php
View File

@ -1448,14 +1448,14 @@ final class _WP_Editors {
<div id="link-selector">
<div id="link-options">
<p class="howto"><?php _e( 'Enter the destination URL' ); ?></p>
<div>
<label><span><?php _e( 'URL' ); ?></span><input id="url-field" type="text" name="href" /></label>
<div class="wp-link-text-field">
<label><span><?php _e( 'Text' ); ?></span><input id="wp-link-text" type="text" /></label>
</div>
<div>
<label><span><?php _e( 'Title' ); ?></span><input id="link-title-field" type="text" name="linktitle" /></label>
<label><span><?php _e( 'URL' ); ?></span><input id="wp-link-url" type="text" /></label>
</div>
<div class="link-target">
<label><span>&nbsp;</span><input type="checkbox" id="link-target-checkbox" /> <?php _e( 'Open link in a new window/tab' ); ?></label>
<label><span>&nbsp;</span><input type="checkbox" id="wp-link-target" /> <?php _e( 'Open link in a new window/tab' ); ?></label>
</div>
</div>
<p class="howto"><a href="#" id="wp-link-search-toggle"><?php _e( 'Or link to existing content' ); ?></a></p>
@ -1463,7 +1463,7 @@ final class _WP_Editors {
<div class="link-search-wrapper">
<label>
<span class="search-label"><?php _e( 'Search' ); ?></span>
<input type="search" id="search-field" class="link-search-field" autocomplete="off" />
<input type="search" id="wp-link-search" class="link-search-field" autocomplete="off" />
<span class="spinner"></span>
</label>
</div>

18
src/wp-includes/css/editor.css
View File

@ -1193,7 +1193,6 @@ i.mce-i-hr:before {
-webkit-box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
width: 500px;
height: 250px;
overflow: hidden;
margin-left: -250px;
margin-top: -125px;
@ -1229,6 +1228,14 @@ i.mce-i-hr:before {
margin-top: -250px;
}
#wp-link-wrap .wp-link-text-field {
display: none;
}
#wp-link-wrap.has-text-field .wp-link-text-field {
display: block;
}
#link-modal-title {
background: #fcfcfc;
border-bottom: 1px solid #dfdfdf;
@ -1395,6 +1402,10 @@ i.mce-i-hr:before {
left: 16px;
right: 16px;
bottom: 16px;
top: 172px;
}
.has-text-field #wp-link .query-results {
top: 205px;
}
@ -1529,11 +1540,14 @@ i.mce-i-hr:before {
@media screen and ( max-width: 782px ) {
#wp-link-wrap {
height: 280px;
margin-top: -140px;
}
#wp-link-wrap.search-panel-visible .query-results {
top: 195px;
}
#wp-link-wrap.search-panel-visible.has-text-field .query-results {
top: 235px;
}

34
src/wp-includes/js/tinymce/plugins/wplink/plugin.js
View File

@ -1,12 +1,7 @@
/* global tinymce */
tinymce.PluginManager.add( 'wplink', function( editor ) {
var linkButton;
// Register a command so that it can be invoked by using tinyMCE.activeEditor.execCommand( 'WP_Link' );
editor.addCommand( 'WP_Link', function() {
if ( ( ! linkButton || ! linkButton.disabled() ) && typeof window.wpLink !== 'undefined' ) {
window.wpLink.open( editor.id );
}
window.wpLink && window.wpLink.open( editor.id );
});
// WP default shortcut
@ -14,41 +9,18 @@ tinymce.PluginManager.add( 'wplink', function( editor ) {
// The "de-facto standard" shortcut, see #27305
editor.addShortcut( 'ctrl+k', '', 'WP_Link' );
function setState( button, node ) {
var parent = editor.dom.getParent( node, 'a' ),
getView = editor.plugins.wpview ? editor.plugins.wpview.getView : function() { return false; };
button.disabled( ( editor.selection.isCollapsed() && ! parent ) || ( parent && ! parent.href ) || getView( node ) );
button.active( parent && parent.href );
}
editor.addButton( 'link', {
icon: 'link',
tooltip: 'Insert/edit link',
shortcut: 'Alt+Shift+A',
cmd: 'WP_Link',
onPostRender: function() {
linkButton = this;
editor.on( 'nodechange', function( event ) {
setState( linkButton, event.element );
});
}
stateSelector: 'a[href]'
});
editor.addButton( 'unlink', {
icon: 'unlink',
tooltip: 'Remove link',
cmd: 'unlink',
onPostRender: function() {
var unlinkButton = this;
editor.on( 'nodechange', function( event ) {
setState( unlinkButton, event.element );
});
}
cmd: 'unlink'
});
editor.addMenuItem( 'link', {

160
src/wp-includes/js/wplink.js
View File

@ -7,6 +7,10 @@ var wpLink;
rivers = {},
isTouch = ( 'ontouchend' in document );
function getLink() {
return editor.dom.getParent( editor.selection.getNode(), 'a' );
}
wpLink = {
timeToTriggerRiver: 150,
minRiverAJAXDuration: 200,
@ -21,14 +25,14 @@ var wpLink;
inputs.backdrop = $( '#wp-link-backdrop' );
inputs.submit = $( '#wp-link-submit' );
inputs.close = $( '#wp-link-close' );
// URL
inputs.url = $( '#url-field' );
// Input
inputs.text = $( '#wp-link-text' );
inputs.url = $( '#wp-link-url' );
inputs.nonce = $( '#_ajax_linking_nonce' );
// Secondary options
inputs.title = $( '#link-title-field' );
// Advanced Options
inputs.openInNewTab = $( '#link-target-checkbox' );
inputs.search = $( '#search-field' );
inputs.openInNewTab = $( '#wp-link-target' );
inputs.search = $( '#wp-link-search' );
// Build Rivers
rivers.search = new River( $( '#search-results' ) );
rivers.recent = new River( $( '#most-recent-results' ) );
@ -129,6 +133,7 @@ var wpLink;
inputs.backdrop.show();
wpLink.refresh();
$( document ).trigger( 'wplink-open', inputs.wrap );
},
@ -144,6 +149,8 @@ var wpLink;
if ( wpLink.isMCE() ) {
wpLink.mceRefresh();
} else {
inputs.wrap.removeClass( 'has-text-field' );
inputs.text.val( '' );
wpLink.setDefaultValues();
}
@ -154,8 +161,12 @@ var wpLink;
// Focus the URL field and highlight its contents.
// If this is moved above the selection changes,
// IE will show a flashing cursor over the dialog.
if ( inputs.wrap.hasClass( 'has-text-field' ) ) {
inputs.text.focus();
} else {
inputs.url.focus()[0].select();
}
}
// Load the most recent results if this is the first time opening the panel.
if ( ! rivers.recent.ul.children().length ) {
@ -165,22 +176,53 @@ var wpLink;
correctedURL = inputs.url.val().replace( /^http:\/\//, '' );
},
hasSelectedText: function( linkNode ) {
var html = editor.selection.getContent();
// Partial html and not a fully selected anchor element
if ( /</.test( html ) && ( ! /^<a [^>]+>[^<]+<\/a>$/.test( html ) || html.indexOf('href=') === -1 ) ) {
return false;
}
if ( linkNode ) {
var nodes = linkNode.childNodes, i;
if ( nodes.length === 0 ) {
return false;
}
for ( i = nodes.length - 1; i >= 0; i-- ) {
if ( nodes[i].nodeType != 3 ) {
return false;
}
}
}
return true;
},
mceRefresh: function() {
var e;
var text,
selectedNode = editor.selection.getNode(),
linkNode = editor.dom.getParent( selectedNode, 'a[href]' ),
onlyText = this.hasSelectedText( linkNode );
// If link exists, select proper values.
if ( e = editor.dom.getParent( editor.selection.getNode(), 'A' ) ) {
// Set URL and description.
inputs.url.val( editor.dom.getAttrib( e, 'href' ) );
inputs.title.val( editor.dom.getAttrib( e, 'title' ) );
// Set open in new tab.
inputs.openInNewTab.prop( 'checked', ( '_blank' === editor.dom.getAttrib( e, 'target' ) ) );
// Update save prompt.
if ( linkNode ) {
text = linkNode.innerText || linkNode.textContent;
inputs.url.val( editor.dom.getAttrib( linkNode, 'href' ) );
inputs.openInNewTab.prop( 'checked', '_blank' === editor.dom.getAttrib( linkNode, 'target' ) );
inputs.submit.val( wpLinkL10n.update );
// If there's no link, set the default values.
} else {
wpLink.setDefaultValues();
text = editor.selection.getContent({ format: 'text' });
this.setDefaultValues();
}
if ( onlyText ) {
inputs.text.val( text || '' );
inputs.wrap.addClass( 'has-text-field' );
} else {
inputs.text.val( '' );
inputs.wrap.removeClass( 'has-text-field' );
}
},
@ -209,39 +251,37 @@ var wpLink;
getAttrs: function() {
return {
href: $.trim( inputs.url.val() ),
title: $.trim( inputs.title.val() ),
target: inputs.openInNewTab.prop( 'checked' ) ? '_blank' : ''
};
},
update: function() {
if ( wpLink.isMCE() )
if ( wpLink.isMCE() ) {
wpLink.mceUpdate();
else
} else {
wpLink.htmlUpdate();
}
},
htmlUpdate: function() {
var attrs, html, begin, end, cursor, title, selection,
var attrs, text, html, begin, end, cursor, selection,
textarea = wpLink.textarea;
if ( ! textarea )
if ( ! textarea ) {
return;
}
attrs = wpLink.getAttrs();
text = inputs.text.val();
// If there's no href, return.
if ( ! attrs.href )
if ( ! attrs.href ) {
return;
}
// Build HTML
html = '<a href="' + attrs.href + '"';
if ( attrs.title ) {
title = attrs.title.replace( /</g, '&lt;' ).replace( />/g, '&gt;' ).replace( /"/g, '&quot;' );
html += ' title="' + title + '"';
}
if ( attrs.target ) {
html += ' target="' + attrs.target + '"';
}
@ -254,7 +294,7 @@ var wpLink;
// Note: If no text is selected, IE will not place the cursor
// inside the closing tag.
textarea.focus();
wpLink.range.text = html + wpLink.range.text + '</a>';
wpLink.range.text = html + ( text || wpLink.range.text ) + '</a>';
wpLink.range.moveToBookmark( wpLink.range.getBookmark() );
wpLink.range.select();
@ -263,16 +303,20 @@ var wpLink;
// W3C
begin = textarea.selectionStart;
end = textarea.selectionEnd;
selection = textarea.value.substring( begin, end );
selection = text || textarea.value.substring( begin, end );
html = html + selection + '</a>';
cursor = begin + html.length;
// If no text is selected, place the cursor inside the closing tag.
if ( begin == end )
cursor -= '</a>'.length;
if ( begin === end && ! selection ) {
cursor -= 4;
}
textarea.value = textarea.value.substring( 0, begin ) + html +
textarea.value.substring( end, textarea.value.length );
textarea.value = (
textarea.value.substring( 0, begin ) +
html +
textarea.value.substring( end, textarea.value.length )
);
// Update cursor position
textarea.selectionStart = textarea.selectionEnd = cursor;
@ -283,8 +327,8 @@ var wpLink;
},
mceUpdate: function() {
var link,
attrs = wpLink.getAttrs();
var attrs = wpLink.getAttrs(),
link, text;
wpLink.close();
editor.focus();
@ -293,33 +337,50 @@ var wpLink;
editor.selection.moveToBookmark( editor.windowManager.bookmark );
}
link = editor.dom.getParent( editor.selection.getNode(), 'a[href]' );
// If the values are empty, unlink and return
if ( ! attrs.href || attrs.href == 'http://' ) {
if ( ! attrs.href ) {
editor.execCommand( 'unlink' );
return;
}
link = getLink();
text = inputs.text.val();
if ( link ) {
if ( text ) {
if ( 'innerText' in link ) {
link.innerText = text;
} else {
link.textContent = text;
}
}
editor.dom.setAttribs( link, attrs );
} else {
if ( text ) {
editor.selection.setNode( editor.dom.create( 'a', attrs, text ) );
} else {
editor.execCommand( 'mceInsertLink', false, attrs );
}
// Move the cursor to the end of the selection
editor.selection.collapse();
}
},
updateFields: function( e, li ) {
inputs.url.val( li.children( '.item-permalink' ).val() );
inputs.title.val( li.hasClass( 'no-title' ) ? '' : li.children( '.item-title' ).text() );
},
setDefaultValues: function() {
var selection = editor && editor.selection.getContent(),
var selection,
emailRegexp = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
urlRegexp = /^(https?|ftp):\/\/[A-Z0-9.-]+\.[A-Z]{2,4}[^ "]*$/i;
urlRegexp = /^(https?|ftp):\/\/[A-Z0-9.-]+\.[A-Z]{2,4}[^ "]*$/i,
text;
if ( this.isMCE() ) {
selection = editor.selection.getContent();
} else if ( document.selection && wpLink.range ) {
selection = wpLink.range.text;
} else if ( typeof this.textarea.selectionStart !== 'undefined' ) {
selection = this.textarea.value.substring( this.textarea.selectionStart, this.textarea.selectionEnd );
}
if ( selection && emailRegexp.test( selection ) ) {
// Selection is email address
@ -332,9 +393,6 @@ var wpLink;
inputs.url.val( '' );
}
// Set description to default.
inputs.title.val( '' );
// Update save prompt.
inputs.submit.val( wpLinkL10n.save );
},