if(!dojo._hasResource["dijit.layout.AccordionContainer"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. dojo._hasResource["dijit.layout.AccordionContainer"] = true; dojo.provide("dijit.layout.AccordionContainer"); dojo.require("dojo.fx"); dojo.require("dijit._Container"); dojo.require("dijit._Templated"); dojo.require("dijit.layout.StackContainer"); dojo.require("dijit.layout.ContentPane"); dojo.declare( "dijit.layout.AccordionContainer", dijit.layout.StackContainer, { // summary: // Holds a set of panes where every pane's title is visible, but only one pane's content is visible at a time, // and switching between panes is visualized by sliding the other panes up/down. // example: // |
// |
// |
...
// |
// |
// |

This is some text

// || ... // |
// // duration: Integer // Amount of time (in ms) it takes to slide panes duration: 250, _verticalSpace: 0, postCreate: function(){ this.domNode.style.overflow="hidden"; this.inherited("postCreate",arguments); dijit.setWaiRole(this.domNode, "tablist"); dojo.addClass(this.domNode,"dijitAccordionContainer"); }, startup: function(){ if(this._started){ return; } this.inherited("startup",arguments); if(this.selectedChildWidget){ var style = this.selectedChildWidget.containerNode.style; style.display = ""; style.overflow = "auto"; this.selectedChildWidget._setSelectedState(true); } }, layout: function(){ // summary: // Set the height of the open pane based on what room remains // get cumulative height of all the title bars, and figure out which pane is open var totalCollapsedHeight = 0; var openPane = this.selectedChildWidget; dojo.forEach(this.getChildren(), function(child){ totalCollapsedHeight += child.getTitleHeight(); }); var mySize = this._contentBox; this._verticalSpace = (mySize.h - totalCollapsedHeight); if(openPane){ openPane.containerNode.style.height = this._verticalSpace + "px"; /*** TODO: this is wrong. probably you wanted to call resize on the SplitContainer inside the AccordionPane?? if(openPane.resize){ openPane.resize({h: this._verticalSpace}); } ***/ } }, _setupChild: function(/*Widget*/ page){ // Summary: prepare the given child return page; }, _transition: function(/*Widget?*/newWidget, /*Widget?*/oldWidget){ //TODO: should be able to replace this with calls to slideIn/slideOut if(this._inTransition){ return; } this._inTransition = true; var animations = []; var paneHeight = this._verticalSpace; if(newWidget){ newWidget.setSelected(true); var newContents = newWidget.containerNode; newContents.style.display = ""; animations.push(dojo.animateProperty({ node: newContents, duration: this.duration, properties: { height: { start: "1", end: paneHeight } }, onEnd: function(){ newContents.style.overflow = "auto"; } })); } if(oldWidget){ oldWidget.setSelected(false); var oldContents = oldWidget.containerNode; oldContents.style.overflow = "hidden"; animations.push(dojo.animateProperty({ node: oldContents, duration: this.duration, properties: { height: { start: paneHeight, end: "1" } }, onEnd: function(){ oldContents.style.display = "none"; } })); } this._inTransition = false; dojo.fx.combine(animations).play(); }, // note: we are treating the container as controller here _onKeyPress: function(/*Event*/ e){ if(this.disabled || e.altKey || !(e._dijitWidget || e.ctrlKey)){ return; } var k = dojo.keys; var fromTitle = e._dijitWidget; switch(e.keyCode){ case k.LEFT_ARROW: case k.UP_ARROW: if (fromTitle){ this._adjacent(false)._onTitleClick(); dojo.stopEvent(e); } break; case k.PAGE_UP: if (e.ctrlKey){ this._adjacent(false)._onTitleClick(); dojo.stopEvent(e); } break; case k.RIGHT_ARROW: case k.DOWN_ARROW: if (fromTitle){ this._adjacent(true)._onTitleClick(); dojo.stopEvent(e); } break; case k.PAGE_DOWN: if (e.ctrlKey){ this._adjacent(true)._onTitleClick(); dojo.stopEvent(e); } break; default: if(e.ctrlKey && e.keyCode == k.TAB){ this._adjacent(e._dijitWidget, !e.shiftKey)._onTitleClick(); dojo.stopEvent(e); } } } } ); dojo.declare("dijit.layout.AccordionPane", [dijit.layout.ContentPane, dijit._Templated, dijit._Contained], { // summary: // AccordionPane is a ContentPane with a title that may contain another widget. // Nested layout widgets, such as SplitContainer, are not supported at this time. // example: // | see dijit.layout.AccordionContainer templateString:"
${title}
\n
\n", postCreate: function(){ this.inherited("postCreate",arguments) dojo.setSelectable(this.titleNode, false); this.setSelected(this.selected); }, getTitleHeight: function(){ // summary: returns the height of the title dom node return dojo.marginBox(this.titleNode).h; // Integer }, _onTitleClick: function(){ // summary: callback when someone clicks my title var parent = this.getParent(); if(!parent._inTransition){ parent.selectChild(this); dijit.focus(this.focusNode); } }, _onTitleKeyPress: function(/*Event*/ evt){ evt._dijitWidget = this; return this.getParent()._onKeyPress(evt); }, _setSelectedState: function(/*Boolean*/ isSelected){ this.selected = isSelected; dojo[(isSelected ? "addClass" : "removeClass")](this.titleNode,"dijitAccordionTitle-selected"); this.focusNode.setAttribute("tabIndex", isSelected ? "0" : "-1"); }, _handleFocus: function(/*Event*/e){ // summary: handle the blur and focus state of this widget dojo[(e.type=="focus" ? "addClass" : "removeClass")](this.focusNode,"dijitAccordionFocused"); }, setSelected: function(/*Boolean*/ isSelected){ // summary: change the selected state on this pane this._setSelectedState(isSelected); if(isSelected){ this.onSelected(); this._loadCheck(true); // if href specified, trigger load } }, onSelected: function(){ // summary: called when this pane is selected } }); }