class-wp-customize-themes-section.php (6756B)
1 <?php 2 /** 3 * Customize API: WP_Customize_Themes_Section class 4 * 5 * @package WordPress 6 * @subpackage Customize 7 * @since 4.4.0 8 */ 9 10 /** 11 * Customize Themes Section class. 12 * 13 * A UI container for theme controls, which are displayed within sections. 14 * 15 * @since 4.2.0 16 * 17 * @see WP_Customize_Section 18 */ 19 class WP_Customize_Themes_Section extends WP_Customize_Section { 20 21 /** 22 * Section type. 23 * 24 * @since 4.2.0 25 * @var string 26 */ 27 public $type = 'themes'; 28 29 /** 30 * Theme section action. 31 * 32 * Defines the type of themes to load (installed, wporg, etc.). 33 * 34 * @since 4.9.0 35 * @var string 36 */ 37 public $action = ''; 38 39 /** 40 * Theme section filter type. 41 * 42 * Determines whether filters are applied to loaded (local) themes or by initiating a new remote query (remote). 43 * When filtering is local, the initial themes query is not paginated by default. 44 * 45 * @since 4.9.0 46 * @var string 47 */ 48 public $filter_type = 'local'; 49 50 /** 51 * Get section parameters for JS. 52 * 53 * @since 4.9.0 54 * @return array Exported parameters. 55 */ 56 public function json() { 57 $exported = parent::json(); 58 $exported['action'] = $this->action; 59 $exported['filter_type'] = $this->filter_type; 60 61 return $exported; 62 } 63 64 /** 65 * Render a themes section as a JS template. 66 * 67 * The template is only rendered by PHP once, so all actions are prepared at once on the server side. 68 * 69 * @since 4.9.0 70 */ 71 protected function render_template() { 72 ?> 73 <li id="accordion-section-{{ data.id }}" class="theme-section"> 74 <button type="button" class="customize-themes-section-title themes-section-{{ data.id }}">{{ data.title }}</button> 75 <?php if ( current_user_can( 'install_themes' ) || is_multisite() ) : // @todo Upload support. ?> 76 <?php endif; ?> 77 <div class="customize-themes-section themes-section-{{ data.id }} control-section-content themes-php"> 78 <div class="theme-overlay" tabindex="0" role="dialog" aria-label="<?php esc_attr_e( 'Theme Details' ); ?>"></div> 79 <div class="theme-browser rendered"> 80 <div class="customize-preview-header themes-filter-bar"> 81 <?php $this->filter_bar_content_template(); ?> 82 </div> 83 <?php $this->filter_drawer_content_template(); ?> 84 <div class="error unexpected-error" style="display: none; "> 85 <p> 86 <?php 87 printf( 88 /* translators: %s: Support forums URL. */ 89 __( 'An unexpected error occurred. Something may be wrong with WordPress.org or this server’s configuration. If you continue to have problems, please try the <a href="%s">support forums</a>.' ), 90 __( 'https://wordpress.org/support/forums/' ) 91 ); 92 ?> 93 </p> 94 </div> 95 <ul class="themes"> 96 </ul> 97 <p class="no-themes"><?php _e( 'No themes found. Try a different search.' ); ?></p> 98 <p class="no-themes-local"> 99 <?php 100 printf( 101 /* translators: %s: "Search WordPress.org themes" button text. */ 102 __( 'No themes found. Try a different search, or %s.' ), 103 sprintf( '<button type="button" class="button-link search-dotorg-themes">%s</button>', __( 'Search WordPress.org themes' ) ) 104 ); 105 ?> 106 </p> 107 <p class="spinner"></p> 108 </div> 109 </div> 110 </li> 111 <?php 112 } 113 114 /** 115 * Render the filter bar portion of a themes section as a JS template. 116 * 117 * The template is only rendered by PHP once, so all actions are prepared at once on the server side. 118 * The filter bar container is rendered by @see `render_template()`. 119 * 120 * @since 4.9.0 121 */ 122 protected function filter_bar_content_template() { 123 ?> 124 <button type="button" class="button button-primary customize-section-back customize-themes-mobile-back"><?php _e( 'Go to theme sources' ); ?></button> 125 <# if ( 'wporg' === data.action ) { #> 126 <div class="search-form"> 127 <label for="wp-filter-search-input-{{ data.id }}" class="screen-reader-text"><?php _e( 'Search themes…' ); ?></label> 128 <input type="search" id="wp-filter-search-input-{{ data.id }}" placeholder="<?php esc_attr_e( 'Search themes…' ); ?>" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search"> 129 <div class="search-icon" aria-hidden="true"></div> 130 <span id="{{ data.id }}-live-search-desc" class="screen-reader-text"><?php _e( 'The search results will be updated as you type.' ); ?></span> 131 </div> 132 <button type="button" class="button feature-filter-toggle"> 133 <span class="filter-count-0"><?php _e( 'Filter themes' ); ?></span><span class="filter-count-filters"> 134 <?php 135 /* translators: %s: Number of filters selected. */ 136 printf( __( 'Filter themes (%s)' ), '<span class="theme-filter-count">0</span>' ); 137 ?> 138 </span> 139 </button> 140 <# } else { #> 141 <div class="themes-filter-container"> 142 <label for="{{ data.id }}-themes-filter" class="screen-reader-text"><?php _e( 'Search themes…' ); ?></label> 143 <input type="search" id="{{ data.id }}-themes-filter" placeholder="<?php esc_attr_e( 'Search themes…' ); ?>" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search wp-filter-search-themes" /> 144 <div class="search-icon" aria-hidden="true"></div> 145 <span id="{{ data.id }}-live-search-desc" class="screen-reader-text"><?php _e( 'The search results will be updated as you type.' ); ?></span> 146 </div> 147 <# } #> 148 <div class="filter-themes-count"> 149 <span class="themes-displayed"> 150 <?php 151 /* translators: %s: Number of themes displayed. */ 152 printf( __( '%s themes' ), '<span class="theme-count">0</span>' ); 153 ?> 154 </span> 155 </div> 156 <?php 157 } 158 159 /** 160 * Render the filter drawer portion of a themes section as a JS template. 161 * 162 * The filter bar container is rendered by @see `render_template()`. 163 * 164 * @since 4.9.0 165 */ 166 protected function filter_drawer_content_template() { 167 // @todo Use the .org API instead of the local core feature list. 168 // The .org API is currently outdated and will be reconciled when the .org themes directory is next redesigned. 169 $feature_list = get_theme_feature_list( false ); 170 ?> 171 <# if ( 'wporg' === data.action ) { #> 172 <div class="filter-drawer filter-details"> 173 <?php foreach ( $feature_list as $feature_name => $features ) : ?> 174 <fieldset class="filter-group"> 175 <legend><?php echo esc_html( $feature_name ); ?></legend> 176 <div class="filter-group-feature"> 177 <?php foreach ( $features as $feature => $feature_name ) : ?> 178 <input type="checkbox" id="filter-id-<?php echo esc_attr( $feature ); ?>" value="<?php echo esc_attr( $feature ); ?>" /> 179 <label for="filter-id-<?php echo esc_attr( $feature ); ?>"><?php echo esc_html( $feature_name ); ?></label> 180 <?php endforeach; ?> 181 </div> 182 </fieldset> 183 <?php endforeach; ?> 184 </div> 185 <# } #> 186 <?php 187 } 188 }