Proyectos de Subversion Moodle

Rev

Rev 1 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 1 Rev 1441
Línea 1... Línea 1...
1 
/**
 1 
/**
2 
 * --------------------------------------------------------------------------
 2 
 * --------------------------------------------------------------------------
3 
 * Bootstrap (v4.6.2): collapse.js
 3 
 * Bootstrap collapse.js
4 
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 4 
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5 
 * --------------------------------------------------------------------------
 5 
 * --------------------------------------------------------------------------
6 
 */
 6 
 */
Línea 7... Línea 7...
7 
 
 7 
 
8 
import $ from 'jquery'
 8 
import BaseComponent from './base-component'
- 
 
 9 
import EventHandler from './dom/event-handler'
- 
 
 10 
import SelectorEngine from './dom/selector-engine'
- 
 
 11 
import {
- 
 
 12 
  defineJQueryPlugin,
- 
 
 13 
  getElement,
- 
 
 14 
  reflow
Línea 9... Línea 15...
9 
import Util from './util'
 15 
} from './util/index'
10 
 
 16 
 
11 
/**
 17 
/**
Línea 12... Línea 18...
12 
 * Constants
 18 
 * Constants
13 
 */
 - 
 
14 
 
 19 
 */
15 
const NAME = 'collapse'
 20 
 
16 
const VERSION = '4.6.2'
 21 
const NAME = 'collapse'
17 
const DATA_KEY = 'bs.collapse'
 - 
 
18 
const EVENT_KEY = `.${DATA_KEY}`
 - 
 
19 
const DATA_API_KEY = '.data-api'
 - 
 
20 
const JQUERY_NO_CONFLICT = $.fn[NAME]
 - 
 
21 
 
 - 
 
22 
const CLASS_NAME_SHOW = 'show'
 - 
 
23 
const CLASS_NAME_COLLAPSE = 'collapse'
 - 
 
24 
const CLASS_NAME_COLLAPSING = 'collapsing'
 - 
 
25 
const CLASS_NAME_COLLAPSED = 'collapsed'
 - 
 
Línea 26... Línea 22...
26 
 
 22 
const DATA_KEY = 'bs.collapse'
27 
const DIMENSION_WIDTH = 'width'
 23 
const EVENT_KEY = `.${DATA_KEY}`
28 
const DIMENSION_HEIGHT = 'height'
 24 
const DATA_API_KEY = '.data-api'
29 
 
 25 
 
30 
const EVENT_SHOW = `show${EVENT_KEY}`
 26 
const EVENT_SHOW = `show${EVENT_KEY}`
Línea -... Línea 27...
- 
 
 27 
const EVENT_SHOWN = `shown${EVENT_KEY}`
- 
 
 28 
const EVENT_HIDE = `hide${EVENT_KEY}`
- 
 
 29 
const EVENT_HIDDEN = `hidden${EVENT_KEY}`
- 
 
 30 
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
- 
 
 31 
 
- 
 
 32 
const CLASS_NAME_SHOW = 'show'
- 
 
 33 
const CLASS_NAME_COLLAPSE = 'collapse'
- 
 
 34 
const CLASS_NAME_COLLAPSING = 'collapsing'
- 
 
 35 
const CLASS_NAME_COLLAPSED = 'collapsed'
- 
 
 36 
const CLASS_NAME_DEEPER_CHILDREN = `:scope .${CLASS_NAME_COLLAPSE} .${CLASS_NAME_COLLAPSE}`
31 
const EVENT_SHOWN = `shown${EVENT_KEY}`
 37 
const CLASS_NAME_HORIZONTAL = 'collapse-horizontal'
32 
const EVENT_HIDE = `hide${EVENT_KEY}`
 38 
 
Línea 33... Línea 39...
33 
const EVENT_HIDDEN = `hidden${EVENT_KEY}`
 39 
const WIDTH = 'width'
34 
const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
 40 
const HEIGHT = 'height'
35 
 
 41 
 
36 
const SELECTOR_ACTIVES = '.show, .collapsing'
 42 
