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

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

Built from https://develop.svn.wordpress.org/trunk@27499


git-svn-id: http://core.svn.wordpress.org/trunk@27341 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrew Nacin 2014-03-11 07:47:15 +00:00
parent 69ccc8b53d
commit 9aca2a65f8
14 changed files with 979 additions and 662 deletions

View File

@ -25,7 +25,8 @@
margin-right: 20px;
}
.themes-php .wrap .theme-count {
.themes-php .wrap .theme-count,
.theme-navigation .theme-count {
color: #fff;
-webkit-border-radius: 30px;
border-radius: 30px;
@ -1064,157 +1065,210 @@ body.folded .theme-overlay .theme-wrap {
16.2 - Install Themes
------------------------------------------------------------------------------*/
.theme-install-php h4 {
margin: 2.5em 0 8px;
.theme-install-php h2 .upload {
margin-right: 10px;
}
.theme-install-php .tablenav {
height: auto;
}
.theme-install-php .spinner {
margin-top: 9px;
}
.available-theme {
.theme-navigation {
background: #fff;
box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #555;
display: inline-block;
margin-left: 10px;
overflow: hidden;
padding: 20px 0 20px 20px;
vertical-align: top;
width: 300px;
font-size: 13px;
margin: 20px 0 30px;
padding: 0 20px;
position: relative;
width: 100%;
}
.available-theme .screenshot {
width: 300px;
height: 225px;
.upload-theme {
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
margin: 0px 0 0;
padding: 0;
width: 100%;
overflow: hidden;
position: relative;
top: 10px;
}
.upload-theme.opened {
display: block;
border: 1px solid #ccc;
margin-bottom: 10px;
overflow: hidden;
background-color: #fff;
}
.available-theme img {
width: 300px;
.upload-theme .wp-upload-form {
background: #fafafa;
border: 1px solid #e5e5e5;
padding: 30px;
margin: 30px auto;
max-width: 380px;
}
.available-theme h3 {
margin: 15px 0 0;
.upload-theme .install-help {
color: #999;
font-size: 18px;
font-style: normal;
margin: 0;
padding: 40px 0 0;
text-align: center;
}
.available-theme .theme-author {
line-height: 18px;
.upload-theme.opened + .theme-navigation,
.upload-theme.opened + .theme-navigation + .theme-browser {
display: none;
}
.available-theme .action-links {
margin-top: 10px;
overflow: hidden;
.theme-navigation .theme-count {
top: 3px;
margin-right: 0;
}
.available-theme a.screenshot:focus {
border-color: #777;
}
.available-theme .action-links li {
float: right;
padding-left: 10px;
margin-left: 10px;
border-left: 1px solid #dfdfdf;
}
.available-theme .action-links li {
padding-left: 8px;
margin-left: 8px;
}
.ie8 .available-theme .action-links li {
padding-left: 7px;
margin-left: 7px;
}
.available-theme .action-links li:last-child {
padding-left: 0;
margin-left: 0;
border-left: 0;
}
.available-theme .action-links .delete-theme {
float: left;
margin-right: 8px;
margin-left: 0;
}
.available-theme .action-links .delete-theme a {
color: red;
padding: 2px;
}
.available-theme .action-links .delete-theme a:hover {
background: red;
color: #fff;
text-decoration: none;
}
.available-theme .action-links p {
float: right;
}
/* Allow for three-up in small windows when sidebar is collapsed */
@media only screen and (max-width: 1200px) {
.folded .available-theme,
.folded .available-theme .screenshot {
width: 300px;
}
.folded .available-theme .screenshot {
height: 225px;
}
}
/* Adjust three-up display in smaller windows when sidebar is collapsed */
@media only screen and (max-width: 1079px) {
.folded .available-theme,
.folded .available-theme .screenshot {
width: 270px;
}
.folded .available-theme .screenshot {
height: 203px;
}
}
/* Allow for three-up on 1024px wide screens, e.g. tablets */
@media only screen and (max-width: 1200px) {
.available-theme,
.available-theme .screenshot {
width: 240px;
}
.available-theme .screenshot {
height: 180px;
}
.available-theme img {
width: 100%;
}
}
.feature-filter {
padding: 8px 12px 0;
}
.feature-filter .feature-group {
float: right;
margin: 5px 10px 10px;
}
.feature-filter .feature-group li {
.theme-section,
.theme-filter {
border-bottom: 4px solid #fff;
color: #666;
cursor: pointer;
display: inline-block;
margin: 0 10px;
padding: 15px 0;
-moz-transition: border-color .1s ease-in;
-webkit-transition: border-color .1s ease-in;
}
.theme-section.current,
.theme-filter.current {
border-bottom: 4px solid #666;
color: #222;
}
.theme-top-filters {
display: inline-block;
}
.theme-navigation .more-filters {
color: #666;
cursor: pointer;
display: inline-block;
margin: 0 10px;
padding: 4px 5px;
-moz-transition: color .1s ease-in, background .1s ease-in;
-webkit-transition: color .1s ease-in, background .1s ease-in;
transition: color .1s ease-in, background .1s ease-in;
}
body.more-filters-opened .more-filters,
.theme-navigation .more-filters.current {
background: rgb(46, 162, 204);
border-radius: 2px;
border: none;
color: #fff;
}
.theme-install-php .theme-search {
position: absolute;
left: 10px;
top: 9px;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
width: 280px;
}
.more-filters:before {
color: #777;
text-align: center;
margin: 0 0 0 5px;
content: "\f111";
display: inline-block;
width: 16px;
height: 16px;
-webkit-font-smoothing: antialiased;
font-size: 16px;
line-height: 1;
font-family: "dashicons";
text-decoration: inherit;
font-weight: normal;
font-style: normal;
vertical-align: top;
list-style-type: none;
padding-left: 25px;
width: 150px;
-moz-transition: color .1s ease-in 0;
-webkit-transition: color .1s ease-in 0;
transition: color .1s ease-in 0;
text-align: center;
}
.more-filters.current:before {
color: #fff;
}
.more-filters-container {
display: none;
padding: 30px;
border-top: 1px solid #eee;
margin: 0 -20px;
background: #fafafa;
}
body.more-filters-opened .more-filters-container {
display: block;
}
.theme-install-php .add-new-theme {
display: none !important;
}
.rating {
margin: 30px 0;
}
.rating span:before {
color: #e6b800;
content: "\f154";
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 20px/1 'dashicons';
vertical-align: top;
}
/* Half stars */
.rating-10 span.one:before,
.rating-30 span.two:before,
.rating-50 span.three:before,
.rating-70 span.four:before,
.rating-90 span.five:before {
content: "\f459";
}
/* Full stars */
.rating-20 span.one:before {
content: "\f155";
}
.rating-30 span.one:before,
.rating-40 span.one:before,
.rating-40 span.two:before {
content: "\f155";
}
.rating-50 span.one:before,
.rating-50 span.two:before,
.rating-60 span.one:before,
.rating-60 span.two:before,
.rating-60 span.three:before {
content: "\f155";
}
.rating-70 span.one:before,
.rating-70 span.two:before,
.rating-70 span.three:before,
.rating-80 span.one:before,
.rating-80 span.two:before,
.rating-80 span.three:before,
.rating-80 span.four:before {
content: "\f155";
}
.rating-90 span.one:before,
.rating-90 span.two:before,
.rating-90 span.three:before,
.rating-90 span.four:before,
.rating-100 span.one:before,
.rating-100 span.two:before,
.rating-100 span.three:before,
.rating-100 span.four:before,
.rating-100 span.five:before {
content: "\f155";
}
.rating .votes {
display: inline;
margin-right: 10px;
line-height: 20px;
}
.loading-themes .theme-browser,
.error .theme-browser {
display: none;
}
.loading-themes .spinner {
display: block;
margin: 40px auto 0;
float: none;
}
/*------------------------------------------------------------------------------

View File

@ -25,7 +25,8 @@
margin-left: 20px;
}
.themes-php .wrap .theme-count {
.themes-php .wrap .theme-count,
.theme-navigation .theme-count {
color: #fff;
-webkit-border-radius: 30px;
border-radius: 30px;
@ -1064,157 +1065,210 @@ body.folded .theme-overlay .theme-wrap {
16.2 - Install Themes
------------------------------------------------------------------------------*/
.theme-install-php h4 {
margin: 2.5em 0 8px;
.theme-install-php h2 .upload {
margin-left: 10px;
}
.theme-install-php .tablenav {
height: auto;
}
.theme-install-php .spinner {
margin-top: 9px;
}
.available-theme {
.theme-navigation {
background: #fff;
box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #555;
display: inline-block;
margin-right: 10px;
overflow: hidden;
padding: 20px 20px 20px 0;
vertical-align: top;
width: 300px;
font-size: 13px;
margin: 20px 0 30px;
padding: 0 20px;
position: relative;
width: 100%;
}
.available-theme .screenshot {
width: 300px;
height: 225px;
.upload-theme {
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
margin: 0px 0 0;
padding: 0;
width: 100%;
overflow: hidden;
position: relative;
top: 10px;
}
.upload-theme.opened {
display: block;
border: 1px solid #ccc;
margin-bottom: 10px;
overflow: hidden;
background-color: #fff;
}
.available-theme img {
width: 300px;
.upload-theme .wp-upload-form {
background: #fafafa;
border: 1px solid #e5e5e5;
padding: 30px;
margin: 30px auto;
max-width: 380px;
}
.available-theme h3 {
margin: 15px 0 0;
.upload-theme .install-help {
color: #999;
font-size: 18px;
font-style: normal;
margin: 0;
padding: 40px 0 0;
text-align: center;
}
.available-theme .theme-author {
line-height: 18px;
.upload-theme.opened + .theme-navigation,
.upload-theme.opened + .theme-navigation + .theme-browser {
display: none;
}
.available-theme .action-links {
margin-top: 10px;
overflow: hidden;
.theme-navigation .theme-count {
top: 3px;
margin-left: 0;
}
.available-theme a.screenshot:focus {
border-color: #777;
}
.available-theme .action-links li {
float: left;
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid #dfdfdf;
}
.available-theme .action-links li {
padding-right: 8px;
margin-right: 8px;
}
.ie8 .available-theme .action-links li {
padding-right: 7px;
margin-right: 7px;
}
.available-theme .action-links li:last-child {
padding-right: 0;
margin-right: 0;
border-right: 0;
}
.available-theme .action-links .delete-theme {
float: right;
margin-left: 8px;
margin-right: 0;
}
.available-theme .action-links .delete-theme a {
color: red;
padding: 2px;
}
.available-theme .action-links .delete-theme a:hover {
background: red;
color: #fff;
text-decoration: none;
}
.available-theme .action-links p {
float: left;
}
/* Allow for three-up in small windows when sidebar is collapsed */
@media only screen and (max-width: 1200px) {
.folded .available-theme,
.folded .available-theme .screenshot {
width: 300px;
}
.folded .available-theme .screenshot {
height: 225px;
}
}
/* Adjust three-up display in smaller windows when sidebar is collapsed */
@media only screen and (max-width: 1079px) {
.folded .available-theme,
.folded .available-theme .screenshot {
width: 270px;
}
.folded .available-theme .screenshot {
height: 203px;
}
}
/* Allow for three-up on 1024px wide screens, e.g. tablets */
@media only screen and (max-width: 1200px) {
.available-theme,
.available-theme .screenshot {
width: 240px;
}
.available-theme .screenshot {
height: 180px;
}
.available-theme img {
width: 100%;
}
}
.feature-filter {
padding: 8px 12px 0;
}
.feature-filter .feature-group {
float: left;
margin: 5px 10px 10px;
}
.feature-filter .feature-group li {
.theme-section,
.theme-filter {
border-bottom: 4px solid #fff;
color: #666;
cursor: pointer;
display: inline-block;
margin: 0 10px;
padding: 15px 0;
-moz-transition: border-color .1s ease-in;
-webkit-transition: border-color .1s ease-in;
}
.theme-section.current,
.theme-filter.current {
border-bottom: 4px solid #666;
color: #222;
}
.theme-top-filters {
display: inline-block;
}
.theme-navigation .more-filters {
color: #666;
cursor: pointer;
display: inline-block;
margin: 0 10px;
padding: 4px 5px;
-moz-transition: color .1s ease-in, background .1s ease-in;
-webkit-transition: color .1s ease-in, background .1s ease-in;
transition: color .1s ease-in, background .1s ease-in;
}
body.more-filters-opened .more-filters,
.theme-navigation .more-filters.current {
background: rgb(46, 162, 204);
border-radius: 2px;
border: none;
color: #fff;
}
.theme-install-php .theme-search {
position: absolute;
right: 10px;
top: 9px;
font-size: 16px;
font-weight: 300;
line-height: 1.5;
width: 280px;
}
.more-filters:before {
color: #777;
text-align: center;
margin: 0 5px 0 0;
content: "\f111";
display: inline-block;
width: 16px;
height: 16px;
-webkit-font-smoothing: antialiased;
font-size: 16px;
line-height: 1;
font-family: "dashicons";
text-decoration: inherit;
font-weight: normal;
font-style: normal;
vertical-align: top;
list-style-type: none;
padding-right: 25px;
width: 150px;
-moz-transition: color .1s ease-in 0;
-webkit-transition: color .1s ease-in 0;
transition: color .1s ease-in 0;
text-align: center;
}
.more-filters.current:before {
color: #fff;
}
.more-filters-container {
display: none;
padding: 30px;
border-top: 1px solid #eee;
margin: 0 -20px;
background: #fafafa;
}
body.more-filters-opened .more-filters-container {
display: block;
}
.theme-install-php .add-new-theme {
display: none !important;
}
.rating {
margin: 30px 0;
}
.rating span:before {
color: #e6b800;
content: "\f154";
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 20px/1 'dashicons';
vertical-align: top;
}
/* Half stars */
.rating-10 span.one:before,
.rating-30 span.two:before,
.rating-50 span.three:before,
.rating-70 span.four:before,
.rating-90 span.five:before {
content: "\f459";
}
/* Full stars */
.rating-20 span.one:before {
content: "\f155";
}
.rating-30 span.one:before,
.rating-40 span.one:before,
.rating-40 span.two:before {
content: "\f155";
}
.rating-50 span.one:before,
.rating-50 span.two:before,
.rating-60 span.one:before,
.rating-60 span.two:before,
.rating-60 span.three:before {
content: "\f155";
}
.rating-70 span.one:before,
.rating-70 span.two:before,
.rating-70 span.three:before,
.rating-80 span.one:before,
.rating-80 span.two:before,
.rating-80 span.three:before,
.rating-80 span.four:before {
content: "\f155";
}
.rating-90 span.one:before,
.rating-90 span.two:before,
.rating-90 span.three:before,
.rating-90 span.four:before,
.rating-100 span.one:before,
.rating-100 span.two:before,
.rating-100 span.three:before,
.rating-100 span.four:before,
.rating-100 span.five:before {
content: "\f155";
}
.rating .votes {
display: inline;
margin-left: 10px;
line-height: 20px;
}
.loading-themes .theme-browser,
.error .theme-browser {
display: none;
}
.loading-themes .spinner {
display: block;
margin: 40px auto 0;
float: none;
}
/*------------------------------------------------------------------------------

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -132,11 +132,10 @@ function install_themes_dashboard() {
</form>
<?php
}
add_action('install_themes_dashboard', 'install_themes_dashboard');
// add_action('install_themes_dashboard', 'install_themes_dashboard');
function install_themes_upload($page = 1) {
function install_themes_upload() {
?>
<h4><?php _e('Install a theme in .zip format'); ?></h4>
<p class="install-help"><?php _e('If you have a theme in a .zip format, you may install it by uploading it here.'); ?></p>
<form method="post" enctype="multipart/form-data" class="wp-upload-form" action="<?php echo self_admin_url('update.php?action=upload-theme'); ?>">
<?php wp_nonce_field( 'theme-upload'); ?>
@ -145,7 +144,7 @@ function install_themes_upload($page = 1) {
</form>
<?php
}
add_action('install_themes_upload', 'install_themes_upload', 10, 1);
// add_action('install_themes_upload', 'install_themes_upload', 10, 0);
/**
* Prints a theme on the Install Themes pages.
@ -155,6 +154,10 @@ add_action('install_themes_upload', 'install_themes_upload', 10, 1);
function display_theme( $theme ) {
_deprecated_function( __FUNCTION__, '3.4' );
global $wp_list_table;
if ( ! isset( $wp_list_table ) ) {
$wp_list_table = _get_list_table('WP_Theme_Install_List_Table');
}
$wp_list_table->prepare_items();
$wp_list_table->single_row( $theme );
}
@ -166,12 +169,17 @@ function display_theme( $theme ) {
function display_themes() {
global $wp_list_table;
if ( ! isset( $wp_list_table ) ) {
$wp_list_table = _get_list_table('WP_Theme_Install_List_Table');
}
$wp_list_table->prepare_items();
$wp_list_table->display();
}
add_action('install_themes_search', 'display_themes');
add_action('install_themes_featured', 'display_themes');
add_action('install_themes_new', 'display_themes');
add_action('install_themes_updated', 'display_themes');
// add_action('install_themes_search', 'display_themes');
// add_action('install_themes_featured', 'display_themes');
// add_action('install_themes_new', 'display_themes');
// add_action('install_themes_updated', 'display_themes');
/**
* Display theme information in dialog box form.
@ -179,7 +187,7 @@ add_action('install_themes_updated', 'display_themes');
* @since 2.8.0
*/
function install_theme_information() {
global $tab, $themes_allowedtags, $wp_list_table;
global $wp_list_table;
$theme = themes_api( 'theme_information', array( 'slug' => wp_unslash( $_REQUEST['theme'] ) ) );
@ -187,6 +195,9 @@ function install_theme_information() {
wp_die( $theme );
iframe_header( __('Theme Install') );
if ( ! isset( $wp_list_table ) ) {
$wp_list_table = _get_list_table('WP_Theme_Install_List_Table');
}
$wp_list_table->theme_installer_single( $theme );
iframe_footer();
exit;

View File

@ -1,268 +0,0 @@
/* global ajaxurl, list_args, theme_list_args */
var theme_viewer;
/**
* Theme Browsing
*
* Controls visibility of theme details on manage and install themes pages.
*/
jQuery( function($) {
$('#availablethemes').on( 'click', '.theme-detail', function (event) {
var theme = $(this).closest('.available-theme'),
details = theme.find('.themedetaildiv');
if ( ! details.length ) {
details = theme.find('.install-theme-info .theme-details');
details = details.clone().addClass('themedetaildiv').appendTo( theme ).hide();
}
details.toggle();
event.preventDefault();
});
});
/**
* Theme Install
*
* Displays theme previews on theme install pages.
*/
jQuery( function($) {
if ( ! window.postMessage ) {
return;
}
var preview = $('#theme-installer'),
header = preview.find('.wp-full-overlay-header'),
info = preview.find('.install-theme-info'),
panel = preview.find('.wp-full-overlay-main'),
body = $( document.body );
preview.on( 'click', '.close-full-overlay', function( event ) {
preview.fadeOut( 200, function() {
panel.empty();
body.removeClass('theme-installer-active full-overlay-active');
});
event.preventDefault();
});
preview.on( 'click', '.collapse-sidebar', function( event ) {
preview.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
event.preventDefault();
});
$('#availablethemes').on( 'click', '.install-theme-preview', function( event ) {
var src;
info.html( $(this).closest('.installable-theme').find('.install-theme-info').html() );
header.find( '.theme-install' ).replaceWith( info.find( '.theme-install' ) );
src = info.find( '.theme-preview-url' ).val();
panel.html( '<iframe src="' + src + '" />');
preview.fadeIn( 200, function() {
body.addClass('theme-installer-active full-overlay-active');
});
event.preventDefault();
});
});
var ThemeViewer;
(function($){
ThemeViewer = function() {
function init() {
$( '#filter-click, #mini-filter-click' ).unbind( 'click' ).click( function() {
$( '#filter-click' ).toggleClass( 'current' );
$( '#filter-box' ).slideToggle();
$( '#current-theme' ).slideToggle( 300 );
return false;
});
$( '#filter-box :checkbox' ).unbind( 'click' ).click( function() {
var count = $( '#filter-box :checked' ).length,
text = $( '#filter-click' ).text();
if ( text.indexOf( '(' ) !== -1 ) {
text = text.substr( 0, text.indexOf( '(' ) );
}
if ( count === 0 ) {
$( '#filter-click' ).text( text );
} else {
$( '#filter-click' ).text( text + ' (' + count + ')' );
}
});
/* $('#filter-box :submit').unbind( 'click' ).click(function() {
var features = [];
$('#filter-box :checked').each(function() {
features.push($(this).val());
});
listTable.update_rows({'features': features}, true, function() {
$( '#filter-click' ).toggleClass( 'current' );
$( '#filter-box' ).slideToggle();
$( '#current-theme' ).slideToggle( 300 );
});
return false;
}); */
}
// These are the functions we expose
var api = {
init: init
};
return api;
};
})(jQuery);
jQuery( document ).ready( function() {
theme_viewer = new ThemeViewer();
theme_viewer.init();
});
/**
* Class that provides infinite scroll for Themes admin screens
*
* @since 3.4.0
*
* @uses ajaxurl
* @uses list_args
* @uses theme_list_args
* @uses $('#_ajax_fetch_list_nonce').val()
* */
var ThemeScroller;
(function($){
ThemeScroller = {
querying: false,
scrollPollingDelay: 500,
failedRetryDelay: 4000,
outListBottomThreshold: 300,
/**
* Initializer
*
* @since 3.4.0
* @access private
*/
init: function() {
var self = this;
// Get out early if we don't have the required arguments.
if ( typeof ajaxurl === 'undefined' ||
typeof list_args === 'undefined' ||
typeof theme_list_args === 'undefined' ) {
$('.pagination-links').show();
return;
}
// Handle inputs
this.nonce = $('#_ajax_fetch_list_nonce').val();
this.nextPage = ( theme_list_args.paged + 1 );
// Cache jQuery selectors
this.$outList = $('#availablethemes');
this.$spinner = $('div.tablenav.bottom').children( '.spinner' );
this.$window = $(window);
this.$document = $(document);
/**
* If there are more pages to query, then start polling to track
* when user hits the bottom of the current page
*/
if ( theme_list_args.total_pages >= this.nextPage ) {
this.pollInterval = setInterval( function() {
return self.poll();
}, this.scrollPollingDelay );
}
},
/**
* Checks to see if user has scrolled to bottom of page.
* If so, requests another page of content from self.ajax().
*
* @since 3.4.0
* @access private
*/
poll: function() {
var bottom = this.$document.scrollTop() + this.$window.innerHeight();
if ( this.querying ||
( bottom < this.$outList.height() - this.outListBottomThreshold ) ) {
return;
}
this.ajax();
},
/**
* Applies results passed from this.ajax() to $outList
*
* @since 3.4.0
* @access private
*
* @param results Array with results from this.ajax() query.
*/
process: function( results ) {
if ( results === undefined ) {
clearInterval( this.pollInterval );
return;
}
if ( this.nextPage > theme_list_args.total_pages ) {
clearInterval( this.pollInterval );
}
if ( this.nextPage <= ( theme_list_args.total_pages + 1 ) ) {
this.$outList.append( results.rows );
}
},
/**
* Queries next page of themes
*
* @since 3.4.0
* @access private
*/
ajax: function() {
var self = this,
query = {
action: 'fetch-list',
paged: this.nextPage,
s: theme_list_args.search,
tab: theme_list_args.tab,
type: theme_list_args.type,
_ajax_fetch_list_nonce: this.nonce,
'features[]': theme_list_args.features,
'list_args': list_args
};
this.querying = true;
this.$spinner.show();
$.getJSON( ajaxurl, query )
.done( function( response ) {
self.nextPage++;
self.process( response );
self.$spinner.hide();
self.querying = false;
})
.fail( function() {
self.$spinner.hide();
self.querying = false;
setTimeout( function() { self.ajax(); }, self.failedRetryDelay );
});
}
};
$(document).ready( function() {
ThemeScroller.init();
});
})(jQuery);

View File

@ -1 +0,0 @@
var theme_viewer;jQuery(function(a){a("#availablethemes").on("click",".theme-detail",function(b){var c=a(this).closest(".available-theme"),d=c.find(".themedetaildiv");d.length||(d=c.find(".install-theme-info .theme-details"),d=d.clone().addClass("themedetaildiv").appendTo(c).hide()),d.toggle(),b.preventDefault()})}),jQuery(function(a){if(window.postMessage){var b=a("#theme-installer"),c=b.find(".wp-full-overlay-header"),d=b.find(".install-theme-info"),e=b.find(".wp-full-overlay-main"),f=a(document.body);b.on("click",".close-full-overlay",function(a){b.fadeOut(200,function(){e.empty(),f.removeClass("theme-installer-active full-overlay-active")}),a.preventDefault()}),b.on("click",".collapse-sidebar",function(a){b.toggleClass("collapsed").toggleClass("expanded"),a.preventDefault()}),a("#availablethemes").on("click",".install-theme-preview",function(g){var h;d.html(a(this).closest(".installable-theme").find(".install-theme-info").html()),c.find(".theme-install").replaceWith(d.find(".theme-install")),h=d.find(".theme-preview-url").val(),e.html('<iframe src="'+h+'" />'),b.fadeIn(200,function(){f.addClass("theme-installer-active full-overlay-active")}),g.preventDefault()})}});var ThemeViewer;!function(a){ThemeViewer=function(){function b(){a("#filter-click, #mini-filter-click").unbind("click").click(function(){return a("#filter-click").toggleClass("current"),a("#filter-box").slideToggle(),a("#current-theme").slideToggle(300),!1}),a("#filter-box :checkbox").unbind("click").click(function(){var b=a("#filter-box :checked").length,c=a("#filter-click").text();-1!==c.indexOf("(")&&(c=c.substr(0,c.indexOf("("))),a("#filter-click").text(0===b?c:c+" ("+b+")")})}var c={init:b};return c}}(jQuery),jQuery(document).ready(function(){theme_viewer=new ThemeViewer,theme_viewer.init()});var ThemeScroller;!function(a){ThemeScroller={querying:!1,scrollPollingDelay:500,failedRetryDelay:4e3,outListBottomThreshold:300,init:function(){var b=this;return"undefined"==typeof ajaxurl||"undefined"==typeof list_args||"undefined"==typeof theme_list_args?void a(".pagination-links").show():(this.nonce=a("#_ajax_fetch_list_nonce").val(),this.nextPage=theme_list_args.paged+1,this.$outList=a("#availablethemes"),this.$spinner=a("div.tablenav.bottom").children(".spinner"),this.$window=a(window),this.$document=a(document),void(theme_list_args.total_pages>=this.nextPage&&(this.pollInterval=setInterval(function(){return b.poll()},this.scrollPollingDelay))))},poll:function(){var a=this.$document.scrollTop()+this.$window.innerHeight();this.querying||a<this.$outList.height()-this.outListBottomThreshold||this.ajax()},process:function(a){return void 0===a?void clearInterval(this.pollInterval):(this.nextPage>theme_list_args.total_pages&&clearInterval(this.pollInterval),void(this.nextPage<=theme_list_args.total_pages+1&&this.$outList.append(a.rows)))},ajax:function(){var b=this,c={action:"fetch-list",paged:this.nextPage,s:theme_list_args.search,tab:theme_list_args.tab,type:theme_list_args.type,_ajax_fetch_list_nonce:this.nonce,"features[]":theme_list_args.features,list_args:list_args};this.querying=!0,this.$spinner.show(),a.getJSON(ajaxurl,c).done(function(a){b.nextPage++,b.process(a),b.$spinner.hide(),b.querying=!1}).fail(function(){b.$spinner.hide(),b.querying=!1,setTimeout(function(){b.ajax()},b.failedRetryDelay)})}},a(document).ready(function(){ThemeScroller.init()})}(jQuery);

View File

@ -1,59 +0,0 @@
/* global tb_click */
var thickDims, tbWidth, tbHeight;
jQuery(document).ready(function($) {
thickDims = function() {
var tbWindow = $('#TB_window'), H = $(window).height(), W = $(window).width(), w, h;
w = (tbWidth && tbWidth < W - 90) ? tbWidth : W - 90;
h = (tbHeight && tbHeight < H - 60) ? tbHeight : H - 60;
if ( tbWindow.size() ) {
tbWindow.width(w).height(h);
$('#TB_iframeContent').width(w).height(h - 27);
tbWindow.css({'margin-left': '-' + parseInt((w / 2),10) + 'px'});
if ( typeof document.body.style.maxWidth !== 'undefined' ) {
tbWindow.css({'top':'30px','margin-top':'0'});
}
}
};
thickDims();
$(window).resize( function() { thickDims(); } );
$('a.thickbox-preview').click( function() {
tb_click.call(this);
var alink = $(this).parents('.available-theme').find('.activatelink'), link = '', href = $(this).attr('href'), url, text;
if ( tbWidth = href.match(/&tbWidth=[0-9]+/) ) {
tbWidth = parseInt(tbWidth[0].replace(/[^0-9]+/g, ''), 10);
} else {
tbWidth = $(window).width() - 90;
}
if ( tbHeight = href.match(/&tbHeight=[0-9]+/) ) {
tbHeight = parseInt(tbHeight[0].replace(/[^0-9]+/g, ''), 10);
} else {
tbHeight = $(window).height() - 60;
}
if ( alink.length ) {
url = alink.attr('href') || '';
text = alink.attr('title') || '';
link = '&nbsp; <a href="' + url + '" target="_top" class="tb-theme-preview-link">' + text + '</a>';
} else {
text = $(this).attr('title') || '';
link = '&nbsp; <span class="tb-theme-preview-link">' + text + '</span>';
}
$('#TB_title').css({'background-color':'#222','color':'#dfdfdf'});
$('#TB_closeAjaxWindow').css({'float':'left'});
$('#TB_ajaxWindowTitle').css({'float':'right'}).html(link);
$('#TB_iframeContent').width('100%');
thickDims();
return false;
} );
});

View File

@ -1 +0,0 @@
var thickDims,tbWidth,tbHeight;jQuery(document).ready(function(a){thickDims=function(){var b,c,d=a("#TB_window"),e=a(window).height(),f=a(window).width();b=tbWidth&&f-90>tbWidth?tbWidth:f-90,c=tbHeight&&e-60>tbHeight?tbHeight:e-60,d.size()&&(d.width(b).height(c),a("#TB_iframeContent").width(b).height(c-27),d.css({"margin-left":"-"+parseInt(b/2,10)+"px"}),"undefined"!=typeof document.body.style.maxWidth&&d.css({top:"30px","margin-top":"0"}))},thickDims(),a(window).resize(function(){thickDims()}),a("a.thickbox-preview").click(function(){tb_click.call(this);var b,c,d=a(this).parents(".available-theme").find(".activatelink"),e="",f=a(this).attr("href");return tbWidth=(tbWidth=f.match(/&tbWidth=[0-9]+/))?parseInt(tbWidth[0].replace(/[^0-9]+/g,""),10):a(window).width()-90,tbHeight=(tbHeight=f.match(/&tbHeight=[0-9]+/))?parseInt(tbHeight[0].replace(/[^0-9]+/g,""),10):a(window).height()-60,d.length?(b=d.attr("href")||"",c=d.attr("title")||"",e='&nbsp; <a href="'+b+'" target="_top" class="tb-theme-preview-link">'+c+"</a>"):(c=a(this).attr("title")||"",e='&nbsp; <span class="tb-theme-preview-link">'+c+"</span>"),a("#TB_title").css({"background-color":"#222",color:"#dfdfdf"}),a("#TB_closeAjaxWindow").css({"float":"left"}),a("#TB_ajaxWindowTitle").css({"float":"right"}).html(e),a("#TB_iframeContent").width("100%"),thickDims(),!1})});

View File

@ -12,10 +12,45 @@ themes = wp.themes = wp.themes || {};
themes.data = _wpThemeSettings;
l10n = themes.data.l10n;
// Shortcut for isInstall check
themes.isInstall = !! themes.data.settings.isInstall;
// Setup app structure
_.extend( themes, { model: {}, view: {}, routes: {}, router: {}, template: wp.template });
themes.model = Backbone.Model.extend({});
themes.Model = Backbone.Model.extend({
// Adds attributes to the default data coming through the .org themes api
// Map `id` to `slug` for shared code
initialize: function() {
var install, preview;
// Install url for the theme
// using the install nonce
install = {
action: 'install-theme',
theme: this.get( 'slug' ),
_wpnonce: themes.data.settings._nonceInstall
};
// Build the url query
install = themes.data.settings.updateURI + '?' + $.param( install );
// Preview url for the theme
preview = {
tab: 'theme-information',
theme: this.get( 'slug' )
};
preview = themes.data.settings.installURI + '?' + $.param( preview );
// Set the attributes
this.set({
installURI: install,
previewURI: preview,
id: this.get( 'slug' )
});
}
});
// Main view controller for themes.php
// Unifies and renders all available views
@ -28,10 +63,11 @@ themes.view.Appearance = wp.Backbone.View.extend({
page: 0,
// Sets up a throttler for binding to 'scroll'
initialize: function() {
initialize: function( options ) {
// Scroller checks how far the scroll position is
_.bindAll( this, 'scroller' );
this.SearchView = options.SearchView ? options.SearchView : themes.view.Search;
// Bind to the scroll event and throttle
// the results from this.scroller
this.window.bind( 'scroll', _.throttle( this.scroller, 300 ) );
@ -55,6 +91,9 @@ themes.view.Appearance = wp.Backbone.View.extend({
this.$el.append( '<br class="clear"/>' );
},
// Defines search element container
searchContainer: $( '#wpbody h2:first' ),
// Search input and view
// for current theme collection
search: function() {
@ -66,11 +105,14 @@ themes.view.Appearance = wp.Backbone.View.extend({
return;
}
view = new themes.view.Search({ collection: self.collection, parent: this });
view = new this.SearchView({
collection: self.collection,
parent: this
});
// Render and append after screen title
view.render();
$('#wpbody h2:first')
this.searchContainer
.append( $.parseHTML( '<label class="screen-reader-text" for="theme-search-input">' + l10n.search + '</label>' ) )
.append( view.el );
},
@ -95,7 +137,7 @@ themes.view.Appearance = wp.Backbone.View.extend({
// @has 'id' 'name' 'screenshot' 'author' 'authorURI' 'version' 'active' ...
themes.Collection = Backbone.Collection.extend({
model: themes.model,
model: themes.Model,
// Search terms
terms: '',
@ -187,9 +229,10 @@ themes.view.Theme = wp.Backbone.View.extend({
html: themes.template( 'theme' ),
events: {
'click': 'expand',
'keydown': 'expand',
'touchend': 'expand',
'click': themes.isInstall ? 'preview': 'expand',
'click .preview': 'preview',
'keydown': themes.isInstall ? 'preview': 'expand',
'touchend': themes.isInstall ? 'preview': 'expand',
'touchmove': 'preventExpand'
},
@ -250,6 +293,24 @@ themes.view.Theme = wp.Backbone.View.extend({
preventExpand: function() {
this.touchDrag = true;
},
preview: function( event ) {
// Bail if the user scrolled on a touch device
if ( this.touchDrag === true ) {
return this.touchDrag = false;
}
event.preventDefault();
event = event || window.event;
var preview = new themes.view.Preview({
model: this.model
});
preview.render();
$( 'div.wrap' ).append( preview.el );
}
});
@ -415,6 +476,47 @@ themes.view.Details = wp.Backbone.View.extend({
}
});
// Theme Preview view
// Set ups a modal overlay with the expanded theme data
themes.view.Preview = wp.Backbone.View.extend({
className: 'wp-full-overlay expanded',
el: '#theme-installer',
events: {
'click .close-full-overlay': 'close',
'click .collapse-sidebar': 'collapse'
},
// The HTML template for the theme preview
html: themes.template( 'theme-preview' ),
render: function() {
var data = this.model.toJSON();
this.$el.html( this.html( data ) );
themes.router.navigate( themes.router.baseUrl( '?theme=' + this.model.get( 'id' ) ), { replace: true } );
this.$el.fadeIn( 200, function() {
$( 'body' ).addClass( 'theme-installer-active full-overlay-active' );
});
},
close: function() {
this.$el.fadeOut( 200, function() {
$( 'body' ).removeClass( 'theme-installer-active full-overlay-active' );
});
themes.router.navigate( themes.router.baseUrl( '' ) );
return false;
},
collapse: function() {
this.$el.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
return false;
}
});
// Controls the rendering of div.themes,
// a wrapper that will hold all the theme elements
themes.view.Themes = wp.Backbone.View.extend({
@ -732,7 +834,7 @@ themes.view.Search = wp.Backbone.View.extend({
// Sets up the routes events for relevant url queries
// Listens to [theme] and [search] params
themes.routes = Backbone.Router.extend({
themes.Router = Backbone.Router.extend({
routes: {
'themes.php?theme=:slug': 'theme',
@ -788,7 +890,7 @@ themes.Run = {
var self = this;
// Bind to our global thx object
// so that the object is available to sub-views
themes.router = new themes.routes();
themes.router = new themes.Router();
// Handles theme details route event
themes.router.on( 'route:theme', function( slug ) {
@ -805,16 +907,334 @@ themes.Run = {
self.view.trigger( 'theme:close' );
self.themes.doSearch( query );
});
this.extraRoutes();
},
extraRoutes: function() {
return false;
}
};
// Extend the main Search view
themes.view.InstallerSearch = themes.view.Search.extend({
events: {
'keyup': 'search'
},
// Handles Ajax request for searching through themes in public repo
search: function( event ) {
this.collection = this.options.parent.view.collection;
// Clear on escape.
if ( event.type === 'keyup' && event.which === 27 ) {
event.target.value = '';
}
_.debounce( _.bind( this.doSearch, this ), 300 )( event.target.value );
},
doSearch: function( value ) {
var request = {},
self = this;
request.search = value;
// Intercept an [author] search.
//
// If input value starts with `author:` send a request
// for `author` instead of a regular `search`
if ( value.substring( 0, 7 ) === 'author:' ) {
request.search = '';
request.author = value.slice( 7 );
}
// Intercept a [tag] search.
//
// If input value starts with `tag:` send a request
// for `tag` instead of a regular `search`
if ( value.substring( 0, 4 ) === 'tag:' ) {
request.search = '';
request.tag = [ value.slice( 4 ) ];
}
// Send Ajax POST request to api.wordpress.org/themes
themes.view.Installer.prototype.apiCall( request ).done( function( data ) {
// Update the collection with the queried data
self.collection.reset( data.themes );
// Trigger a collection refresh event to render the views
self.collection.trigger( 'update' );
// Un-spin it
$( 'body' ).removeClass( 'loading-themes' );
$( '.theme-browser' ).find( 'div.error' ).remove();
}).fail( function() {
$( '.theme-browser' ).find( 'div.error' ).remove();
$( '.theme-browser' ).append( '<div class="error"><p>' + l10n.error + '</p></div>' );
});
return false;
}
});
themes.view.Installer = themes.view.Appearance.extend({
el: '#wpbody-content .wrap',
// Register events for sorting and filters in theme-navigation
events: {
'click .theme-section': 'onSort',
'click .theme-filter': 'onFilter',
'click .more-filters': 'moreFilters'
},
// Send Ajax POST request to api.wordpress.org/themes
apiCall: function( request ) {
return $.ajax({
url: 'https://api.wordpress.org/themes/info/1.1/?action=query_themes',
// We want JSON data
dataType: 'json',
type: 'POST',
crossDomain: true,
// Request data
data: {
action: 'query_themes',
request: _.extend({
per_page: 36,
fields: {
description: true,
tested: true,
requires: true,
rating: true,
downloaded: true,
downloadLink: true,
last_updated: true,
homepage: true,
num_ratings: true
}
}, request)
},
beforeSend: function() {
// Spin it
$( 'body' ).addClass( 'loading-themes' );
}
});
},
// Handles all the rendering of the public theme directory
browse: function( section ) {
var self = this;
// @todo Cache the collection after fetching based on the section
this.collection = new themes.Collection();
// Create a new collection with the proper theme data
// for each section
this.apiCall({ browse: section }).done( function( data ) {
// Update the collection with the queried data
self.collection.reset( data.themes );
// Trigger a collection refresh event to render the views
self.collection.trigger( 'update' );
// Un-spin it
$( 'body' ).removeClass( 'loading-themes' );
$( '.theme-browser' ).find( 'div.error' ).remove();
});
if ( this.view ) {
this.view.remove();
}
// Set ups the view and passes the section argument
this.view = new themes.view.Themes({
collection: this.collection,
section: section,
parent: this
});
// Reset pagination every time the install view handler is run
this.page = 0;
// Render and append
this.$el.find( '.themes' ).remove();
this.view.render();
this.$el.find( '.theme-browser' ).append( this.view.el ).addClass( 'rendered' );
},
// Initial render method
render: function() {
this.search();
this.uploader();
return this.browse( this.options.section );
},
// Sorting navigation
onSort: function( event ) {
var $el = $( event.target ),
sort = $el.data( 'sort' );
// Bail if this is already active
if ( $el.hasClass( this.activeClass ) ) {
return;
}
this.sort( sort );
// Trigger a router.naviagte update
themes.router.navigate( themes.router.baseUrl( '?sort=' + sort ) );
},
sort: function( sort ) {
$( '#theme-search-input' ).val( '' );
$( '.theme-section, .theme-filter' ).removeClass( this.activeClass );
$( '[data-sort="' + sort + '"]' ).addClass( this.activeClass );
this.browse( sort );
},
// Filters and Tags
onFilter: function( event ) {
var request,
$el = $( event.target ),
filter = $el.data( 'filter' ),
self = this;
// Bail if this is already active
if ( $el.hasClass( this.activeClass ) ) {
return;
}
$( '.theme-filter, .theme-section' ).removeClass( this.activeClass );
$el.addClass( this.activeClass );
if ( ! filter ) {
return;
}
// Construct the filter request
// using the default values
// @todo Cache the collection after fetching based on the filter
request = { tag: [ filter ] };
// Send Ajax POST request to api.wordpress.org/themes
this.apiCall( request ).done( function( data ) {
// Update the collection with the queried data
self.collection.reset( data.themes );
// Trigger a collection refresh event to render the views
self.collection.trigger( 'update' );
// Un-spin it
$( 'body' ).removeClass( 'loading-themes' );
$( '.theme-browser' ).find( 'div.error' ).remove();
}).fail( function() {
$( '.theme-browser' ).find( 'div.error' ).remove();
$( '.theme-browser' ).append( '<div class="error"><p>' + l10n.error + '</p></div>' );
});
return false;
},
activeClass: 'current',
// Overwrite search container class to append search
// in new location
searchContainer: $( '.theme-navigation' ),
uploader: function() {
$( 'a.upload.button' ).on( 'click', function() {
$( '.upload-theme' )
.toggleClass( 'opened' )
.hasClass( 'opened' ) ? $( this ).text( l10n.back ) : $( this ).text( l10n.upload );
});
},
moreFilters: function() {
$( 'body' ).toggleClass( 'more-filters-opened' );
}
});
themes.InstallerRouter = Backbone.Router.extend({
routes: {
'theme-install.php?theme=:slug': 'preview',
'theme-install.php(?sort=:sort)': 'sort',
'': 'sort'
},
baseUrl: function( url ) {
return 'theme-install.php' + url;
}
});
themes.RunInstaller = {
init: function() {
// Set up the view
// Passes the default 'section' as an option
this.view = new themes.view.Installer({
section: 'featured',
SearchView: themes.view.InstallerSearch
});
// Render results
this.render();
},
render: function() {
// Render results
this.view.render();
this.routes();
Backbone.history.start({
root: themes.data.settings.adminUrl,
pushState: true,
hashChange: false
});
},
routes: function() {
var self = this;
// Bind to our global thx object
// so that the object is available to sub-views
themes.router = new themes.InstallerRouter();
// Handles theme details route event
themes.router.on( 'route:theme', function( slug ) {
self.view.view.expand( slug );
});
themes.router.on( 'route:sort', function( sort ) {
if ( ! sort ) {
sort = 'featured';
}
self.view.sort( sort );
self.view.trigger( 'theme:close' );
});
this.extraRoutes();
},
extraRoutes: function() {
return false;
}
};
// Ready...
jQuery( document ).ready(
// Bring on the themes
_.bind( themes.Run.init, themes.Run )
);
$( document ).ready(function() {
if ( themes.isInstall ) {
themes.RunInstaller.init();
} else {
themes.Run.init();
}
});
})( jQuery );

File diff suppressed because one or more lines are too long

View File

@ -6,11 +6,11 @@
* @subpackage Administration
*/
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') )
wp_die( __( 'You do not have sufficient permissions to install themes on this site.' ) );
@ -20,19 +20,43 @@ if ( is_multisite() && ! is_network_admin() ) {
exit();
}
$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' );
$sections = array(
'featured' => __( 'Featured Themes' ),
'popular' => __( 'Popular Themes' ),
'new' => __( 'Newest Themes' ),
);
$body_id = $tab;
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' );
/**
* Fires before each of the tabs are rendered on the Install Themes page.
@ -43,7 +67,9 @@ $body_id = $tab;
*
* @since 2.8.0
*/
do_action( "install_themes_pre_{$tab}" );
if ( $tab ) {
do_action( "install_themes_pre_{$tab}" );
}
$help_overview =
'<p>' . sprintf(__('You can find additional themes for your site by using the Theme Browser/Installer on this screen, which will display themes from the <a href="%s" target="_blank">WordPress.org Theme Directory</a>. These themes are designed and developed by third parties, are available free of charge, and are compatible with the license WordPress uses.'), 'https://wordpress.org/themes/') . '</p>' .
@ -73,14 +99,39 @@ get_current_screen()->set_help_sidebar(
);
include(ABSPATH . 'wp-admin/admin-header.php');
?>
<div class="wrap">
<h2><?php echo esc_html( $title ); ?></h2>
<?php
<h2>
<?php echo esc_html( $title ); ?>
<a class="upload button button-secondary"><?php esc_html_e( 'Upload Theme' ); ?></a>
</h2>
$wp_list_table->views(); ?>
<div class="upload-theme">
<?php install_themes_upload(); ?>
</div>
<br class="clear" />
<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
/**
* Fires at the top of each of the tabs on the Install Themes page.
@ -93,8 +144,68 @@ $wp_list_table->views(); ?>
*
* @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');

View File

@ -202,7 +202,7 @@ if ( isset($_GET['action']) ) {
include_once ABSPATH . 'wp-admin/includes/theme-install.php'; //for themes_api..
check_admin_referer('install-theme_' . $theme);
check_admin_referer( 'install-theme' );
$api = themes_api('theme_information', array('slug' => $theme, 'fields' => array('sections' => false, 'tags' => false) ) ); //Save on a bit of bandwidth.
if ( is_wp_error($api) )

View File

@ -454,10 +454,6 @@ function wp_default_scripts( &$scripts ) {
$scripts->add( 'admin-widgets', "/wp-admin/js/widgets$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable', 'jquery-ui-droppable' ), false, 1 );
$scripts->add( 'theme', "/wp-admin/js/theme$suffix.js", array( 'wp-backbone' ), false, 1 );
$scripts->add( 'theme-install', "/wp-admin/js/theme-install$suffix.js", array( 'jquery' ), false, 1 );
// @todo: Core no longer uses theme-preview.js. Remove?
$scripts->add( 'theme-preview', "/wp-admin/js/theme-preview$suffix.js", array( 'thickbox', 'jquery' ), false, 1 );
$scripts->add( 'inline-edit-post', "/wp-admin/js/inline-edit-post$suffix.js", array( 'jquery', 'suggest', 'heartbeat' ), false, 1 );
did_action( 'init' ) && $scripts->localize( 'inline-edit-post', 'inlineEditL10n', array(