/* * jQuery Mobile Framework : "collapsible" plugin (based on code from Filament Group,Inc) * Copyright (c) jQuery Project * Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses. * Note: Code is in draft form and is subject to change */ (function($){ $.fn.collapsible = function(options){ return $(this).each(function(){ var o = $.extend({ expandCueText: ' click to expand contents', collapseCueText: ' click to collapse contents', collapsed: $(this).is('[data-state="collapsed"]'), heading: '>h1,>h2,>h3,>h4,>h5,>h6,>legend', theme: $(this).data('theme'), iconTheme: $(this).data('icontheme') || 'd' },options); //define var collapsibleContain = $(this).addClass('ui-collapsible-contain'), collapsibleHeading = $(this).find(o.heading).eq(0), collapsibleContent = collapsibleContain.wrapInner('
').find('.ui-collapsible-content'), collapsibleParent = $(this).closest('[data-role=collapsible-set]').addClass('ui-collapsible-set'); //replace collapsibleHeading if it's a legend if(collapsibleHeading.is('legend')){ collapsibleHeading = $('
'+ collapsibleHeading.html() +'
').insertBefore(collapsibleHeading); collapsibleHeading.next().remove(); } //drop heading in before content collapsibleHeading.insertBefore(collapsibleContent); //modify markup & attributes collapsibleHeading.addClass('ui-collapsible-heading') .append('') .wrapInner('') .find('a:eq(0)') .buttonMarkup({ shadow: !!!collapsibleParent.length, corners:false, iconPos: 'left', icon: 'plus', theme: o.theme }) .find('.ui-icon') .removeAttr('class') .buttonMarkup({ shadow: true, corners:true, iconPos: 'notext', icon: 'plus', theme: o.iconTheme }); if( !collapsibleParent.length ){ collapsibleHeading .find('a:eq(0)') .addClass('ui-corner-all') .find('.ui-btn-inner') .addClass('ui-corner-all'); } else { if( collapsibleContain.data('collapsible-last') ){ collapsibleHeading .find('a:eq(0), .ui-btn-inner') .addClass('ui-corner-bottom'); } } //events collapsibleContain .bind('collapse', function(event){ if( !event.isDefaultPrevented() ){ event.preventDefault(); collapsibleHeading .addClass('ui-collapsible-heading-collapsed') .find('.ui-collapsible-heading-status').text(o.expandCueText); collapsibleHeading.find('.ui-icon').removeClass('ui-icon-minus').addClass('ui-icon-plus'); collapsibleContent.addClass('ui-collapsible-content-collapsed').attr('aria-hidden',true); if( collapsibleContain.data('collapsible-last') ){ collapsibleHeading .find('a:eq(0), .ui-btn-inner') .addClass('ui-corner-bottom'); } } }) .bind('expand', function(event){ if( !event.isDefaultPrevented() ){ event.preventDefault(); collapsibleHeading .removeClass('ui-collapsible-heading-collapsed') .find('.ui-collapsible-heading-status').text(o.collapseCueText); collapsibleHeading.find('.ui-icon').removeClass('ui-icon-plus').addClass('ui-icon-minus'); collapsibleContent.removeClass('ui-collapsible-content-collapsed').attr('aria-hidden',false); if( collapsibleContain.data('collapsible-last') ){ collapsibleHeading .find('a:eq(0), .ui-btn-inner') .removeClass('ui-corner-bottom'); } } }) .trigger(o.collapsed ? 'collapse' : 'expand'); //close others in a set if( collapsibleParent.length && !collapsibleParent.data("collapsiblebound") ){ collapsibleParent .data("collapsiblebound", true) .bind("expand", function( event ){ $(this).find( ".ui-collapsible-contain" ) .not( $(event.target).closest( ".ui-collapsible-contain" ) ) .not( "> .ui-collapsible-contain .ui-collapsible-contain" ) .trigger( "collapse" ); }) var set = collapsibleParent.find('[data-role=collapsible]') set.first() .find('a:eq(0)') .addClass('ui-corner-top') .find('.ui-btn-inner') .addClass('ui-corner-top'); set.last().data('collapsible-last', true) } collapsibleHeading.click(function(){ if( collapsibleHeading.is('.ui-collapsible-heading-collapsed') ){ collapsibleContain.trigger('expand'); } else { collapsibleContain.trigger('collapse'); } return false; }); }); }; })(jQuery);