WordPress.org

Make WordPress Core

Ticket #21206: iris-twentyeleven.diff

File iris-twentyeleven.diff, 10.2 KB (added by downstairsdev, 9 years ago)

Patches the Twenty Eleven theme (and include Background iris-2.diff)

  • wp-includes/script-loader.php

     
    399399
    400400                $scripts->add( 'farbtastic', '/wp-admin/js/farbtastic.js', array('jquery'), '1.2' );
    401401
     402                $iris_deps = array( 'jquery-ui-draggable', 'jquery-ui-slider' );
     403                if ( wp_is_mobile() )
     404                        $iris_deps[] = 'touch-punch';
     405                $scripts->add( 'iris', '/wp-admin/js/iris.js', $iris_deps, false, 1 );
     406
     407                $scripts->add( 'wp-color-picker', "/wp-admin/js/wp-color-picker$suffix.js", array( 'iris' ), false, 1 );
     408                did_action( 'init' ) && $scripts->localize( 'wp-color-picker', 'wpColorPickerL10n', array(
     409                        'clear' => __( 'Clear' ),
     410                        'defaultString' => __( 'Default' ),
     411                        'pick' => __( 'Select a Color' )
     412                ));
     413
    402414                $scripts->add( 'dashboard', "/wp-admin/js/dashboard$suffix.js", array( 'jquery', 'admin-comments', 'postbox' ), false, 1 );
    403415
    404416                $scripts->add( 'list-revisions', "/wp-includes/js/wp-list-revisions$suffix.js" );
     
    426438                        'saveAlert' => __('The changes you made will be lost if you navigate away from this page.')
    427439                ) );
    428440
    429                 $scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array('farbtastic'), false, 1 );
     441                $scripts->add( 'custom-background', "/wp-admin/js/custom-background$suffix.js", array('wp-color-picker'), false, 1 );
    430442                $scripts->add( 'media-gallery', "/wp-admin/js/media-gallery$suffix.js", array('jquery'), false, 1 );
    431443        }
    432444}
     
    479491        $styles->add( 'install', "/wp-admin/css/install$suffix.css" );
    480492        $styles->add( 'thickbox', '/wp-includes/js/thickbox/thickbox.css' );
    481493        $styles->add( 'farbtastic', '/wp-admin/css/farbtastic.css', array(), '1.3u1' );
     494        $styles->add( 'wp-color-picker', '/wp-admin/css/wp-color-picker.css' );
    482495        $styles->add( 'jcrop', '/wp-includes/js/jcrop/jquery.Jcrop.css', array(), '0.9.8' );
    483496        $styles->add( 'imgareaselect', '/wp-includes/js/imgareaselect/imgareaselect.css', array(), '0.9.8' );
    484497        $styles->add( 'admin-bar', "/wp-includes/css/admin-bar$suffix.css" );
  • wp-content/themes/twentyeleven/inc/theme-options.php

     
    1717 */
    1818function twentyeleven_admin_enqueue_scripts( $hook_suffix ) {
    1919        wp_enqueue_style( 'twentyeleven-theme-options', get_template_directory_uri() . '/inc/theme-options.css', false, '2011-04-28' );
    20         wp_enqueue_script( 'twentyeleven-theme-options', get_template_directory_uri() . '/inc/theme-options.js', array( 'farbtastic' ), '2011-06-10' );
    21         wp_enqueue_style( 'farbtastic' );
     20        wp_enqueue_script( 'twentyeleven-theme-options', get_template_directory_uri() . '/inc/theme-options.js', array( 'wp-color-picker' ), '2012-08-22' );
     21        wp_enqueue_style('wp-color-picker');
    2222}
    2323add_action( 'admin_print_styles-appearance_page_theme_options', 'twentyeleven_admin_enqueue_scripts' );
    2424
     
    268268function twentyeleven_settings_field_link_color() {
    269269        $options = twentyeleven_get_theme_options();
    270270        ?>
    271         <input type="text" name="twentyeleven_theme_options[link_color]" id="link-color" value="<?php echo esc_attr( $options['link_color'] ); ?>" />
    272         <a href="#" class="pickcolor hide-if-no-js" id="link-color-example"></a>
    273         <input type="button" class="pickcolor button hide-if-no-js" value="<?php esc_attr_e( 'Select a Color', 'twentyeleven' ); ?>" />
    274         <div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
    275         <br />
    276         <span><?php printf( __( 'Default color: %s', 'twentyeleven' ), '<span id="default-color">' . twentyeleven_get_default_link_color( $options['color_scheme'] ) . '</span>' ); ?></span>
     271        <?php $default_color = 'data-default-color="' . twentyeleven_get_default_link_color( $options['color_scheme'] ) . '"'; ?>
     272        <input type="text" name="twentyeleven_theme_options[link_color]" id="link-color" value="<?php echo esc_attr( $options['link_color'] ); ?>" <?php echo $default_color ?>/>
    277273        <?php
    278274}
    279275
  • wp-content/themes/twentyeleven/inc/theme-options.js

     
    1 var farbtastic;
    2 
    31(function($){
    4         var pickColor = function(a) {
    5                 farbtastic.setColor(a);
    6                 $('#link-color').val(a);
    7                 $('#link-color-example').css('background-color', a);
    8         };
    92
    103        $(document).ready( function() {
    11                 $('#default-color').wrapInner('<a href="#" />');
    12 
    13                 farbtastic = $.farbtastic('#colorPickerDiv', pickColor);
    14 
    15                 pickColor( $('#link-color').val() );
    16 
    17                 $('.pickcolor').click( function(e) {
    18                         $('#colorPickerDiv').show();
    19                         e.preventDefault();
    20                 });
    21 
    22                 $('#link-color').keyup( function() {
    23                         var a = $('#link-color').val(),
    24                                 b = a;
    25 
    26                         a = a.replace(/[^a-fA-F0-9]/, '');
    27                         if ( '#' + a !== b )
    28                                 $('#link-color').val(a);
    29                         if ( a.length === 3 || a.length === 6 )
    30                                 pickColor( '#' + a );
    31                 });
    32 
    33                 $(document).mousedown( function() {
    34                         $('#colorPickerDiv').hide();
    35                 });
    36 
    37                 $('#default-color a').click( function(e) {
    38                         pickColor( '#' + this.innerHTML.replace(/[^a-fA-F0-9]/, '') );
    39                         e.preventDefault();
    40                 });
    41 
     4       
     5                $('#link-color').wpColorPicker();
     6               
    427                $('.image-radio-option.color-scheme input:radio').change( function() {
    43                         var currentDefault = $('#default-color a'),
     8                        var currentDefault = $('#link-color').attr('data-default-color'),
    449                                newDefault = $(this).next().val();
    4510
    46                         if ( $('#link-color').val() == currentDefault.text() )
    47                                 pickColor( newDefault );
    48 
    49                         currentDefault.text( newDefault );
     11                        if ( $('#link-color').val() == currentDefault.toString() ) {
     12                                $("#link-color").iris("option", "color", newDefault )
     13                        }
    5014                });
     15               
    5116        });
    5217})(jQuery);
     18 No newline at end of file
  • wp-admin/js/custom-background.dev.js

     
    1 var farbtastic, pickColor;
    2 
    31(function($) {
    42
    5         var defaultColor = '';
    6 
    7         pickColor = function(color) {
    8                 farbtastic.setColor(color);
    9                 $('#background-color').val(color);
    10                 $('#custom-background-image').css('background-color', color);
    11                 // If we have a default color, and they match, then we need to hide the 'Default' link.
    12                 // Otherwise, we hide the 'Clear' link when it is empty.
    13                 if ( ( defaultColor && color === defaultColor ) || ( ! defaultColor && ( '' === color || '#' === color ) ) )
    14                         $('#clearcolor').hide();
    15                 else
    16                         $('#clearcolor').show();
    17         }
    18 
    193        $(document).ready(function() {
     4                var bgImage = $("#custom-background-image");
    205
    21                 defaultColor = $('#defaultcolor').val();
    22 
    23                 $('#pickcolor').click(function() {
    24                         $('#colorPickerDiv').show();
    25                         return false;
     6                $('#background-color').wpColorPicker({
     7                        change: function( event, ui ) {
     8                                bgImage.css('background-color', ui.color.toString());
     9                        },
     10                        clear: function() {
     11                                bgImage.css('background-color', '');
     12                        }
    2613                });
    2714
    28                 $('#clearcolor a').click( function(e) {
    29                         pickColor( defaultColor );
    30                         e.preventDefault();
    31                 });
    32 
    33                 $('#background-color').keyup(function() {
    34                         var _hex = $('#background-color').val(), hex = _hex;
    35                         if ( hex.charAt(0) != '#' )
    36                                 hex = '#' + hex;
    37                         hex = hex.replace(/[^#a-fA-F0-9]+/, '');
    38                         if ( hex != _hex )
    39                                 $('#background-color').val(hex);
    40                         if ( hex.length == 4 || hex.length == 7 )
    41                                 pickColor( hex );
    42                 });
    43 
    4415                $('input[name="background-position-x"]').change(function() {
    45                         $('#custom-background-image').css('background-position', $(this).val() + ' top');
     16                        bgImage.css('background-position', $(this).val() + ' top');
    4617                });
    4718
    4819                $('input[name="background-repeat"]').change(function() {
    49                         $('#custom-background-image').css('background-repeat', $(this).val());
     20                        bgImage.css('background-repeat', $(this).val());
    5021                });
    51 
    52                 farbtastic = $.farbtastic('#colorPickerDiv', function(color) {
    53                         pickColor(color);
    54                 });
    55                 pickColor($('#background-color').val());
    56 
    57                 $(document).mousedown(function(){
    58                         $('#colorPickerDiv').each(function(){
    59                                 var display = $(this).css('display');
    60                                 if ( display == 'block' )
    61                                         $(this).fadeOut(2);
    62                         });
    63                 });
    6422        });
    6523
    6624})(jQuery);
    67  No newline at end of file
  • wp-admin/custom-background.php

     
    108108                add_thickbox();
    109109                wp_enqueue_script('media-upload');
    110110                wp_enqueue_script('custom-background');
    111                 wp_enqueue_style('farbtastic');
     111                wp_enqueue_style('wp-color-picker');
    112112        }
    113113
    114114        /**
     
    327327<tr valign="top">
    328328<th scope="row"><?php _e( 'Background Color' ); ?></th>
    329329<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Color' ); ?></span></legend>
    330 <?php $show_clear = get_theme_mod('background_color') ? '' : ' style="display:none"'; ?>
    331 <input type="text" name="background-color" id="background-color" value="#<?php echo esc_attr(get_background_color()) ?>" />
    332 <a class="hide-if-no-js" href="#" id="pickcolor"><?php _e('Select a Color'); ?></a> <span<?php echo $show_clear; ?> class="hide-if-no-js" id="clearcolor"> (<a href="#"><?php current_theme_supports( 'custom-background', 'default-color' ) ? _e( 'Default' ) : _e( 'Clear' ); ?></a>)</span>
    333 <input type="hidden" id="defaultcolor" value="<?php if ( current_theme_supports( 'custom-background', 'default-color' ) ) echo '#' . esc_attr( get_theme_support( 'custom-background', 'default-color' ) ); ?>" />
    334 <div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
     330<?php $default_color = current_theme_supports( 'custom-background', 'default-color' ) ? 'data-default-color="#' . esc_attr( get_theme_support( 'custom-background', 'default-color' ) ) . '" ' : ''; ?>
     331<input type="text" name="background-color" id="background-color" value="#<?php echo esc_attr(get_background_color()) ?>" <?php echo $default_color ?>/>
    335332</fieldset></td>
    336333</tr>
    337334</tbody>