Skip to content
Permalink
Browse files

changing the css and most of the javascript for the modal metabox to …

…accomodate any taxonomy. Now makes use of the Backbone.js Media API components in 3.5. fixes #1 thanks @stvwlf for the bug report.
  • Loading branch information
eddiemoya committed Dec 15, 2012
1 parent 48c80f5 commit 22931a77eead602a928aeafcd428df9c61cb51d0
Showing with 52 additions and 37 deletions.
  1. +46 −28 media-categories-script.js
  2. +6 −9 media-categories-style.css
@@ -18,43 +18,61 @@ jQuery(document).ready(function($){
delete wp.media.view.AttachmentCompat.prototype.events['change input'];
wp.media.view.AttachmentCompat.prototype.events['change input[type!="checkbox"]'] = 'save';

$.each(taxonomy, function(index, tax){

var metabox_class = '.compat-field-'+tax+'_metabox';
//Overriding saveCompat just so i can add the trigger.
wp.media.model.Attachment.prototype.saveCompat =
function( data, options ) {
var model = this;

// If we do not have the necessary nonce, fail immeditately.
if ( ! this.get('nonces') || ! this.get('nonces').update )
return $.Deferred().rejectWith( this ).promise();

return wp.media.post( 'save-attachment-compat', _.defaults({
id: this.id,
nonce: this.get('nonces').update,
post_id: wp.media.model.settings.post.id
}, data ) ).done( function( resp, status, xhr ) {
model.set( model.parse( resp, xhr ), options );
//trigger so i can detect the refreshing of the sidebar.
$('.compat-attachment-fields').trigger('modal-refreshed');
});
}

// Trigger the 'change' event when the mouse leaves the metabox.
$(metabox_class).live('mouseleave', function(){
$('.compat-item input:first').trigger('change');
});
$.each(taxonomy, function(index, tax){

// Toggle the visiblity of the metabox on clicking the label
$(metabox_class + ' th').live('click', function(){

/*
* .categorydiv and .help are hidden by css to start with - to make it start from a closed position.
* This is different from the normal toggling of the td.field. This fixes it so that it bhaves normally after
* the first click.
*/
if($('.media-sidebar .categorydiv, .media-sidebar .categorydiv + .help').css('display') == 'none'){
$(this).parent().find('td.field').hide();
$('.media-sidebar .categorydiv, .media-sidebar .categorydiv + .help').show();
}
var input_class = '.compat-field-'+tax;
var metabox_class = input_class+'_metabox';

var field_container = $(this).parent().find('td.field');

// Depending on the current state of td.field, hide or show it, and flip the arrow indicator.
if(field_container.is(":visible")){
field_container.slideUp();
$(this).parent().find('.arrow-up').attr('class', 'arrow-down');
wp.media.view.AttachmentCompat.prototype.events['click th'] = 'slideToggle';
wp.media.view.AttachmentCompat.prototype.slideToggle = function( event ){

var metabox_container = this.$el.find('.metabox_container');

metabox_container.find('td.field').slideToggle();

if(metabox_container.find('.arrow-down').length > 0){
metabox_container.find('.arrow-down').attr('class', 'arrow-up');
} else {
field_container.slideDown();
$(this).parent().find('.arrow-down').attr('class', 'arrow-up');

metabox_container.find('.arrow-up').attr('class', 'arrow-down');
}
});

}

$('.compat-attachment-fields').live('modal-refreshed', function(){
$(input_class).hide();
$(metabox_class).addClass('metabox_container');
})

$('.attachments').live('click', function(){
$(input_class).hide();
$(metabox_class).addClass('metabox_container');
})

// Trigger the 'change' event when the mouse leaves the metabox.
$(metabox_class).live('mouseleave', function() { $('.compat-item input:first').trigger('change');});

//Sync the checkboxes to comma delimited list in the hidden text field for the taxonomy.
$('.media-sidebar input').live('click', function(){

var form_fields = $(this).closest("tbody");
@@ -1,8 +1,5 @@
.media-sidebar .category-tabs,
.media-sidebar tr.compat-field-category,
.media-sidebar .categorydiv,
.media-sidebar .categorydiv + .help,
.media-sidebar #category-adder,
.media-sidebar .metabox_container .field,
.media-sidebar .wp-hidden-children{
display:none;
}
@@ -18,14 +15,14 @@
margin-left:-85px;
}*/

.compat-field-category_metabox td.field {
.metabox_container td.field {
width: 99%;
}
.compat-field-category_metabox input[type="checkbox"] {
.metabox_container input[type="checkbox"] {
width: auto;
}

tr.compat-field-category_metabox th.label span {
tr.metabox_container th.label span {
font-weight: bold;
text-transform: uppercase;
font-size: 12px;
@@ -34,15 +31,15 @@ tr.compat-field-category_metabox th.label span {
margin: 0 0 8px;
}

.compat-field-category_metabox, .attachment-details.save-ready {
.metabox_container, div.attachment-details {
overflow: hidden;
box-shadow: 0 1px 0 white;
border-bottom: 1px solid #E5E5E5;
margin-bottom: 16px;
padding-bottom: 11px;
}

div.attachment-details.save-ready {
div.attachment-details {
padding-bottom: 24px;
margin-bottom: 10px;
}

0 comments on commit 22931a7

Please sign in to comment.
You can’t perform that action at this time.