WordPress.org

Make WordPress Core

Ticket #19570: 19570.10.diff

File 19570.10.diff, 10.4 KB (added by lessbloat, 8 years ago)
  • wp-admin/js/post-formats.js

     
    11(function($){
     2        var postFormatSelection = $('.post-format-selection');
    23
     4        // Post formats dropdown
     5        postFormatSelection.on('focusin mouseenter', function () {
     6                $(this).addClass('open');
     7        }).on('focusout mouseleave', function () {
     8                $(this).removeClass('open');
     9        });
     10
    311        // Post formats selection
    4         $('.post-format-select a').on( 'click.post-format', function(e) {
     12        postFormatSelection.find('a').on( 'click', function(e){
    513                var $this = $(this),
    614                        editor,
    715                        body,
    816                        format = $this.data('wp-format'),
    917                        container = $('#post-body-content');
    1018
    11                 $('.post-format-select a.nav-tab-active').removeClass('nav-tab-active');
    12                 $this.addClass('nav-tab-active').blur();
     19                postFormatSelection.removeClass('open').find('.selected').removeClass(postFormats.currentPostFormat).addClass(format);
    1320                $('#post_format').val(format);
    1421
    1522                container.get(0).className = container.get(0).className.replace( /\bwp-format-[^ ]+/, '' );
    1623                container.addClass('wp-format-' + format);
     24                $('#title').focus();
    1725
    1826                if ( typeof tinymce != 'undefined' ) {
    1927                        editor = tinymce.get('content');
     
    2533                        }
    2634                }
    2735
     36                postFormats.currentPostFormat = format;
     37
    2838                e.preventDefault();
    2939        });
    3040
  • wp-admin/edit-form-advanced.php

     
    138138        $format_class = " class='wp-format-{$post_format}'";
    139139}
    140140
     141if ( post_type_supports( $post_type, 'post-formats' ) ) {
     142        $all_post_formats = get_post_format_strings();
     143        $post_format_options = '';
     144
     145        foreach ( $all_post_formats as $slug => $label ) {
     146                $class = '';
     147                if ( $post_format == $slug ) {
     148                        $class = 'active';
     149                        $active_post_type_slug = $slug;
     150                        $active_post_type_label = $label;
     151                }
     152
     153                $post_format_options .= '<a class="' . $class . '" href="?format=' . $slug . '" data-wp-format="' . $slug . '" title="' . sprintf( __( '%s format' ), $slug ) . '"><span class="' . $slug . '"></span>' . $label . '</a>';
     154        }
     155}
     156
     157$current_post_format = array( 'currentPostFormat' => esc_html( $active_post_type_slug ) );
     158wp_localize_script( 'post', 'postFormats', $current_post_format );
     159
    141160if ( post_type_supports($post_type, 'page-attributes') )
    142161        add_meta_box('pageparentdiv', 'page' == $post_type ? __('Page Attributes') : __('Attributes'), 'page_attributes_meta_box', null, 'side', 'core');
    143162
     
    294313?>
    295314
    296315<div class="wrap">
     316
     317<?php if ( ! empty( $post_format_options ) ) : ?>
     318<div class="post-format-container">
     319        <div class="post-format-selection" tabindex="0" title="<?php _e( 'Select a post format' ); ?>">
     320                <div class="current-post-format">
     321                        <div class="selected <?php echo esc_attr( $active_post_type_slug ); ?>">
     322                                <?php echo esc_html( $active_post_type_label ); ?>
     323                        </div>
     324                </div>
     325                <div class="post-format-options">
     326                        <?php echo $post_format_options; ?>
     327                </div>
     328        </div>
     329</div>
     330<?php else: ?>
    297331<?php screen_icon(); ?>
     332<?php endif; ?>
     333
    298334<h2><?php
    299335echo esc_html( $title );
    300336if ( isset( $post_new_file ) && current_user_can( $post_type_object->cap->create_posts ) )
     
    330366?>
    331367
    332368<div id="poststuff">
    333 
    334 <?php
    335 if ( post_type_supports( $post_type, 'post-formats' ) ) {
    336         $all_post_formats = get_post_format_strings();
    337 
    338         echo '<h2 class="nav-tab-wrapper post-format-select">';
    339 
    340         foreach ( $all_post_formats as $slug => $label ) {
    341                 if ( $post_format == $slug )
    342                         $class = 'nav-tab nav-tab-active';
    343                 else
    344                         $class = 'nav-tab';
    345 
    346                 echo '<a class="' . $class . '" href="?format=' . $slug . '" data-wp-format="' . $slug . '">' . $label . '</a>';
    347         }
    348 
    349         echo '</h2>';
    350 }
    351 ?>
    352 
    353369<div id="post-body" class="metabox-holder columns-<?php echo 1 == get_current_screen()->get_columns() ? '1' : '2'; ?>">
    354370<div id="post-body-content"<?php echo $format_class; ?>>
    355371
  • wp-admin/css/wp-admin-rtl.css

     
    2323        11.1 - Custom Fields
    2424        11.2 - Post Revisions
    2525        11.3 - Featured Images
     26        11.4 - Post Format Selection
    262712.0 - Categories
    272813.0 - Tags
    282914.0 - Media Screen
     
    964965}
    965966
    966967/*------------------------------------------------------------------------------
     968  11.4 - Post format selection
     969------------------------------------------------------------------------------*/
     970
     971.post-format-container {
     972        float: right;
     973        margin: 4px 0 0 8px;
     974}
     975
     976.current-post-format {
     977        background: transparent url(../images/arrows.png) no-repeat 0 11px;
     978}
     979
     980.post-format-selection.open .current-post-format {
     981        background: url(../images/arrows.png) no-repeat 0 -25px;
     982}
     983
     984.post-format-options {
     985        left: auto;
     986        right: 0;
     987}
     988
     989.post-format-options a {
     990        padding: 9px 32px 8px 7px;
     991}
     992
     993.post-format-selection .post-format-options a span {
     994        left: auto;
     995        right: 4px;
     996}
     997
     998/*------------------------------------------------------------------------------
    967999  12.0 - Categories
    9681000------------------------------------------------------------------------------*/
    9691001
  • wp-admin/css/wp-admin.css

     
    2424        11.1 - Custom Fields
    2525        11.2 - Post Revisions
    2626        11.3 - Featured Images
     27        11.4 - Post Format Selection
    272812.0 - Categories
    282913.0 - Tags
    293014.0 - Media Screen
     
    38823883}
    38833884
    38843885/*------------------------------------------------------------------------------
     3886  11.4 - Post format selection
     3887------------------------------------------------------------------------------*/
     3888
     3889.post-format-container {
     3890        background: #f9f9f9;
     3891        background-image: -webkit-gradient(linear, left bottom, left top, from(#f7f7f7), to(#fff));
     3892        background-image: -webkit-linear-gradient(bottom, #f7f7f7, #fff);
     3893        background-image:    -moz-linear-gradient(bottom, #f7f7f7, #fff);
     3894        background-image:      -o-linear-gradient(bottom, #f7f7f7, #fff);
     3895        background-image: linear-gradient(to top, #f7f7f7, #fff);
     3896        text-decoration: none;
     3897        margin: 4px 8px 0 0;
     3898        padding: 0 5px 1px;
     3899        cursor: pointer;
     3900        border-width: 1px;
     3901        border-style: solid;
     3902        border-color: #eee #dfdfdf #dfdfdf #eee;
     3903        -webkit-border-radius: 3px;
     3904        -webkit-appearance: none;
     3905        border-radius: 3px;
     3906        float: left;
     3907}
     3908
     3909.post-format-container:hover,
     3910.post-format-container:focus {
     3911        background: #eee;
     3912        border-color: #ccc;
     3913}
     3914
     3915.post-format-selection {
     3916        width: 48px;
     3917        height: 39px;
     3918        position: relative;
     3919}
     3920
     3921.post-format-selection.open .post-format-options {
     3922        display: block;
     3923}
     3924
     3925.post-format-selection .selected {
     3926        opacity: 0.6;
     3927        width: 36px;
     3928        height: 36px;
     3929        text-indent: -10000px;
     3930}
     3931
     3932.current-post-format {
     3933        background: transparent url(../images/arrows.png) no-repeat 34px 11px;
     3934}
     3935
     3936.post-format-selection.open .current-post-format {
     3937        background: url(../images/arrows.png) no-repeat 34px -25px;
     3938}
     3939
     3940.current-post-format .standard {
     3941        background: url(../images/post-formats32.png) no-repeat -3px -2px;
     3942}
     3943
     3944.current-post-format .image {
     3945        background: url(../images/post-formats32.png) no-repeat  -43px 0;
     3946}
     3947
     3948.current-post-format .gallery {
     3949        background: url(../images/post-formats32.png) no-repeat -83px -1px;
     3950}
     3951
     3952.current-post-format .audio {
     3953        background: url(../images/post-formats32.png) no-repeat -123px 0;
     3954}
     3955
     3956.current-post-format .video {
     3957        background: url(../images/post-formats32.png) no-repeat -163px -1px;
     3958}
     3959
     3960.current-post-format .chat {
     3961        background: url(../images/post-formats32.png) no-repeat -202px 0;
     3962}
     3963
     3964.current-post-format .status {
     3965        background: url(../images/post-formats32.png) no-repeat -242px -1px;
     3966}
     3967
     3968.current-post-format .aside {
     3969        background: url(../images/post-formats32.png) no-repeat -282px 0;
     3970}
     3971
     3972.current-post-format .quote {
     3973        background: url(../images/post-formats32.png) no-repeat -322px -2px;
     3974}
     3975
     3976.current-post-format .link {
     3977        background: url(../images/post-formats32.png) no-repeat -362px -2px;
     3978}
     3979
     3980.post-format-options {
     3981        background: #fff;
     3982        border: 1px solid #ccc;
     3983        display: none;
     3984        position: absolute;
     3985        top: 39px;
     3986        left: -6px;
     3987        width: 150px;
     3988        z-index: 100000;
     3989        -webkit-border-radius: 3px;
     3990        border-radius: 3px;
     3991        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
     3992}
     3993
     3994.post-format-options a {
     3995        border-bottom: 1px solid #eee;
     3996        display: block;
     3997        padding: 9px 7px 8px 32px;
     3998        position: relative;
     3999        text-decoration: none;
     4000}
     4001
     4002.post-format-options a:last-child {
     4003        border-bottom: 1px solid #ccc;
     4004        -webkit-border-bottom-left-radius: 3px;
     4005        -webkit-border-bottom-right-radius: 3px;
     4006        border-bottom-left-radius: 3px;
     4007        border-bottom-right-radius: 3px;
     4008}
     4009
     4010.post-format-options a:focus,
     4011.post-format-options a:hover {
     4012        background: #eee;
     4013        border-bottom: 1px solid #ddd;
     4014        color: #222;
     4015        outline: none;
     4016}
     4017
     4018.post-format-options .standard {
     4019        background: url(../images/post-formats.png) no-repeat -2px -2px;
     4020}
     4021
     4022.post-format-options .image {
     4023        background: url(../images/post-formats.png) no-repeat -33px -2px;
     4024}
     4025
     4026.post-format-options .gallery {
     4027        background: url(../images/post-formats.png) no-repeat -66px -2px;
     4028}
     4029
     4030.post-format-options .audio {
     4031        background: url(../images/post-formats.png) no-repeat -98px -2px;
     4032}
     4033
     4034.post-format-options .video {
     4035        background: url(../images/post-formats.png) no-repeat -130px -2px;
     4036}
     4037
     4038.post-format-options .chat {
     4039        background: url(../images/post-formats.png) no-repeat -162px -2px;
     4040}
     4041
     4042.post-format-options .status {
     4043        background: url(../images/post-formats.png) no-repeat -194px -2px;
     4044}
     4045
     4046.post-format-options .aside {
     4047        background: url(../images/post-formats.png) no-repeat -226px -2px;
     4048}
     4049
     4050.post-format-options .quote {
     4051        background: url(../images/post-formats.png) no-repeat -258px -2px;
     4052}
     4053
     4054.post-format-options .link {
     4055        background: url(../images/post-formats.png) no-repeat -290px -2px;
     4056}
     4057
     4058.post-format-selection .post-format-options a span {
     4059        background-position-y: 0;
     4060        height: 24px;
     4061        left: 0;
     4062        opacity: 0.5;
     4063        position: absolute;
     4064        top: 0;
     4065        width: 24px;
     4066}
     4067
     4068.post-format-selection .post-format-options a:focus span,
     4069.post-format-selection .post-format-options a:hover span {
     4070        opacity: 1;
     4071}
     4072
     4073/*------------------------------------------------------------------------------
    38854074  12.0 - Categories
    38864075------------------------------------------------------------------------------*/
    38874076