Gracefully slide down the "{Name} is editing" notice portion of the post row, so everything isn't shifting down in an instant and throwing off people's clicks.

fixes #24553. props kadamwhite, johnbillion.

git-svn-id: https://develop.svn.wordpress.org/trunk@24576 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Mark Jaquith 2013-07-05 23:17:25 +00:00
parent fcf1e26cff
commit 1b4aa41b4c
3 changed files with 20 additions and 5 deletions

View File

@ -2534,7 +2534,7 @@ table.fixed {
tr.wp-locked .locked-indicator {
background: url('../images/lock.png') no-repeat;
margin: -2px 0 0 6px;
height: 16px;
height: 20px;
width: 16px;
}
@ -2545,6 +2545,20 @@ tr.wp-locked .row-actions .trash {
display: none;
}
tr .locked-info {
height: 0;
opacity: 0;
-webkit-transition: height 1s, opacity 500ms;
transition: height 1s, opacity 500ms;
}
tr.wp-locked .locked-info {
height: 22px;
opacity: 1;
-webkit-transition: height 1s, opacity 500ms 500ms;
transition: height 1s, opacity 500ms 500ms;
}
.fixed .column-comments .sorting-indicator {
margin-top: 3px;
}

View File

@ -574,7 +574,7 @@ class WP_Posts_List_Table extends WP_List_Table {
$locked_avatar = $locked_text = '';
}
echo '<span class="locked-avatar">' . $locked_avatar . '</span> <span class="locked-text">' . $locked_text . "</span>\n";
echo '<div class="locked-info"><span class="locked-avatar">' . $locked_avatar . '</span> <span class="locked-text">' . $locked_text . "</span></div>\n";
}
if ( ! $this->hierarchical_display && 'excerpt' == $mode && current_user_can( 'read_post', $post->ID ) )

View File

@ -302,17 +302,18 @@ $( document ).on( 'heartbeat-tick.wp-check-locked-posts', function( e, data ) {
if ( locked.hasOwnProperty( key ) ) {
if ( ! row.hasClass('wp-locked') ) {
lock_data = locked[key];
row.addClass('wp-locked').find('.column-title .locked-text').text( lock_data.text );
row.find('.column-title .locked-text').text( lock_data.text );
row.find('.check-column checkbox').prop('checked', false);
if ( lock_data.avatar_src ) {
avatar = $('<img class="avatar avatar-18 photo" width="18" height="18" />').attr( 'src', lock_data.avatar_src.replace(/&amp;/g, '&') );
row.find('.column-title .locked-avatar').empty().append( avatar );
}
row.addClass('wp-locked');
}
} else if ( row.hasClass('wp-locked') ) {
row.removeClass('wp-locked').find('.column-title .locked-text').empty();
row.find('.column-title .locked-avatar').empty();
// Make room for the CSS animation
row.removeClass('wp-locked').delay(1000).find('.locked-info span').empty();
}
});
}).on( 'heartbeat-send.wp-check-locked-posts', function( e, data ) {