/*! UIkit 2.27.4 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ (function(addon) { var component; if (window.UIkit2) { component = addon(UIkit2); } if (typeof define == 'function' && define.amd) { define('uikit-accordion', ['uikit'], function(){ return component || addon(UIkit2); }); } })(function(UI){ "use strict"; UI.component('accordion', { defaults: { showfirst : true, collapse : true, animate : true, easing : 'swing', duration : 300, toggle : '.uk-accordion-title', containers : '.uk-accordion-content', clsactive : 'uk-active' }, boot: function() { // init code UI.ready(function(context) { setTimeout(function(){ UI.$('[data-uk-accordion]', context).each(function(){ var ele = UI.$(this); if (!ele.data('accordion')) { UI.accordion(ele, UI.Utils.options(ele.attr('data-uk-accordion'))); } }); }, 0); }); }, init: function() { var $this = this; this.element.on('click.uk.accordion', this.options.toggle, function(e) { e.preventDefault(); $this.toggleItem(UI.$(this).data('wrapper'), $this.options.animate, $this.options.collapse); }); this.update(true); UI.domObserve(this.element, function(e) { if ($this.element.children($this.options.containers).length) { $this.update(); } }); }, toggleItem: function(wrapper, animated, collapse) { var $this = this; wrapper.data('toggle').toggleClass(this.options.clsactive); wrapper.data('content').toggleClass(this.options.clsactive); var active = wrapper.data('toggle').hasClass(this.options.clsactive); if (collapse) { this.toggle.not(wrapper.data('toggle')).removeClass(this.options.clsactive); this.content.not(wrapper.data('content')).removeClass(this.options.clsactive) .parent().stop().css('overflow', 'hidden').animate({ height: 0 }, {easing: this.options.easing, duration: animated ? this.options.duration : 0}).attr('aria-expanded', 'false'); } wrapper.stop().css('overflow', 'hidden'); if (animated) { wrapper.animate({ height: active ? getHeight(wrapper.data('content')) : 0 }, {easing: this.options.easing, duration: this.options.duration, complete: function() { if (active) { wrapper.css({'overflow': '', 'height': 'auto'}); UI.Utils.checkDisplay(wrapper.data('content')); } $this.trigger('display.uk.check'); }}); } else { wrapper.height(active ? 'auto' : 0); if (active) { wrapper.css({'overflow': ''}); UI.Utils.checkDisplay(wrapper.data('content')); } this.trigger('display.uk.check'); } // Update ARIA wrapper.attr('aria-expanded', active); this.element.trigger('toggle.uk.accordion', [active, wrapper.data('toggle'), wrapper.data('content')]); }, update: function(init) { var $this = this, $content, $wrapper, $toggle; this.toggle = this.find(this.options.toggle); this.content = this.find(this.options.containers); this.content.each(function(index) { $content = UI.$(this); if ($content.parent().data('wrapper')) { $wrapper = $content.parent(); } else { $wrapper = UI.$(this).wrap('<div data-wrapper="true" style="overflow:hidden;height:0;position:relative;"></div>').parent(); // Init ARIA $wrapper.attr('aria-expanded', 'false'); } $toggle = $this.toggle.eq(index); $wrapper.data('toggle', $toggle); $wrapper.data('content', $content); $toggle.data('wrapper', $wrapper); $content.data('wrapper', $wrapper); }); this.element.trigger('update.uk.accordion', [this]); if (init && this.options.showfirst) { this.toggleItem(this.toggle.eq(0).data('wrapper'), false, false); } } }); // helper function getHeight(ele) { var $ele = UI.$(ele), height = "auto"; if ($ele.is(":visible")) { height = $ele.outerHeight(); } else { var tmp = { position : $ele.css('position'), visibility : $ele.css('visibility'), display : $ele.css('display') }; height = $ele.css({position: 'absolute', visibility: 'hidden', display: 'block'}).outerHeight(); $ele.css(tmp); // reset element } return height; } return UI.accordion; });