url = url.slice( 0, -1 );
}
+ // If nothing's left (maybe the URL was just a fragment), use the whole URL.
+ if ( url === '' ) {
+ url = this.url;
+ }
+
// If the URL is longer that 40 chars, concatenate the beginning (after the domain) and ending with ...
if ( url.length > 40 && ( index = url.indexOf( '/' ) ) !== -1 && ( lastIndex = url.lastIndexOf( '/' ) ) !== -1 && lastIndex !== index ) {
// If the beginning + ending are shorter that 40 chars, show more of the ending
if ( index + url.length - lastIndex < 40 ) {
- lastIndex = -( 40 - ( index + 1 ) );
+ lastIndex = -( 40 - ( index + 1 ) );
}
url = url.slice( 0, index + 1 ) + '\u2026' + url.slice( lastIndex );
}
} );
+ tinymce.ui.WPLinkInput = tinymce.ui.Control.extend( {
+ renderHtml: function() {
+ return (
+ '<div id="' + this._id + '" class="wp-link-input">' +
+ '<input type="text" value="" placeholder="' + tinymce.translate( 'Paste URL or type to search' ) + '" />' +
+ '<input type="text" style="display:none" value="" />' +
+ '</div>'
+ );
+ },
+ setURL: function( url ) {
+ this.getEl().firstChild.value = url;
+ },
+ getURL: function() {
+ return tinymce.trim( this.getEl().firstChild.value );
+ },
+ getLinkText: function() {
+ var text = this.getEl().firstChild.nextSibling.value;
+
+ if ( ! tinymce.trim( text ) ) {
+ return '';
+ }
+
+ return text.replace( /[\r\n\t ]+/g, ' ' );
+ },
+ reset: function() {
+ var urlInput = this.getEl().firstChild;
+
+ urlInput.value = '';
+ urlInput.nextSibling.value = '';
+ }
+ } );
+
tinymce.PluginManager.add( 'wplink', function( editor ) {
var toolbar;
+ var editToolbar;
+ var previewInstance;
+ var inputInstance;
+ var linkNode;
+ var doingUndoRedo;
+ var doingUndoRedoTimer;
+ var $ = window.jQuery;
+
+ function getSelectedLink() {
+ var href, html,
+ node = editor.selection.getNode(),
+ link = editor.dom.getParent( node, 'a[href]' );
+
+ if ( ! link ) {
+ html = editor.selection.getContent({ format: 'raw' });
+
+ if ( html && html.indexOf( '</a>' ) !== -1 ) {
+ href = html.match( /href="([^">]+)"/ );
+
+ if ( href && href[1] ) {
+ link = editor.$( 'a[href="' + href[1] + '"]', node )[0];
+ }
+
+ if ( link ) {
+ editor.selection.select( link );
+ }
+ }
+ }
+
+ return link;
+ }
+
+ function removePlaceholders() {
+ editor.$( 'a' ).each( function( i, element ) {
+ var $element = editor.$( element );
+
+ if ( $element.attr( 'href' ) === '_wp_link_placeholder' ) {
+ editor.dom.remove( element, true );
+ } else if ( $element.attr( 'data-wplink-edit' ) ) {
+ $element.attr( 'data-wplink-edit', null );
+ }
+ });
+ }
+
+ function removePlaceholderStrings( content, dataAttr ) {
+ if ( dataAttr ) {
+ content = content.replace( / data-wplink-edit="true"/g, '' );
+ }
+
+ return content.replace( /<a [^>]*?href="_wp_link_placeholder"[^>]*>([\s\S]+)<\/a>/g, '$1' );
+ }
+
+ editor.on( 'preinit', function() {
+ if ( editor.wp && editor.wp._createToolbar ) {
+ toolbar = editor.wp._createToolbar( [
+ 'wp_link_preview',
+ 'wp_link_edit',
+ 'wp_link_remove'
+ ], true );
+
+ var editButtons = [
+ 'wp_link_input',
+ 'wp_link_apply'
+ ];
+
+ if ( typeof window.wpLink !== 'undefined' ) {
+ editButtons.push( 'wp_link_advanced' );
+ }
+
+ editToolbar = editor.wp._createToolbar( editButtons, true );
+
+ editToolbar.on( 'show', function() {
+ if ( ! tinymce.$( document.body ).hasClass( 'modal-open' ) ) {
+ window.setTimeout( function() {
+ var element = editToolbar.$el.find( 'input.ui-autocomplete-input' )[0],
+ selection = linkNode && ( linkNode.textContent || linkNode.innerText );
+
+ if ( element ) {
+ if ( ! element.value && selection && typeof window.wpLink !== 'undefined' ) {
+ element.value = window.wpLink.getUrlFromSelection( selection );
+ }
+
+ if ( ! doingUndoRedo ) {
+ element.focus();
+ element.select();
+ }
+ }
+ } );
+ }
+ } );
+
+ editToolbar.on( 'hide', function() {
+ if ( ! editToolbar.scrolling ) {
+ editor.execCommand( 'wp_link_cancel' );
+ }
+ } );
+ }
+ } );
editor.addCommand( 'WP_Link', function() {
- window.wpLink && window.wpLink.open( editor.id );
- });
+ if ( tinymce.Env.ie && tinymce.Env.ie < 10 && typeof window.wpLink !== 'undefined' ) {
+ window.wpLink.open( editor.id );
+ return;
+ }
+
+ linkNode = getSelectedLink();
+ editToolbar.tempHide = false;
+
+ if ( linkNode ) {
+ editor.dom.setAttribs( linkNode, { 'data-wplink-edit': true } );
+ } else {
+ removePlaceholders();
+ editor.execCommand( 'mceInsertLink', false, { href: '_wp_link_placeholder' } );
+
+ linkNode = editor.$( 'a[href="_wp_link_placeholder"]' )[0];
+ editor.nodeChanged();
+ }
+ } );
+
+ editor.addCommand( 'wp_link_apply', function() {
+ if ( editToolbar.scrolling ) {
+ return;
+ }
+
+ var href, text;
+
+ if ( linkNode ) {
+ href = inputInstance.getURL();
+ text = inputInstance.getLinkText();
+ editor.focus();
+
+ if ( ! href ) {
+ editor.dom.remove( linkNode, true );
+ return;
+ }
+
+ if ( ! /^(?:[a-z]+:|#|\?|\.|\/)/.test( href ) ) {
+ href = 'http://' + href;
+ }
+
+ editor.dom.setAttribs( linkNode, { href: href, 'data-wplink-edit': null } );
+
+ if ( ! tinymce.trim( linkNode.innerHTML ) ) {
+ editor.$( linkNode ).text( text || href );
+ }
+ }
+
+ inputInstance.reset();
+ editor.nodeChanged();
+
+ // Audible confirmation message when a link has been inserted in the Editor.
+ if ( typeof window.wp !== 'undefined' && window.wp.a11y && typeof window.wpLinkL10n !== 'undefined' ) {
+ window.wp.a11y.speak( window.wpLinkL10n.linkInserted );
+ }
+ } );
+
+ editor.addCommand( 'wp_link_cancel', function() {
+ if ( ! editToolbar.tempHide ) {
+ inputInstance.reset();
+ removePlaceholders();
+ editor.focus();
+ editToolbar.tempHide = false;
+ }
+ } );
// WP default shortcut
editor.addShortcut( 'access+a', '', 'WP_Link' );
}
} );
+ // Remove any remaining placeholders on saving.
+ editor.on( 'savecontent', function( event ) {
+ event.content = removePlaceholderStrings( event.content, true );
+ });
+
+ // Prevent adding undo levels on inserting link placeholder.
+ editor.on( 'BeforeAddUndo', function( event ) {
+ if ( event.lastLevel && event.lastLevel.content && event.level.content &&
+ event.lastLevel.content === removePlaceholderStrings( event.level.content ) ) {
+
+ event.preventDefault();
+ }
+ });
+
+ // When doing undo and redo with keyboard shortcuts (Ctrl|Cmd+Z, Ctrl|Cmd+Shift+Z, Ctrl|Cmd+Y),
+ // set a flag to not focus the inline dialog. The editor has to remain focused so the users can do consecutive undo/redo.
+ editor.on( 'keydown', function( event ) {
+ if ( event.altKey || ( tinymce.Env.mac && ( ! event.metaKey || event.ctrlKey ) ) ||
+ ( ! tinymce.Env.mac && ! event.ctrlKey ) ) {
+
+ return;
+ }
+
+ if ( event.keyCode === 89 || event.keyCode === 90 ) { // Y or Z
+ doingUndoRedo = true;
+
+ window.clearTimeout( doingUndoRedoTimer );
+ doingUndoRedoTimer = window.setTimeout( function() {
+ doingUndoRedo = false;
+ }, 500 );
+ }
+ } );
+
editor.addButton( 'wp_link_preview', {
type: 'WPLinkPreview',
onPostRender: function() {
- var self = this;
+ previewInstance = this;
+ }
+ } );
+
+ editor.addButton( 'wp_link_input', {
+ type: 'WPLinkInput',
+ onPostRender: function() {
+ var element = this.getEl(),
+ input = element.firstChild,
+ $input, cache, last;
+
+ inputInstance = this;
+
+ if ( $ && $.ui && $.ui.autocomplete ) {
+ $input = $( input );
+
+ $input.on( 'keydown', function() {
+ $input.removeAttr( 'aria-activedescendant' );
+ } )
+ .autocomplete( {
+ source: function( request, response ) {
+ if ( last === request.term ) {
+ response( cache );
+ return;
+ }
- editor.on( 'wptoolbar', function( event ) {
- var anchor = editor.dom.getParent( event.element, 'a' ),
- $anchor,
- href;
+ if ( /^https?:/.test( request.term ) || request.term.indexOf( '.' ) !== -1 ) {
+ return response();
+ }
- if ( anchor ) {
- $anchor = editor.$( anchor );
- href = $anchor.attr( 'href' );
+ $.post( window.ajaxurl, {
+ action: 'wp-link-ajax',
+ page: 1,
+ search: request.term,
+ _ajax_linking_nonce: $( '#_ajax_linking_nonce' ).val()
+ }, function( data ) {
+ cache = data;
+ response( data );
+ }, 'json' );
- if ( href && ! $anchor.find( 'img' ).length ) {
- self.setURL( href );
- event.element = anchor;
- event.toolbar = toolbar;
+ last = request.term;
+ },
+ focus: function( event, ui ) {
+ $input.attr( 'aria-activedescendant', 'mce-wp-autocomplete-' + ui.item.ID );
+ /*
+ * Don't empty the URL input field, when using the arrow keys to
+ * highlight items. See api.jqueryui.com/autocomplete/#event-focus
+ */
+ event.preventDefault();
+ },
+ select: function( event, ui ) {
+ $input.val( ui.item.permalink );
+ $( element.firstChild.nextSibling ).val( ui.item.title );
+
+ if ( 9 === event.keyCode && typeof window.wp !== 'undefined' &&
+ window.wp.a11y && typeof window.wpLinkL10n !== 'undefined' ) {
+ // Audible confirmation message when a link has been selected.
+ window.wp.a11y.speak( window.wpLinkL10n.linkSelected );
+ }
+
+ return false;
+ },
+ open: function() {
+ $input.attr( 'aria-expanded', 'true' );
+ editToolbar.blockHide = true;
+ },
+ close: function() {
+ $input.attr( 'aria-expanded', 'false' );
+ editToolbar.blockHide = false;
+ },
+ minLength: 2,
+ position: {
+ my: 'left top+2'
+ },
+ messages: {
+ noResults: ( typeof window.uiAutocompleteL10n !== 'undefined' ) ? window.uiAutocompleteL10n.noResults : '',
+ results: function( number ) {
+ if ( typeof window.uiAutocompleteL10n !== 'undefined' ) {
+ if ( number > 1 ) {
+ return window.uiAutocompleteL10n.manyResults.replace( '%d', number );
+ }
+
+ return window.uiAutocompleteL10n.oneResult;
+ }
+ }
+ }
+ } ).autocomplete( 'instance' )._renderItem = function( ul, item ) {
+ return $( '<li role="option" id="mce-wp-autocomplete-' + item.ID + '">' )
+ .append( '<span>' + item.title + '</span> <span class="wp-editor-float-right">' + item.info + '</span>' )
+ .appendTo( ul );
+ };
+
+ $input.attr( {
+ 'role': 'combobox',
+ 'aria-autocomplete': 'list',
+ 'aria-expanded': 'false',
+ 'aria-owns': $input.autocomplete( 'widget' ).attr( 'id' )
+ } )
+ .on( 'focus', function() {
+ var inputValue = $input.val();
+ /*
+ * Don't trigger a search if the URL field already has a link or is empty.
+ * Also, avoids screen readers announce `No search results`.
+ */
+ if ( inputValue && ! /^https?:/.test( inputValue ) ) {
+ $input.autocomplete( 'search' );
}
+ } )
+ .autocomplete( 'widget' )
+ .addClass( 'wplink-autocomplete' )
+ .attr( 'role', 'listbox' )
+ .removeAttr( 'tabindex' ); // Remove the `tabindex=0` attribute added by jQuery UI.
+ }
+
+ tinymce.$( input ).on( 'keydown', function( event ) {
+ if ( event.keyCode === 13 ) {
+ editor.execCommand( 'wp_link_apply' );
+ event.preventDefault();
}
} );
}
} );
+ editor.on( 'wptoolbar', function( event ) {
+ var linkNode = editor.dom.getParent( event.element, 'a' ),
+ $linkNode, href, edit;
+
+ if ( tinymce.$( document.body ).hasClass( 'modal-open' ) ) {
+ editToolbar.tempHide = true;
+ return;
+ }
+
+ editToolbar.tempHide = false;
+
+ if ( linkNode ) {
+ $linkNode = editor.$( linkNode );
+ href = $linkNode.attr( 'href' );
+ edit = $linkNode.attr( 'data-wplink-edit' );
+
+ if ( href === '_wp_link_placeholder' || edit ) {
+ if ( edit && ! inputInstance.getURL() ) {
+ inputInstance.setURL( href );
+ }
+
+ event.element = linkNode;
+ event.toolbar = editToolbar;
+ } else if ( href && ! $linkNode.find( 'img' ).length ) {
+ previewInstance.setURL( href );
+ event.element = linkNode;
+ event.toolbar = toolbar;
+ }
+ }
+ } );
+
editor.addButton( 'wp_link_edit', {
tooltip: 'Edit ', // trailing space is needed, used for context
icon: 'dashicon dashicons-edit',
cmd: 'unlink'
} );
- editor.on( 'preinit', function() {
- if ( editor.wp && editor.wp._createToolbar ) {
- toolbar = editor.wp._createToolbar( [
- 'wp_link_preview',
- 'wp_link_edit',
- 'wp_link_remove'
- ], true );
+ editor.addButton( 'wp_link_advanced', {
+ tooltip: 'Link options',
+ icon: 'dashicon dashicons-admin-generic',
+ onclick: function() {
+ if ( typeof window.wpLink !== 'undefined' ) {
+ var url = inputInstance.getURL() || null,
+ text = inputInstance.getLinkText() || null;
+
+ /*
+ * Accessibility note: moving focus back to the editor confuses
+ * screen readers. They will announce again the Editor ARIA role
+ * `application` and the iframe `title` attribute.
+ *
+ * Unfortunately IE looses the selection when the editor iframe
+ * looses focus, so without returning focus to the editor, the code
+ * in the modal will not be able to get the selection, place the caret
+ * at the same location, etc.
+ */
+ if ( tinymce.Env.ie ) {
+ editor.focus(); // Needed for IE
+ }
+
+ window.wpLink.open( editor.id, url, text, linkNode );
+
+ editToolbar.tempHide = true;
+ inputInstance.reset();
+ }
}
} );
+
+ editor.addButton( 'wp_link_apply', {
+ tooltip: 'Apply',
+ icon: 'dashicon dashicons-editor-break',
+ cmd: 'wp_link_apply',
+ classes: 'widget btn primary'
+ } );
+
+ return {
+ close: function() {
+ editToolbar.tempHide = false;
+ editor.execCommand( 'wp_link_cancel' );
+ }
+ };
} );
} )( window.tinymce );