2018-11-13 07:41:12 +01:00
/ * !
2020-05-13 21:36:00 +02:00
* Bootstrap carousel . js v5 . 0.0 - alpha1 ( https : //getbootstrap.com/)
2020-03-28 11:29:08 +01:00
* Copyright 2011 - 2020 The Bootstrap Authors ( https : //github.com/twbs/bootstrap/graphs/contributors)
2020-06-16 20:50:01 +02:00
* Licensed under MIT ( https : //github.com/twbs/bootstrap/blob/main/LICENSE)
2018-11-13 07:41:12 +01:00
* /
2018-07-24 02:51:14 +02:00
( function ( global , factory ) {
2019-10-08 08:39:10 +02:00
typeof exports === 'object' && typeof module !== 'undefined' ? module . exports = factory ( require ( './dom/data.js' ) , require ( './dom/event-handler.js' ) , require ( './dom/manipulator.js' ) , require ( './dom/selector-engine.js' ) ) :
typeof define === 'function' && define . amd ? define ( [ './dom/data.js' , './dom/event-handler.js' , './dom/manipulator.js' , './dom/selector-engine.js' ] , factory ) :
2019-03-01 17:31:34 +01:00
( global = global || self , global . Carousel = factory ( global . Data , global . EventHandler , global . Manipulator , global . SelectorEngine ) ) ;
2019-11-08 09:11:23 +01:00
} ( this , ( function ( Data , EventHandler , Manipulator , SelectorEngine ) { 'use strict' ;
2018-07-24 02:51:14 +02:00
2020-03-28 11:29:08 +01:00
Data = Data && Object . prototype . hasOwnProperty . call ( Data , 'default' ) ? Data [ 'default' ] : Data ;
EventHandler = EventHandler && Object . prototype . hasOwnProperty . call ( EventHandler , 'default' ) ? EventHandler [ 'default' ] : EventHandler ;
Manipulator = Manipulator && Object . prototype . hasOwnProperty . call ( Manipulator , 'default' ) ? Manipulator [ 'default' ] : Manipulator ;
SelectorEngine = SelectorEngine && Object . prototype . hasOwnProperty . call ( SelectorEngine , 'default' ) ? SelectorEngine [ 'default' ] : SelectorEngine ;
2018-07-24 02:51:14 +02:00
2019-03-01 17:31:34 +01:00
/ * *
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
2020-05-13 21:36:00 +02:00
* Bootstrap ( v5 . 0.0 - alpha1 ) : util / index . js
2020-06-16 20:50:01 +02:00
* Licensed under MIT ( https : //github.com/twbs/bootstrap/blob/main/LICENSE)
2019-03-01 17:31:34 +01:00
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* /
var MILLISECONDS _MULTIPLIER = 1000 ;
2019-08-27 15:03:21 +02:00
var TRANSITION _END = 'transitionend' ; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
2019-03-01 17:31:34 +01:00
var toType = function toType ( obj ) {
2020-03-28 11:29:08 +01:00
if ( obj === null || obj === undefined ) {
return "" + obj ;
}
2019-03-01 17:31:34 +01:00
return { } . toString . call ( obj ) . match ( /\s([a-z]+)/i ) [ 1 ] . toLowerCase ( ) ;
} ;
2019-08-27 15:03:21 +02:00
var getSelector = function getSelector ( element ) {
2019-03-01 17:31:34 +01:00
var selector = element . getAttribute ( 'data-target' ) ;
if ( ! selector || selector === '#' ) {
var hrefAttr = element . getAttribute ( 'href' ) ;
2019-08-27 15:03:21 +02:00
selector = hrefAttr && hrefAttr !== '#' ? hrefAttr . trim ( ) : null ;
2019-03-01 17:31:34 +01:00
}
2019-08-27 15:03:21 +02:00
return selector ;
} ;
var getElementFromSelector = function getElementFromSelector ( element ) {
var selector = getSelector ( element ) ;
return selector ? document . querySelector ( selector ) : null ;
2019-03-01 17:31:34 +01:00
} ;
var getTransitionDurationFromElement = function getTransitionDurationFromElement ( element ) {
if ( ! element ) {
return 0 ;
} // Get transition-duration of the element
var _window$getComputedSt = window . getComputedStyle ( element ) ,
transitionDuration = _window$getComputedSt . transitionDuration ,
transitionDelay = _window$getComputedSt . transitionDelay ;
var floatTransitionDuration = parseFloat ( transitionDuration ) ;
var floatTransitionDelay = parseFloat ( transitionDelay ) ; // Return 0 if element or transition duration is not found
if ( ! floatTransitionDuration && ! floatTransitionDelay ) {
return 0 ;
} // If multiple durations are defined, take the first
transitionDuration = transitionDuration . split ( ',' ) [ 0 ] ;
transitionDelay = transitionDelay . split ( ',' ) [ 0 ] ;
return ( parseFloat ( transitionDuration ) + parseFloat ( transitionDelay ) ) * MILLISECONDS _MULTIPLIER ;
} ;
var triggerTransitionEnd = function triggerTransitionEnd ( element ) {
2020-03-28 11:29:08 +01:00
element . dispatchEvent ( new Event ( TRANSITION _END ) ) ;
2019-03-01 17:31:34 +01:00
} ;
var isElement = function isElement ( obj ) {
return ( obj [ 0 ] || obj ) . nodeType ;
} ;
var emulateTransitionEnd = function emulateTransitionEnd ( element , duration ) {
var called = false ;
var durationPadding = 5 ;
var emulatedDuration = duration + durationPadding ;
function listener ( ) {
called = true ;
element . removeEventListener ( TRANSITION _END , listener ) ;
}
element . addEventListener ( TRANSITION _END , listener ) ;
setTimeout ( function ( ) {
if ( ! called ) {
triggerTransitionEnd ( element ) ;
}
} , emulatedDuration ) ;
} ;
var typeCheckConfig = function typeCheckConfig ( componentName , config , configTypes ) {
Object . keys ( configTypes ) . forEach ( function ( property ) {
var expectedTypes = configTypes [ property ] ;
var value = config [ property ] ;
var valueType = value && isElement ( value ) ? 'element' : toType ( value ) ;
if ( ! new RegExp ( expectedTypes ) . test ( valueType ) ) {
throw new Error ( componentName . toUpperCase ( ) + ": " + ( "Option \"" + property + "\" provided type \"" + valueType + "\" " ) + ( "but expected type \"" + expectedTypes + "\"." ) ) ;
}
} ) ;
} ;
var isVisible = function isVisible ( element ) {
if ( ! element ) {
return false ;
}
if ( element . style && element . parentNode && element . parentNode . style ) {
2019-11-08 09:11:23 +01:00
var elementStyle = getComputedStyle ( element ) ;
var parentNodeStyle = getComputedStyle ( element . parentNode ) ;
return elementStyle . display !== 'none' && parentNodeStyle . display !== 'none' && elementStyle . visibility !== 'hidden' ;
2019-03-01 17:31:34 +01:00
}
return false ;
} ;
var reflow = function reflow ( element ) {
return element . offsetHeight ;
} ;
2019-08-27 15:03:21 +02:00
var getjQuery = function getjQuery ( ) {
var _window = window ,
jQuery = _window . jQuery ;
if ( jQuery && ! document . body . hasAttribute ( 'data-no-jquery' ) ) {
return jQuery ;
}
return null ;
} ;
2020-06-14 00:40:28 +02:00
function ownKeys ( object , enumerableOnly ) { var keys = Object . keys ( object ) ; if ( Object . getOwnPropertySymbols ) { var symbols = Object . getOwnPropertySymbols ( object ) ; if ( enumerableOnly ) symbols = symbols . filter ( function ( sym ) { return Object . getOwnPropertyDescriptor ( object , sym ) . enumerable ; } ) ; keys . push . apply ( keys , symbols ) ; } return keys ; }
function _objectSpread ( target ) { for ( var i = 1 ; i < arguments . length ; i ++ ) { var source = arguments [ i ] != null ? arguments [ i ] : { } ; if ( i % 2 ) { ownKeys ( Object ( source ) , true ) . forEach ( function ( key ) { _defineProperty ( target , key , source [ key ] ) ; } ) ; } else if ( Object . getOwnPropertyDescriptors ) { Object . defineProperties ( target , Object . getOwnPropertyDescriptors ( source ) ) ; } else { ownKeys ( Object ( source ) ) . forEach ( function ( key ) { Object . defineProperty ( target , key , Object . getOwnPropertyDescriptor ( source , key ) ) ; } ) ; } } return target ; }
function _defineProperty ( obj , key , value ) { if ( key in obj ) { Object . defineProperty ( obj , key , { value : value , enumerable : true , configurable : true , writable : true } ) ; } else { obj [ key ] = value ; } return obj ; }
function _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
function _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2015-05-08 07:26:40 +02:00
/ * *
2018-11-13 07:41:12 +01:00
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* Constants
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
2015-05-08 07:26:40 +02:00
* /
2018-07-24 02:51:14 +02:00
2018-11-13 07:41:12 +01:00
var NAME = 'carousel' ;
2020-05-13 21:36:00 +02:00
var VERSION = '5.0.0-alpha1' ;
2018-11-13 07:41:12 +01:00
var DATA _KEY = 'bs.carousel' ;
var EVENT _KEY = "." + DATA _KEY ;
var DATA _API _KEY = '.data-api' ;
2020-05-13 20:53:43 +02:00
var ARROW _LEFT _KEY = 'ArrowLeft' ;
var ARROW _RIGHT _KEY = 'ArrowRight' ;
2018-11-13 07:41:12 +01:00
var TOUCHEVENT _COMPAT _WAIT = 500 ; // Time for mouse compat events to fire after touch
var SWIPE _THRESHOLD = 40 ;
var Default = {
interval : 5000 ,
keyboard : true ,
slide : false ,
pause : 'hover' ,
wrap : true ,
touch : true
} ;
var DefaultType = {
interval : '(number|boolean)' ,
keyboard : 'boolean' ,
slide : '(boolean|string)' ,
pause : '(string|boolean)' ,
wrap : 'boolean' ,
touch : 'boolean'
} ;
2020-03-28 11:29:08 +01:00
var DIRECTION _NEXT = 'next' ;
var DIRECTION _PREV = 'prev' ;
var DIRECTION _LEFT = 'left' ;
var DIRECTION _RIGHT = 'right' ;
var EVENT _SLIDE = "slide" + EVENT _KEY ;
var EVENT _SLID = "slid" + EVENT _KEY ;
var EVENT _KEYDOWN = "keydown" + EVENT _KEY ;
var EVENT _MOUSEENTER = "mouseenter" + EVENT _KEY ;
var EVENT _MOUSELEAVE = "mouseleave" + EVENT _KEY ;
var EVENT _TOUCHSTART = "touchstart" + EVENT _KEY ;
var EVENT _TOUCHMOVE = "touchmove" + EVENT _KEY ;
var EVENT _TOUCHEND = "touchend" + EVENT _KEY ;
var EVENT _POINTERDOWN = "pointerdown" + EVENT _KEY ;
var EVENT _POINTERUP = "pointerup" + EVENT _KEY ;
var EVENT _DRAG _START = "dragstart" + EVENT _KEY ;
var EVENT _LOAD _DATA _API = "load" + EVENT _KEY + DATA _API _KEY ;
var EVENT _CLICK _DATA _API = "click" + EVENT _KEY + DATA _API _KEY ;
var CLASS _NAME _CAROUSEL = 'carousel' ;
var CLASS _NAME _ACTIVE = 'active' ;
var CLASS _NAME _SLIDE = 'slide' ;
var CLASS _NAME _RIGHT = 'carousel-item-right' ;
var CLASS _NAME _LEFT = 'carousel-item-left' ;
var CLASS _NAME _NEXT = 'carousel-item-next' ;
var CLASS _NAME _PREV = 'carousel-item-prev' ;
var CLASS _NAME _POINTER _EVENT = 'pointer-event' ;
var SELECTOR _ACTIVE = '.active' ;
var SELECTOR _ACTIVE _ITEM = '.active.carousel-item' ;
var SELECTOR _ITEM = '.carousel-item' ;
var SELECTOR _ITEM _IMG = '.carousel-item img' ;
var SELECTOR _NEXT _PREV = '.carousel-item-next, .carousel-item-prev' ;
var SELECTOR _INDICATORS = '.carousel-indicators' ;
var SELECTOR _DATA _SLIDE = '[data-slide], [data-slide-to]' ;
var SELECTOR _DATA _RIDE = '[data-ride="carousel"]' ;
2018-11-13 07:41:12 +01:00
var PointerType = {
TOUCH : 'touch' ,
PEN : 'pen'
} ;
2019-10-08 08:39:10 +02:00
/ * *
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* Class Definition
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* /
2018-11-13 07:41:12 +01:00
2020-03-28 11:29:08 +01:00
var Carousel = /*#__PURE__*/ function ( ) {
2018-11-13 07:41:12 +01:00
function Carousel ( element , config ) {
this . _items = null ;
this . _interval = null ;
this . _activeElement = null ;
this . _isPaused = false ;
this . _isSliding = false ;
this . touchTimeout = null ;
this . touchStartX = 0 ;
this . touchDeltaX = 0 ;
this . _config = this . _getConfig ( config ) ;
this . _element = element ;
2020-03-28 11:29:08 +01:00
this . _indicatorsElement = SelectorEngine . findOne ( SELECTOR _INDICATORS , this . _element ) ;
2018-11-13 07:41:12 +01:00
this . _touchSupported = 'ontouchstart' in document . documentElement || navigator . maxTouchPoints > 0 ;
2020-05-13 20:53:43 +02:00
this . _pointerEvent = Boolean ( window . PointerEvent ) ;
2018-11-13 07:41:12 +01:00
this . _addEventListeners ( ) ;
2019-03-01 17:31:34 +01:00
Data . setData ( element , DATA _KEY , this ) ;
2018-11-13 07:41:12 +01:00
} // Getters
var _proto = Carousel . prototype ;
// Public
_proto . next = function next ( ) {
if ( ! this . _isSliding ) {
2020-03-28 11:29:08 +01:00
this . _slide ( DIRECTION _NEXT ) ;
2018-11-13 07:41:12 +01:00
}
2018-07-24 02:51:14 +02:00
} ;
2018-11-13 07:41:12 +01:00
_proto . nextWhenVisible = function nextWhenVisible ( ) {
// Don't call next when the page isn't visible
// or the carousel or its parent isn't visible
2019-03-01 17:31:34 +01:00
if ( ! document . hidden && isVisible ( this . _element ) ) {
2018-11-13 07:41:12 +01:00
this . next ( ) ;
}
2018-07-24 02:51:14 +02:00
} ;
2018-11-13 07:41:12 +01:00
_proto . prev = function prev ( ) {
if ( ! this . _isSliding ) {
2020-03-28 11:29:08 +01:00
this . _slide ( DIRECTION _PREV ) ;
2018-11-13 07:41:12 +01:00
}
2018-07-24 02:51:14 +02:00
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . pause = function pause ( event ) {
if ( ! event ) {
this . _isPaused = true ;
}
2020-03-28 11:29:08 +01:00
if ( SelectorEngine . findOne ( SELECTOR _NEXT _PREV , this . _element ) ) {
2019-03-01 17:31:34 +01:00
triggerTransitionEnd ( this . _element ) ;
2018-11-13 07:41:12 +01:00
this . cycle ( true ) ;
}
clearInterval ( this . _interval ) ;
this . _interval = null ;
2018-07-24 02:51:14 +02:00
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . cycle = function cycle ( event ) {
if ( ! event ) {
2018-07-24 02:51:14 +02:00
this . _isPaused = false ;
2018-11-13 07:41:12 +01:00
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( this . _interval ) {
clearInterval ( this . _interval ) ;
this . _interval = null ;
}
2015-05-08 07:26:40 +02:00
2019-03-01 17:31:34 +01:00
if ( this . _config && this . _config . interval && ! this . _isPaused ) {
2018-11-13 07:41:12 +01:00
this . _interval = setInterval ( ( document . visibilityState ? this . nextWhenVisible : this . next ) . bind ( this ) , this . _config . interval ) ;
}
} ;
2016-10-10 02:26:51 +02:00
2018-11-13 07:41:12 +01:00
_proto . to = function to ( index ) {
var _this = this ;
2017-09-30 23:28:03 +02:00
2020-03-28 11:29:08 +01:00
this . _activeElement = SelectorEngine . findOne ( SELECTOR _ACTIVE _ITEM , this . _element ) ;
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
var activeIndex = this . _getItemIndex ( this . _activeElement ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( index > this . _items . length - 1 || index < 0 ) {
return ;
}
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
if ( this . _isSliding ) {
2020-03-28 11:29:08 +01:00
EventHandler . one ( this . _element , EVENT _SLID , function ( ) {
2018-11-13 07:41:12 +01:00
return _this . to ( index ) ;
} ) ;
return ;
}
2016-10-10 02:26:51 +02:00
2018-11-13 07:41:12 +01:00
if ( activeIndex === index ) {
this . pause ( ) ;
this . cycle ( ) ;
return ;
}
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
var direction = index > activeIndex ? DIRECTION _NEXT : DIRECTION _PREV ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
this . _slide ( direction , this . _items [ index ] ) ;
} ;
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
_proto . dispose = function dispose ( ) {
2019-03-01 17:31:34 +01:00
EventHandler . off ( this . _element , EVENT _KEY ) ;
Data . removeData ( this . _element , DATA _KEY ) ;
2018-11-13 07:41:12 +01:00
this . _items = null ;
this . _config = null ;
this . _element = null ;
this . _interval = null ;
this . _isPaused = null ;
this . _isSliding = null ;
this . _activeElement = null ;
this . _indicatorsElement = null ;
2019-01-04 17:29:45 +01:00
} // Private
;
2018-11-13 07:41:12 +01:00
_proto . _getConfig = function _getConfig ( config ) {
2020-06-14 00:40:28 +02:00
config = _objectSpread ( _objectSpread ( { } , Default ) , config ) ;
2019-03-01 17:31:34 +01:00
typeCheckConfig ( NAME , config , DefaultType ) ;
2018-11-13 07:41:12 +01:00
return config ;
} ;
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
_proto . _handleSwipe = function _handleSwipe ( ) {
var absDeltax = Math . abs ( this . touchDeltaX ) ;
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
if ( absDeltax <= SWIPE _THRESHOLD ) {
return ;
}
2015-05-08 07:26:40 +02:00
2019-04-18 13:47:52 +02:00
var direction = absDeltax / this . touchDeltaX ;
this . touchDeltaX = 0 ; // swipe left
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( direction > 0 ) {
this . prev ( ) ;
} // swipe right
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( direction < 0 ) {
this . next ( ) ;
}
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _addEventListeners = function _addEventListeners ( ) {
var _this2 = this ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( this . _config . keyboard ) {
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _KEYDOWN , function ( event ) {
2018-11-13 07:41:12 +01:00
return _this2 . _keydown ( event ) ;
} ) ;
}
2016-11-01 05:14:23 +01:00
2018-11-13 07:41:12 +01:00
if ( this . _config . pause === 'hover' ) {
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _MOUSEENTER , function ( event ) {
2018-11-13 07:41:12 +01:00
return _this2 . pause ( event ) ;
2019-03-01 17:31:34 +01:00
} ) ;
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _MOUSELEAVE , function ( event ) {
2018-11-13 07:41:12 +01:00
return _this2 . cycle ( event ) ;
} ) ;
}
2015-05-08 07:26:40 +02:00
2019-07-24 08:13:50 +02:00
if ( this . _config . touch && this . _touchSupported ) {
2019-02-11 20:15:34 +01:00
this . _addTouchEventListeners ( ) ;
}
2018-11-13 07:41:12 +01:00
} ;
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
_proto . _addTouchEventListeners = function _addTouchEventListeners ( ) {
var _this3 = this ;
2018-07-24 02:51:14 +02:00
2018-11-13 07:41:12 +01:00
var start = function start ( event ) {
2019-03-01 17:31:34 +01:00
if ( _this3 . _pointerEvent && PointerType [ event . pointerType . toUpperCase ( ) ] ) {
_this3 . touchStartX = event . clientX ;
2018-11-13 07:41:12 +01:00
} else if ( ! _this3 . _pointerEvent ) {
2019-03-01 17:31:34 +01:00
_this3 . touchStartX = event . touches [ 0 ] . clientX ;
2017-09-06 06:05:12 +02:00
}
2018-11-13 07:41:12 +01:00
} ;
2017-09-06 06:05:12 +02:00
2018-11-13 07:41:12 +01:00
var move = function move ( event ) {
// ensure swiping with one touch and not pinching
2019-03-01 17:31:34 +01:00
if ( event . touches && event . touches . length > 1 ) {
2018-11-13 07:41:12 +01:00
_this3 . touchDeltaX = 0 ;
} else {
2019-03-01 17:31:34 +01:00
_this3 . touchDeltaX = event . touches [ 0 ] . clientX - _this3 . touchStartX ;
2018-07-24 02:51:14 +02:00
}
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var end = function end ( event ) {
2019-03-01 17:31:34 +01:00
if ( _this3 . _pointerEvent && PointerType [ event . pointerType . toUpperCase ( ) ] ) {
_this3 . touchDeltaX = event . clientX - _this3 . touchStartX ;
2018-07-24 02:51:14 +02:00
}
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
_this3 . _handleSwipe ( ) ;
if ( _this3 . _config . pause === 'hover' ) {
// If it's a touch-enabled device, mouseenter/leave are fired as
// part of the mouse compatibility events on first tap - the carousel
// would stop cycling until user tapped out of it;
// here, we listen for touchend, explicitly pause the carousel
// (as if it's the second time we tap on it, mouseenter compat event
// is NOT fired) and after a timeout (to allow for mouse compatibility
// events to fire) we explicitly restart cycling
_this3 . pause ( ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( _this3 . touchTimeout ) {
clearTimeout ( _this3 . touchTimeout ) ;
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_this3 . touchTimeout = setTimeout ( function ( event ) {
return _this3 . cycle ( event ) ;
} , TOUCHEVENT _COMPAT _WAIT + _this3 . _config . interval ) ;
2018-07-24 02:51:14 +02:00
}
} ;
2016-10-10 02:26:51 +02:00
2020-03-28 11:29:08 +01:00
SelectorEngine . find ( SELECTOR _ITEM _IMG , this . _element ) . forEach ( function ( itemImg ) {
EventHandler . on ( itemImg , EVENT _DRAG _START , function ( e ) {
2019-03-01 17:31:34 +01:00
return e . preventDefault ( ) ;
} ) ;
2018-11-13 07:41:12 +01:00
} ) ;
2016-10-10 02:26:51 +02:00
2018-11-13 07:41:12 +01:00
if ( this . _pointerEvent ) {
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _POINTERDOWN , function ( event ) {
2018-11-13 07:41:12 +01:00
return start ( event ) ;
} ) ;
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _POINTERUP , function ( event ) {
2018-11-13 07:41:12 +01:00
return end ( event ) ;
} ) ;
2017-09-30 23:28:03 +02:00
2020-03-28 11:29:08 +01:00
this . _element . classList . add ( CLASS _NAME _POINTER _EVENT ) ;
2018-11-13 07:41:12 +01:00
} else {
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _TOUCHSTART , function ( event ) {
2018-11-13 07:41:12 +01:00
return start ( event ) ;
} ) ;
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _TOUCHMOVE , function ( event ) {
2018-11-13 07:41:12 +01:00
return move ( event ) ;
} ) ;
2020-03-28 11:29:08 +01:00
EventHandler . on ( this . _element , EVENT _TOUCHEND , function ( event ) {
2018-11-13 07:41:12 +01:00
return end ( event ) ;
} ) ;
}
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _keydown = function _keydown ( event ) {
if ( /input|textarea/i . test ( event . target . tagName ) ) {
return ;
}
2015-05-08 07:26:40 +02:00
2020-05-13 20:53:43 +02:00
switch ( event . key ) {
case ARROW _LEFT _KEY :
2018-11-13 07:41:12 +01:00
event . preventDefault ( ) ;
this . prev ( ) ;
break ;
2015-05-08 07:26:40 +02:00
2020-05-13 20:53:43 +02:00
case ARROW _RIGHT _KEY :
2018-11-13 07:41:12 +01:00
event . preventDefault ( ) ;
this . next ( ) ;
break ;
}
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _getItemIndex = function _getItemIndex ( element ) {
2020-03-28 11:29:08 +01:00
this . _items = element && element . parentNode ? SelectorEngine . find ( SELECTOR _ITEM , element . parentNode ) : [ ] ;
2018-11-13 07:41:12 +01:00
return this . _items . indexOf ( element ) ;
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _getItemByDirection = function _getItemByDirection ( direction , activeElement ) {
2020-03-28 11:29:08 +01:00
var isNextDirection = direction === DIRECTION _NEXT ;
var isPrevDirection = direction === DIRECTION _PREV ;
2018-07-24 02:51:14 +02:00
2018-11-13 07:41:12 +01:00
var activeIndex = this . _getItemIndex ( activeElement ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var lastItemIndex = this . _items . length - 1 ;
var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex ;
2018-07-24 02:51:14 +02:00
2018-11-13 07:41:12 +01:00
if ( isGoingToWrap && ! this . _config . wrap ) {
return activeElement ;
}
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
var delta = direction === DIRECTION _PREV ? - 1 : 1 ;
2018-11-13 07:41:12 +01:00
var itemIndex = ( activeIndex + delta ) % this . _items . length ;
return itemIndex === - 1 ? this . _items [ this . _items . length - 1 ] : this . _items [ itemIndex ] ;
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _triggerSlideEvent = function _triggerSlideEvent ( relatedTarget , eventDirectionName ) {
var targetIndex = this . _getItemIndex ( relatedTarget ) ;
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
var fromIndex = this . _getItemIndex ( SelectorEngine . findOne ( SELECTOR _ACTIVE _ITEM , this . _element ) ) ;
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
return EventHandler . trigger ( this . _element , EVENT _SLIDE , {
2018-11-13 07:41:12 +01:00
relatedTarget : relatedTarget ,
direction : eventDirectionName ,
from : fromIndex ,
to : targetIndex
} ) ;
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _setActiveIndicatorElement = function _setActiveIndicatorElement ( element ) {
if ( this . _indicatorsElement ) {
2020-03-28 11:29:08 +01:00
var indicators = SelectorEngine . find ( SELECTOR _ACTIVE , this . _indicatorsElement ) ;
2019-03-01 17:31:34 +01:00
for ( var i = 0 ; i < indicators . length ; i ++ ) {
2020-03-28 11:29:08 +01:00
indicators [ i ] . classList . remove ( CLASS _NAME _ACTIVE ) ;
2019-03-01 17:31:34 +01:00
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var nextIndicator = this . _indicatorsElement . children [ this . _getItemIndex ( element ) ] ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( nextIndicator ) {
2020-03-28 11:29:08 +01:00
nextIndicator . classList . add ( CLASS _NAME _ACTIVE ) ;
2018-07-24 02:51:14 +02:00
}
2018-11-13 07:41:12 +01:00
}
} ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
_proto . _slide = function _slide ( direction , element ) {
var _this4 = this ;
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
var activeElement = SelectorEngine . findOne ( SELECTOR _ACTIVE _ITEM , this . _element ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var activeElementIndex = this . _getItemIndex ( activeElement ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var nextElement = element || activeElement && this . _getItemByDirection ( direction , activeElement ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var nextElementIndex = this . _getItemIndex ( nextElement ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var isCycling = Boolean ( this . _interval ) ;
var directionalClassName ;
var orderClassName ;
var eventDirectionName ;
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
if ( direction === DIRECTION _NEXT ) {
directionalClassName = CLASS _NAME _LEFT ;
orderClassName = CLASS _NAME _NEXT ;
eventDirectionName = DIRECTION _LEFT ;
2018-11-13 07:41:12 +01:00
} else {
2020-03-28 11:29:08 +01:00
directionalClassName = CLASS _NAME _RIGHT ;
orderClassName = CLASS _NAME _PREV ;
eventDirectionName = DIRECTION _RIGHT ;
2018-11-13 07:41:12 +01:00
}
2017-09-30 23:28:03 +02:00
2020-03-28 11:29:08 +01:00
if ( nextElement && nextElement . classList . contains ( CLASS _NAME _ACTIVE ) ) {
2018-11-13 07:41:12 +01:00
this . _isSliding = false ;
return ;
}
2017-09-30 23:28:03 +02:00
2018-11-13 07:41:12 +01:00
var slideEvent = this . _triggerSlideEvent ( nextElement , eventDirectionName ) ;
2018-09-19 06:35:40 +02:00
2019-03-01 17:31:34 +01:00
if ( slideEvent . defaultPrevented ) {
2018-11-13 07:41:12 +01:00
return ;
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( ! activeElement || ! nextElement ) {
// Some weirdness is happening, so we bail
return ;
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
this . _isSliding = true ;
2015-08-19 05:28:28 +02:00
2018-11-13 07:41:12 +01:00
if ( isCycling ) {
this . pause ( ) ;
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
this . _setActiveIndicatorElement ( nextElement ) ;
2017-09-30 23:28:03 +02:00
2020-03-28 11:29:08 +01:00
if ( this . _element . classList . contains ( CLASS _NAME _SLIDE ) ) {
2019-03-01 17:31:34 +01:00
nextElement . classList . add ( orderClassName ) ;
reflow ( nextElement ) ;
activeElement . classList . add ( directionalClassName ) ;
nextElement . classList . add ( directionalClassName ) ;
2018-11-13 07:41:12 +01:00
var nextElementInterval = parseInt ( nextElement . getAttribute ( 'data-interval' ) , 10 ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
if ( nextElementInterval ) {
this . _config . defaultInterval = this . _config . defaultInterval || this . _config . interval ;
this . _config . interval = nextElementInterval ;
} else {
this . _config . interval = this . _config . defaultInterval || this . _config . interval ;
}
2018-07-24 02:51:14 +02:00
2019-03-01 17:31:34 +01:00
var transitionDuration = getTransitionDurationFromElement ( activeElement ) ;
EventHandler . one ( activeElement , TRANSITION _END , function ( ) {
2020-05-13 20:53:43 +02:00
nextElement . classList . remove ( directionalClassName , orderClassName ) ;
2020-03-28 11:29:08 +01:00
nextElement . classList . add ( CLASS _NAME _ACTIVE ) ;
2020-05-13 20:53:43 +02:00
activeElement . classList . remove ( CLASS _NAME _ACTIVE , orderClassName , directionalClassName ) ;
2018-11-13 07:41:12 +01:00
_this4 . _isSliding = false ;
setTimeout ( function ( ) {
2020-03-28 11:29:08 +01:00
EventHandler . trigger ( _this4 . _element , EVENT _SLID , {
2019-03-01 17:31:34 +01:00
relatedTarget : nextElement ,
direction : eventDirectionName ,
from : activeElementIndex ,
to : nextElementIndex
} ) ;
2018-11-13 07:41:12 +01:00
} , 0 ) ;
2019-03-01 17:31:34 +01:00
} ) ;
emulateTransitionEnd ( activeElement , transitionDuration ) ;
2018-11-13 07:41:12 +01:00
} else {
2020-03-28 11:29:08 +01:00
activeElement . classList . remove ( CLASS _NAME _ACTIVE ) ;
nextElement . classList . add ( CLASS _NAME _ACTIVE ) ;
2018-11-13 07:41:12 +01:00
this . _isSliding = false ;
2020-03-28 11:29:08 +01:00
EventHandler . trigger ( this . _element , EVENT _SLID , {
2019-03-01 17:31:34 +01:00
relatedTarget : nextElement ,
direction : eventDirectionName ,
from : activeElementIndex ,
to : nextElementIndex
} ) ;
2018-11-13 07:41:12 +01:00
}
2018-07-24 02:51:14 +02:00
2018-11-13 07:41:12 +01:00
if ( isCycling ) {
this . cycle ( ) ;
}
2019-01-04 17:29:45 +01:00
} // Static
;
2016-10-10 02:26:51 +02:00
2019-08-27 15:03:21 +02:00
Carousel . carouselInterface = function carouselInterface ( element , config ) {
2019-03-01 17:31:34 +01:00
var data = Data . getData ( element , DATA _KEY ) ;
2017-09-30 23:28:03 +02:00
2020-06-14 00:40:28 +02:00
var _config = _objectSpread ( _objectSpread ( { } , Default ) , Manipulator . getDataAttributes ( element ) ) ;
2017-09-30 23:28:03 +02:00
2019-03-01 17:31:34 +01:00
if ( typeof config === 'object' ) {
2020-06-14 00:40:28 +02:00
_config = _objectSpread ( _objectSpread ( { } , _config ) , config ) ;
2019-03-01 17:31:34 +01:00
}
2017-09-30 23:28:03 +02:00
2019-03-01 17:31:34 +01:00
var action = typeof config === 'string' ? config : _config . slide ;
2017-12-23 01:21:54 +01:00
2019-03-01 17:31:34 +01:00
if ( ! data ) {
data = new Carousel ( element , _config ) ;
}
if ( typeof config === 'number' ) {
data . to ( config ) ;
} else if ( typeof action === 'string' ) {
if ( typeof data [ action ] === 'undefined' ) {
2019-03-11 16:13:30 +01:00
throw new TypeError ( "No method named \"" + action + "\"" ) ;
2018-07-24 02:51:14 +02:00
}
2017-09-30 23:28:03 +02:00
2019-03-01 17:31:34 +01:00
data [ action ] ( ) ;
} else if ( _config . interval && _config . ride ) {
data . pause ( ) ;
data . cycle ( ) ;
}
} ;
2017-09-30 23:28:03 +02:00
2019-08-27 15:03:21 +02:00
Carousel . jQueryInterface = function jQueryInterface ( config ) {
2019-03-01 17:31:34 +01:00
return this . each ( function ( ) {
2019-08-27 15:03:21 +02:00
Carousel . carouselInterface ( this , config ) ;
2018-11-13 07:41:12 +01:00
} ) ;
} ;
2017-09-30 23:28:03 +02:00
2019-08-27 15:03:21 +02:00
Carousel . dataApiClickHandler = function dataApiClickHandler ( event ) {
var target = getElementFromSelector ( this ) ;
2015-05-08 07:26:40 +02:00
2020-03-28 11:29:08 +01:00
if ( ! target || ! target . classList . contains ( CLASS _NAME _CAROUSEL ) ) {
2018-11-13 07:41:12 +01:00
return ;
}
2015-05-08 07:26:40 +02:00
2020-06-14 00:40:28 +02:00
var config = _objectSpread ( _objectSpread ( { } , Manipulator . getDataAttributes ( target ) ) , Manipulator . getDataAttributes ( this ) ) ;
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
var slideIndex = this . getAttribute ( 'data-slide-to' ) ;
2018-06-22 07:55:23 +02:00
2018-11-13 07:41:12 +01:00
if ( slideIndex ) {
config . interval = false ;
2018-07-24 02:51:14 +02:00
}
2017-09-30 23:28:03 +02:00
2019-08-27 15:03:21 +02:00
Carousel . carouselInterface ( target , config ) ;
2018-11-13 07:41:12 +01:00
if ( slideIndex ) {
2019-03-01 17:31:34 +01:00
Data . getData ( target , DATA _KEY ) . to ( slideIndex ) ;
2018-11-13 07:41:12 +01:00
}
2015-05-08 07:26:40 +02:00
2018-11-13 07:41:12 +01:00
event . preventDefault ( ) ;
2018-07-24 02:51:14 +02:00
} ;
2017-09-30 23:28:03 +02:00
2019-08-27 15:03:21 +02:00
Carousel . getInstance = function getInstance ( element ) {
2019-03-01 17:31:34 +01:00
return Data . getData ( element , DATA _KEY ) ;
} ;
2018-11-13 07:41:12 +01:00
_createClass ( Carousel , null , [ {
key : "VERSION" ,
get : function get ( ) {
return VERSION ;
}
} , {
key : "Default" ,
get : function get ( ) {
return Default ;
}
} ] ) ;
2018-07-24 02:51:14 +02:00
return Carousel ;
2018-11-13 07:41:12 +01:00
} ( ) ;
/ * *
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* Data Api implementation
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* /
2020-03-28 11:29:08 +01:00
EventHandler . on ( document , EVENT _CLICK _DATA _API , SELECTOR _DATA _SLIDE , Carousel . dataApiClickHandler ) ;
EventHandler . on ( window , EVENT _LOAD _DATA _API , function ( ) {
var carousels = SelectorEngine . find ( SELECTOR _DATA _RIDE ) ;
2018-11-13 07:41:12 +01:00
for ( var i = 0 , len = carousels . length ; i < len ; i ++ ) {
2019-08-27 15:03:21 +02:00
Carousel . carouselInterface ( carousels [ i ] , Data . getData ( carousels [ i ] , DATA _KEY ) ) ;
2018-11-13 07:41:12 +01:00
}
} ) ;
2019-08-27 15:03:21 +02:00
var $ = getjQuery ( ) ;
2018-11-13 07:41:12 +01:00
/ * *
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
* jQuery
* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
2019-03-01 17:31:34 +01:00
* add . carousel to jQuery only if jQuery is present
2018-11-13 07:41:12 +01:00
* /
2019-07-24 08:13:50 +02:00
/* istanbul ignore if */
2019-08-27 15:03:21 +02:00
if ( $ ) {
var JQUERY _NO _CONFLICT = $ . fn [ NAME ] ;
$ . fn [ NAME ] = Carousel . jQueryInterface ;
$ . fn [ NAME ] . Constructor = Carousel ;
2018-11-13 07:41:12 +01:00
2019-08-27 15:03:21 +02:00
$ . fn [ NAME ] . noConflict = function ( ) {
$ . fn [ NAME ] = JQUERY _NO _CONFLICT ;
return Carousel . jQueryInterface ;
2019-03-01 17:31:34 +01:00
} ;
}
2015-05-08 07:26:40 +02:00
return Carousel ;
2018-07-24 02:51:14 +02:00
2019-11-08 09:11:23 +01:00
} ) ) ) ;
2018-07-24 02:51:14 +02:00
//# sourceMappingURL=carousel.js.map