Ticket #36613: 36613.2.diff

src/wp-admin/js/theme.js

@@ -492 +492 @@
                 themes.focusedTheme = this.$el;
 
                 // Construct a new Preview view.
-                preview = new themes.view.Preview({
+                themes.currentPreview = preview = new themes.view.Preview({
                         model: this.model
                 });
 
@@ -572 +572 @@
                 this.listenTo( preview, 'preview:close', function() {
                         self.current = self.model;
                 });
+
+                // Listen for closepreview events, closing the preview.
+                this.listenTo( preview, 'closepreview', function() {
+                        preview.close();
+                });
         },
 
         // Handles .disabled classes for previous/next buttons in theme installer preview
@@ -885 +890 @@
                         self.tooglePreviewDeviceButtons( currentPreviewDevice );
                 }
 
-                themes.router.navigate( themes.router.baseUrl( themes.router.themePath + this.model.get( 'id' ) ), { replace: true } );
+                themes.router.navigate( themes.router.baseUrl( themes.router.themePath + this.model.get( 'id' ) ), { replace: false } );
 
                 this.$el.fadeIn( 200, function() {
                         $body.addClass( 'theme-installer-active full-overlay-active' );
@@ -1902 +1907 @@
                 // Handles `theme` route event
                 // Queries the API for the passed theme slug
                 themes.router.on( 'route:preview', function( slug ) {
-                        request.theme = slug;
-                        self.view.collection.query( request );
-                        self.view.collection.once( 'update', function() {
+
+                        // If the theme preview is active, set the current theme.
+                        if ( self.view.view.theme && self.view.view.theme.preview ) {
+                                self.view.view.theme.model = self.view.collection.findWhere( { 'slug': slug } );
                                 self.view.view.theme.preview();
-                        });
+                        } else {
+
+                                // Select the theme by slug.
+                                request.theme = slug;
+                                self.view.collection.query( request );
+                                self.view.collection.trigger( 'update' );
+
+                                // Open the theme preview.
+                                self.view.collection.once( 'query:success', function() {
+                                        $( 'div[data-slug="' + slug + '"]' ).trigger( 'click' );
+                                })
+
+                        }
                 });
 
                 // Handles sorting / browsing routes
@@ -1917 +1935 @@
                                 sort = 'featured';
                         }
                         self.view.sort( sort );
-                        self.view.trigger( 'theme:close' );
+
+                        // Close the current preview.
+                        if ( themes.currentPreview ) {
+                                themes.currentPreview.trigger( 'closepreview' );
+                        }
                 });
 
                 // The `search` route event. The router populates the input field.