Make WordPress Core

Ticket #38752: 38752.2.diff

File 38752.2.diff, 13.4 KB (added by afercia, 8 years ago)
  • src/wp-content/themes/twentyseventeen/assets/js/customize-controls.js

     
    2424                        });
    2525                });
    2626
    27                 // Detect when the front page sections section is expanded (or closed) so we can adjust the preview accordingly
     27                // Detect when the front page sections section is expanded (or closed) so we can adjust the preview accordingly.
    2828                wp.customize.section( 'theme_options' ).expanded.bind( function( isExpanding ) {
    2929
    30                         // Value of isExpanding will = true if you're entering the section, false if you're leaving it
     30                        // Value of isExpanding will = true if you're entering the section, false if you're leaving it.
    3131                        wp.customize.previewer.send( 'section-highlight', { expanded: isExpanding } );
    3232                } );
    3333        } );
  • src/wp-content/themes/twentyseventeen/assets/js/customize-preview.js

     
    66
    77( function( $ ) {
    88
    9         // Collect information from customize-controls.js about which panels are opening
     9        // Collect information from customize-controls.js about which panels are opening.
    1010        wp.customize.bind( 'preview-ready', function() {
    1111                wp.customize.preview.bind( 'section-highlight', function( data ) {
    1212
     
    2525                                        } );
    2626                                });
    2727
    28                         // If we've left the panel, hide the placeholders and scroll back to the top
     28                        // If we've left the panel, hide the placeholders and scroll back to the top.
    2929                        } else {
    3030                                $( 'body' ).removeClass( 'highlight-front-sections' );
    31                                 $( '.panel-placeholder' ).slideUp( 200 ); // Don't change scroll when leaving - it's likely to have unintended consequences.
     31                                // Don't change scroll when leaving - it's likely to have unintended consequences.
     32                                $( '.panel-placeholder' ).slideUp( 200 );
    3233                        }
    3334                } );
    3435        } );
     
    5051                value.bind( function( to ) {
    5152                        if ( 'blank' === to ) {
    5253                                $( '.site-title, .site-description' ).css( {
    53                                         'clip': 'rect(1px, 1px, 1px, 1px)',
    54                                         'position': 'absolute'
     54                                        clip: 'rect(1px, 1px, 1px, 1px)',
     55                                        position: 'absolute'
    5556                                } );
    5657                                $( 'body' ).addClass( 'title-tagline-hidden' );
    5758                        } else {
    5859                                $( '.site-title, .site-description' ).css( {
    59                                         'clip': 'auto',
    60                                         'position': 'relative'
     60                                        clip: 'auto',
     61                                        position: 'relative'
    6162                                } );
    6263                                $( '.site-branding, .site-branding a, .site-description, .site-description a' ).css( {
    63                                         'color': to
     64                                        color: to
    6465                                } );
    6566                                $( 'body' ).removeClass( 'title-tagline-hidden' );
    6667                        }
     
    7273                value.bind( function( to ) {
    7374
    7475                        // Update color body class.
    75                         $( 'body' ).removeClass( 'colors-light colors-dark colors-custom' )
    76                                    .addClass( 'colors-' + to );
     76                        $( 'body' )
     77                                .removeClass( 'colors-light colors-dark colors-custom' )
     78                                .addClass( 'colors-' + to );
    7779                } );
    7880        } );
    7981
     
    8183        wp.customize( 'colorscheme_hue', function( value ) {
    8284                value.bind( function( to ) {
    8385
    84                         // Update custom color CSS
     86                        // Update custom color CSS.
    8587                        var style = $( '#custom-theme-colors' ),
    86                             hue = style.data( 'hue' ),
    87                             css = style.html();
     88                                hue = style.data( 'hue' ),
     89                                css = style.html();
    8890
    89                         css = css.split( hue + ',' ).join( to + ',' ); // Equivalent to css.replaceAll, with hue followed by comma to prevent values with units from being changed.
    90                         style.html( css )
    91                              .data( 'hue', to );
     91                        // Equivalent to css.replaceAll, with hue followed by comma to prevent values with units from being changed.
     92                        css = css.split( hue + ',' ).join( to + ',' );
     93                        style.html( css ).data( 'hue', to );
    9294                } );
    9395        } );
    9496
  • src/wp-content/themes/twentyseventeen/assets/js/global.js

     
    11/* global twentyseventeenScreenReaderText */
    22( function( $ ) {
    33
    4         // Variables and DOM Caching
     4        // Variables and DOM Caching.
    55        var $body = $( 'body' ),
    6                         $customHeader = $body.find( '.custom-header' ),
    7                         $customHeaderImage = $customHeader.find( '.custom-header-image' ),
    8                         $branding = $customHeader.find( '.site-branding' ),
    9                         $navigation = $body.find( '.navigation-top' ),
    10                         $navWrap = $navigation.find( '.wrap' ),
    11                         $navMenuItem = $navigation.find( '.menu-item' ),
    12                         $menuToggle = $navigation.find( '.menu-toggle' ),
    13                         $menuScrollDown = $body.find( '.menu-scroll-down' ),
    14                         $sidebar = $body.find( '#secondary' ),
    15                         $entryContent = $body.find( '.entry-content' ),
    16                         $formatQuote = $body.find( '.format-quote blockquote' ),
    17                         isFrontPage = $body.hasClass( 'twentyseventeen-front-page' ) || $body.hasClass( 'home blog' ),
    18                         navigationFixedClass = 'site-navigation-fixed',
    19                         navigationHeight,
    20                         navigationOuterHeight,
    21                         navPadding,
    22                         navMenuItemHeight,
    23                         idealNavHeight,
    24                         navIsNotTooTall,
    25                         headerOffset,
    26                         menuTop = 0,
    27                         resizeTimer;
     6                $customHeader = $body.find( '.custom-header' ),
     7                $customHeaderImage = $customHeader.find( '.custom-header-image' ),
     8                $branding = $customHeader.find( '.site-branding' ),
     9                $navigation = $body.find( '.navigation-top' ),
     10                $navWrap = $navigation.find( '.wrap' ),
     11                $navMenuItem = $navigation.find( '.menu-item' ),
     12                $menuToggle = $navigation.find( '.menu-toggle' ),
     13                $menuScrollDown = $body.find( '.menu-scroll-down' ),
     14                $sidebar = $body.find( '#secondary' ),
     15                $entryContent = $body.find( '.entry-content' ),
     16                $formatQuote = $body.find( '.format-quote blockquote' ),
     17                isFrontPage = $body.hasClass( 'twentyseventeen-front-page' ) || $body.hasClass( 'home blog' ),
     18                navigationFixedClass = 'site-navigation-fixed',
     19                navigationHeight,
     20                navigationOuterHeight,
     21                navPadding,
     22                navMenuItemHeight,
     23                idealNavHeight,
     24                navIsNotTooTall,
     25                headerOffset,
     26                menuTop = 0,
     27                resizeTimer;
    2828
    29         /**
    30          * Ensure the sticky navigation doesn't cover current focused links
    31          */
     29        // Ensure the sticky navigation doesn't cover current focused links.
    3230        $( '#content a, #colophon a' ).focus( function() {
    3331                if ( $navigation.hasClass( 'site-navigation-fixed' ) ) {
    3432                        var windowScrollTop = $( window ).scrollTop(),
     
    4240                        }
    4341
    4442                        if ( offsetDiff < fixedNavHeight ) {
    45                                 $( window ).scrollTo( itemScrollTop - ( fixedNavHeight + 50 ), 600);
     43                                $( window ).scrollTo( itemScrollTop - ( fixedNavHeight + 50 ), 600 );
    4644                        }
    4745                }
    4846        } );
    4947
    50         /**
    51          * Sets properties of navigation
    52          */
     48        // Set properties of navigation.
    5349        function setNavProps() {
    5450                navigationHeight      = $navigation.height();
    5551                navigationOuterHeight = $navigation.outerHeight();
     
    5955                navIsNotTooTall       = navigationHeight <= idealNavHeight;
    6056        }
    6157
    62         /**
    63          * Makes navigation 'stick'
    64          */
     58        // Make navigation 'stick'.
    6559        function adjustScrollClass() {
    6660
    67                 // Make sure we're not on a mobile screen
     61                // Make sure we're not on a mobile screen.
    6862                if ( 'none' === $menuToggle.css( 'display' ) ) {
    6963
    70                         // Make sure the nav isn't taller than two rows
     64                        // Make sure the nav isn't taller than two rows.
    7165                        if ( navIsNotTooTall ) {
    7266
    73                                 // When there's a custom header image, the header offset includes the height of the navigation
     67                                // When there's a custom header image, the header offset includes the height of the navigation.
    7468                                if ( isFrontPage && $customHeaderImage.length ) {
    7569                                        headerOffset = $customHeader.innerHeight() - navigationOuterHeight;
    7670                                } else {
     
    7771                                        headerOffset = $customHeader.innerHeight();
    7872                                }
    7973
    80                                 // If the scroll is more than the custom header, set the fixed class
     74                                // If the scroll is more than the custom header, set the fixed class.
    8175                                if ( $( window ).scrollTop() >= headerOffset ) {
    8276                                        $navigation.addClass( navigationFixedClass );
    8377                                } else {
     
    8680
    8781                        } else {
    8882
    89                                 // Remove 'fixed' class if nav is taller than two rows
     83                                // Remove 'fixed' class if nav is taller than two rows.
    9084                                $navigation.removeClass( navigationFixedClass );
    9185                        }
    9286                }
    9387        }
    9488
    95         /**
    96          * Sets margins of branding in header
    97          */
     89        // Set margins of branding in header.
    9890        function adjustHeaderHeight() {
    9991                if ( 'none' === $menuToggle.css( 'display' ) ) {
    10092
     
    111103                }
    112104        }
    113105
    114         /**
    115          * Sets icon for quotes
    116          */
     106        // Set icon for quotes.
    117107        function setQuotesIcon() {
    118108                $( twentyseventeenScreenReaderText.quote ).prependTo( $formatQuote );
    119109        }
    120110
    121         /**
    122          * Add 'below-entry-meta' class to elements.
    123          */
     111        // Add 'below-entry-meta' class to elements.
    124112        function belowEntryMetaClass( param ) {
    125113                var sidebarPos, sidebarPosBottom;
    126114
     
    138126
    139127                $entryContent.find( param ).each( function() {
    140128                        var $element = $( this ),
    141                                         elementPos = $element.offset(),
    142                                         elementPosTop = elementPos.top;
     129                                elementPos = $element.offset(),
     130                                elementPosTop = elementPos.top;
    143131
    144132                        // Add 'below-entry-meta' to elements below the entry meta.
    145133                        if ( elementPosTop > sidebarPosBottom ) {
     
    150138                });
    151139        }
    152140
    153         /**
     141        /*
    154142         * Test if inline SVGs are supported.
    155143         * @link https://github.com/Modernizr/Modernizr/
    156144         */
     
    160148                return 'http://www.w3.org/2000/svg' === ( 'undefined' !== typeof SVGRect && div.firstChild && div.firstChild.namespaceURI );
    161149        }
    162150
    163         // Fires on document ready
     151        // Fire on document ready.
    164152        $( document ).ready( function() {
    165153
    166                 // If navigation menu is present on page, setNavProps and adjustScrollClass
    167                 if( $navigation.length ) {
     154                // If navigation menu is present on page, setNavProps and adjustScrollClass.
     155                if ( $navigation.length ) {
    168156                        setNavProps();
    169157                        adjustScrollClass();
    170158                }
    171159
    172                 // If 'Scroll Down' arrow in present on page, calculate scroll offset and bind an event handler to the click event
     160                // If 'Scroll Down' arrow in present on page, calculate scroll offset and bind an event handler to the click event.
    173161                if ( $menuScrollDown.length ) {
    174162
    175163                        if ( $( 'body' ).hasClass( 'admin-bar' ) ) {
     
    176164                                menuTop -= 32;
    177165                        }
    178166                        if ( $( 'body' ).hasClass( 'blog' ) ) {
    179                                 menuTop -= 30; // The div for latest posts has no space above content, add some to account for this
     167                                menuTop -= 30; // The div for latest posts has no space above content, add some to account for this.
    180168                        }
    181169                        if ( ! $navigation.length ) {
    182170                                navigationOuterHeight = 0;
     
    186174                                e.preventDefault();
    187175                                $( window ).scrollTo( '#primary', {
    188176                                        duration: 600,
    189                                         offset: { 'top': menuTop - navigationOuterHeight }
     177                                        offset: { top: menuTop - navigationOuterHeight }
    190178                                } );
    191179                        } );
    192180                }
     
    198186                }
    199187        } );
    200188
    201         // If navigation menu is present on page, adjust it on scroll and screen resize
     189        // If navigation menu is present on page, adjust it on scroll and screen resize.
    202190        if ( $navigation.length ) {
    203191
    204                 // On scroll, we want to stick/unstick the navigation
     192                // On scroll, we want to stick/unstick the navigation.
    205193                $( window ).on( 'scroll', function() {
    206194                        adjustScrollClass();
    207195                        adjustHeaderHeight();
    208196                } );
    209197
    210                 // Also want to make sure the navigation is where it should be on resize
     198                // Also want to make sure the navigation is where it should be on resize.
    211199                $( window ).resize( function() {
    212200                        setNavProps();
    213201                        setTimeout( adjustScrollClass, 500 );
     
    222210                setTimeout( adjustHeaderHeight, 1000 );
    223211        } );
    224212
    225 }( jQuery ) );
     213} )( jQuery );
  • src/wp-content/themes/twentyseventeen/assets/js/navigation.js

     
    3030                container.find( '.menu-item-has-children, .page_item_has_children' ).attr( 'aria-haspopup', 'true' );
    3131
    3232                container.find( '.dropdown-toggle' ).click( function( e ) {
    33                         var _this            = $( this ),
     33                        var _this = $( this ),
    3434                                screenReaderSpan = _this.find( '.screen-reader-text' );
    3535
    3636                        e.preventDefault();
     
    3737                        _this.toggleClass( 'toggled-on' );
    3838                        _this.next( '.children, .sub-menu' ).toggleClass( 'toggled-on' );
    3939
    40                         // jscs:disable
    4140                        _this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
    42                         // jscs:enable
     41
    4342                        screenReaderSpan.text( screenReaderSpan.text() === twentyseventeenScreenReaderText.expand ? twentyseventeenScreenReaderText.collapse : twentyseventeenScreenReaderText.expand );
    4443                } );
    4544        }
     45
    4646        initMainNavigation( $( '.main-navigation' ) );
    4747
    48         masthead         = $( '#masthead' );
    49         menuToggle       = masthead.find( '.menu-toggle' );
    50         siteNavigation   = masthead.find( '.main-navigation > div > ul' );
     48        masthead       = $( '#masthead' );
     49        menuToggle     = masthead.find( '.menu-toggle' );
     50        siteNavigation = masthead.find( '.main-navigation > div > ul' );
    5151
    5252        // Enable menuToggle.
    5353        ( function() {
     
    6363                menuToggle.on( 'click.twentyseventeen', function() {
    6464                        $( siteNavigation.closest( '.main-navigation' ), this ).toggleClass( 'toggled-on' );
    6565
    66                         // jscs:disable
    6766                        $( this ).add( siteNavigation ).attr( 'aria-expanded', $( this ).add( siteNavigation ).attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' );
    68                         // jscs:enable
    6967                } );
    7068        } )();
    7169