Changeset 27499 for trunk/src/wp-admin/theme-install.php

Timestamp:

03/11/2014 07:46:27 AM (12 years ago)

Author:

nacin

Message:

Bring the theme browsing experience from 3.8 to the theme installer. First pass.

props matveb with assists from me and gcorne.
see #27055.

File:

• trunk/src/wp-admin/theme-install.php (modified) (5 diffs)

trunk/src/wp-admin/theme-install.php

@@ -7 +7 @@
  */
 
-if ( !defined( 'IFRAME_REQUEST' ) && isset( $_GET['tab'] ) && ( 'theme-information' == $_GET['tab'] ) )
-        define( 'IFRAME_REQUEST', true );
-
 /** WordPress Administration Bootstrap */
 require_once( dirname( __FILE__ ) . '/admin.php' );
+require( ABSPATH . 'wp-admin/includes/theme-install.php' );
+
+wp_reset_vars( array( 'tab' ) );
 
 if ( ! current_user_can('install_themes') )
@@ -21 +21 @@
 }
 
-$wp_list_table = _get_list_table('WP_Theme_Install_List_Table');
-$pagenum = $wp_list_table->get_pagenum();
-$wp_list_table->prepare_items();
-
-$title = __('Install Themes');
+$title = __( 'Add Themes' );
 $parent_file = 'themes.php';
-if ( !is_network_admin() )
+
+if ( ! is_network_admin() ) {
         $submenu_file = 'themes.php';
-
-wp_enqueue_script( 'theme-install' );
-wp_enqueue_script( 'theme-preview' );
-
-$body_id = $tab;
+}
+
+$sections = array(
+        'featured' => __( 'Featured Themes' ),
+        'popular'  => __( 'Popular Themes' ),
+        'new'      => __( 'Newest Themes' ),
+);
+
+wp_localize_script( 'theme', '_wpThemeSettings', array(
+        'themes'   => false,
+        'settings' => array(
+                'isInstall'     => true,
+                'canInstall'    => current_user_can( 'install_themes' ),
+                'installURI'    => current_user_can( 'install_themes' ) ? self_admin_url( 'theme-install.php' ) : null,
+                'adminUrl'      => parse_url( self_admin_url(), PHP_URL_PATH ),
+                'updateURI'     => self_admin_url( 'update.php' ),
+                '_nonceInstall' => wp_create_nonce( 'install-theme' )
+        ),
+        'l10n' => array(
+                'addNew' => __( 'Add New Theme' ),
+                'search'  => __( 'Search Themes' ),
+                'searchPlaceholder' => __( 'Search themes...' ),
+                'upload' => __( 'Upload Theme' ),
+                'back'   => __( 'Back' ),
+                'error'  => __( 'There was a problem trying to load the themes. Please, try again.' ),
+        ),
+        'browse' => array(
+                'sections' => $sections,
+        ),
+) );
+
+wp_enqueue_script( 'theme' );
 
 /**
@@ -44 +68 @@
  * @since 2.8.0
  */
-do_action( "install_themes_pre_{$tab}" );
+if ( $tab ) {
+        do_action( "install_themes_pre_{$tab}" );
+}
 
 $help_overview =
@@ -74 +100 @@
 
 include(ABSPATH . 'wp-admin/admin-header.php');
+
 ?>
 <div class="wrap">
