WordPress.org

Make WordPress Core

Ticket #32604: 32604.15.patch

File 32604.15.patch, 9.4 KB (added by iseulde, 5 years ago)
  • src/wp-includes/css/editor.css

     
    16831683div.wp-link-preview {
    16841684        float: left;
    16851685        margin: 5px;
    1686         max-width: 694px;
     1686        max-width: 350px;
    16871687        overflow: hidden;
    16881688        text-overflow: ellipsis;
    16891689}
  • src/wp-includes/js/tinymce/plugins/wplink/plugin.js

     
    1 /* global tinymce */
    2 tinymce.PluginManager.add( 'wplink', function( editor ) {
    3         var toolbar;
    4 
    5         editor.addCommand( 'WP_Link', function() {
    6                 window.wpLink && window.wpLink.open( editor.id );
    7         });
    8 
    9         // WP default shortcut
    10         editor.addShortcut( 'Alt+Shift+A', '', 'WP_Link' );
    11         // The "de-facto standard" shortcut, see #27305
    12         editor.addShortcut( 'Meta+K', '', 'WP_Link' );
    13 
    14         editor.addButton( 'link', {
    15                 icon: 'link',
    16                 tooltip: 'Insert/edit link',
    17                 cmd: 'WP_Link',
    18                 stateSelector: 'a[href]'
    19         });
    20 
    21         editor.addButton( 'unlink', {
    22                 icon: 'unlink',
    23                 tooltip: 'Remove link',
    24                 cmd: 'unlink'
    25         });
    26 
    27         editor.addMenuItem( 'link', {
    28                 icon: 'link',
    29                 text: 'Insert/edit link',
    30                 cmd: 'WP_Link',
    31                 stateSelector: 'a[href]',
    32                 context: 'insert',
    33                 prependToContext: true
    34         });
    35 
    36         editor.on( 'pastepreprocess', function( event ) {
    37                 var pastedStr = event.content,
    38                         regExp = /^(?:https?:)?\/\/\S+$/i;
    39 
    40                 if ( ! editor.selection.isCollapsed() && ! regExp.test( editor.selection.getContent() ) ) {
    41                         pastedStr = pastedStr.replace( /<[^>]+>/g, '' );
    42                         pastedStr = tinymce.trim( pastedStr );
    43 
    44                         if ( regExp.test( pastedStr ) ) {
    45                                 editor.execCommand( 'mceInsertLink', false, {
    46                                         href: editor.dom.decode( pastedStr )
    47                                 } );
    48 
    49                                 event.preventDefault();
    50                         }
    51                 }
    52         } );
    53 
     1( function( tinymce ) {
    542        tinymce.ui.WPLinkPreview = tinymce.ui.Control.extend( {
    553                url: '#',
    564                renderHtml: function() {
    57                         return (
    58                                 '<div id="' + this._id + '" class="wp-link-preview">' +
    59                                         '<a href="' + this.url + '" target="_blank" tabindex="-1">' + this.url + '</a>' +
    60                                 '</div>'
    61                         );
     5                        return '<div id="' + this._id + '" class="wp-link-preview"></div>';
    626                },
    63                 setURL: function( url ) {
     7                prettyURL: function( url ) {
    648                        var index, lastIndex;
    659
    66                         if ( this.url !== url ) {
    67                                 this.url = url;
    68 
    69                                 url = window.decodeURIComponent( url );
    70 
    71                                 url = url.replace( /^(?:https?:)?\/\/(?:www\.)?/, '' );
     10                        url = window.decodeURIComponent( url );
    7211
    73                                 if ( ( index = url.indexOf( '?' ) ) !== -1 ) {
    74                                         url = url.slice( 0, index );
    75                                 }
     12                        index = url.indexOf( '?' );
    7613
    77                                 if ( ( index = url.indexOf( '#' ) ) !== -1 ) {
    78                                         url = url.slice( 0, index );
    79                                 }
     14                        if ( index === 0 ) {
     15                                return url;
     16                        } else if ( index !== -1 ) {
     17                                url = url.slice( 0, index );
     18                        }
    8019
    81                                 url = url.replace( /(?:index)?\.html$/, '' );
     20                        index = url.indexOf( '#' );
    8221
    83                                 if ( url.charAt( url.length - 1 ) === '/' ) {
    84                                         url = url.slice( 0, -1 );
    85                                 }
     22                        if ( index === 0 ) {
     23                                return url;
     24                        } else if ( index !== -1 ) {
     25                                url = url.slice( 0, index );
     26                        }
    8627
    87                                 // If the URL is longer that 40 chars, concatenate the beginning (after the domain) and ending with ...
    88                                 if ( url.length > 40 && ( index = url.indexOf( '/' ) ) !== -1 && ( lastIndex = url.lastIndexOf( '/' ) ) !== -1 && lastIndex !== index ) {
    89                                         // If the beginning + ending are shorter that 40 chars, show more of the ending
    90                                         if ( index + url.length - lastIndex < 40 ) {
    91                                                 lastIndex =  -( 40 - ( index + 1 ) );
    92                                         }
     28                        url = url.replace( /^(?:https?:)?\/\/(?:www\.)?/, '' );
     29                        url = url.replace( /(?:index)?\.html$/, '' );
    9330
    94                                         url = url.slice( 0, index + 1 ) + '\u2026' + url.slice( lastIndex );
    95                                 }
     31                        if ( url.charAt( url.length - 1 ) === '/' ) {
     32                                url = url.slice( 0, -1 );
     33                        }
    9634
    97                                 tinymce.$( this.getEl().firstChild ).attr( 'href', this.url ).text( url );
     35                        if ( ( index = url.indexOf( '/' ) ) !== -1 && ( lastIndex = url.lastIndexOf( '/' ) ) !== -1 && lastIndex !== index ) {
     36                                url = url.slice( 0, index + 1 ) + '\u2026' + url.slice( lastIndex );
    9837                        }
     38
     39                        return url;
    9940                },
    100                 postRender: function() {
    101                         var self = this;
     41                setURL: function( url ) {
     42                        var $ = tinymce.$,
     43                                $element;
    10244
    103                         editor.on( 'wptoolbar', function( event ) {
    104                                 var anchor = editor.dom.getParent( event.element, 'a' ),
    105                                         $ = editor.$,
    106                                         href;
    107 
    108                                 if ( anchor && ! $( anchor ).find( 'img' ).length &&
    109                                         ( href = $( anchor ).attr( 'href' ) ) ) {
    110 
    111                                         self.setURL( href );
    112                                         event.element = anchor;
    113                                         event.toolbar = toolbar;
     45                        if ( this.url !== url ) {
     46                                this.url = url;
     47
     48                                if ( url.indexOf( '#' ) === 0 || url.indexOf( '?' ) === 0 ) {
     49                                        $element = $( document.createElement( 'span' ) );
     50                                } else {
     51                                        $element = $( document.createElement( 'a' ) );
     52                                        $element.attr( 'href', this.url );
     53                                        $element.attr( 'target', '_blank' );
     54                                        $element.attr( 'tabindex', '-1' );
    11455                                }
    115                         } );
     56
     57                                $element.text( this.prettyURL( url ) );
     58
     59                                $( this.getEl() ).empty().append( $element );
     60                        }
    11661                }
    11762        } );
    11863
    119         editor.addButton( 'wp_link_edit', {
    120                 tooltip: 'Edit ', // trailing space is needed, used for context
    121                 icon: 'dashicon dashicons-edit',
    122                 cmd: 'WP_Link'
    123         } );
     64        tinymce.PluginManager.add( 'wplink', function( editor ) {
     65                var toolbar;
    12466
    125         editor.addButton( 'wp_link_remove', {
    126                 tooltip: 'Remove',
    127                 icon: 'dashicon dashicons-no',
    128                 cmd: 'unlink'
    129         } );
     67                editor.addCommand( 'WP_Link', function() {
     68                        window.wpLink && window.wpLink.open( editor.id );
     69                });
     70
     71                // WP default shortcut
     72                editor.addShortcut( 'Alt+Shift+A', '', 'WP_Link' );
     73                // The "de-facto standard" shortcut, see #27305
     74                editor.addShortcut( 'Meta+K', '', 'WP_Link' );
     75
     76                editor.addButton( 'link', {
     77                        icon: 'link',
     78                        tooltip: 'Insert/edit link',
     79                        cmd: 'WP_Link',
     80                        stateSelector: 'a[href]'
     81                });
     82
     83                editor.addButton( 'unlink', {
     84                        icon: 'unlink',
     85                        tooltip: 'Remove link',
     86                        cmd: 'unlink'
     87                });
     88
     89                editor.addMenuItem( 'link', {
     90                        icon: 'link',
     91                        text: 'Insert/edit link',
     92                        cmd: 'WP_Link',
     93                        stateSelector: 'a[href]',
     94                        context: 'insert',
     95                        prependToContext: true
     96                });
     97
     98                editor.on( 'pastepreprocess', function( event ) {
     99                        var pastedStr = event.content,
     100                                regExp = /^(?:https?:)?\/\/\S+$/i;
     101
     102                        if ( ! editor.selection.isCollapsed() && ! regExp.test( editor.selection.getContent() ) ) {
     103                                pastedStr = pastedStr.replace( /<[^>]+>/g, '' );
     104                                pastedStr = tinymce.trim( pastedStr );
     105
     106                                if ( regExp.test( pastedStr ) ) {
     107                                        editor.execCommand( 'mceInsertLink', false, {
     108                                                href: editor.dom.decode( pastedStr )
     109                                        } );
     110
     111                                        event.preventDefault();
     112                                }
     113                        }
     114                } );
     115
     116                editor.addButton( 'wp_link_preview', {
     117                        type: 'WPLinkPreview',
     118                        onPostRender: function() {
     119                                var self = this;
     120
     121                                editor.on( 'wptoolbar', function( event ) {
     122                                        var anchor = editor.dom.getParent( event.element, 'a' ),
     123                                                $anchor,
     124                                                href;
     125
     126                                        if ( anchor ) {
     127                                                $anchor = editor.$( anchor );
     128                                                href = $anchor.attr( 'href' );
     129
     130                                                if ( href && ! $anchor.find( 'img' ).length ) {
     131                                                        self.setURL( href );
     132                                                        event.element = anchor;
     133                                                        event.toolbar = toolbar;
     134                                                }
     135                                        }
     136                                } );
     137                        }
     138                } );
    130139
    131         editor.on( 'preinit', function() {
    132                 toolbar = editor.wp._createToolbar( [
    133                         'WPLinkPreview',
    134                         'wp_link_edit',
    135                         'wp_link_remove'
    136                 ], true );
     140                editor.addButton( 'wp_link_edit', {
     141                        tooltip: 'Edit ', // trailing space is needed, used for context
     142                        icon: 'dashicon dashicons-edit',
     143                        cmd: 'WP_Link'
     144                } );
     145
     146                editor.addButton( 'wp_link_remove', {
     147                        tooltip: 'Remove',
     148                        icon: 'dashicon dashicons-no',
     149                        cmd: 'unlink'
     150                } );
     151
     152                editor.on( 'preinit', function() {
     153                        toolbar = editor.wp._createToolbar( [
     154                                'wp_link_preview',
     155                                'wp_link_edit',
     156                                'wp_link_remove'
     157                        ], true );
     158                } );
    137159        } );
    138 });
     160} )( window.tinymce );
  • tests/qunit/index.html

     
    377377
    378378
    379379                <script src="../../src/wp-includes/js/tinymce/tinymce.js"></script>
     380                <script src="../../src/wp-includes/js/tinymce/plugins/wplink/plugin.js"></script>
    380381                <script src="editor/js/utils.js"></script>
    381382                <script src="wp-includes/js/tinymce/plugins/wptextpattern/plugin.js"></script>
     383                <script src="wp-includes/js/tinymce/plugins/wplink/plugin.js"></script>
    382384        </body>
    383385</html>
  • tests/qunit/wp-includes/js/tinymce/plugins/wplink/plugin.js

     
     1( function( QUnit, tinymce, _ ) {
     2        var wpLinkPreview = new tinymce.ui.WPLinkPreview();
     3
     4        QUnit.module( 'tinymce.plugins.wplink'  );
     5
     6        QUnit.test( 'prettyURL.', function( assert ) {
     7                var tests = {
     8                        '#fragment': '#fragment',
     9                        '?query#fragment': '?query#fragment',
     10                        'http://w.org/one/': 'w.org/one',
     11                        'http://w.org/one/index.html': 'w.org/one',
     12                        'http://w.org/one/two/': 'w.org/\u2026/two'
     13                };
     14
     15                _.each( tests, function( result, input ) {
     16                        assert.equal( wpLinkPreview.prettyURL( input ), result );
     17                } );
     18        } );
     19} )( window.QUnit, window.tinymce, window._ );