Initial cleanup after [29220]:

* Alter/remove some jQuery global selectors, views should only manage themselves
* Trigger an event for attachments when arrow keys are pressed: `attachment:keydown:arrow`
* `media.view.Attachments` should listen for `attachment:keydown:arrow`
* Favor scoped selectors over globals

See #23560.


git-svn-id: https://develop.svn.wordpress.org/trunk@29555 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Scott Taylor 2014-08-20 19:13:50 +00:00
parent 21a7e91fbd
commit 66acb3b298
1 changed files with 45 additions and 46 deletions

View File

@ -4854,49 +4854,8 @@
* @param {Object} event
*/
arrowEvent: function( event ) {
var attachment = $('.attachments-browser .attachment'),
attachmentsWidth = $('.attachments-browser .attachments').width(),
thumbnailWidth = attachment.first().outerWidth(),
thumbnailsPerRow = Math.round( attachmentsWidth / thumbnailWidth ),
totalThumnails = attachment.length,
totalRows = Math.ceil(totalThumnails/thumbnailsPerRow),
thisIndex = attachment.filter( ':focus' ).index(),
thisIndexAdjusted = thisIndex + 1,
thisRow = thisIndexAdjusted <= thumbnailsPerRow ? 1 : Math.ceil(thisIndexAdjusted/thumbnailsPerRow);
// Left arrow
if ( 37 === event.keyCode ) {
if ( 0 === thisIndex ) {
return;
}
attachment.eq( thisIndex - 1 ).focus();
}
// Up arrow
if ( 38 === event.keyCode ) {
if ( 1 === thisRow ) {
return;
}
attachment.eq( thisIndex - thumbnailsPerRow ).focus();
}
// Right arrow
if ( 39 === event.keyCode ) {
if ( totalThumnails === thisIndex ) {
return;
}
attachment.eq( thisIndex + 1 ).focus();
}
// Down arrow
if ( 40 === event.keyCode ) {
if ( totalRows === thisRow ) {
return;
}
attachment.eq( thisIndex + thumbnailsPerRow ).focus();
}
return false;
this.controller.trigger( 'attachment:keydown:arrow', event );
return false;
},
/**
* @param {Object} options
@ -5315,6 +5274,8 @@
this.collection.on( 'reset', this.render, this );
this.listenTo( this.controller, 'attachment:keydown:arrow', this.arrowEvent );
// Throttle the scroll handler and bind this.
this.scroll = _.chain( this.scroll ).bind( this ).throttle( this.options.refreshSensitivity ).value();
@ -5335,6 +5296,45 @@
_.defer( this.setColumns, this );
},
arrowEvent: function( event ) {
var attachments = this.$el.children( 'li' ),
perRow = Math.round( this.$el.width() / attachments.first().outerWidth() ),
index = attachments.filter( ':focus' ).index(),
row = ( index + 1 ) <= perRow ? 1 : Math.ceil( ( index + 1 ) / perRow );
// Left arrow
if ( 37 === event.keyCode ) {
if ( 0 === index ) {
return;
}
attachments.eq( index - 1 ).focus();
}
// Up arrow
if ( 38 === event.keyCode ) {
if ( 1 === row ) {
return;
}
attachments.eq( index - perRow ).focus();
}
// Right arrow
if ( 39 === event.keyCode ) {
if ( attachments.length === index ) {
return;
}
attachments.eq( index + 1 ).focus();
}
// Down arrow
if ( 40 === event.keyCode ) {
if ( Math.ceil( attachments.length / perRow ) === row ) {
return;
}
attachments.eq( index + perRow ).focus();
}
},
dispose: function() {
this.collection.props.off( null, null, this );
$( window ).off( 'resize.media-modal-columns' );
@ -6581,12 +6581,11 @@
* @param {Object} event
*/
toggleSelectionHandler: function( event ) {
if ( 'keydown' === event.type && 9 === event.keyCode && event.shiftKey && event.target === $( ':tabbable', this.$el ).filter( ':first' )[0] ) {
$('.attachments-browser .details').focus();
if ( 'keydown' === event.type && 9 === event.keyCode && event.shiftKey && event.target === this.$( ':tabbable' ).get( 0 ) ) {
this.$( ':tabbable' ).eq( 0 ).blur();
return false;
}
}
});
/**