12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091 |
- /* ========================================================================
- * Tutorial specific Javascript
- *
- * ========================================================================
- * Copyright 2015 Bootbites.com (unless otherwise stated)
- * For license information see: http://bootbites.com/license
- * ======================================================================== */
- 'use strict';
-
- var dropdownSelectors = $('.dropdown, .dropup');
-
- // Custom function to read dropdown data
- // =========================
- function dropdownEffectData(target) {
- // @todo - page level global?
- var effectInDefault = null,
- effectOutDefault = null;
- var dropdown = $(target),
- dropdownMenu = $('.dropdown-menu', target);
- var parentUl = dropdown.parents('ul.nav');
-
- // If parent is ul.nav allow global effect settings
- if (parentUl.length > 0) {
- effectInDefault = parentUl.data('dropdown-in') || null;
- effectOutDefault = parentUl.data('dropdown-out') || null;
- }
-
- return {
- target: target,
- dropdown: dropdown,
- dropdownMenu: dropdownMenu,
- effectIn: dropdownMenu.data('dropdown-in') || effectInDefault,
- effectOut: dropdownMenu.data('dropdown-out') || effectOutDefault,
- };
- }
-
- // Custom function to start effect (in or out)
- // =========================
- function dropdownEffectStart(data, effectToStart) {
- if (effectToStart) {
- data.dropdown.addClass('dropdown-animating');
- data.dropdownMenu.addClass('animated');
- data.dropdownMenu.addClass(effectToStart);
- }
- }
-
- // Custom function to read when animation is over
- // =========================
- function dropdownEffectEnd(data, callbackFunc) {
- var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
- data.dropdown.one(animationEnd, function() {
- data.dropdown.removeClass('dropdown-animating');
- data.dropdownMenu.removeClass('animated');
- data.dropdownMenu.removeClass(data.effectIn);
- data.dropdownMenu.removeClass(data.effectOut);
-
- // Custom callback option, used to remove open class in out effect
- if(typeof callbackFunc == 'function'){
- callbackFunc();
- }
- });
- }
-
- // Bootstrap API hooks
- // =========================
- dropdownSelectors.on({
- "show.bs.dropdown": function () {
- // On show, start in effect
- var dropdown = dropdownEffectData(this);
- dropdownEffectStart(dropdown, dropdown.effectIn);
- },
- "shown.bs.dropdown": function () {
- // On shown, remove in effect once complete
- var dropdown = dropdownEffectData(this);
- if (dropdown.effectIn && dropdown.effectOut) {
- dropdownEffectEnd(dropdown, function() {});
- }
- },
- "hide.bs.dropdown": function(e) {
- // On hide, start out effect
- var dropdown = dropdownEffectData(this);
- if (dropdown.effectOut) {
- e.preventDefault();
- dropdownEffectStart(dropdown, dropdown.effectOut);
- dropdownEffectEnd(dropdown, function() {
- dropdown.dropdown.removeClass('show');
- dropdown.dropdownMenu.removeClass('show');
- });
- }
- },
- });
|