Ticket #35457: 35457.2.patch

src/wp-admin/css/common.css

@@ -608 +608 @@
         text-shadow: none;
         font-weight: 600;
         font-size: 13px;
+        cursor: pointer;
 }
 
 .wrap .add-new-h2:hover, /* deprecated */

src/wp-admin/css/themes.css

@@ -1058 +1058 @@
 }
 
 .upload-view-toggle .browse,
-.upload-view-toggle.upload-tab .upload {
+.upload-view-toggle.upload-tab .upload,
+.show-upload-view .hide-if-upload-view {
         display: none;
 }
 
@@ -1103 +1104 @@
         padding: 40px 0 0;
         text-align: center;
 }
-body.show-upload-theme .upload-theme + .wp-filter,
-body.show-upload-theme .upload-theme + .wp-filter + .theme-browser {
-        display: none;
-}
 
 p.no-themes {
         clear: both;
@@ -1119 +1116 @@
         display: none;
 }
 
-body.no-results p.no-themes {
+.no-results p.no-themes {
         display: block;
 }
 
-body.show-upload-theme p.no-themes {
-        display: none !important;
-}
-
 .theme-install-php .add-new-theme {
         display: none !important;
 }

src/wp-admin/js/theme.js

@@ -1610 +1610 @@
          */
         uploader: function() {
                 var uploadViewToggle = $( '.upload-view-toggle' ),
-                        $body = $( document.body );
+                        $body = $( document.body ),
+                        uploaderOpen;
 
-                uploadViewToggle
-                        .attr({
-                                role: 'button',
-                                'aria-expanded': 'false'
-                        })
-                        .on( 'click', function( event ) {
-                                event.preventDefault();
-                                $body.toggleClass( 'show-upload-view' );
-                                uploadViewToggle.attr( 'aria-expanded', $body.hasClass( 'show-upload-view' ) );
-                        });
+                uploadViewToggle.on( 'click', function() {
+                        // Toggle the upload view.
+                        $body.toggleClass( 'show-upload-view' );
+                        // Get and store the upload view collapsed/expanded status.
+                        uploaderOpen = $body.hasClass( 'show-upload-view' )
+                        // Toggle the `aria-expanded` button attribute.
+                        uploadViewToggle.attr( 'aria-expanded', uploaderOpen );
+                        // Support the `upload` route.
+                        if ( uploaderOpen ) {
+                                themes.router.navigate( themes.router.baseUrl( '?upload' ), { replace: true } );
+                        } else {
+                                themes.router.navigate( themes.router.baseUrl( '' ), { replace: true } );
+                        }
+                });
         },
 
         // Toggle the full filters navigation
@@ -1759 +1764 @@
 
                 // Support the `upload` route by going straight to upload section
                 themes.router.on( 'route:upload', function() {
-                        $( 'a.upload' ).trigger( 'click' );
+                        $( '.upload-view-toggle' ).trigger( 'click' );
                 });
 
                 // The `search` route event. The router populates the input field.

src/wp-admin/theme-install.php

@@ -127 +127 @@
          */
         $tabs = apply_filters( 'install_themes_tabs', array( 'upload' => __( 'Upload Theme' ) ) );
         if ( ! empty( $tabs['upload'] ) && current_user_can( 'upload_themes' ) ) {
-                echo ' <a href="#" class="upload-view-toggle page-title-action">' . __( 'Upload Theme' ) . '</a>';
+                echo ' <button type="button" class="upload-view-toggle page-title-action hide-if-no-js" aria-expanded="false">' . __( 'Upload Theme' ) . '</button>';
         }
         ?></h1>
+        <div class="error hide-if-js">
+                <p><?php _e( 'The Theme Installer screen requires JavaScript.' ); ?></p>
+        </div>
 
         <div class="upload-theme">
         <?php install_themes_upload(); ?>
         </div>
 
-        <h2 class="screen-reader-text"><?php _e( 'Filter themes list' ); ?></h2>
+        <h2 class="screen-reader-text hide-if-no-js hide-if-upload-view"><?php _e( 'Filter themes list' ); ?></h2>
 
-        <div class="wp-filter">
+        <div class="wp-filter hide-if-no-js hide-if-upload-view">
                 <div class="filter-count">
                         <span class="count theme-count"></span>
                 </div>
@@ -201 +204 @@
                         </div>
                 </div>
         </div>
-        <h2 class="screen-reader-text"><?php _e( 'Themes list' ); ?></h2>
-        <div class="theme-browser content-filterable"></div>
+        <h2 class="screen-reader-text hide-if-no-js hide-if-upload-view"><?php _e( 'Themes list' ); ?></h2>
+        <div class="theme-browser content-filterable hide-if-upload-view"></div>
         <div class="theme-install-overlay wp-full-overlay expanded"></div>
 
-        <p class="no-themes"><?php _e( 'No themes found. Try a different search.' ); ?></p>
+        <p class="no-themes hide-if-upload-view"><?php _e( 'No themes found. Try a different search.' ); ?></p>
         <span class="spinner"></span>
 
 <?php