Ticket #19816: 19816.4.2.diff
File 19816.4.2.diff, 10.9 KB (added by , 13 years ago) |
---|
-
wp-admin/includes/class-wp-theme-install-list-table.php
162 162 $theme_names = array_keys( $themes ); 163 163 164 164 foreach ( $theme_names as $theme_name ) { 165 $class = array( 'available-theme' ); 166 ?> 167 <div class="<?php echo join( ' ', $class ); ?>"><?php 168 if ( isset( $themes[$theme_name] ) ) 169 display_theme( $themes[$theme_name] ); 170 ?></div> 171 <?php } // end foreach $theme_names 165 if ( isset( $themes[$theme_name] ) ) 166 display_theme( $themes[$theme_name] ); 167 } // end foreach $theme_names 172 168 } 173 169 } -
wp-admin/includes/theme-install.php
133 133 if ( empty($theme) ) 134 134 return; 135 135 136 $class = array( 'available-theme' ); 137 136 138 $name = wp_kses($theme->name, $themes_allowedtags); 137 139 $author = wp_kses($theme->author, $themes_allowedtags); 138 140 $desc = wp_kses($theme->description, $themes_allowedtags); 141 $screenshots = (array) $theme->screenshot_url; 142 $num_screenshots = count( $screenshots ); 143 144 if ( $num_screenshots > 1 ) 145 $class[] = 'has-screenshots'; 146 139 147 //if ( strlen($desc) > 30 ) 140 148 // $desc = substr($desc, 0, 15) . '<span class="dots">...</span><span>' . substr($desc, -15) . '</span>'; 141 149 … … 151 159 152 160 $actions = implode ( ' | ', $actions ); 153 161 ?> 162 <div class="<?php echo implode( ' ', $class ); ?>"> 154 163 <a class='thickbox thickbox-preview screenshot' 155 164 href='<?php echo esc_url($preview_link); ?>' 156 165 title='<?php echo esc_attr(sprintf(__('Preview “%s”'), $name)); ?>'> 157 <img src='<?php echo esc_url($theme->screenshot_url); ?>' width='150' /> 166 <?php if ( ! empty ( $screenshots ) && false !== $screenshots[0] ) : ?> 167 <img src='<?php echo esc_url($screenshots[0]); ?>' alt='' data-num-images='<?php echo $num_screenshots; ?>' /> 168 <?php endif; ?> 158 169 </a> 159 170 <h3><?php 160 171 /* translators: 1: theme name, 2: author name */ … … 183 194 <div class="star star1"><img src="<?php echo admin_url('images/star.png?v=20110615'); ?>" alt="<?php esc_attr_e('1 star') ?>" /></div> 184 195 </div> 185 196 </div> 197 </div> 186 198 <?php } 187 199 /* 188 200 object(stdClass)[59] -
wp-admin/includes/class-wp-themes-list-table.php
11 11 12 12 var $search = array(); 13 13 var $features = array(); 14 14 15 15 function __construct() { 16 16 parent::__construct( array( 17 17 'ajax' => true, … … 123 123 $themes = $this->items; 124 124 125 125 foreach ( $themes as $theme ) { 126 echo '<div class="available-theme">';127 128 126 $template = $theme->get_template(); 129 127 $stylesheet = $theme->get_stylesheet(); 130 128 131 129 $title = $theme->display('Name'); 132 130 $version = $theme->display('Version'); 133 131 $author = $theme->display('Author'); 134 132 $screenshot_count = $theme->get_screenshot_count(); 133 134 $class = array( 'available-theme' ); 135 if ( $screenshot_count > 1 ) 136 $class[] = 'has-screenshots'; 137 135 138 $activate_link = wp_nonce_url( "themes.php?action=activate&template=" . urlencode( $template ) . "&stylesheet=" . urlencode( $stylesheet ), 'switch-theme_' . $template ); 136 139 $preview_link = esc_url( add_query_arg( 137 140 array( 'preview' => 1, 'template' => $template, 'stylesheet' => $stylesheet, 'preview_iframe' => true, 'TB_iframe' => 'true' ), 138 141 home_url( '/' ) ) ); 139 142 140 143 $actions = array(); 141 144 $actions[] = '<a href="' . $activate_link . '" class="activatelink" title="' 142 145 . esc_attr( sprintf( __( 'Activate “%s”' ), $title ) ) . '">' . __( 'Activate' ) . '</a>'; … … 146 149 $actions[] = '<a class="submitdelete deletion" href="' . wp_nonce_url( "themes.php?action=delete&template=$stylesheet", 'delete-theme_' . $stylesheet ) 147 150 . '" onclick="' . "return confirm( '" . esc_js( sprintf( __( "You are about to delete this theme '%s'\n 'Cancel' to stop, 'OK' to delete." ), $title ) ) 148 151 . "' );" . '">' . __( 'Delete' ) . '</a>'; 149 152 150 153 $actions = apply_filters( 'theme_action_links', $actions, $theme ); 151 154 152 155 $actions = implode ( ' | ', $actions ); 153 156 ?> 157 <div class="<?php echo implode( ' ', $class ); ?>"> 154 158 <a href="<?php echo $preview_link; ?>" class="thickbox thickbox-preview screenshot"> 155 159 <?php if ( $theme->get_screenshot() ) : ?> 156 <img src="<?php echo esc_url( $theme->get_screenshot( 'absolute' ) ); ?>" alt="" />160 <img src="<?php echo esc_url( $theme->get_screenshot( 'absolute' ) ); ?>" alt="" data-num-images="<?php echo $screenshot_count; ?>" /> 157 161 <?php endif; ?> 158 162 </a> 159 163 <h3><?php 160 164 /* translators: 1: theme title, 2: theme version, 3: theme author */ 161 165 printf( __( '%1$s %2$s by %3$s' ), $title, $version, $author ) ; ?></h3> 162 166 163 167 <span class='action-links'><?php echo $actions ?></span> 164 168 <span class="separator hide-if-no-js">| </span><a href="#" class="theme-detail hide-if-no-js" tabindex='4'><?php _e('Details') ?></a> 165 169 <div class="themedetaildiv hide-if-js"> … … 210 214 211 215 if ( false !== stripos( $theme->get_template(), $word ) ) 212 216 continue; 213 217 214 218 return false; 215 219 } 216 220 } -
wp-admin/js/theme-preview.dev.js
54 54 return false; 55 55 } ); 56 56 57 // Theme details 58 $('#availablethemes').on('click', 'a.theme-detail', function (event) { 59 $(this).siblings('.themedetaildiv').toggle(); 57 58 // Toggle Theme Details 59 var currentTheme; 60 $('#availablethemes').on( 'click', 'a.theme-detail', function() { 61 62 var $this = $(this); 63 64 if ( currentTheme !== undefined ) { 65 // remove active class/extended details div 66 $('.extended-details').remove(); 67 currentTheme.removeClass( 'active' ); 68 currentTheme.height( 'auto' ); 69 70 // bail if the link clicked was the same as previously 71 if ( currentTheme[0] === $this.closest( 'div.available-theme' )[0] ) { 72 currentTheme = undefined; 73 return false; 74 } 75 } 76 77 // reset nextLower - has scope for now to possibly use for window resize reflow 78 var nextLower = undefined, 79 maxMargin = 50, // Max Margin allowed between theme and details div 80 detailsDiv = $('<div class="extended-details"><div class="themedetaildiv"><h4>Theme Details</h4></div><div class="screenshots"></div></div>'); 81 82 currentTheme = $this.closest( 'div.available-theme' ); 83 var currentPosition = currentTheme.position().top; 84 var currentBottom = currentPosition + currentTheme.height(); 85 86 currentTheme.addClass( 'active' ); 87 88 // find the next div.available-theme that has a lower position().top 89 currentTheme.nextAll('div.available-theme').each( function() { 90 var $this = $(this); 91 if( currentPosition < $this.position().top ) { 92 nextLower = $this; 93 return false; 94 } 95 }); 96 97 // insert the details div 98 if ( nextLower !== undefined ) { 99 nextLower.before( detailsDiv ); 100 } else { 101 $('#availablethemes').append( detailsDiv ); 102 } 103 104 // now that it's generated, grab top of details div 105 var detailsTop = detailsDiv.position().top; 106 var margin = detailsTop - currentBottom; 107 108 /** 109 * If the margin between the bottom of the current theme and details div 110 * is greater than maxMargin, extend current theme to avoid whitespace. 111 */ 112 if ( margin > maxMargin) 113 currentTheme.height( currentTheme.height() + ( margin - maxMargin ) ); 114 115 var themeDetails = $this.siblings( '.themedetaildiv' ).html(); 116 $('.extended-details .themedetaildiv').append( themeDetails ); 117 118 // do more screenshots 119 var screenshot = $('.screenshot img', currentTheme); 120 var src = screenshot.attr( 'src' ); 121 122 if ( src !== undefined ) { 123 var numScreenshots = screenshot.data( 'numImages' ), 124 screenshots = $('.extended-details .screenshots'); 125 126 screenshots.append( '<div class="screenshot"><img src="' + src + '" /></div>' ); 127 128 if ( numScreenshots !== undefined && numScreenshots > 1 ) { 129 var base = src.replace( /screenshot\.(jpg|png)$/, '' ); 130 131 for ( var i = 2; i <= numScreenshots; i++ ) { 132 screenshots.append( '<div class="screenshot"><img src="' + base + 'screenshot-' + String(i) + '.png" /></div>' ); 133 } 134 } 135 } 136 60 137 return false; 61 138 }); 62 139 140 // If the window is resized, and there's a details div open, close it. 141 $(window).resize( function() { 142 if ( currentTheme !== undefined ) { 143 $('.extended-details').remove(); 144 currentTheme.removeClass( 'active' ); 145 currentTheme.height( 'auto' ); 146 currentTheme = undefined; 147 } 148 }); 149 63 150 }); -
wp-admin/css/wp-admin.dev.css
4478 4478 .available-theme { 4479 4479 display: inline-block; 4480 4480 margin-bottom: 10px; 4481 margin-right: 25px;4481 margin-right: 10px; 4482 4482 overflow: hidden; 4483 4483 padding: 20px; 4484 4484 vertical-align: top; 4485 width: 240px; 4485 width: 300px; 4486 border-top-left-radius: 3px; 4487 border-top-right-radius: 3px; 4488 -webkit-border-top-left-radius: 3px; 4489 -webkit-border-top-right-radius: 3px; 4486 4490 } 4487 4491 4492 .js .available-theme.has-screenshots { 4493 background: transparent url(../images/stack.png) no-repeat 26px 5px; 4494 } 4495 4488 4496 .available-theme a.screenshot { 4489 width: 240px; 4490 height: 180px; 4497 width: 300px; 4498 height: 225px; 4499 margin: 0 auto; 4491 4500 display: block; 4492 4501 border-width: 1px; 4493 4502 border-style: solid; … … 4496 4505 } 4497 4506 4498 4507 .available-theme img { 4499 width: 240px;4508 width: 300px; 4500 4509 } 4501 4510 4502 4511 .available-theme h3 { 4503 4512 margin: 15px 0 5px; 4504 4513 } 4505 4514 4515 .available-theme.active, 4516 .available-theme.has-screenshots.active { 4517 background: #efefef; 4518 } 4519 4520 .extended-details { 4521 overflow: hidden; 4522 position: relative; 4523 margin-top: -13px; 4524 margin-bottom: 20px; 4525 padding: 5px 20px; 4526 padding-left: 330px; 4527 background-color: #efefef; 4528 border-radius: 3px; 4529 -webkit-border-radius: 3px; 4530 } 4531 4532 #availablethemes .extended-details h4 { 4533 margin: 1em 0; 4534 } 4535 4536 .extended-details .themedetaildiv { 4537 position: relative; 4538 float: left; 4539 width: 280px; 4540 right: 310px; 4541 margin-right: -100%; 4542 margin-bottom: 20px; 4543 } 4544 4545 .extended-details .screenshots { 4546 position: relative; 4547 float: left; 4548 margin-top: 15px; 4549 width: 100%; 4550 } 4551 4552 .extended-details div.screenshot { 4553 overflow: hidden; 4554 float: left; 4555 margin-right: 20px; 4556 margin-bottom: 20px; 4557 width: 300px; 4558 height: 225px; 4559 border: 1px solid #ddd; 4560 } 4561 4562 .extended-details div.screenshot img { 4563 display: block; 4564 margin: 0 auto; 4565 width: 100%; 4566 } 4567 4506 4568 #current-theme { 4507 4569 margin: 1em 0 1.5em; 4508 4570 } … … 7423 7485 } 7424 7486 7425 7487 7426 #theme-information .available-theme, 7427 .available-theme { 7488 #theme-information .available-theme { 7428 7489 padding: 20px 15px; 7429 7490 } 7430 7491