-<h2><?php echo esc_html( $title ); ?></h2>
-<?php
-
-$wp_list_table->views(); ?>
-
-<br class="clear" />
+        <h2>
+                <?php echo esc_html( $title ); ?>
+                <a class="upload button button-secondary"><?php esc_html_e( 'Upload Theme' ); ?></a>
+        </h2>
+
+        <div class="upload-theme">
+        <?php install_themes_upload(); ?>
+        </div>
+
+        <div class="theme-navigation">
+                <span class="theme-count"></span>
+                <span class="theme-section current" data-sort="featured"><?php esc_html_e( 'Featured' ); ?></span>
+                <span class="theme-section" data-sort="popular"><?php esc_html_e( 'Popular' ); ?></span>
+                <span class="theme-section" data-sort="new"><?php esc_html_e( 'Latest' ); ?></span>
+                <div class="theme-top-filters">
+                        <span class="theme-filter" data-filter="photoblogging">Photography</span>
+                        <span class="theme-filter" data-filter="responsive-layout">Responsive</span>
+                        <span class="theme-filter more-filters">More</span>
+                </div>
+                <div class="more-filters-container">
+                        Display more filters.
+                </div>
+        </div>
+        <div class="theme-browser"></div>
+        <div class="theme-overlay"></div>
+        <div id="theme-installer" class="wp-full-overlay expanded"></div>
+
+        <span class="spinner"></span>
+
+        <br class="clear" />
 <?php
 /**
@@ -94 +145 @@
  * @param int $paged Number of the current page of results being viewed.
  */
-do_action( "install_themes_{$tab}", $paged );
+if ( $tab ) {
+        do_action( "install_themes_{$tab}", $paged );
+}
 ?>
 </div>
+
+<script id="tmpl-theme" type="text/template">
+        <# if ( data.screenshot_url ) { #>
+                <div class="theme-screenshot">
+                        <img src="{{ data.screenshot_url }}" alt="" />
+                </div>
+        <# } else { #>
+                <div class="theme-screenshot blank"></div>
+        <# } #>
+        <span class="more-details"><?php _ex( 'Details &amp; Preview', 'theme' ); ?></span>
+        <div class="theme-author"><?php printf( __( 'By %s' ), '{{ data.author }}' ); ?></div>
+        <h3 class="theme-name">{{ data.name }}</h3>
+
+        <div class="theme-actions">
+                <a class="button button-primary" href="{{ data.installURI }}"><?php esc_html_e( 'Install' ); ?></a>
+                <a class="button button-secondary preview install-theme-preview" href="#"><?php esc_html_e( 'Preview' ); ?></a>
+        </div>
+</script>
+
+<script id="tmpl-theme-preview" type="text/template">
+        <div class="wp-full-overlay-sidebar">
+                <div class="wp-full-overlay-header">
+                        <a href="" class="close-full-overlay button-secondary"><?php _e( 'Close' ); ?></a>
+                        <a href="{{ data.installURI }}" class="button button-primary theme-install"><?php _e( 'Install' ); ?></a>
+                </div>
+                <div class="wp-full-overlay-sidebar-content">
+                        <div class="install-theme-info">
+                                <h3 class="theme-name">{{ data.name }}</h3>
+                                <span class="theme-by"><?php printf( __( 'By %s' ), '{{ data.author }}' ); ?></span>
+
+                                <img class="theme-screenshot" src="{{ data.screenshot_url }}" alt="" />
+
+                                <div class="theme-details">
+                                        <div class="rating rating-{{ Math.round( data.rating / 10 ) * 10 }}">
+                                                <span class="one"></span>
+                                                <span class="two"></span>
+                                                <span class="three"></span>
+                                                <span class="four"></span>
+                                                <span class="five"></span>
+                                                <p class="votes"><?php printf( __( 'Based on %s ratings.' ), '{{ data.num_ratings }}' ); ?></p>
+                                        </div>
+                                        <div class="theme-version"><?php printf( __( 'Version: %s' ), '{{ data.version }}' ); ?></div>
+                                        <div class="theme-description">{{ data.description }}</div>
+                                </div>
+                        </div>
+                </div>
+                <div class="wp-full-overlay-footer">
+                        <a href="" class="collapse-sidebar" title="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
+                                <span class="collapse-sidebar-label"><?php _e( 'Collapse' ); ?></span>
+                                <span class="collapse-sidebar-arrow"></span>
+                        </a>
+                </div>
+        </div>
+        <div class="wp-full-overlay-main">
+                <iframe src="{{ data.preview_url }}" />
+        </div>
+</script>
+
 <?php
 include(ABSPATH . 'wp-admin/admin-footer.php');