Ticket #15580: spinner-search.2.diff

wp-includes/script-loader.php

@@ -307 +307 @@
                 $scripts->add( 'list-table', "/wp-admin/js/list-table$suffix.js", array( 'jquery-query', 'jquery-serialize-object' ), '20101215' );
                 $scripts->add_data( 'list-table', 'group', 1 );
                 $scripts->localize( 'list-table', 'listTableL10n', array(
-                        'loading' => __('Loading...'),
                         'error' => __('An error has occurred while loading the items.'),
                         'search' => __('Search results for “%s”'),
                         'l10n_print_after' => 'try{convertEntities(listTableL10n);}catch(e){};'

wp-admin/includes/class-wp-list-table.php

@@ -199 +199 @@
         <input type="text" id="<?php echo $input_id ?>" name="s" value="<?php _admin_search_query(); ?>" />
         <?php submit_button( $text, 'button', 'submit', false ); ?>
 </p>
+<img src="<?php echo esc_url( admin_url( 'images/wpspin_light.gif' ) ); ?>" class="ajax-loading list-ajax-loading" alt="" />
 <?php
         }
 
@@ -730 +731 @@
                 <div class="alignleft actions">
                         <?php $this->bulk_actions( $which ); ?>
                 </div>
-
-        <?php
+<?php
                 $this->extra_tablenav( $which );
                 $this->pagination( $which );
-        ?>
 
+if ( 'bottom' == $which ) {
+?>
+<img src="<?php echo esc_url( admin_url( 'images/wpspin_light.gif' ) ); ?>" class="ajax-loading list-ajax-loading" alt="" />
+<?php } ?>
+
                 <br class="clear" />
         </div>
 <?php

wp-admin/js/list-table.dev.js

@@ -14 +14 @@
                 this.set_total_pages();
 
                 this.$tbody = $('#the-list, #the-comment-list');
-
-                this.$overlay = $('<div id="loading-items">')
-                        .html(listTableL10n.loading)
-                        .hide()
-                        .prependTo($('body'));
         },
 
         // paging
@@ -53 +48 @@
                 if ( !different )
                         return false;
 
-                this.show_overlay();
+                this.start_loading();
 
                 if ( reset_paging )
                         $.query.SET('paged', 1);
@@ -96 +91 @@
                 if ( 'object' != typeof response ) {
                         this.handle_error();
                 } else {
-                        this.hide_overlay();
+                        this.stop_loading();
 
                         this.$tbody.html(response.rows);
 
@@ -119 +114 @@
         },
 
         handle_error: function() {
-                this.hide_overlay();
+                this.stop_loading();
 
                 $('h2').after('<div class="error ajax below-h2"><p>' + listTableL10n.error + '</p></div>');
         },
 
-        show_overlay: function() {
+        start_loading: function() {
                 this.loading = true;
 
                 $('.error.ajax').remove();
 
-                this.$overlay
-                        .css({
-                                width: this.$tbody.width() + 'px',
-                                height: this.$tbody.height() - 20 + 'px'
-                        })
-                        .css(this.$tbody.offset())
-                        .show();
+                $('.list-ajax-loading').css('visibility', 'visible');
         },
 
-        hide_overlay: function() {
+        stop_loading: function() {
                 this.loading = false;
-                this.$overlay.hide();
+
+                $('.list-ajax-loading').css('visibility', 'hidden');
         }
 }
 

wp-admin/css/wp-admin.dev.css

@@ -4193 +4193 @@
 }
 * html #template div {margin-right: 0;}
 #save {width: 15em;}
-#loading-items {
-        position: absolute;
-        z-index: 9999;
-        padding: 10px 0;
-        background-color: #fff;
-        font-weight: bold;
-        text-align: center;
-        opacity: 0.5;
+.list-ajax-loading {
+        float: right;
+        margin-right: 9px;
+        margin-top: -1px;
 }
+.bottom .list-ajax-loading {
+        margin-top: 7px;
+}
 #howto {
         font-size: 11px;
         margin: 0 5px;