const SELECTOR_ACTIVES = '.collapse.show, .collapse.collapsing'
Línea 37... Línea 43...
37 
const SELECTOR_DATA_TOGGLE = '[data-toggle="collapse"]'
 43 
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="collapse"]'
38 
 
 44 
 
39 
const Default = {
 45 
const Default = {
40 
  toggle: true,
 46 
  parent: null,
Línea 41... Línea 47...
41 
  parent: ''
 47 
  toggle: true
42 
}
 48 
}
43 
 
 49 
 
Línea 44... Línea 50...
44 
const DefaultType = {
 50 
const DefaultType = {
45 
  toggle: 'boolean',
 51 
  parent: '(null|element)',
- 
 
 52 
  toggle: 'boolean'
- 
 
 53 
}
46 
  parent: '(string|element)'
 54 
 
47 
}
 55 
/**
48 
 
 - 
 
49 
/**
 - 
 
50 
 * Class definition
 - 
 
51 
 */
 - 
 
52 
 
 - 
 
53 
class Collapse {
 56 
 * Class definition
54 
  constructor(element, config) {
 57 
 */
55 
    this._isTransitioning = false
 - 
 
- 
 
 58 
 
56 
    this._element = element
 59 
class Collapse extends BaseComponent {
57 
    this._config = this._getConfig(config)
 60 
  constructor(element, config) {
58 
    this._triggerArray = [].slice.call(document.querySelectorAll(
 61 
    super(element, config)
59 
      `[data-toggle="collapse"][href="#${element.id}"],` +
 62 
 
Línea 60... Línea 63...
60 
      `[data-toggle="collapse"][data-target="#${element.id}"]`
 63 
    this._isTransitioning = false
61 
    ))
 - 
 
62 
 
 64 
    this._triggerArray = []
63 
    const toggleList = [].slice.call(document.querySelectorAll(SELECTOR_DATA_TOGGLE))
 65 
 
64 
    for (let i = 0, len = toggleList.length; i < len; i++) {
 66 
    const toggleList = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
Línea 65... Línea 67...
65 
      const elem = toggleList[i]
 67 
 
Línea 66... Línea 68...
66 
      const selector = Util.getSelectorFromElement(elem)
 68 
    for (const elem of toggleList) {
67 
      const filterElement = [].slice.call(document.querySelectorAll(selector))
 69 
      const selector = SelectorEngine.getSelectorFromElement(elem)
68 
        .filter(foundElem => foundElem === element)
 70 
      const filterElement = SelectorEngine.find(selector)
Línea 69... Línea 71...
69 
 
 71 
        .filter(foundElement => foundElement === this._element)
70 
      if (selector !== null && filterElement.length > 0) {
 72 
 
71 
        this._selector = selector
 73 
      if (selector !== null && filterElement.length) {
72 
        this._triggerArray.push(elem)
 74 
        this._triggerArray.push(elem)
Línea 73... Línea 75...
73 
      }
 75 
      }
74 
    }
 - 
 
75 
 
 - 
 
76 
    this._parent = this._config.parent ? this._getParent() : null
 - 
 
77 
 
 - 
 
78 
    if (!this._config.parent) {
 76 
    }
79 
      this._addAriaAndCollapsedClass(this._element, this._triggerArray)
 77 
 
80 
    }
 78 
    this._initializeChildren()
Línea -... Línea 79...
- 
 
 79 
 
- 
 
 80 
    if (!this._config.parent) {
- 
 
 81 
      this._addAriaAndCollapsedClass(this._triggerArray, this._isShown())
- 
 
 82 
    }
- 
 
 83 
 
- 
 
 84 
    if (this._config.toggle) {
- 
 
 85 
      this.toggle()
- 
 
 86 
    }
81 
 
 87 
  }
82 
    if (this._config.toggle) {
 88 
 
83 
      this.toggle()
 89 
  // Getters
84 
    }
 90 
  static get Default() {
85 
  }
 91 
    return Default
86 
 
 92 
  }
87 
  // Getters
 93 
 
88 
  static get VERSION() {
 94 
  static get DefaultType() {
Línea 89... Línea 95...
89 
    return VERSION
 95 
    return DefaultType
90 
  }
 96 
  }
91 
 
 - 
 
92 
  static get Default() {
 97 
 
93 
    return Default
 98 
  static get NAME() {
Línea 94... Línea -...
94 
  }
 - 
 
95 
 
 99 
    return NAME
96 
  // Public
 - 
 
97 
  toggle() {
 - 
 
98 
    if ($(this._element).hasClass(CLASS_NAME_SHOW)) {
 - 
 
99 
      this.hide()
 - 
 
100 
    } else {
 - 
 
101 
      this.show()
 - 
 
102 
    }
 - 
 
103 
  }
 - 
 
104 
 
 - 
 
105 
  show() {
 - 
 
Línea 106... Línea 100...
106 
    if (this._isTransitioning ||
 100 
  }
107 
      $(this._element).hasClass(CLASS_NAME_SHOW)) {
 101 
 
- 
 
 102 
  // Public
108 
      return
 103 
  toggle() {
- 
 
 104 
    if (this._isShown()) {
109 
    }
 105 
      this.hide()
Línea 110... Línea -...
110 
 
 - 
 
111 
    let actives
 - 
 
112 
    let activesData
 106 
    } else {
113 
 
 107 
      this.show()
114 
    if (this._parent) {
 - 
 
115 
      actives = [].slice.call(this._parent.querySelectorAll(SELECTOR_ACTIVES))
 108 
    }
Línea 116... Línea 109...
116 
        .filter(elem => {
 109 
  }
117 
          if (typeof this._config.parent === 'string') {
 - 
 
118 
            return elem.getAttribute('data-parent') === this._config.parent
 110 
 
119 
          }
 111 
  show() {
120 
 
 112 
    if (this._isTransitioning || this._isShown()) {
Línea 121... Línea -...
121 
          return elem.classList.contains(CLASS_NAME_COLLAPSE)
 - 
 
122 
        })
 113 
      return
123 
 
 114 
    }
124 
      if (actives.length === 0) {
 - 
 
125 
        actives = null
 - 
 
126 
      }
 115 
 
Línea 127... Línea 116...
127 
    }
 116 
    let activeChildren = []
Línea 128... Línea -...
128 
 
 - 
 
129 
    if (actives) {
 117 
 
130 
      activesData = $(actives).not(this._selector).data(DATA_KEY)
 118 
    // find active children
Línea 131... Línea 119...
131 
      if (activesData && activesData._isTransitioning) {
 119 
    if (this._config.parent) {
Línea 132... Línea 120...
132 
        return
 120 
      activeChildren = this._getFirstLevelChildren(SELECTOR_ACTIVES)
133 
      }
 - 
 
134 
    }
 - 
 
135 
 
 - 
 
136 
    const startEvent = $.Event(EVENT_SHOW)
 - 
 
137 
    $(this._element).trigger(startEvent)
 - 
 
138 
    if (startEvent.isDefaultPrevented()) {
 121 
        .filter(element => element !== this._element)
Línea 139... Línea 122...
139 
      return
 122 
        .map(element => Collapse.getOrCreateInstance(element, { toggle: false }))
140 
    }
 123 
    }
141 
 
 - 
 
142 
    if (actives) {
 - 
 
Línea 143... Línea 124...
143 
      Collapse._jQueryInterface.call($(actives).not(this._selector), 'hide')
 124 
 
- 
 
 125 
    if (activeChildren.length && activeChildren[0]._isTransitioning) {
Línea 144... Línea 126...
144 
      if (!activesData) {
 126 
      return
Línea 145... Línea 127...
145 
        $(actives).data(DATA_KEY, null)
 127 
    }
146 
      }
 128 
 
Línea 147... Línea 129...
147 
    }
 129 
    const startEvent = EventHandler.trigger(this._element, EVENT_SHOW)
148 
 
 130 
    if (startEvent.defaultPrevented) {
149 
    const dimension = this._getDimension()
 - 
 
150 
 
 - 
 
151 
    $(this._element)
 - 
 
152 
      .removeClass(CLASS_NAME_COLLAPSE)
 - 
 
153 
      .addClass(CLASS_NAME_COLLAPSING)
 - 
 
Línea -... Línea 131...
- 
 
 131 
      return
154 
 
 132 
    }
155 
    this._element.style[dimension] = 0
 133 
 
Línea 156... Línea 134...
156 
 
 134 
    for (const activeInstance of activeChildren) {
157 
    if (this._triggerArray.length) {
 135 
      activeInstance.hide()
158 
      $(this._triggerArray)
 - 
 
159 
        .removeClass(CLASS_NAME_COLLAPSED)
 136 
    }
160 
        .attr('aria-expanded', true)
 137 
 
Línea 161... Línea 138...
161 
    }
 138 
    const dimension = this._getDimension()
162 
 
 - 
 
163 
    this.setTransitioning(true)
 139 
 
164 
 
 140 
    this._element.classList.remove(CLASS_NAME_COLLAPSE)
165 
    const complete = () => {
 141 
    this._element.classList.add(CLASS_NAME_COLLAPSING)
Línea 166... Línea 142...
166 
      $(this._element)
 142 
 
Línea 167... Línea 143...
167 
        .removeClass(CLASS_NAME_COLLAPSING)
 143 
    this._element.style[dimension] = 0
Línea 168... Línea 144...
168 
        .addClass(`${CLASS_NAME_COLLAPSE} ${CLASS_NAME_SHOW}`)
 144 
 
Línea 169... Línea -...
169 
 
 - 
 
170 
      this._element.style[dimension] = ''
 145 
    this._addAriaAndCollapsedClass(this._triggerArray, true)
171 
 
 146 
    this._isTransitioning = true
172 
      this.setTransitioning(false)
 147 
 
173 
 
 - 
 
174 
      $(this._element).trigger(EVENT_SHOWN)
 - 
 
175 
    }
 - 
 
176 
 
 148 
    const complete = () => {
177 
    const capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1)
 149 
      this._isTransitioning = false
178 
    const scrollSize = `scroll${capitalizedDimension}`
 150 
 
179 
    const transitionDuration = Util.getTransitionDurationFromElement(this._element)
 - 
 
180 
 
 - 
 
181 
    $(this._element)
 151 
      this._element.classList.remove(CLASS_NAME_COLLAPSING)
182 
      .one(Util.TRANSITION_END, complete)
 - 
 
183 
      .emulateTransitionEnd(transitionDuration)
 152 
      this._element.classList.add(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
184 
 
 - 
 
185 
    this._element.style[dimension] = `${this._element[scrollSize]}px`
 - 
 
186 
  }
 153 
 
187 
 
 154 
      this._element.style[dimension] = ''
Línea 188... Línea 155...
188 
  hide() {
 155 
 
Línea 189... Línea 156...
189 
    if (this._isTransitioning ||
 156 
      EventHandler.trigger(this._element, EVENT_SHOWN)
190 
      !$(this._element).hasClass(CLASS_NAME_SHOW)) {
 157 
    }
191 
      return
 - 
 
192 
    }
 158 
 
193 
 
 159 
    const capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1)
194 
    const startEvent = $.Event(EVENT_HIDE)
 160 
    const scrollSize = `scroll${capitalizedDimension}`
195 
    $(this._element).trigger(startEvent)
 161 
 
Línea 196... Línea 162...
196 
    if (startEvent.isDefaultPrevented()) {
 162 
    this._queueCallback(complete, this._element, true)
197 
      return
 - 
 
198 
    }
 - 
 
199 
 
 - 
 
200 
    const dimension = this._getDimension()
 - 
 
201 
 
 - 
 
202 
    this._element.style[dimension] = `${this._element.getBoundingClientRect()[dimension]}px`
 - 
 
Línea 203... Línea -...
203 
 
 - 
 
204 
    Util.reflow(this._element)
 163 
    this._element.style[dimension] = `${this._element[scrollSize]}px`
205 
 
 164 
  }
Línea 206... Línea -...
206 
    $(this._element)
 - 
 
207 
      .addClass(CLASS_NAME_COLLAPSING)
 165 
 
208 
      .removeClass(`${CLASS_NAME_COLLAPSE} ${CLASS_NAME_SHOW}`)
 - 
 
209 
 
 - 
 
210 
    const triggerArrayLength = this._triggerArray.length
 - 
 
211 
    if (triggerArrayLength > 0) {
 - 
 
212 
      for (let i = 0; i < triggerArrayLength; i++) {
 - 
 
213 
        const trigger = this._triggerArray[i]
 166 
  hide() {
214 
        const selector = Util.getSelectorFromElement(trigger)
 167 
    if (this._isTransitioning || !this._isShown()) {
Línea 215... Línea 168...
215 
 
 168 
      return
216 
        if (selector !== null) {
 169 
    }
217 
          const $elem = $([].slice.call(document.querySelectorAll(selector)))
 - 
 
218 
          if (!$elem.hasClass(CLASS_NAME_SHOW)) {
 - 
 
219 
            $(trigger).addClass(CLASS_NAME_COLLAPSED)
 - 
 
220 
              .attr('aria-expanded', false)
 - 
 
221 
          }
 170 
 
222 
        }
 171 
    const startEvent = EventHandler.trigger(this._element, EVENT_HIDE)
223 
      }
 172 
    if (startEvent.defaultPrevented) {
224 
    }
 173 
      return
Línea 225... Línea 174...
225 
 
 174 
    }
226 
    this.setTransitioning(true)
 - 
 
227 
 
 175 
 
228 
    const complete = () => {
 176 
    const dimension = this._getDimension()
Línea 229... Línea 177...
229 
      this.setTransitioning(false)
 177 
 
- 
 
 178 
    this._element.style[dimension] = `${this._element.getBoundingClientRect()[dimension]}px`
230 
      $(this._element)
 179 
 
- 
 
 180 
    reflow(this._element)
Línea 231... Línea 181...
231 
        .removeClass(CLASS_NAME_COLLAPSING)
 181 
 
232 
        .addClass(CLASS_NAME_COLLAPSE)
 - 
 
Línea 233... Línea 182...
233 
        .trigger(EVENT_HIDDEN)
 182 
    this._element.classList.add(CLASS_NAME_COLLAPSING)
234 
    }
 183 
    this._element.classList.remove(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
- 
 
 184 
 
- 
 
 185 
    for (const trigger of this._triggerArray) {
235 
 
 186 
      const element = SelectorEngine.getElementFromSelector(trigger)
236 
    this._element.style[dimension] = ''
 187 
 
237 
    const transitionDuration = Util.getTransitionDurationFromElement(this._element)
 - 
 
238 
 
 - 
 
239 
    $(this._element)
 188 
      if (element && !this._isShown(element)) {
- 
 
 189 
        this._addAriaAndCollapsedClass([trigger], false)
Línea 240... Línea 190...
240 
      .one(Util.TRANSITION_END, complete)
 190 
      }
241 
      .emulateTransitionEnd(transitionDuration)
 191 
    }
242 
  }
 - 
 
243 
 
 192 
 
244 
  setTransitioning(isTransitioning) {
 - 
 
245 
    this._isTransitioning = isTransitioning
 193 
    this._isTransitioning = true
246 
  }
 - 
 
247 
 
 - 
 
248 
  dispose() {
 - 
 
249 
    $.removeData(this._element, DATA_KEY)
 - 
 
250 
 
 - 
 
251 
    this._config = null
 194 
 
Línea 252... Línea 195...
252 
    this._parent = null
 195 
    const complete = () => {
253 
    this._element = null
 196 
      this._isTransitioning = false
- 
 
 197 
      this._element.classList.remove(CLASS_NAME_COLLAPSING)
- 
 
 198 
      this._element.classList.add(CLASS_NAME_COLLAPSE)
Línea 254... Línea -...
254 
    this._triggerArray = null
 - 
 
255 
    this._isTransitioning = null
 199 
      EventHandler.trigger(this._element, EVENT_HIDDEN)
256 
  }
 200 
    }
257 
 
 201 
 
258 
  // Private
 202 
    this._element.style[dimension] = ''
259 
  _getConfig(config) {
 203 
 
Línea 260... Línea 204...
260 
    config = {
 204 
    this._queueCallback(complete, this._element, true)
261 
      ...Default,
 205 
  }
- 
 
 206 
 
262 
      ...config
 207 
  _isShown(element = this._element) {
263 
    }
 208 
    return element.classList.contains(CLASS_NAME_SHOW)
264 
    config.toggle = Boolean(config.toggle) // Coerce string values
 209 
  }
Línea 265... Línea -...
265 
    Util.typeCheckConfig(NAME, config, DefaultType)
 - 
 
266 
    return config
 210 
 
267 
  }
 - 
 
268 
 
 - 
 
269 
  _getDimension() {
 - 
 
270 
    const hasWidth = $(this._element).hasClass(DIMENSION_WIDTH)
 - 
 
271 
    return hasWidth ? DIMENSION_WIDTH : DIMENSION_HEIGHT
 - 
 
272 
  }
 - 
 
273 
 
 - 
 
274 
  _getParent() {
 - 
 
275 
    let parent
 - 
 
276 
 
 - 
 
277 
    if (Util.isElement(this._config.parent)) {
 - 
 
278 
      parent = this._config.parent
 - 
 
279 
 
 - 
 
280 
      // It's a jQuery object
 211 
  // Private
281 
      if (typeof this._config.parent.jquery !== 'undefined') {
 - 
 
282 
        parent = this._config.parent[0]
 - 
 
Línea 283... Línea 212...
283 
      }
 212 
  _configAfterMerge(config) {
284 
    } else {
 213 
    config.toggle = Boolean(config.toggle) // Coerce string values
285 
      parent = document.querySelector(this._config.parent)
 214 
    config.parent = getElement(config.parent)
286 
    }
 215 
    return config
Línea 346... Línea 275...
346 
 
 275 
 
347 
/**
 276 
/**
348 
 * Data API implementation
 277 
 * Data API implementation
Línea 349... Línea 278...
349 
 */
 278 
 */
350 
 
 279 
 
351 
$(document).on(EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
 280 
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
352 
  // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
 281 
  // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
353 
  if (event.currentTarget.tagName === 'A') {
 282 
  if (event.target.tagName === 'A' || (event.delegateTarget && event.delegateTarget.tagName === 'A')) {
Línea 354... Línea -...
354 
    event.preventDefault()
 - 
 
355 
  }
 283 
    event.preventDefault()
356 
 
 - 
 
357 
  const $trigger = $(this)
 - 
 
358 
  const selector = Util.getSelectorFromElement(this)
 - 
 
359 
  const selectors = [].slice.call(document.querySelectorAll(selector))
 - 
 
360 
 
 - 
 
361 
  $(selectors).each(function () {
 - 
 
362 
    const $target = $(this)
 284 
  }
363 
    const data = $target.data(DATA_KEY)
 285 
 
364 
    const config = data ? 'toggle' : $trigger.data()
 286 
  for (const element of SelectorEngine.getMultipleElementsFromSelector(this)) {
Línea 365... Línea 287...
365 
    Collapse._jQueryInterface.call($target, config)
 287 
    Collapse.getOrCreateInstance(element, { toggle: false }).toggle()
366 
  })
 288 
  }
367 
})
 289 
})
Línea 368... Línea -...
368 
 
 - 
 
369 
/**
 290 
 
370 
 * jQuery
 - 
 
371 
 */
 - 
 
372 
 
 - 
 
373 
$.fn[NAME] = Collapse._jQueryInterface
 - 
 
Línea 374... Línea 291...
374 
$.fn[NAME].Constructor = Collapse
 291 
/**