Opened 12 years ago

Closed 12 years ago

Last modified 12 years ago

#4639 closed defect (fixed)

dijit.layout.AccordionContainer -> panes dissapear when using onmouseover instead of onclick (fix included)

Reported by: guest Owned by: Adam Peller
Priority: high Milestone: 1.0
Component: Dijit Version: 0.9
Keywords: Cc:
Blocked By: Blocking:

Description

The bug is when using onmouseover instead of onclick with AccordionContainer?, if you change panels to fast, they will dissapear. This is due to the fact that on an onmouseover event on a panel, the transition() (animation) is executed, the "height" (verticalSpace) is currently changing. Then if the user moves over another panel, another "animation" is started and this is where the "height" will be wrong because the 1st animation isn't done yet.

I needed to change the templateString of the AccordionContainer?.js to be able to use an onmouseover event. Here's the small change (note that I decided to keep the onclick anyway) :

dojoAttachEvent='ondijitclick:_onTitleClick,onmouseover:_onTitleClick [...]

This is what I did in the AccordionContainer?.js to fix it. In resume, I've added another var to the AccordionContainer? so I know if there is already an animation running at the moment :

	duration: 250,
        isRunning: false, //Added
	_verticalSpace: 0,

        [...]

		_transition: function(/*Widget?*/newWidget, /*Widget?*/oldWidget){
//TODO: should be able to replace this with calls to slideIn/slideOut
            if(this.isRunning){ return; } //Added
            var animations = [];
			var paneHeight = this._verticalSpace;
            var _this = this;
            this.isRunning=true; //Added
            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.isRunning=false; //Added
                    }
				}));
			}

			dojo.fx.combine(animations).play();
		},

        [...]

    _onTitleClick: function(){
            if(this.getParent().isRunning){ return; } //Added
        [...]

I hope it's enough clear, let me know if it's not or if you need more details.

Attachments (1)

AccordionContainer.js (6.9 KB) - added by guest 12 years ago.
I've added my js file if you want to compare

Download all attachments as: .zip

Change History (5)

Changed 12 years ago by guest

Attachment: AccordionContainer.js added

I've added my js file if you want to compare

comment:1 Changed 12 years ago by Adam Peller

I need contact info and also need to know if you've signed a CLA. Also, if you can attach this as a patch or diff, that would be huge.

comment:2 Changed 12 years ago by Adam Peller

Owner: set to Adam Peller

comment:3 Changed 12 years ago by Adam Peller

Resolution: fixed
Status: newclosed

(In [10738]) Guess we don't need a CLA for this. Fixes #4639

comment:4 Changed 12 years ago by Adam Peller

Milestone: 1.0
Note: See TracTickets for help on using tickets.