panelbar height

[ronanker]

hello,

i have a rich:panelbar and i want its height to match the size of the parent div... but that can't function on firefox and ie at the same time, and perhaps can't function on firefox at all...

the height should probably be be calculated, i don't know...

the folowing code seems to be a part of the cause (in panelbar.js) :

showSlide: function(slide) {
 if (this.current) this.current.hideContent();
 var h=this.getContentHeight();
 if (this.current) this.current.hideHeader();

 slide.content.style.height=(h>0?h:0)+"px";
 if (h<=1 && (this.panel.style.height=="" || this.panel.style.height.indexOf("%")!=-1)) {
 this.panel.style.height="";
 slide.content.style.height="100%";
 }
 slide.showContent();
 this.current=slide;

 // this.input.value=this.current.index;
 this.input.value=this.current.item.id;
 this.firstLoad = false;
}

on firefox the slide content take the size of the top div and a scroller apears to enable visibility of slides headers...

we should have something like :
slide.content.style.height = panel.style.height - (slideHeaderHeight * numberOfSlides);

i'm not sure that this.getContentHeight(); returns the same value on firefox and IE... and i don't know what object is 'this' here... I'm not good enough in javascript to understand all that...

also, we have to monitor the size of the panel div in case of a resize...
in my case, the panel can have height of 100% to always match its parent, and onresize we read the height value in px to calculate new value of slide content.

do you understand what I mean ? (not easy to explain)

for exemple :

<div id="testDiv">
 <rich:panelBar width="100%" height="100%" selectedPanel="s1">
 <rich:panelBarItem name="s1" label="test 1">
 <jsp:include page="/aaa.inc.jsp" />
 </rich:panelBarItem>
 <rich:panelBarItem name="s2" label="test 2">
 <jsp:include page="/aaa.inc.jsp" />
 </rich:panelBarItem>
 <rich:panelBarItem name="s3" label="test 3">
 <jsp:include page="/aaa.inc.jsp" />
 </rich:panelBarItem>
 </rich:panelBar>
</div>

I want the panelBar size to always match the div "testDiv" size so that the scrollers of that div never apear and the headers of the slides are always on top or bottom of the div.
if the content of a slide is bigger, the the scrollers will appear in the slideContent div.

isn't it like it should act ?

[ronanker]

the structure of the component is quite strange and lack of styles to personalize it :

DIV dr-pnlbar rich-panelbar dr-pnlbar-b (lack rich-panelbar-border) 'styleclass'
 DIV dr-pnlbar rich-panelbar dr-pnlbar-ext (lack rich-panelbar-?) 'styleclass'
 DIV dr-pnlbar-h rich-panelbar-header 'headerclass' 'itemheaderclass'
 DIV dr-pnlbar-h-act rich-panelbar-header-act 'headerclass' 'itemheaderclass' 'activeheaderclass' 'itemactiveheaderclass'
 DIV (lack of styles here)
 TABLE (and why a table ? should have some more styles to make it not visible with borderspacing:0)
 TR
 TD dr-pnlbar-c rich-panelbar-content 'contentclass' 'itemcontentclass'

the 'styleclass' of panelbar is on the 2 first div so it's not easy to use.