Layout von Websiten mit Bootstrap und Foundation
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

collapse.js 14KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432
  1. /*!
  2. * Bootstrap collapse.js v4.5.0 (https://getbootstrap.com/)
  3. * Copyright 2011-2020 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
  4. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  5. */
  6. (function (global, factory) {
  7. typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
  8. typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
  9. (global = global || self, global.Collapse = factory(global.jQuery, global.Util));
  10. }(this, (function ($, Util) { 'use strict';
  11. $ = $ && Object.prototype.hasOwnProperty.call($, 'default') ? $['default'] : $;
  12. Util = Util && Object.prototype.hasOwnProperty.call(Util, 'default') ? Util['default'] : Util;
  13. function _defineProperties(target, props) {
  14. for (var i = 0; i < props.length; i++) {
  15. var descriptor = props[i];
  16. descriptor.enumerable = descriptor.enumerable || false;
  17. descriptor.configurable = true;
  18. if ("value" in descriptor) descriptor.writable = true;
  19. Object.defineProperty(target, descriptor.key, descriptor);
  20. }
  21. }
  22. function _createClass(Constructor, protoProps, staticProps) {
  23. if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  24. if (staticProps) _defineProperties(Constructor, staticProps);
  25. return Constructor;
  26. }
  27. function _defineProperty(obj, key, value) {
  28. if (key in obj) {
  29. Object.defineProperty(obj, key, {
  30. value: value,
  31. enumerable: true,
  32. configurable: true,
  33. writable: true
  34. });
  35. } else {
  36. obj[key] = value;
  37. }
  38. return obj;
  39. }
  40. function ownKeys(object, enumerableOnly) {
  41. var keys = Object.keys(object);
  42. if (Object.getOwnPropertySymbols) {
  43. var symbols = Object.getOwnPropertySymbols(object);
  44. if (enumerableOnly) symbols = symbols.filter(function (sym) {
  45. return Object.getOwnPropertyDescriptor(object, sym).enumerable;
  46. });
  47. keys.push.apply(keys, symbols);
  48. }
  49. return keys;
  50. }
  51. function _objectSpread2(target) {
  52. for (var i = 1; i < arguments.length; i++) {
  53. var source = arguments[i] != null ? arguments[i] : {};
  54. if (i % 2) {
  55. ownKeys(Object(source), true).forEach(function (key) {
  56. _defineProperty(target, key, source[key]);
  57. });
  58. } else if (Object.getOwnPropertyDescriptors) {
  59. Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
  60. } else {
  61. ownKeys(Object(source)).forEach(function (key) {
  62. Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
  63. });
  64. }
  65. }
  66. return target;
  67. }
  68. /**
  69. * ------------------------------------------------------------------------
  70. * Constants
  71. * ------------------------------------------------------------------------
  72. */
  73. var NAME = 'collapse';
  74. var VERSION = '4.5.0';
  75. var DATA_KEY = 'bs.collapse';
  76. var EVENT_KEY = "." + DATA_KEY;
  77. var DATA_API_KEY = '.data-api';
  78. var JQUERY_NO_CONFLICT = $.fn[NAME];
  79. var Default = {
  80. toggle: true,
  81. parent: ''
  82. };
  83. var DefaultType = {
  84. toggle: 'boolean',
  85. parent: '(string|element)'
  86. };
  87. var EVENT_SHOW = "show" + EVENT_KEY;
  88. var EVENT_SHOWN = "shown" + EVENT_KEY;
  89. var EVENT_HIDE = "hide" + EVENT_KEY;
  90. var EVENT_HIDDEN = "hidden" + EVENT_KEY;
  91. var EVENT_CLICK_DATA_API = "click" + EVENT_KEY + DATA_API_KEY;
  92. var CLASS_NAME_SHOW = 'show';
  93. var CLASS_NAME_COLLAPSE = 'collapse';
  94. var CLASS_NAME_COLLAPSING = 'collapsing';
  95. var CLASS_NAME_COLLAPSED = 'collapsed';
  96. var DIMENSION_WIDTH = 'width';
  97. var DIMENSION_HEIGHT = 'height';
  98. var SELECTOR_ACTIVES = '.show, .collapsing';
  99. var SELECTOR_DATA_TOGGLE = '[data-toggle="collapse"]';
  100. /**
  101. * ------------------------------------------------------------------------
  102. * Class Definition
  103. * ------------------------------------------------------------------------
  104. */
  105. var Collapse = /*#__PURE__*/function () {
  106. function Collapse(element, config) {
  107. this._isTransitioning = false;
  108. this._element = element;
  109. this._config = this._getConfig(config);
  110. this._triggerArray = [].slice.call(document.querySelectorAll("[data-toggle=\"collapse\"][href=\"#" + element.id + "\"]," + ("[data-toggle=\"collapse\"][data-target=\"#" + element.id + "\"]")));
  111. var toggleList = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLE));
  112. for (var i = 0, len = toggleList.length; i < len; i++) {
  113. var elem = toggleList[i];
  114. var selector = Util.getSelectorFromElement(elem);
  115. var filterElement = [].slice.call(document.querySelectorAll(selector)).filter(function (foundElem) {
  116. return foundElem === element;
  117. });
  118. if (selector !== null && filterElement.length > 0) {
  119. this._selector = selector;
  120. this._triggerArray.push(elem);
  121. }
  122. }
  123. this._parent = this._config.parent ? this._getParent() : null;
  124. if (!this._config.parent) {
  125. this._addAriaAndCollapsedClass(this._element, this._triggerArray);
  126. }
  127. if (this._config.toggle) {
  128. this.toggle();
  129. }
  130. } // Getters
  131. var _proto = Collapse.prototype;
  132. // Public
  133. _proto.toggle = function toggle() {
  134. if ($(this._element).hasClass(CLASS_NAME_SHOW)) {
  135. this.hide();
  136. } else {
  137. this.show();
  138. }
  139. };
  140. _proto.show = function show() {
  141. var _this = this;
  142. if (this._isTransitioning || $(this._element).hasClass(CLASS_NAME_SHOW)) {
  143. return;
  144. }
  145. var actives;
  146. var activesData;
  147. if (this._parent) {
  148. actives = [].slice.call(this._parent.querySelectorAll(SELECTOR_ACTIVES)).filter(function (elem) {
  149. if (typeof _this._config.parent === 'string') {
  150. return elem.getAttribute('data-parent') === _this._config.parent;
  151. }
  152. return elem.classList.contains(CLASS_NAME_COLLAPSE);
  153. });
  154. if (actives.length === 0) {
  155. actives = null;
  156. }
  157. }
  158. if (actives) {
  159. activesData = $(actives).not(this._selector).data(DATA_KEY);
  160. if (activesData && activesData._isTransitioning) {
  161. return;
  162. }
  163. }
  164. var startEvent = $.Event(EVENT_SHOW);
  165. $(this._element).trigger(startEvent);
  166. if (startEvent.isDefaultPrevented()) {
  167. return;
  168. }
  169. if (actives) {
  170. Collapse._jQueryInterface.call($(actives).not(this._selector), 'hide');
  171. if (!activesData) {
  172. $(actives).data(DATA_KEY, null);
  173. }
  174. }
  175. var dimension = this._getDimension();
  176. $(this._element).removeClass(CLASS_NAME_COLLAPSE).addClass(CLASS_NAME_COLLAPSING);
  177. this._element.style[dimension] = 0;
  178. if (this._triggerArray.length) {
  179. $(this._triggerArray).removeClass(CLASS_NAME_COLLAPSED).attr('aria-expanded', true);
  180. }
  181. this.setTransitioning(true);
  182. var complete = function complete() {
  183. $(_this._element).removeClass(CLASS_NAME_COLLAPSING).addClass(CLASS_NAME_COLLAPSE + " " + CLASS_NAME_SHOW);
  184. _this._element.style[dimension] = '';
  185. _this.setTransitioning(false);
  186. $(_this._element).trigger(EVENT_SHOWN);
  187. };
  188. var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
  189. var scrollSize = "scroll" + capitalizedDimension;
  190. var transitionDuration = Util.getTransitionDurationFromElement(this._element);
  191. $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
  192. this._element.style[dimension] = this._element[scrollSize] + "px";
  193. };
  194. _proto.hide = function hide() {
  195. var _this2 = this;
  196. if (this._isTransitioning || !$(this._element).hasClass(CLASS_NAME_SHOW)) {
  197. return;
  198. }
  199. var startEvent = $.Event(EVENT_HIDE);
  200. $(this._element).trigger(startEvent);
  201. if (startEvent.isDefaultPrevented()) {
  202. return;
  203. }
  204. var dimension = this._getDimension();
  205. this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + "px";
  206. Util.reflow(this._element);
  207. $(this._element).addClass(CLASS_NAME_COLLAPSING).removeClass(CLASS_NAME_COLLAPSE + " " + CLASS_NAME_SHOW);
  208. var triggerArrayLength = this._triggerArray.length;
  209. if (triggerArrayLength > 0) {
  210. for (var i = 0; i < triggerArrayLength; i++) {
  211. var trigger = this._triggerArray[i];
  212. var selector = Util.getSelectorFromElement(trigger);
  213. if (selector !== null) {
  214. var $elem = $([].slice.call(document.querySelectorAll(selector)));
  215. if (!$elem.hasClass(CLASS_NAME_SHOW)) {
  216. $(trigger).addClass(CLASS_NAME_COLLAPSED).attr('aria-expanded', false);
  217. }
  218. }
  219. }
  220. }
  221. this.setTransitioning(true);
  222. var complete = function complete() {
  223. _this2.setTransitioning(false);
  224. $(_this2._element).removeClass(CLASS_NAME_COLLAPSING).addClass(CLASS_NAME_COLLAPSE).trigger(EVENT_HIDDEN);
  225. };
  226. this._element.style[dimension] = '';
  227. var transitionDuration = Util.getTransitionDurationFromElement(this._element);
  228. $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
  229. };
  230. _proto.setTransitioning = function setTransitioning(isTransitioning) {
  231. this._isTransitioning = isTransitioning;
  232. };
  233. _proto.dispose = function dispose() {
  234. $.removeData(this._element, DATA_KEY);
  235. this._config = null;
  236. this._parent = null;
  237. this._element = null;
  238. this._triggerArray = null;
  239. this._isTransitioning = null;
  240. } // Private
  241. ;
  242. _proto._getConfig = function _getConfig(config) {
  243. config = _objectSpread2(_objectSpread2({}, Default), config);
  244. config.toggle = Boolean(config.toggle); // Coerce string values
  245. Util.typeCheckConfig(NAME, config, DefaultType);
  246. return config;
  247. };
  248. _proto._getDimension = function _getDimension() {
  249. var hasWidth = $(this._element).hasClass(DIMENSION_WIDTH);
  250. return hasWidth ? DIMENSION_WIDTH : DIMENSION_HEIGHT;
  251. };
  252. _proto._getParent = function _getParent() {
  253. var _this3 = this;
  254. var parent;
  255. if (Util.isElement(this._config.parent)) {
  256. parent = this._config.parent; // It's a jQuery object
  257. if (typeof this._config.parent.jquery !== 'undefined') {
  258. parent = this._config.parent[0];
  259. }
  260. } else {
  261. parent = document.querySelector(this._config.parent);
  262. }
  263. var selector = "[data-toggle=\"collapse\"][data-parent=\"" + this._config.parent + "\"]";
  264. var children = [].slice.call(parent.querySelectorAll(selector));
  265. $(children).each(function (i, element) {
  266. _this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
  267. });
  268. return parent;
  269. };
  270. _proto._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
  271. var isOpen = $(element).hasClass(CLASS_NAME_SHOW);
  272. if (triggerArray.length) {
  273. $(triggerArray).toggleClass(CLASS_NAME_COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
  274. }
  275. } // Static
  276. ;
  277. Collapse._getTargetFromElement = function _getTargetFromElement(element) {
  278. var selector = Util.getSelectorFromElement(element);
  279. return selector ? document.querySelector(selector) : null;
  280. };
  281. Collapse._jQueryInterface = function _jQueryInterface(config) {
  282. return this.each(function () {
  283. var $this = $(this);
  284. var data = $this.data(DATA_KEY);
  285. var _config = _objectSpread2(_objectSpread2(_objectSpread2({}, Default), $this.data()), typeof config === 'object' && config ? config : {});
  286. if (!data && _config.toggle && typeof config === 'string' && /show|hide/.test(config)) {
  287. _config.toggle = false;
  288. }
  289. if (!data) {
  290. data = new Collapse(this, _config);
  291. $this.data(DATA_KEY, data);
  292. }
  293. if (typeof config === 'string') {
  294. if (typeof data[config] === 'undefined') {
  295. throw new TypeError("No method named \"" + config + "\"");
  296. }
  297. data[config]();
  298. }
  299. });
  300. };
  301. _createClass(Collapse, null, [{
  302. key: "VERSION",
  303. get: function get() {
  304. return VERSION;
  305. }
  306. }, {
  307. key: "Default",
  308. get: function get() {
  309. return Default;
  310. }
  311. }]);
  312. return Collapse;
  313. }();
  314. /**
  315. * ------------------------------------------------------------------------
  316. * Data Api implementation
  317. * ------------------------------------------------------------------------
  318. */
  319. $(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
  320. // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
  321. if (event.currentTarget.tagName === 'A') {
  322. event.preventDefault();
  323. }
  324. var $trigger = $(this);
  325. var selector = Util.getSelectorFromElement(this);
  326. var selectors = [].slice.call(document.querySelectorAll(selector));
  327. $(selectors).each(function () {
  328. var $target = $(this);
  329. var data = $target.data(DATA_KEY);
  330. var config = data ? 'toggle' : $trigger.data();
  331. Collapse._jQueryInterface.call($target, config);
  332. });
  333. });
  334. /**
  335. * ------------------------------------------------------------------------
  336. * jQuery
  337. * ------------------------------------------------------------------------
  338. */
  339. $.fn[NAME] = Collapse._jQueryInterface;
  340. $.fn[NAME].Constructor = Collapse;
  341. $.fn[NAME].noConflict = function () {
  342. $.fn[NAME] = JQUERY_NO_CONFLICT;
  343. return Collapse._jQueryInterface;
  344. };
  345. return Collapse;
  346. })));
  347. //# sourceMappingURL=collapse.js.map