WordPress.org

Make WordPress Core

Ticket #19570: 19570.9.diff

File 19570.9.diff, 10.8 KB (added by lessbloat, 9 years ago)
  • wp-admin/js/post-formats.js

     
    11window.wp = window.wp || {};
    22
    33(function($){
    4         var imageFrame;
     4        var imageFrame,
     5                postFormatSelection = $('.post-format-selection');
    56
     7        // Post formats dropdown
     8        postFormatSelection.on('focusin mouseenter', function () {
     9                $(this).addClass('open');
     10        }).on('focusout mouseleave', function () {
     11                $(this).removeClass('open');
     12        });
     13
    614        // Post formats selection
    7         $('.post-format-select a').on( 'click.post-format', function(e) {
     15        postFormatSelection.find('a').on( 'click', function(e){
    816                var $this = $(this), editor, body,
    917                        format = $this.data('wp-format'), 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();
     39        }).on('focusin mouseenter', function () {
     40                $(this).parent('.post-format-options').addClass( $(this).data('wp-format') );
     41        }).on('focusout mouseleave', function () {
     42                $(this).parent('.post-format-options').removeClass( $(this).data('wp-format') );
    2943        });
    3044
    3145        // Image selection
  • 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">
    297 <?php screen_icon(); ?>
     316
     317<?php if ( ! empty( $post_format_options ) ) : ?>
     318<div class="post-format-selection" tabindex="0" title="<?php _e( 'Select a post format' ); ?>">
     319        <div class="current-post-format">
     320                <div class="selected <?php echo esc_attr( $active_post_type_slug ); ?>">
     321                        <?php echo esc_html( $active_post_type_label ); ?>
     322                </div>
     323        </div>
     324        <div class="post-format-options">
     325                <div class="arrow"></div>
     326                <?php echo $post_format_options; ?>
     327        </div>
     328</div>
     329<?php endif; ?>
     330
    298331<h2><?php
    299332echo esc_html( $title );
    300333if ( isset( $post_new_file ) && current_user_can( $post_type_object->cap->create_posts ) )
     
    330363?>
    331364
    332365<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 
    353366<div id="post-body" class="metabox-holder columns-<?php echo 1 == get_current_screen()->get_columns() ? '1' : '2'; ?>">
    354367<div id="post-body-content"<?php echo $format_class; ?>>
    355368
  • 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-selection {
     972        float: right;
     973}
     974
     975.current-post-format {
     976        background: transparent url(../images/arrows.png) no-repeat 4px 11px;
     977}
     978
     979.post-format-selection.open .current-post-format {
     980        background: url(../images/arrows.png) no-repeat 4px -25px;
     981}
     982
     983.post-format-options {
     984        left: auto;
     985        right: 0;
     986}
     987
     988.post-format-options a {
     989        padding: 9px 32px 8px 7px;
     990}
     991
     992.post-format-options .arrow {
     993        left: auto;
     994        right: 14px;
     995        margin-left: 0;
     996        margin-right: -7px;
     997}
     998
     999.post-format-options .arrow:after {
     1000        margin-left: 0;
     1001        margin-right: -7px;
     1002}
     1003
     1004.post-format-selection .post-format-options a span {
     1005        left: auto;
     1006        right: 4px;
     1007}
     1008
     1009/*------------------------------------------------------------------------------
    9671010  12.0 - Categories
    9681011------------------------------------------------------------------------------*/
    9691012
  • 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
     
    39123913}
    39133914
    39143915/*------------------------------------------------------------------------------
     3916  11.4 - Post format selection
     3917------------------------------------------------------------------------------*/
     3918
     3919.post-format-selection {
     3920        width: 55px;
     3921        height: 40px;
     3922        margin-top: 4px;
     3923        padding-bottom: 5px;
     3924        position: relative;
     3925        float: left;
     3926}
     3927
     3928.post-format-selection.open .post-format-options {
     3929        display: block;
     3930}
     3931
     3932.post-format-selection .selected {
     3933        opacity: 0.6;
     3934        width: 36px;
     3935        height: 36px;
     3936        text-indent: -10000px;
     3937}
     3938
     3939.current-post-format {
     3940        background: transparent url(../images/arrows.png) no-repeat 34px 11px;
     3941}
     3942
     3943.post-format-selection.open .current-post-format {
     3944        background: url(../images/arrows.png) no-repeat 34px -25px;
     3945}
     3946
     3947.current-post-format .standard {
     3948        background: url(../images/post-formats32.png) no-repeat -3px -2px;
     3949}
     3950
     3951.current-post-format .image {
     3952        background: url(../images/post-formats32.png) no-repeat  -43px -2px;
     3953}
     3954
     3955.current-post-format .gallery {
     3956        background: url(../images/post-formats32.png) no-repeat -83px -2px;
     3957}
     3958
     3959.current-post-format .audio {
     3960        background: url(../images/post-formats32.png) no-repeat -123px -2px;
     3961}
     3962
     3963.current-post-format .video {
     3964        background: url(../images/post-formats32.png) no-repeat -163px -2px;
     3965}
     3966
     3967.current-post-format .chat {
     3968        background: url(../images/post-formats32.png) no-repeat -202px -2px;
     3969}
     3970
     3971.current-post-format .status {
     3972        background: url(../images/post-formats32.png) no-repeat -242px -2px;
     3973}
     3974
     3975.current-post-format .aside {
     3976        background: url(../images/post-formats32.png) no-repeat -282px -2px;
     3977}
     3978
     3979.current-post-format .quote {
     3980        background: url(../images/post-formats32.png) no-repeat -322px -2px;
     3981}
     3982
     3983.current-post-format .link {
     3984        background: url(../images/post-formats32.png) no-repeat -362px -2px;
     3985}
     3986
     3987.post-format-options {
     3988        background: #fff;
     3989        border: 1px solid #ccc;
     3990        display: none;
     3991        position: absolute;
     3992        top: 45px;
     3993        left: 0;
     3994        width: 150px;
     3995        z-index: 100000;
     3996        -webkit-border-radius: 3px;
     3997        border-radius: 3px;
     3998        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
     3999}
     4000
     4001.post-format-options a {
     4002        border-bottom: 1px solid #eee;
     4003        display: block;
     4004        padding: 9px 7px 8px 32px;
     4005        position: relative;
     4006        text-decoration: none;
     4007}
     4008
     4009.post-format-options a:last-child {
     4010        border-bottom: 1px solid #ccc;
     4011        -webkit-border-bottom-left-radius: 3px;
     4012        -webkit-border-bottom-right-radius: 3px;
     4013        border-bottom-left-radius: 3px;
     4014        border-bottom-right-radius: 3px;
     4015}
     4016
     4017.post-format-options a:focus,
     4018.post-format-options a:hover {
     4019        background: #eee;
     4020        border-bottom: 1px solid #ddd;
     4021        color: #222;
     4022        outline: none;
     4023}
     4024
     4025.post-format-options .arrow,
     4026.post-format-options .arrow:after {
     4027        position: absolute;
     4028        display: block;
     4029        width: 0;
     4030        height: 0;
     4031        border-color: transparent;
     4032        border-style: solid;
     4033}
     4034
     4035.post-format-options .arrow {
     4036        border-width: 7px;
     4037        top: -7px;
     4038        left: 14px;
     4039        margin-left: -7px;
     4040        border-bottom-color: #ccc;
     4041        border-bottom-color: rgba(0, 0, 0, 0.25);
     4042        border-top-width: 0;
     4043}
     4044
     4045.post-format-options .arrow:after {
     4046        border-width: 6px;
     4047        content: "";
     4048        top: 1px;
     4049        margin-left: -6px;
     4050        border-bottom-color: #fff;
     4051        border-top-width: 0;
     4052}
     4053
     4054.post-format-options.standard .arrow:after {
     4055        border-bottom-color: #eee;
     4056}
     4057
     4058.post-format-options .standard {
     4059        background: url(../images/post-formats.png) no-repeat -2px -2px;
     4060}
     4061
     4062.post-format-options .image {
     4063        background: url(../images/post-formats.png) no-repeat -33px -2px;
     4064}
     4065
     4066.post-format-options .gallery {
     4067        background: url(../images/post-formats.png) no-repeat -66px -2px;
     4068}
     4069
     4070.post-format-options .audio {
     4071        background: url(../images/post-formats.png) no-repeat -98px -2px;
     4072}
     4073
     4074.post-format-options .video {
     4075        background: url(../images/post-formats.png) no-repeat -130px -2px;
     4076}
     4077
     4078.post-format-options .chat {
     4079        background: url(../images/post-formats.png) no-repeat -162px -2px;
     4080}
     4081
     4082.post-format-options .status {
     4083        background: url(../images/post-formats.png) no-repeat -194px -2px;
     4084}
     4085
     4086.post-format-options .aside {
     4087        background: url(../images/post-formats.png) no-repeat -226px -2px;
     4088}
     4089
     4090.post-format-options .quote {
     4091        background: url(../images/post-formats.png) no-repeat -258px -2px;
     4092}
     4093
     4094.post-format-options .link {
     4095        background: url(../images/post-formats.png) no-repeat -290px -2px;
     4096}
     4097
     4098.post-format-selection .post-format-options a span {
     4099        background-position-y: 0;
     4100        height: 24px;
     4101        left: 0;
     4102        opacity: 0.5;
     4103        position: absolute;
     4104        top: 0;
     4105        width: 24px;
     4106}
     4107
     4108.post-format-selection .post-format-options a:focus span,
     4109.post-format-selection .post-format-options a:hover span {
     4110        opacity: 1;
     4111}
     4112
     4113/*------------------------------------------------------------------------------
    39154114  12.0 - Categories
    39164115------------------------------------------------------------------------------*/
    39174116