WordPress.org

Make WordPress Core

Ticket #17351: 17351-2.diff

File 17351-2.diff, 4.3 KB (added by lancewillett, 3 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}