Changeset 1282

Timestamp:

02/19/2015 08:01:44 PM (12 years ago)

Author:

obenland

Message:

WP.org Themes: Give previews their own place in history.

Allows users to navigate from index to Detail to Preview and back, using UI or
the browser back button. Also makes sure that if they navigate between themes
while in Preview, Detail come along for the ride and greets them with the right
theme once they leave Preview.

Fixes #843.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-themes/js/theme.js (modified) (6 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-themes/js/theme.js

@@ -280 +280 @@
                         // for `theme:next` and `theme:previous` events.
                         this.listenTo( preview, 'theme:next', function() {
+                                this.trigger( 'theme:next' );
 
                                 // Keep local track of current theme model.
@@ -306 +307 @@
                         })
                                 .listenTo( preview, 'theme:previous', function() {
+                                        this.trigger( 'theme:previous' );
 
                                         // Keep track of current theme model.
@@ -442 +444 @@
         _.extend( wp.themes.view.Preview.prototype, {
 
+                render: function() {
+                        var data = this.model.toJSON();
+
+                        this.$el.html( this.html( data ) );
+
+                        wp.themes.router.navigate( wp.themes.router.baseUrl( wp.themes.router.themePath + this.model.get( 'id' ) + '/preview' ) );
+
+                        this.$el.fadeIn( 200, function() {
+                                $( 'body' ).addClass( 'theme-installer-active full-overlay-active' );
+                                $( '.close-full-overlay' ).focus();
+                        });
+                },
+
                 close: function() {
                         this.$el.fadeOut( 200, function() {
@@ -455 +470 @@
                         this.undelegateEvents();
                         this.unbind();
+                        wp.themes.router.navigate( wp.themes.router.baseUrl( wp.themes.router.themePath + this.model.get( 'id' ) ) );
                         return false;
                 },
@@ -521 +537 @@
         _.extend( wp.themes.InstallerRouter.prototype, {
                 routes: {
-                        'browse/:sort/': 'sort',
-                        'tag/:tag/': 'tag',
-                        'search/:query/': 'search',
+                        'browse/:sort/'  : 'sort',
+                        'tag/:tag/'      : 'tag',
+                        'search/:query/' : 'search',
                         'author/:author/': 'author',
-                        ':slug/': 'preview',
-                        '': 'sort'
+                        ':slug/preview/' : 'preview',
+                        ':slug/'         : 'preview',
+                        ''               : 'sort'
                 },
 
@@ -548 +565 @@
                         // Open the modal when matching the route for a single themes.
                         wp.themes.router.on( 'route:preview', function( slug ) {
+                                $( '.close-full-overlay' ).trigger( 'click' );
                                 this.listenToOnce( self.view.collection, 'query:success', function() {
                                         self.view.view.expand( slug );