Media Grid: Move toggling of visible fields to Screen Options. This moves us in a better direction... but this will probably need to be massaged again.

See #24716.

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


git-svn-id: http://core.svn.wordpress.org/trunk@28863 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Scott Taylor 2014-07-10 21:00:17 +00:00
parent b7c8dee8f5
commit a89060013b
17 changed files with 64 additions and 78 deletions

View File

@ -1025,6 +1025,7 @@ form.upgrade .hint {
display: none; display: none;
margin: 0 0px -1px 20px; margin: 0 0px -1px 20px;
position: relative; position: relative;
z-index: 10;
background-color: #fff; background-color: #fff;
border: 1px solid #ddd; border: 1px solid #ddd;
border-top: none; border-top: none;
@ -1047,6 +1048,7 @@ form.upgrade .hint {
#screen-meta-links .screen-meta-toggle { #screen-meta-links .screen-meta-toggle {
position: relative; position: relative;
top: 0; top: 0;
z-index: 10;
} }
#screen-meta-links a { #screen-meta-links a {

View File

@ -1025,6 +1025,7 @@ form.upgrade .hint {
display: none; display: none;
margin: 0 20px -1px 0px; margin: 0 20px -1px 0px;
position: relative; position: relative;
z-index: 10;
background-color: #fff; background-color: #fff;
border: 1px solid #ddd; border: 1px solid #ddd;
border-top: none; border-top: none;
@ -1047,6 +1048,7 @@ form.upgrade .hint {
#screen-meta-links .screen-meta-toggle { #screen-meta-links .screen-meta-toggle {
position: relative; position: relative;
top: 0; top: 0;
z-index: 10;
} }
#screen-meta-links a { #screen-meta-links a {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1019,7 +1019,12 @@ final class WP_Screen {
?> ?>
<div id="screen-options-wrap" class="hidden" tabindex="-1" aria-label="<?php esc_attr_e('Screen Options Tab'); ?>"> <div id="screen-options-wrap" class="hidden" tabindex="-1" aria-label="<?php esc_attr_e('Screen Options Tab'); ?>">
<form id="adv-settings" action="" method="post"> <form id="adv-settings" action="" method="post">
<?php if ( isset( $wp_meta_boxes[ $this->id ] ) || $this->get_option( 'per_page' ) || ( $columns && empty( $columns['_title'] ) ) ) : ?> <?php if (
isset( $wp_meta_boxes[ $this->id ] )
|| $this->get_option( 'per_page' )
|| $this->get_option( 'media_grid_title' )
|| ( $columns && empty( $columns['_title'] ) )
) : ?>
<h5><?php _e( 'Show on screen' ); ?></h5> <h5><?php _e( 'Show on screen' ); ?></h5>
<?php <?php
endif; endif;
@ -1071,6 +1076,17 @@ final class WP_Screen {
?> ?>
<br class="clear" /> <br class="clear" />
</div> </div>
<?php elseif ( $this->get_option( 'media_grid_title' ) ): ?>
<div class="metabox-prefs media-grid-prefs">
<?php foreach ( $this->_options as $column => $args ) {
$id = "$column-hide";
echo '<label for="' . $id . '">';
$saved = str_replace( 'media_grid_', '', $column );
echo '<input class="hide-column-tog" name="' . $id . '" type="checkbox" id="' . $id . '" value="' . $column . '"' . checked( ! in_array( $saved, $hidden ), true, false ) . ' />';
echo $args['label'] . "</label>\n";
} ?>
<br class="clear" />
</div>
<?php endif; <?php endif;
$this->render_screen_layout(); $this->render_screen_layout();

View File

@ -28,6 +28,20 @@ columns = {
saveManageColumnsState : function() { saveManageColumnsState : function() {
var hidden = this.hidden(); var hidden = this.hidden();
if ( $( '#media_grid_title-hide' ).length ) {
hidden = [];
$( '.hide-column-tog', '.media-grid-prefs' ).each( function() {
var $el, field = this.value.replace( 'media_grid_', '' );
$el = $( '.data-' + field );
if ( ! this.checked ) {
hidden.push( field );
$el.removeClass( 'data-visible' ).addClass( 'data-hidden' );
} else {
$el.removeClass( 'data-hidden' ).addClass( 'data-visible' );
}
} );
hidden = hidden.join( ',' );
}
$.post(ajaxurl, { $.post(ajaxurl, {
action: 'hidden-columns', action: 'hidden-columns',
hidden: hidden, hidden: hidden,

File diff suppressed because one or more lines are too long

View File

@ -26,6 +26,11 @@ if ( 'grid' === $mode ) {
wp_enqueue_script( 'media' ); wp_enqueue_script( 'media' );
wp_localize_script( 'media-grid', 'mediaGridSettings', array( 'adminUrl' => parse_url( self_admin_url(), PHP_URL_PATH ) ) ); wp_localize_script( 'media-grid', 'mediaGridSettings', array( 'adminUrl' => parse_url( self_admin_url(), PHP_URL_PATH ) ) );
add_screen_option( 'media_grid_title', array( 'label' => __( 'Name' ) ) );
add_screen_option( 'media_grid_uploadedTo', array( 'label' => __( 'Uploaded To' ) ) );
add_screen_option( 'media_grid_dateFormatted', array( 'label' => __( 'Date' ) ) );
add_screen_option( 'media_grid_mime', array( 'label' => __( 'Mime-type' ) ) );
require_once( ABSPATH . 'wp-admin/admin-header.php' ); require_once( ABSPATH . 'wp-admin/admin-header.php' );
include( ABSPATH . 'wp-admin/admin-footer.php' ); include( ABSPATH . 'wp-admin/admin-footer.php' );
exit; exit;

View File

@ -2575,6 +2575,7 @@ video#inline-media-node {
* area of the screen. * area of the screen.
*/ */
.media-grid-view { .media-grid-view {
z-index: 1;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
right: 160px; right: 160px;

File diff suppressed because one or more lines are too long

View File

@ -2575,6 +2575,7 @@ video#inline-media-node {
* area of the screen. * area of the screen.
*/ */
.media-grid-view { .media-grid-view {
z-index: 1;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 160px; left: 160px;

File diff suppressed because one or more lines are too long

View File

@ -597,34 +597,6 @@
} }
}); });
media.view.GridFieldOptions = media.View.extend({
className: 'media-grid-field-options',
template: media.template( 'media-grid-field-options' ),
events: {
'change input': 'toggleFields'
},
toggleFields: function(e) {
var $el = $( e.currentTarget ), fields, setting;
setting = $el.data( 'setting' );
fields = $( '.data-' + setting, '.data-fields' );
if ( $el.is( ':checked' ) ) {
fields.show();
deleteUserSetting( 'hidegrid' + setting );
} else {
fields.hide();
setUserSetting( 'hidegrid' + setting, 1 );
}
if ( $( ':checked', this.$el ).length ) {
fields.parent().show();
} else {
fields.parent().hide();
}
}
});
media.view.BulkSelectionToggleButton = media.view.Button.extend({ media.view.BulkSelectionToggleButton = media.view.Button.extend({
initialize: function() { initialize: function() {
media.view.Button.prototype.initialize.apply( this, arguments ); media.view.Button.prototype.initialize.apply( this, arguments );

File diff suppressed because one or more lines are too long

View File

@ -5228,8 +5228,7 @@
controller: this.controller, controller: this.controller,
model: attachment, model: attachment,
collection: this.collection, collection: this.collection,
selection: this.options.selection, selection: this.options.selection
showAttachmentFields: this.options.showAttachmentFields
}); });
return this._viewsByCid[ attachment.cid ] = view; return this._viewsByCid[ attachment.cid ] = view;
@ -5544,7 +5543,6 @@
search: true, search: true,
display: false, display: false,
sidebar: true, sidebar: true,
showAttachmentFields: getUserSetting( 'showAttachmentFields', [ 'title', 'uploadedTo', 'dateFormatted', 'mime' ] ),
AttachmentView: media.view.Attachment.Library AttachmentView: media.view.Attachment.Library
}); });
@ -5609,11 +5607,6 @@
controller: this.controller, controller: this.controller,
priority: -69 priority: -69
}).render() ); }).render() );
this.toolbar.set( 'gridFieldOptions', new media.view.GridFieldOptions({
controller: this.controller,
priority: -50
}).render() );
} }
filters = this.options.filters; filters = this.options.filters;
@ -5705,7 +5698,6 @@
selection: this.options.selection, selection: this.options.selection,
model: this.model, model: this.model,
sortable: this.options.sortable, sortable: this.options.sortable,
showAttachmentFields: this.options.showAttachmentFields,
// The single `Attachment` view to be used in the `Attachments` view. // The single `Attachment` view to be used in the `Attachments` view.
AttachmentView: this.options.AttachmentView AttachmentView: this.options.AttachmentView

