WordPress.org

Make WordPress Core

Ticket #25963: 25963.9.diff

File 25963.9.diff, 6.8 KB (added by adamsilverstein, 6 years ago)

combines 7 & 8, fixes missing event in collapse call

  • src/wp-admin/js/theme.js

     
    292292                                scroll = document.body.scrollTop;
    293293
    294294                                // Clean the url structure
    295                                 themes.router.navigate( '' );
     295                                themes.router.navigate( themes.router.baseUrl( '' ), { replace: true } );
    296296
    297297                                // Restore scroll position
    298298                                document.body.scrollTop = scroll;
     
    300300                }
    301301        },
    302302
    303         // Handles arrow keys navigation for the overlay
    304         // Triggers theme:next and theme:previous events
     303        // Handles .disabled classes for next/previous buttons
    305304        navigation: function() {
    306                 var self = this;
    307305
    308                 $( 'body' ).on( 'keyup', function( event ) {
    309 
    310                         // Pressing the right arrow key fires a theme:next event
    311                         if ( event.keyCode === 39 ) {
    312                                 self.trigger( 'theme:next', self.model.cid );
    313                         }
    314 
    315                         // Pressing the left arrow key fires a theme:previous event
    316                         if ( event.keyCode === 37 ) {
    317                                 self.trigger( 'theme:previous', self.model.cid );
    318                         }
    319 
    320                         // Pressing the escape key closes the theme details panel
    321                         if ( event.keyCode === 27 ) {
    322                                 self.collapse();
    323                         }
    324                 });
    325 
    326306                // Disable Left/Right when at the start or end of the collection
    327307                if ( this.model.cid === this.model.collection.at(0).cid ) {
    328308                        this.$el.find( '.left' ).addClass( 'disabled' );
     
    380360themes.view.Themes = wp.Backbone.View.extend({
    381361
    382362        className: 'themes',
     363        $overlay: $( 'div.theme-overlay' ),
    383364
    384365        // Number to keep track of scroll position
    385366        // while in theme-overlay mode
     
    410391                this.listenTo( this.parent, 'theme:scroll', function() {
    411392                        self.renderThemes( self.parent.page );
    412393                });
     394
     395                // Bind keyboard events.
     396                $('body').on( 'keyup', function( event ) {
     397                        // Pressing the right arrow key fires a theme:next event
     398                        if ( event.keyCode === 39 ) {
     399                                self.overlay.nextTheme();
     400                        }
     401
     402                        // Pressing the left arrow key fires a theme:previous event
     403                        if ( event.keyCode === 37 ) {
     404                                self.overlay.previousTheme();
     405                        }
     406
     407                        // Pressing the escape key fires a theme:collapse event
     408                        if ( event.keyCode === 27 ) {
     409                                self.overlay.collapse( event );
     410                        }
     411                });
    413412        },
    414413
    415414        // Manages rendering of theme pages
     
    511510                this.model = self.collection.get( id );
    512511
    513512                // Trigger a route update for the current model
    514                 themes.router.navigate( 'theme/' + this.model.id );
     513                themes.router.navigate( themes.router.baseUrl( '?theme=' + this.model.id ), { replace: true } );
    515514
    516515                // Sets this.view to 'detail'
    517516                this.setView( 'detail' );
     
    523522                });
    524523
    525524                this.overlay.render();
    526                 this.$el.append( this.overlay.el );
     525                this.$overlay.html( this.overlay.el );
    527526
    528527                this.overlay.screenshotGallery();
    529528
     
    565564                        this.overlay.closeOverlay();
    566565
    567566                        // Trigger a route update for the current model
    568                         // that renders the new theme's overlay
    569                         themes.router.navigate( 'theme/' + nextModel.id, { trigger: true } );
     567                        self.theme.trigger( 'theme:expand', nextModel.cid );
     568
    570569                }
    571570        },
    572571
     
    589588                        this.overlay.closeOverlay();
    590589
    591590                        // Trigger a route update for the current model
    592                         // that renders the new theme's overlay
    593                         themes.router.navigate( 'theme/' + previousModel.id, { trigger: true } );
     591                        self.theme.trigger( 'theme:expand', previousModel.cid );
     592
    594593                }
    595594        }
    596595});
     
    624623
    625624                // Update the URL hash
    626625                if ( event.target.value ) {
    627                         themes.router.navigate( 'search/' + event.target.value, { replace: true } );
     626                        themes.router.navigate( themes.router.baseUrl( '?search=' + event.target.value ), { replace: true } );
    628627                } else {
    629                         themes.router.navigate( '' );
     628                        themes.router.navigate( themes.router.baseUrl( '' ), { replace: true } );
    630629                }
    631630        }
    632631});
     
    635634// Listens to [theme] and [search] params
    636635themes.routes = Backbone.Router.extend({
    637636
    638         routes: {
    639                 'search/*query': 'search',
    640                 'theme/*slug': 'theme'
     637        initialize: function() {
     638                this.routes = _.object([
     639                ]);
    641640        },
    642641
     642        baseUrl: function( url ) {
     643                return themes.data.settings.root + url;
     644        },
     645
    643646        // Set the search input value based on url
    644647        search: function( query ) {
    645648                $( '.theme-search' ).val( query );
     649                _.debounce( self.themes.doSearch( query ), 200 );
    646650        }
    647651});
    648652
     
    667671        render: function() {
    668672                // Render results
    669673                this.view.render();
    670 
    671                 // Calls the routes functionality
    672674                this.routes();
    673675
    674                 // Set ups history with pushState and our root
    675                 Backbone.history.start({ root: themes.data.settings.root });
     676                // Set the initial theme
     677                if ( 'undefined' !== typeof themes.data.settings.theme && '' !== themes.data.settings.theme ){
     678                        this.view.view.theme.trigger( 'theme:expand', this.view.collection.findWhere( { id: themes.data.settings.theme } ) );
     679                }
     680
     681                // Set the initial search
     682                if ( 'undefined' !== typeof themes.data.settings.search && '' !== themes.data.settings.search ){
     683                        $( '.theme-search' ).val( themes.data.settings.search );
     684                        this.themes.doSearch( themes.data.settings.search );
     685                }
     686
     687                // Start the router if browser supports History API
     688                if ( window.history && window.history.pushState ) {
     689                        // Calls the routes functionality
     690                        Backbone.history.start({ pushState: true, silent: true });
     691                }
    676692        },
    677693
    678694        routes: function() {
     
    680696                // Bind to our global thx object
    681697                // so that the object is available to sub-views
    682698                themes.router = new themes.routes();
    683 
    684                 // Handles theme details route event
    685                 themes.router.on( 'route:theme', function( slug ) {
    686                         self.view.view.expand( slug );
    687                 });
    688 
    689                 // Handles search route event
    690                 themes.router.on( 'route:search', function( query ) {
    691                         self.themes.doSearch( query );
    692                 });
    693699        }
    694700};
    695701
  • src/wp-admin/themes.php

     
    9191} else {
    9292        $themes = wp_prepare_themes_for_js( array( wp_get_theme() ) );
    9393}
     94wp_reset_vars( array( 'theme', 'search' ) );
    9495
    9596wp_localize_script( 'theme', '_wpThemeSettings', array(
    9697        'themes'   => $themes,
     
    9899                'canInstall'    => ( ! is_multisite() && current_user_can( 'install_themes' ) ),
    99100                'installURI'    => ( ! is_multisite() && current_user_can( 'install_themes' ) ) ? admin_url( 'theme-install.php' ) : null,
    100101                'confirmDelete' => __( "Are you sure you want to delete this theme?\n\nClick 'Cancel' to go back, 'OK' to confirm the delete." ),
    101                 'root'          => admin_url( 'themes.php' ),
     102                'root'          => parse_url( admin_url( 'themes.php' ), PHP_URL_PATH ),
    102103                'extraRoutes'   => '',
     104                'theme'         => esc_html( $theme ),
     105                'search'        => esc_html( $search ),
     106
    103107        ),
    104108        'l10n' => array(
    105109                'addNew' => __( 'Add New Theme' ),
     
    180184?>
    181185
    182186<div class="theme-browser"></div>
     187<div class="theme-overlay"></div>
    183188
    184189<?php
    185190// List broken themes, if any.