Skip to content
GitLab
Switch branch/tag
Find file BlameHistoryPermalink
collapse.js 9.01 KiB
1 
import Util from './util'
2
3
4 
/**
5 
 * --------------------------------------------------------------------------
6 
 * Bootstrap (v4.0.0): collapse.js
7 
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
8 
 * --------------------------------------------------------------------------
9 
 */
10
11 
const Collapse = (($) => {
12
13
14 
  /**
15 
   * ------------------------------------------------------------------------
16 
   * Constants
17 
   * ------------------------------------------------------------------------
18 
   */
19
20 
  const NAME                = 'collapse'
21 
  const VERSION             = '4.0.0'
22 
  const DATA_KEY            = 'bs.collapse'
23 
  const EVENT_KEY           = `.${DATA_KEY}`
24 
  const DATA_API_KEY        = '.data-api'
25 
  const JQUERY_NO_CONFLICT  = $.fn[NAME]
26 
  const TRANSITION_DURATION = 600
27
28 
  const Default = {
29 
    toggle : true,
30 
    parent : ''
31 
  }
32
33 
  const DefaultType = {
34 
    toggle : 'boolean',
35 
    parent : 'string'
36 
  }
37
38 
  const Event = {
39 
    SHOW           : `show${EVENT_KEY}`,
40 
    SHOWN          : `shown${EVENT_KEY}`,
41 
    HIDE           : `hide${EVENT_KEY}`,
42 
    HIDDEN         : `hidden${EVENT_KEY}`,
43 
    CLICK_DATA_API : `click${EVENT_KEY}${DATA_API_KEY}`
44 
  }
45
46 
  const ClassName = {
47 
    IN         : 'in',
48 
    COLLAPSE   : 'collapse',
49 
    COLLAPSING : 'collapsing',
50 
    COLLAPSED  : 'collapsed'
51 
  }
52
53 
  const Dimension = {
54 
    WIDTH  : 'width',
55 
    HEIGHT : 'height'
56 
  }
57
58 
  const Selector = {
59 
    ACTIVES     : '.panel > .in, .panel > .collapsing',
60 
    DATA_TOGGLE : '[data-toggle="collapse"]'
61 
  }
62
63
64 
  /**
65 
   * ------------------------------------------------------------------------
66 
   * Class Definition
67 
   * ------------------------------------------------------------------------
68 
   */
69
70 
  class Collapse {
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
constructor(element, config) { this._isTransitioning = false this._element = element this._config = this._getConfig(config) this._triggerArray = $.makeArray($( `[data-toggle="collapse"][href="#${element.id}"],` + `[data-toggle="collapse"][data-target="#${element.id}"]` )) this._parent = this._config.parent ? this._getParent() : null if (!this._config.parent) { this._addAriaAndCollapsedClass(this._element, this._triggerArray) } if (this._config.toggle) { this.toggle() } } // getters static get VERSION() { return VERSION } static get Default() { return Default } // public toggle() { if ($(this._element).hasClass(ClassName.IN)) { this.hide() } else { this.show() } } show() { if (this._isTransitioning || $(this._element).hasClass(ClassName.IN)) { return } let actives let activesData if (this._parent) { actives = $.makeArray($(Selector.ACTIVES)) if (!actives.length) { actives = null } } if (actives) { activesData = $(actives).data(DATA_KEY) if (activesData && activesData._isTransitioning) { return } } let startEvent = $.Event(Event.SHOW) $(this._element).trigger(startEvent) if (startEvent.isDefaultPrevented()) { return