Ticket #428 (closed defect: invalid)
opacity-only Accordion (alwaysHide type, toggler) does not complete execution
| Reported by: | weaver | Owned by: | |
|---|---|---|---|
| Type: | defect | Priority: | major |
| Milestone: | Component: | Core | |
| Keywords: | accordion, opacity | Cc: |
Description
This is with the public release of mootools v1.11 (I did not check this with any dev builds)
Using a standard instance of an Accordion, in the 'toggler' flavor, and just allowing 'opacity', Accordion does not function correctly. User-defined functions, if present, such as onActive, etc... do not fire and actually do not complete. So I could not even develop a workaround function as the triggers are not fired when clicked or a transition is finished.
var accordion = new Accordion('h3.atStart', 'div.atStart', {
opacity: false,
height: false,
alwaysHide: true
});
Original conditional in 'display' method (highlighting comments added)
display: function(index){
index = ($type(index) == 'element') ? this.elements.indexOf(index) : index;
if ((this.timer && this.options.wait) || (index === this.previous && !this.options.alwaysHide)) return this;
this.previous = index;
var obj = {};
this.elements.each(function(el, i){
obj[i] = {};
//xcxcxcxcxcxcxcx
var hide = (i != index) || (this.options.alwaysHide && (el.offsetHeight > 0));
//xcxcxcxcxcxcxcx
this.fireEvent(hide ? 'onBackground' : 'onActive', [this.togglers[i], el]);
for (var fx in this.effects) obj[i][fx] = hide ? 0 : el[this.effects[fx]];
}, this);
return this.start(obj);
},
I think that the conditional below works better and allows for opacity only 'toggle':
var hide = (i != index) || (this.options.alwaysHide && ((el.offsetHeight > 0 && this.options.height) || (el.style.opacity > 0 && this.options.opacity)));
changes - pseudo-code: '(am I concerned with height, AND is it too big?) OR (am I concerned with opacity AND is it visible)' either/or is sufficient to trigger the hiding action.
I believe this possibility needs to be accounted for, as it is not a 'cosmetic' issue that the effect just does not work. The script is actually not completing execution.
Kudos on the library, keep it up. I hope this is not a duplication and is useful.
Thanks