WordPress.org

Make WordPress Core

Ticket #17351: 17351-2.diff

File 17351-2.diff, 4.3 KB (added by lancewillett, 7 years ago)

Uses correct default value on page load, JS improvements

  • wp-content/themes/twentyeleven/inc/theme-options.js

     
    33(function($){
    44        var pickColor = function(a) {
    55                farbtastic.setColor(a);
    6                 $('#link-color').val(a);
     6                $('#link-color-input').val(a);
    77                $('#link-color-example').css('background-color', a);
    88        };
    99
    1010        $(document).ready( function() {
    1111                farbtastic = $.farbtastic('#colorPickerDiv', pickColor);
    1212
    13                 pickColor( $('#link-color').val() );
     13                pickColor( $('#link-color-input').val() );
    1414
    1515                $('.pickcolor').click( function(e) {
    1616                        $('#colorPickerDiv').show();
    1717                        e.preventDefault();
    1818                });
    1919
    20                 $('#link-color').keyup( function() {
    21                         var a = $('#link-color').val(),
     20                $('#link-color-input').keyup( function() {
     21                        var a = $('#link-color-input').val(),
    2222                                b = a;
    2323
    2424                        a = a.replace(/[^a-fA-F0-9]/, '');
    2525                        if ( '#' + a !== b )
    26                                 $('#link-color').val(a);
     26                                $('#link-color-input').val(a);
    2727                        if ( a.length === 3 || a.length === 6 )
    2828                                pickColor( '#' + a );
    2929                });
     
    3131                $(document).mousedown( function() {
    3232                        $('#colorPickerDiv').hide();
    3333                });
     34
     35                $('#color-scheme input').click( function() {
     36                        var color_input = $('#link-color-input'),
     37                                default_color = '#1b8be0',
     38                                default_color_dark = '#e4741f',
     39                                new_color = '';
     40
     41                        if ( 'dark' == $(this).val() )
     42                                new_color = default_color_dark;
     43                        else
     44                                new_color = default_color;
     45
     46                        $('#link-color-default').html(new_color);
     47
     48                        // Only change the swatch and input if hex color is still the default value.
     49                        if ( color_input.val() == default_color || color_input.val() == default_color_dark ) {
     50                                color_input.val(new_color);
     51                                farbtastic.setColor(new_color);
     52                        }
     53                });
    3454        });
    3555})(jQuery);
     56 No newline at end of file
  • wp-content/themes/twentyeleven/inc/theme-options.php

     
    166166
    167167                        <table class="form-table">
    168168
    169                                 <tr valign="top" class="image-radio-option"><th scope="row"><?php _e( 'Color Scheme', 'twentyeleven' ); ?></th>
     169                                <tr valign="top" class="image-radio-option" id="color-scheme"><th scope="row"><?php _e( 'Color Scheme', 'twentyeleven' ); ?></th>
    170170                                        <td>
    171171                                                <fieldset><legend class="screen-reader-text"><span><?php _e( 'Color Scheme', 'twentyeleven' ); ?></span></legend>
    172172                                                <?php
     
    188188                                        </td>
    189189                                </tr>
    190190
    191                                 <tr valign="top"><th scope="row"><?php _e( 'Link Color', 'twentyeleven' ); ?></th>
     191                                <tr valign="top" id="link-color"><th scope="row"><?php _e( 'Link Color', 'twentyeleven' ); ?></th>
    192192                                        <td>
    193193                                                <fieldset><legend class="screen-reader-text"><span><?php _e( 'Link Color', 'twentyeleven' ); ?></span></legend>
    194                                                         <input type="text" name="twentyeleven_theme_options[link_color]" id="link-color" value="<?php echo esc_attr( $options['link_color'] ); ?>" />
     194                                                        <input type="text" name="twentyeleven_theme_options[link_color]" id="link-color-input" value="<?php echo esc_attr( $options['link_color'] ); ?>" />
    195195                                                        <a href="#" class="pickcolor hide-if-no-js" id="link-color-example"></a>
    196196                                                        <input type="button" class="pickcolor button hide-if-no-js" value="<?php esc_attr_e( 'Select a Color', 'twentyeleven' ); ?>">
    197197                                                        <div id="colorPickerDiv" style="z-index: 100; background:#eee; border:1px solid #ccc; position:absolute; display:none;"></div>
    198198                                                        <br />
    199                                                         <small class="description"><?php printf( __( 'Default color: %s', 'twentyeleven' ), $default_options['link_color'] ); ?></small>
     199                                                        <?php
     200                                                                $default_link_color = $default_options['link_color'];
     201                                                                if ( isset( $options['color_scheme'] ) && 'dark' === $options['color_scheme'] )
     202                                                                        $default_link_color = '#e4741f';
     203                                                        ?>
     204                                                        <small class="description"><?php printf( __( 'Default color: %s', 'twentyeleven' ), '<span id="link-color-default">' . $default_link_color . '</span>' ); ?></small>
    200205                                                </fieldset>
    201206                                        </td>
    202207                                </tr>
     
    302307                }
    303308                section.recent-posts .other-recent-posts .comments-link a:hover {
    304309                        border-color: <?php echo $link_color; ?>;
    305                 }               
     310                }
    306311        </style>
    307312<?php
    308313}