File diff suppressed because one or more lines are too long

View File

@ -229,25 +229,6 @@ function wp_print_media_templates() {
</a> </a>
</script> </script>
<script type="text/html" id="tmpl-media-grid-field-options">
<label class="setting">
<span><?php _e( 'Name' ); ?></span>
<input type="checkbox" data-setting="title" {{ '' === getUserSetting( 'hidegridtitle' ) && 'checked' }} />
</label>
<label class="setting">
<span><?php _e( 'Uploaded to' ); ?></span>
<input type="checkbox" data-setting="uploadedTo" {{ '' === getUserSetting( 'hidegriduploadedTo' ) && 'checked' }} />
</label>
<label class="setting">
<span><?php _e( 'Date' ); ?></span>
<input type="checkbox" data-setting="dateFormatted" {{ '' === getUserSetting( 'hidegriddateFormatted' ) && 'checked' }} />
</label>
<label class="setting">
<span><?php _e( 'Mime-type' ); ?></span>
<input type="checkbox" data-setting="mime" {{ '' === getUserSetting( 'hidegridmime' ) && 'checked' }} />
</label>
</script>
<script type="text/html" id="tmpl-uploader-status"> <script type="text/html" id="tmpl-uploader-status">
<h3><?php _e( 'Uploading' ); ?></h3> <h3><?php _e( 'Uploading' ); ?></h3>
<a class="upload-dismiss-errors" href="#"><?php _e('Dismiss Errors'); ?></a> <a class="upload-dismiss-errors" href="#"><?php _e('Dismiss Errors'); ?></a>
@ -437,26 +418,26 @@ function wp_print_media_templates() {
if ( _.contains( data.controller.options.mode, 'grid' ) ) { #> if ( _.contains( data.controller.options.mode, 'grid' ) ) { #>
<div class="data-fields"> <div class="data-fields">
<# _.each( data.showAttachmentFields, function( field ) { <?php
var className = 'data-field data-hidden'; $hidden = get_hidden_columns( get_current_screen() );
if ( '' === getUserSetting( 'hidegrid' + field ) ) { $fields = array( 'title', 'uploadedTo', 'dateFormatted', 'mime' );
className = 'data-field data-visible'; foreach ( $fields as $field ):
} $class_name = in_array( $field, $hidden ) ? 'data-field data-hidden' : 'data-field data-visible';
#> ?>
<div class="{{ className }} data-{{ field }}"><# <div class="<?php echo $class_name ?> data-<?php echo $field ?>"><#
if ( 'uploadedTo' === field ) { if ( 'uploadedTo' === '<?php echo $field ?>' ) {
if ( data[ field ] ) { if ( data[ '<?php echo $field ?>' ] ) {
#><?php _e( 'Uploaded To: ' ) ?><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a><# #><?php _e( 'Uploaded To: ' ) ?><a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a><#
} else { } else {
#><?php _e( 'Unattached' ) ?><# #><?php _e( 'Unattached' ) ?><#
} }
} else if ( 'title' === field && ! data[ field ] ) { } else if ( 'title' === '<?php echo $field ?>' && ! data[ '<?php echo $field ?>' ] ) {
#><?php _e( '(No title)' ) ?><# #><?php _e( '(No title)' ) ?><#
} else if ( data[ field ] ) { } else if ( data[ '<?php echo $field ?>' ] ) {
#>{{ data[ field ] }}<# #>{{ data[ '<?php echo $field ?>' ] }}<#
} }
#></div> #></div>
<# }); #> <?php endforeach ?>
</div> </div>
<# } #> <# } #>