Skip to content

Commit e0ae192

Browse files
committed
Merge remote branch 'Adovenmuehle/master' into accordion-height
2 parents c614889 + 94a1786 commit e0ae192

File tree

3 files changed

+69
-9
lines changed

3 files changed

+69
-9
lines changed

tests/unit/accordion/accordion_options.js

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,10 @@ test("{ autoHeight: true }, default", function() {
6969
equalHeights($('#navigation').accordion({ autoHeight: true }), 95, 130);
7070
});
7171

72+
test("{ heightStyle: 'auto' }, default", function() {
73+
equalHeights($('#navigation').accordion({ heightStyle: 'auto' }), 95, 130);
74+
});
75+
7276
test("{ autoHeight: false }", function() {
7377
var accordion = $('#navigation').accordion({ autoHeight: false });
7478
var sizes = [];
@@ -80,6 +84,16 @@ test("{ autoHeight: false }", function() {
8084
ok( sizes[2] >= 42 && sizes[2] <= 54, "was " + sizes[2] );
8185
});
8286

87+
test("{ heightStyle: 'content' }", function() {
88+
var accordion = $('#navigation').accordion({ heightStyle: 'content' });
89+
var sizes = [];
90+
accordion.find(".ui-accordion-content").each(function() {
91+
sizes.push($(this).height());
92+
});
93+
ok( sizes[0] >= 70 && sizes[0] <= 90, "was " + sizes[0] );
94+
ok( sizes[1] >= 98 && sizes[1] <= 126, "was " + sizes[1] );
95+
ok( sizes[2] >= 42 && sizes[2] <= 54, "was " + sizes[2] );
96+
});
8397
test("{ collapsible: false }, default", function() {
8498
var ac = $("#list1").accordion();
8599
ac.accordion("activate", false);
@@ -102,6 +116,28 @@ test("{ fillSpace: true }", function() {
102116
equalHeights($('#navigation').accordion({ fillSpace: true }), 446, 458);
103117
});
104118

119+
test("{ heightStyle: 'fill' }", function() {
120+
$("#navigationWrapper").height(500);
121+
equalHeights($('#navigation').accordion({ heightStyle: 'fill' }), 446, 458);
122+
});
123+
124+
test("{ fillSpace: true } with sibling", function() {
125+
$("#navigationWrapper").height(500);
126+
var sibling = $("<p>Lorem Ipsum</p>");
127+
$("#navigationWrapper").prepend( sibling.height(100) );
128+
//sibling.outerHeight(true) == 126
129+
equalHeights($('#navigation').accordion({ fillSpace: true}), 320, 332);
130+
});
131+
132+
test("{ fillSpace: true } with multiple siblings", function() {
133+
$("#navigationWrapper").height(500);
134+
var sibling = $("<p>Lorem Ipsum</p>");
135+
$("#navigationWrapper").prepend( sibling.height(100) );
136+
$("#navigationWrapper").prepend( sibling.clone().height(50) );
137+
//sibling.outerHeight(true) == 126
138+
equalHeights($('#navigation').accordion({ fillSpace: true}), 244, 256);
139+
});
140+
105141
test("{ header: '> li > :first-child,> :not(li):even' }, default", function() {
106142
state($("#list1").accordion(), 1, 0, 0);
107143
state($("#navigation").accordion(), 1, 0, 0);

tests/visual/accordion/accordion_option_fillSpace_true.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
<body>
2121

2222
<div style="height: 500px; width: 500px; border: 1px solid red;">
23+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ultricies enim augue. Vestibulum quis risus massa. Donec ut augue vitae velit dignissim auctor ac eleifend nisi. Donec et urna sapien. Donec bibendum rhoncus erat sit amet suscipit. Ut sodales vestibulum urna, blandit tempor enim sodales ac. Integer sagittis mauris nec sapien ornare ut malesuada nunc egestas. Ut auctor metus eget leo imperdiet non cursus velit rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur euismod ipsum ac sodales. Proin volutpat, est non ultricies iaculis, augue orci pulvinar lectus, quis tincidunt nibh odio a augue. Sed posuere interdum augue a consequat. Ut ac nunc nulla, quis aliquet purus. Nullam convallis elit id magna pretium pretium. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce commodo, ipsum ac ultrices porta, purus leo suscipit dui, sit amet ultricies ligula ante a dui. Morbi a sem quam, quis rhoncus quam.</p>
2324
<div id="accordion" style="width:490px;">
2425
<h3><a href="#">Accordion Header 1</a></h3>
2526
<div style="padding-top: 1em">

ui/jquery.ui.accordion.js

Lines changed: 32 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,12 @@ $.widget( "ui.accordion", {
1717
options: {
1818
active: 0,
1919
animated: "slide",
20-
autoHeight: true,
21-
clearStyle: false,
20+
autoHeight: true, //DEPRECATED - use heightStyle: "auto"
21+
clearStyle: false, //DEPRECATED - use heightStyle: "content"
2222
collapsible: false,
2323
event: "click",
24-
fillSpace: false,
24+
fillSpace: false, //DEPRECATED - use heightStyle: "fill"
25+
//heightStyle: "auto",
2526
header: "> li > :first-child,> :not(li):even",
2627
icons: {
2728
header: "ui-icon-triangle-1-e",
@@ -33,6 +34,9 @@ $.widget( "ui.accordion", {
3334
var self = this,
3435
options = self.options;
3536

37+
//Merge autoheight, fillSpace and clearStyle
38+
options.heightStyle = options.heightStyle || self._mergeHeightStyle();
39+
3640
self.running = 0;
3741

3842
self.element
@@ -165,13 +169,29 @@ $.widget( "ui.accordion", {
165169
.css( "display", "" )
166170
.removeAttr( "role" )
167171
.removeClass( "ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content ui-accordion-content-active ui-accordion-disabled ui-state-disabled" );
168-
if ( options.autoHeight || options.fillHeight ) {
172+
if ( options.heightStyle !== "content" ) {
169173
contents.css( "height", "" );
170174
}
171175

172176
return $.Widget.prototype.destroy.call( this );
173177
},
174178

179+
_mergeHeightStyle: function() {
180+
var options = this.options;
181+
182+
if ( options.fillSpace ) {
183+
return "fill";
184+
}
185+
186+
if ( options.clearStyle ) {
187+
return "content";
188+
}
189+
190+
if ( options.autoHeight ) {
191+
return "auto";
192+
}
193+
},
194+
175195
_setOption: function( key, value ) {
176196
$.Widget.prototype._setOption.apply( this, arguments );
177197

@@ -232,12 +252,15 @@ $.widget( "ui.accordion", {
232252
var options = this.options,
233253
maxHeight;
234254

235-
if ( options.fillSpace ) {
255+
if ( options.heightStyle === "fill" ) {
236256
if ( $.browser.msie ) {
237257
var defOverflow = this.element.parent().css( "overflow" );
238258
this.element.parent().css( "overflow", "hidden");
239259
}
240260
maxHeight = this.element.parent().height();
261+
this.element.siblings( ":visible" ).each(function() {
262+
maxHeight -= $( this ).outerHeight( true );
263+
});
241264
if ($.browser.msie) {
242265
this.element.parent().css( "overflow", defOverflow );
243266
}
@@ -252,7 +275,7 @@ $.widget( "ui.accordion", {
252275
$( this ).innerHeight() + $( this ).height() ) );
253276
})
254277
.css( "overflow", "auto" );
255-
} else if ( options.autoHeight ) {
278+
} else if ( options.heightStyle === "auto" ) {
256279
maxHeight = 0;
257280
this.headers.next()
258281
.each(function() {
@@ -398,15 +421,15 @@ $.widget( "ui.accordion", {
398421
toHide: toHide,
399422
complete: complete,
400423
down: down,
401-
autoHeight: options.autoHeight || options.fillSpace
424+
autoHeight: options.heightStyle !== "content"
402425
};
403426
} else {
404427
animOptions = {
405428
toShow: toShow,
406429
toHide: toHide,
407430
complete: complete,
408431
down: down,
409-
autoHeight: options.autoHeight || options.fillSpace
432+
autoHeight: options.heightStyle !== "content"
410433
};
411434
}
412435

@@ -475,7 +498,7 @@ $.widget( "ui.accordion", {
475498
return;
476499
}
477500

478-
if ( this.options.clearStyle ) {
501+
if ( this.options.heightStyle === "content" ) {
479502
this.toShow.add( this.toHide ).css({
480503
height: "",
481504
overflow: ""

0 commit comments

Comments
 (0)