WordPress.org

Make WordPress Core

Ticket #11420: 11204.dropdown.to.tabs.diff

File 11204.dropdown.to.tabs.diff, 5.0 KB (added by koopersmith, 10 years ago)
  • wp-includes/js/tinymce/plugins/wplink/js/wplink.js

     
    6666                        inputs.title = $('#link-title-field');
    6767                        // Advanced Options
    6868                        inputs.openInNewTab = $('#link-target-checkbox');
    69                         // Types
    70                         inputs.typeDropdown = $('#link-type');
    71                         inputs.typeOptions = inputs.typeDropdown.find('option');
    7269                       
    7370                        panels = $('.link-panel');
    7471                        active = $('.link-panel-active');
     72                        $('#link-panel-tab-bar').wpTabs({
     73                                show: function(e, widget) {
     74                                        active = widget.panel;
     75                                        active.addClass('link-panel-active');
     76                                        wpLink.maybeLoadPanel();
     77                                },
     78                                hide: function(e, widget) {
     79                                        active.removeClass('link-panel-active');
     80                                }
     81                        })
    7582                       
    76                         // Extract type names
    77                         inputs.typeOptions.each( function(){
    78                                 var linkType = this.id.replace(/^link-option-id-/,''),
    79                                         parts = linkType.split('-');
    80                                 $(this).data( 'link-type', {
    81                                         full : linkType,
    82                                         type : parts[0],
    83                                         name : parts[1] || ''
    84                                 });
    85                         });
    8683                        panels.each( function(){
    8784                                var linkType = this.id.replace(/^link-panel-id-/,''),
    8885                                        parts = linkType.split('-');
     
    9491                        });
    9592                       
    9693                        // Bind event handlers
    97                         inputs.typeDropdown.change( wpLink.selectPanel );
    9894                        $('#wp-update').click( wpLink.update );
    9995                        $('#wp-cancel').click( function() { tinyMCEPopup.close(); } );
    10096                        $('.link-panel .wp-tab-bar').wpTabs('option', 'show', wpLink.maybeLoadPanel );
     
    107103                        if ( ! e )
    108104                                return;
    109105                       
    110                         // @TODO: select proper panel/fill values when a link is edited
    111106                        active.find('input.url-field').val( e.href );
    112107                        inputs.title.val( ed.dom.getAttrib(e, 'title') );
    113108                        // Advanced Options
     
    193188                        tinyMCEPopup.close();
    194189                },
    195190               
    196                 selectPanel : function( option ) {
    197                         var sel = inputs.typeOptions.filter(':selected');
    198                        
    199                         if ( option.jquery ) {
    200                                 sel.removeAttr('selected');
    201                                 sel = option.attr('selected', 'selected');
    202                         }
    203                        
    204                         active.removeClass('link-panel-active');
    205                         active = $('#link-panel-id-' + sel.data('link-type').full ).addClass('link-panel-active');
    206                         wpLink.maybeLoadPanel();
    207                 },
    208                
    209191                maybeLoadPanel : function() {
    210192                        var panel = active.find('.wp-tab-panel:visible');
    211193                        if ( panel.length && panel.find('.wp-tab-panel-loading').length )
  • wp-includes/js/tinymce/wp-mce-link.php

     
    4949        padding: 5px;
    5050        border-bottom: 1px solid #dfdfdf;
    5151}
     52        #link-header {
     53                padding-bottom: 0;
     54                background: #fff;
     55        }
     56        #link-panel-tab-bar li {
     57                font-weight: bold;
     58                border: #dfdfdf solid;
     59                margin-right: 5px;
     60                border-width: 1px 1px 0;
     61        }
     62        #link-panel-tab-bar .wp-tab-active {
     63                border-color:#ccc;
     64                background-color: #f1f1f1;
     65        }
     66
    5267#link-type {
    5368        width: 140px;
    5469}
     
    155170</style>
    156171</head>
    157172<?php
    158 
    159 $pts = get_post_types( array( 'public' => true ), 'objects' );
     173// @TODO: Support custom post types.
     174// $pts = get_post_types( array( 'public' => true ), 'objects' );
     175$pts = array( get_post_type_object( 'page' ), get_post_type_object( 'post' ) );
    160176$queries = array(
    161177        array( 'preset' => 'all', 'label' => __('View All') ),
    162178        array( 'preset' => 'recent', 'label' => __('Most Recent') ),
    163179        array( 'preset' => 'search', 'label' => __('Search') )
    164180);
    165181
     182$tb = new WP_Tab_Bar();
     183$tb->id = 'link-panel-tab-bar';
     184$tb->add( 'link-panel-id-custom', __('External Link') );
     185foreach( $pts as $pt ) {
     186        $tb->add( "link-panel-id-pt-$pt->name", $pt->labels->singular_name );
     187}
     188
     189
    166190?>
    167191<body id="post-body">
    168192<div id="link-header">
    169         <label for="link-type">
    170                 <span><strong><?php _e('Link Type:'); ?></strong>
    171                 </span><select id="link-type">
    172                         <option id="link-option-id-custom" class="link-custom"><?php _e('External Link'); ?></option>
    173                 <?php
    174                 foreach ( $pts as $pt ) {
    175                         echo "<option id='link-option-id-pt-$pt->name' class='link-option-pt'>";
    176                         echo $pt->labels->singular_name . '</option>';
    177                 } ?>
    178                 </select>
    179         </label>
     193        <?php $tb->render(); ?>
    180194</div>
    181195<div id="link-selector">
    182196        <?php
  • wp-includes/js/tinymce/wp-mce-link-includes.php

     
    33class WP_Tab_Bar {
    44        var $tabs = array();
    55       
     6        var $id = '';
     7        var $classes = array();
     8       
    69        var $selected = '';
    710       
    811        function add( $id, $label, $url='' ) {
     
    2124                if ( empty( $this->selected ) )
    2225                        $this->selected = $this->tabs[0]['for'];
    2326
    24                 $out = "<ul class='wp-tab-bar'>";
     27                array_unshift( $this->classes, 'wp-tab-bar' );
     28               
     29                $out = "<ul id='$this->id' class='" . implode( " ", $this->classes ) . "'>";
    2530                foreach( $this->tabs as $tab ) {
    2631                        if ( !isset($tab['url']) )
    2732                                $tab['url'] = '';