rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00
Code Issues Actions Packages Releases Activity

Carousel: reorder variables and refactor method to use it inline

Browse Source
This commit is contained in:
GeoSot 2022-03-02 01:16:25 +02:00 committed by XhmikosR
parent e77ae50311
commit a8142497c7
2 changed files with 27 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
js/src/carousel.js
View File

@ -277,17 +277,6 @@ class Carousel extends BaseComponent {
return getNextActiveElement(this._items, activeElement, isNext, this._config.wrap)
}
_triggerSlideEvent(relatedTarget, fromIndex, eventDirectionName) {
const targetIndex = this._getItemIndex(relatedTarget)
return EventHandler.trigger(this._element, EVENT_SLIDE, {
relatedTarget,
direction: eventDirectionName,
from: fromIndex,
to: targetIndex
})
}
_setActiveIndicatorElement(index) {
if (!this._indicatorsElement) {
return
@ -320,17 +309,12 @@ class Carousel extends BaseComponent {
_slide(directionOrOrder, element) {
const order = this._directionToOrder(directionOrOrder)
const activeElement = this._getActive()
const activeElementIndex = this._getItemIndex(activeElement)
const nextElement = element || this._getItemByOrder(order, activeElement)
const nextElementIndex = this._getItemIndex(nextElement)
const isCycling = Boolean(this._interval)
const isNext = order === ORDER_NEXT
const directionalClassName = isNext ? CLASS_NAME_START : CLASS_NAME_END
const orderClassName = isNext ? CLASS_NAME_NEXT : CLASS_NAME_PREV
const eventDirectionName = this._orderToDirection(order)
if (nextElement && nextElement.classList.contains(CLASS_NAME_ACTIVE)) {
this._isSliding = false
@ -341,7 +325,17 @@ class Carousel extends BaseComponent {
return
}
const slideEvent = this._triggerSlideEvent(nextElement, activeElementIndex, eventDirectionName)
const triggerEvent = eventName => {
return EventHandler.trigger(this._element, eventName, {
relatedTarget: nextElement,
direction: this._orderToDirection(order),
from: activeElementIndex,
to: nextElementIndex
})
}
const slideEvent = triggerEvent(EVENT_SLIDE)
if (slideEvent.defaultPrevented) {
return
}
@ -353,6 +347,7 @@ class Carousel extends BaseComponent {
this._isSliding = true
const isCycling = Boolean(this._interval)
if (isCycling) {
this.pause()
}
@ -360,6 +355,10 @@ class Carousel extends BaseComponent {
this._setActiveIndicatorElement(nextElementIndex)
this._activeElement = nextElement
const isNext = order === ORDER_NEXT
const directionalClassName = isNext ? CLASS_NAME_START : CLASS_NAME_END
const orderClassName = isNext ? CLASS_NAME_NEXT : CLASS_NAME_PREV
nextElement.classList.add(orderClassName)
reflow(nextElement)
@ -375,12 +374,7 @@ class Carousel extends BaseComponent {
this._isSliding = false
EventHandler.trigger(this._element, EVENT_SLID, {
relatedTarget: nextElement,
direction: eventDirectionName,
from: activeElementIndex,
to: nextElementIndex
})
triggerEvent(EVENT_SLID)
}
this._queueCallback(completeCallBack, activeElement, this._isAnimated())

16
js/tests/unit/carousel.spec.js
View File

@ -214,7 +214,7 @@ describe('Carousel', () => {
const carouselEl = fixtureEl.querySelector('div')
const carousel = new Carousel(carouselEl, {})
spyOn(carousel, '_triggerSlideEvent')
spyOn(EventHandler, 'trigger')
carousel._isSliding = true
@ -225,7 +225,7 @@ describe('Carousel', () => {
carouselEl.dispatchEvent(keydown)
}
expect(carousel._triggerSlideEvent).not.toHaveBeenCalled()
expect(EventHandler.trigger).not.toHaveBeenCalled()
})
it('should wrap around from end to start when wrap option is true', () => {
@ -546,7 +546,7 @@ describe('Carousel', () => {
const carousel = new Carousel(carouselEl)
carousel._isSliding = true
spyOn(carousel, '_triggerSlideEvent')
spyOn(EventHandler, 'trigger')
Simulator.gestures.swipe(carouselEl, {
deltaX: 300,
@ -560,7 +560,7 @@ describe('Carousel', () => {
})
setTimeout(() => {
expect(carousel._triggerSlideEvent).not.toHaveBeenCalled()
expect(EventHandler.trigger).not.toHaveBeenCalled()
delete document.documentElement.ontouchstart
restorePointerEvents()
resolve()
@ -639,12 +639,12 @@ describe('Carousel', () => {
const carouselEl = fixtureEl.querySelector('div')
const carousel = new Carousel(carouselEl, {})
spyOn(carousel, '_triggerSlideEvent')
spyOn(EventHandler, 'trigger')
carousel._isSliding = true
carousel.next()
expect(carousel._triggerSlideEvent).not.toHaveBeenCalled()
expect(EventHandler.trigger).not.toHaveBeenCalled()
})
it('should not fire slid when slide is prevented', () => {
@ -858,12 +858,12 @@ describe('Carousel', () => {
const carouselEl = fixtureEl.querySelector('div')
const carousel = new Carousel(carouselEl, {})
spyOn(carousel, '_triggerSlideEvent')
spyOn(EventHandler, 'trigger')
carousel._isSliding = true
carousel.prev()
expect(carousel._triggerSlideEvent).not.toHaveBeenCalled()
expect(EventHandler.trigger).not.toHaveBeenCalled()
})
})