@odopod/odo-carousel
Advanced tools
Comparing version 2.0.0 to 2.1.0
@@ -1,2 +0,2 @@ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("tiny-emitter"),require("@odopod/odo-device"),require("@odopod/odo-pointer"),require("@odopod/odo-draggable"),require("@odopod/odo-helpers")):"function"==typeof define&&define.amd?define(["tiny-emitter","@odopod/odo-device","@odopod/odo-pointer","@odopod/odo-draggable","@odopod/odo-helpers"],t):e.OdoCarousel=t(e.TinyEmitter,e.OdoDevice,e.OdoPointer,e.OdoDraggable,e.OdoHelpers)}(this,function(e,t,i,s,o){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,i=i&&i.hasOwnProperty("default")?i.default:i,s=s&&s.hasOwnProperty("default")?s.default:s;var n=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},a=function(){function e(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,i,s){return i&&e(t.prototype,i),s&&e(t,s),t}}(),r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},d=function(){function e(t,i,s,o){n(this,e),this.type=t,this.target=i.element,this.from=s,this.to=o,this.hasSlideChanged=s!==o,this.defaultPrevented=!1}return e.prototype.preventDefault=function(){this.defaultPrevented=!0},e}();function l(e){if("none"===e)return{x:0,y:0};var t=e.match(/(-?[\d.]+)/g);return{x:parseFloat(t[4]),y:parseFloat(t[5])}}var h=0;function p(){return"odo-carousel"+(h+=1)}var _=function(e){function h(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};n(this,h);var s=r(this,e.call(this));if(!(t instanceof Element))throw new TypeError('OdoCarousel requires an element. Got: "'+t+'"');return s.element=t,s.options=h.getOptions(i),s.isVertical=s.options.isVertical,s._isSlidingLooped=s.options.isLooped&&!s.options.isFade,s.domIndex=0,s.lastDomIndex=0,s._selectedIndex=0,s._slideContainerParentEl=null,s._carouselEl=null,s._slides=[],s._isJumped=!1,s._isEnabled=!0,s._posAttr=s.isVertical?"top":"left",s._offsetPosition="offset"+o.capitalize(s._posAttr),s._dimensionAttr=s.isVertical?"height":"width",s._translateAxis=s.isVertical?"Y":"X",s.isTransitioning=!1,s._transitionId=null,s._hasSlideChildren=!1,s._isDraggable=!0,s.hasDragged=!1,s._isOffset=!1,s._timer=null,s._crossfadeTimeout=s.options.animationSpeed-s.options.animationSpeed*s.options.crossfadeAmount,s._startEdge=0,s.draggable=null,s.pointer=null,s._isBidirectional=!1,s.resetSync=s.reset,s.decorate(),s}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(h,e),h.prototype.getElementsByClass=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.element;return Array.from(t.getElementsByClassName(e))},h.prototype.getElementByClass=function(e,t){return this.getElementsByClass(e,t)[0]||null},h.prototype.decorate=function(){this._saveDomElements(),this.options.isLooped&&2===this._slides.length&&this._decorateBidirectionalCarousel(),this._setA11yAttributes(),this._renderPaddles(),this.options.pagination&&this._renderPagination(),this._saveRenderedElements(),this._setSlideIndices(),this.options.isFade?this._decorateFadeCarousel():this._decorateRegularCarousel(),this._onClick=this._handleClick.bind(this),this.element.addEventListener("click",this._onClick),this.setSelectedIndex(this._getSafeIndex(this.options.startIndex),!0),this._isSlidingLooped&&(this._setNeighborSlides(),this._snapToCurrentSlide())},h.prototype._decorateRegularCarousel=function(){this._carouselEl.style[t.Dom.TRANSITION_PROPERTY]=t.Css.TRANSFORM,this._carouselEl.style[t.Dom.TRANSITION_TIMING_FUNCTION]=this.options.easing,this._hasSlideChildren=this._getSlideChildren().length>0,this.bindDragEvents()},h.prototype._decorateFadeCarousel=function(){var e=this;this._isDraggable=!1,this.getSlides().forEach(function(i,s){i.style[t.Dom.TRANSITION]="opacity "+e.options.animationSpeed+"ms linear",0===s&&i.classList.add(h.Classes.VISIBLE)}),this.bindSwipeEvents()},h.prototype._decorateBidirectionalCarousel=function(){var e=this;this._isBidirectional=!0,this._isJumped=!0,this._slides.forEach(function(t){e.getCarouselElement().appendChild(t.cloneNode(!0))}),this._slides=this.getElementsByClass(h.Classes.SLIDE)},h.prototype._setA11yAttributes=function(){this.getWrapper().setAttribute("aria-live","polite"),this.getCarouselElement().setAttribute("role","list"),this.getSlides().forEach(function(e){o.giveId(e,p),e.setAttribute("role","listitem")})},h.prototype._removeA11yAttributes=function(){this.getWrapper().removeAttribute("aria-live"),this.getCarouselElement().removeAttribute("role"),this.getSlides().forEach(function(e){e.removeAttribute("role")})},h.prototype._saveDomElements=function(){this._slideContainerParentEl=this.getElementByClass(h.Classes.WRAPPER),this._carouselEl=this.getElementByClass(h.Classes.CAROUSEL_ELEMENT),this._slides=this.getElementsByClass(h.Classes.SLIDE)},h.prototype._saveRenderedElements=function(){this._paddlePrevious=this.getElementByClass(h.Classes.PADDLE_PREV),this._paddleNext=this.getElementByClass(h.Classes.PADDLE_NEXT),this._paginationDots=this.getElementsByClass(h.Classes.PAGINATION_DOT).map(function(e){return{dot:e,i:parseInt(e.getAttribute("data-index"),10),i2:parseInt(e.getAttribute("data-secondary-index"),10)}})},h.prototype._renderPaddles=function(){this.element.insertAdjacentHTML("beforeend",this._getNavPaddleHtml())},h.prototype._removePaddles=function(){this._removeByClass(h.Classes.PADDLES)},h.prototype._removeByClass=function(e){var t=this.getElementByClass(e);t&&t.parentNode.removeChild(t)},h.prototype._getNavPaddleHtml=function(){return"function"==typeof this.options.getNavPaddleHtml?this.options.getNavPaddleHtml.call(this,this):h.template(this.options.template.paddles,{prev:h.template(this.options.template.paddlePrev,{paddleInner:this.options.template.paddlePrevInner}),next:h.template(this.options.template.paddleNext,{paddleInner:this.options.template.paddleNextInner})})},h.prototype._renderPagination=function(){this.element.insertAdjacentHTML("beforeend",this._getPaginationHtml())},h.prototype._removePagination=function(){this._removeByClass(h.Classes.PAGINATION)},h.prototype._getPaginationHtml=function(){if("function"==typeof this.options.getPaginationHtml)return this.options.getPaginationHtml.call(this,this);var e=this._buildPaginationHtml();return h.template(this.options.template.pagination,{dots:e})},h.prototype._buildPaginationHtml=function(){var e=this,t=this._isBidirectional?this.options.template.paginationDotSecondary:this.options.template.paginationDot;return this.getSlides().reduce(function(i,s,o,n){var a={index:o,index1:o+1,slideId:s.id};return e._isBidirectional&&(a.secondaryIndex=o>1?o%2:o+2,a.hidden=o>=n.length/2),i+h.template(t,a)},"")},h.prototype.bindDragEvents=function(){this.draggable=new s(this._carouselEl,{axis:this.isVertical?i.Axis.Y:i.Axis.X}),this._onDragStart=this._handleDragStart.bind(this),this._onDragMove=this._handleDragMove.bind(this),this._onDragEnd=this._handleDragEnd.bind(this),this.draggable.on(s.EventType.START,this._onDragStart),this.draggable.on(s.EventType.MOVE,this._onDragMove),this.draggable.on(s.EventType.END,this._onDragEnd)},h.prototype.bindSwipeEvents=function(){this.pointer=new i(this._carouselEl,{axis:i.Axis.X,preventEventDefault:!0}),this._onPointerEnd=this._handlePointerEnd.bind(this),this.pointer.on(i.EventType.END,this._onPointerEnd)},h.prototype.addSlide=function(e){this._setSlidesToLogicalOrder(),this._carouselEl.insertAdjacentHTML("beforeend",e),this.reset()},h.prototype.reset=function(){this._saveDomElements(),this._removePaddles(),this._removePagination(),this._setA11yAttributes(),this._renderPaddles(),this.options.pagination&&this._renderPagination(),this._saveRenderedElements(),this._setSlideIndices();var e=this.getSelectedIndex();this.setSelectedIndex(0,!0),this.setSelectedIndex(e,!0),this._isSlidingLooped&&(this._setNeighborSlides(),this._snapToCurrentSlide())},h.prototype.getWrapper=function(){return this._slideContainerParentEl},h.prototype.getCarouselElement=function(){return this._carouselEl},h.prototype.getSlides=function(){return this._slides},h.prototype.getSlide=function(e){return this.getSlides()[e]},h.prototype.getSelectedIndex=function(){return this._selectedIndex},h.prototype._getDomIndex=function(e){return this.getSlideIndices().indexOf(e)},h.prototype._getLogicalIndex=function(e){return this.getSlideIndices()[e]},h.prototype._getSafeIndex=function(e){return this.isIndexOutOfRange(e)?this.options.isLooped?this._getRelativeIndex(e,0):this.clampIndexToSlides(e):e},h.prototype._getRelativeIndex=function(e,t){return o.wrapAroundList(e,t,this._slides.length)},h.prototype.isIndexOutOfRange=function(e){return e<=-1||e>=this._slides.length},h.prototype.clampIndexToSlides=function(e){return o.clamp(e,0,this._slides.length-1)},h.prototype.isFirstSlide=function(){return 0===this.getSelectedIndex()},h.prototype.isLastSlide=function(){return this.getSelectedIndex()===this._slides.length-1},h.prototype._setSlideIndices=function(){this._slideIndices=new Array(this._slides.length);for(var e=0,t=this._slides.length;e<t;e++)this._slideIndices[e]=e},h.prototype.getSlideIndices=function(){return this._slideIndices},h.prototype._getSlideChildren=function(e){return this.getElementsByClass(h.Classes.SLIDE_CHILD,e)},h.prototype._moveIndex=function(e,t){var i=this.clampIndexToSlides(t),s=this._getDomIndex(e),o=this._slideIndices;o.splice(i,0,o.splice(s,1)[0])},h.prototype._swapIndexes=function(e,t){var i=this._getDomIndex(e);this._slideIndices[i]=-1,this._slideIndices[this._getDomIndex(t)]=e,this._slideIndices[i]=t},h.prototype._getPositions=function(e){var t=this,i=this.getWrapper().getBoundingClientRect()[this._posAttr];return e.map(function(e){return e.getBoundingClientRect()[t._posAttr]-i})},h.prototype._setDraggableEnabled=function(e){this.draggable?this.draggable.isEnabled=e:this.pointer.isEnabled=e},h.prototype.setDraggable=function(e){this._isDraggable=e,this._setDraggableEnabled(e)},h.prototype._getNewPosition=function(e){var t=e[this._offsetPosition],i=o.getSize(this.getCarouselElement())[this._dimensionAttr];if(this.options.isCentered){var s=o.getSize(e)[this._dimensionAttr],n=o.getSize(this.getWrapper())[this._dimensionAttr];this._startEdge=(n-s)/2,t-=this._startEdge}var a=t/i;return this._hasSlideChildren&&this.isLastSlide()&&(a=this._getPositionForSlideChildren(e,t,i)),a},h.prototype._getPositionForSlideChildren=function(e,t,i){var s=o.getElementsSize(this._getSlideChildren(e),this._dimensionAttr);return(t-(o.getSize(e)[this._dimensionAttr]-s))/i},h.prototype._getCssPosition=function(e){return"translate"+this._translateAxis+"("+e+")"},h.prototype._setSlidesToLogicalOrder=function(){var e=document.createDocumentFragment();this._slides.forEach(e.appendChild,e),this._carouselEl.appendChild(e),this._setSlideIndices()},h.prototype._setNeighborSlidesForJump=function(e){var t=this._getLogicalIndex(e),i=this._getLogicalIndex(this.domIndex);this._isJumped=!0;var s=t>i?this.domIndex+1:this.domIndex-1;return this._swapSlides(t,this._getLogicalIndex(s)),s},h.prototype._swapSlides=function(e,t){this._swapIndexes(e,t),o.swapElements(this.getSlide(e),this.getSlide(t))},h.prototype.startSlideshow=function(){this._timer||(this._timer=new o.Timer(this._slideshowTimerExpired.bind(this),this.options.slideshowSpeed,!0)),this._timer.start()},h.prototype.pauseSlideshow=function(){this._isSlideshowPlaying()&&this._timer.stop()},h.prototype._isSlideshowPlaying=function(){return!!this._timer&&this._timer.isTicking},h.prototype.getInnocentNeighbor=function(e,t){var i=this.getSlide(this.getSelectedIndex());return t?o.getNthSibling(i,e+1):o.getNthSibling(i,e,!1)||this._carouselEl.firstElementChild},h.prototype.getNeighborInsertionIndex=function(e,t,i){return t?i+e+1:i-e},h.prototype._setNeighborSlide=function(e,t,i){var s=this.getSelectedIndex(),o=this.getSlideIndices(),n=this._getDomIndex(s),a=this._getRelativeIndex(s,t);if(o[n+t]!==a){var r=this.getInnocentNeighbor(e,i),d=this.getNeighborInsertionIndex(e,i,n),l=this.getSlide(a);this._moveIndex(a,d),this._carouselEl.insertBefore(l,r)}},h.prototype._setNeighborSlides=function(){var e=void 0;for(e=0;e<this.options.neighborCount;e++)this._setNeighborSlide(e,-(e+1),!1);for(e=0;e<this.options.neighborCount;e++)this._setNeighborSlide(e,e+1,!0)},h.prototype._snapToCurrentSlide=function(){this.goToSlide(this._getDomIndex(this.getSelectedIndex()),!0)},h.prototype._maybeSetJumpedSlides=function(e,t){return this.options.isJumped&&!t&&Math.abs(this.domIndex-e)>1?this._setNeighborSlidesForJump(e):e},h.prototype._canNavigate=function(e,t){var i=e===this.domIndex&&!t,s=this.hasDragged||this._isOffset;return!(!this._isEnabled||!this.options.isLooped&&this.isIndexOutOfRange(e)||i&&!s)},h.prototype._toNewSlide=function(){this.isTransitioning=!0,this._emitEvent(new d(h.EventType.SLIDE_START,this,this._getLogicalIndex(this.lastDomIndex),this._getLogicalIndex(this.domIndex)))},h.prototype._moveToPosition=function(e,i){this._carouselEl.style[t.Dom.TRANSFORM]=this._getCssPosition(e),i?this._carouselEl.style[t.Dom.TRANSITION_DURATION]="0ms":(this._carouselEl.style[t.Dom.TRANSITION_DURATION]=this.options.animationSpeed+"ms",this._transitionId=o.onTransitionEnd(this._carouselEl,this._transitionDone,this,t.Dom.TRANSFORM,this.options.animationSpeed+h.TRANSITION_END_WAIT),this._toNewSlide())},h.prototype._getCarouselOffset=function(){var e=getComputedStyle(this._carouselEl)[t.Dom.TRANSFORM],i=Math.round(10*l(e)[this._translateAxis.toLowerCase()])/10;return this.getSlide(this.getSelectedIndex())[this._offsetPosition]+i},h.prototype._cancelMovement=function(){if(this.isTransitioning&&(this.isTransitioning=!1,o.cancelTransitionEnd(this._transitionId),!this.options.isFade)){var e=o.getSize(this.getCarouselElement())[this._dimensionAttr],t=this._getCarouselOffset();this._isJumped&&this._setSlidesToLogicalOrder(),this._isSlidingLooped&&this._setNeighborSlides();var i=(this.getSlide(this.getSelectedIndex())[this._offsetPosition]-t)/e;this._moveToPosition(-100*i+"%",!0),this.draggable.update()}},h.prototype.fadeToSlide=function(e,t){var i=this.getSlide(e,!0),s=this.getSlide(this.domIndex,!0);t||(this._transitionId=o.onTransitionEnd(i,this._transitionDone,this)),i.classList.add(h.Classes.VISIBLE),s!==i&&(s.classList.add(h.Classes.BEHIND),setTimeout(function(){s.classList.remove(h.Classes.VISIBLE)},this._crossfadeTimeout)),this.lastDomIndex=this.domIndex,this.domIndex=e,t||this._toNewSlide()},h.prototype.goToSlide=function(e,t){var i=this.getSlide(this._getLogicalIndex(e)),s=this._maybeSetJumpedSlides(e,t),o=-100*this._getNewPosition(i)+"%";this.lastDomIndex=this.domIndex,this.domIndex=s,this._moveToPosition(o,t)},h.prototype.setSelectedIndex=function(e,t){var i=this._getDomIndex(e),s=this._canNavigate(i,t);if(s){if(this._emitEvent(new d(h.EventType.WILL_NAVIGATE,this)))return!1;this._cancelMovement(),this._selectedIndex=this._getSafeIndex(e),i=this._getDomIndex(this._selectedIndex),this._setSlidesState(),this._setPaddleState(),this._setPaginationState(),this.options.isFade?this.fadeToSlide(i,t):this.goToSlide(i,t)}return s},h.prototype.goToNearestSlide=function(e){var t=this._getPositions(this.getSlides()),i=t.indexOf(o.closest(t,this._startEdge));return i===this.getSelectedIndex()&&(!0===e?i=this._getSafeIndex(i+1):!1===e&&(i=this._getSafeIndex(i-1))),this.setSelectedIndex(i)},h.prototype.goToNextSlide=function(){return this.setSelectedIndex(this.getSelectedIndex()+1)},h.prototype.goToPreviousSlide=function(){return this.setSelectedIndex(this.getSelectedIndex()-1)},h.prototype._setSlidesState=function(){var e=this.getSelectedIndex(),t=this._getSafeIndex(e-2),i=this._getSafeIndex(e-1),s=this._getSafeIndex(e+1),o=this._getSafeIndex(e+2);this.getSlides().forEach(function(n,a){var r=a===e;!function(e,t){var i="a[href],button,details,iframe,input,textarea,select,*[tabindex]",s=Array.from(e.querySelectorAll(i));e.matches(i)&&s.push(e);for(var o=s.length-1;o>=0;o--)t?s[o].removeAttribute("tabindex"):s[o].tabIndex=-1}(n,r),n.setAttribute("aria-hidden",!r),n.classList.toggle(h.Classes.ACTIVE_SLIDE,r),n.classList.toggle(h.Classes.PAST_SLIDE,a===t&&e!==t&&i!==t),n.classList.toggle(h.Classes.PREVIOUS_SLIDE,a===i&&e!==i),n.classList.toggle(h.Classes.NEXT_SLIDE,a===s&&e!==s),n.classList.toggle(h.Classes.FUTURE_SLIDE,a===o&&e!==o&&s!==o)})},h.prototype._setPaginationState=function(){if(this.options.pagination){var e=this.getSelectedIndex();this._paginationDots.forEach(function(t){var i=t.dot,s=t.i,o=t.i2,n=e===s||e===o;i.classList.toggle(h.Classes.PAGINATION_DOT_SELECTED,n),i.setAttribute("aria-selected",n)})}},h.prototype._setPaddleState=function(){var e=!this.options.isLooped;if(e&&this._paddlePrevious){var t=this.isFirstSlide();this._paddlePrevious.classList.toggle(h.Classes.PADDLE_DISABLED,t),this._paddlePrevious.setAttribute("aria-disabled",t)}if(e&&this._paddleNext){var i=this.isLastSlide();this._paddleNext.classList.toggle(h.Classes.PADDLE_DISABLED,i),this._paddleNext.setAttribute("aria-disabled",i)}},h.prototype._slideshowTimerExpired=function(){!this.options.isLooped&&this.isLastSlide()?this.pauseSlideshow():this.goToNextSlide()},h.prototype._transitionDone=function(){var e=this._getLogicalIndex(this.lastDomIndex),t=this._getLogicalIndex(this.domIndex);this.isTransitioning=!1,this._isJumped&&this._setSlidesToLogicalOrder(),this._isSlidingLooped&&this._setNeighborSlides(),(this._isJumped||this._isSlidingLooped)&&this._snapToCurrentSlide(),this.options.isFade&&this.getSlide(e).classList.remove(h.Classes.BEHIND),this._isJumped=!1,this._emitEvent(new d(h.EventType.SLIDE_END,this,e,t))},h.prototype._handlePointerEnd=function(e){this.pointer.hasVelocity(e.velocity)&&(e.direction===i.Direction.RIGHT?this.goToPreviousSlide():e.direction===i.Direction.LEFT&&this.goToNextSlide())},h.prototype._handleClick=function(e){var t=e.target,i=!1,s=t.closest("."+h.Classes.PAGINATION_DOT),o=t.closest("."+h.Classes.PADDLE_PREV),n=t.closest("."+h.Classes.PADDLE_NEXT);s?(i=!0,this.setSelectedIndex(parseInt(s.getAttribute("data-index"),10))):o?(i=!0,this.goToPreviousSlide()):n?(i=!0,this.goToNextSlide()):this.isTransitioning&&e.preventDefault(),i&&(e.preventDefault(),this.pauseSlideshow())},h.prototype._handleDragStart=function(){this.pauseSlideshow(),this._cancelMovement(),this._carouselEl.style[t.Dom.TRANSITION_DURATION]="0ms"},h.prototype._handleDragMove=function(e){var t=e.delta;if(this.hasDragged=this.isVertical?Math.abs(t.y)>0:Math.abs(t.x)>0,!this.options.isLooped){var i=this._isMovingTowardsEdge(t.x,t.y)?.4:1;this.draggable.friction=i}},h.prototype._handleDragEnd=function(e){this.draggable.friction=1,this.navigateAfterDrag(e.velocity,e.axisDirection,e.didMoveOnAxis),this.hasDragged=!1,this._isOffset=!1},h.prototype._shouldGoToPrevious=function(e,t){return e&&(this.options.isLooped||!this.isFirstSlide())&&(t===i.Direction.RIGHT||t===i.Direction.DOWN)},h.prototype._shouldGoToNext=function(e,t){return e&&(this.options.isLooped||!this.isLastSlide())&&(t===i.Direction.LEFT||t===i.Direction.UP)},h.prototype.navigateAfterDrag=function(e,t,i){var s=this.hasDragged&&this.draggable.pointer.hasVelocity(e);this.hasDragged||(this._isOffset=Math.abs(Math.round(this._getCarouselOffset()))>Math.round(this._startEdge)),this._shouldGoToPrevious(s,t)?this.goToNearestSlide(!1):this._shouldGoToNext(s,t)?this.goToNearestSlide(!0):(i||this._isOffset)&&this.goToNearestSlide()},h.prototype._emitEvent=function(e){return this.emit(e.type,e),e.defaultPrevented},h.prototype._isMovingTowardsEdge=function(e,t){var i=this.isVertical?t>0:e>0,s=this.isVertical?t<0:e<0;return this.isFirstSlide()&&i||this.isLastSlide()&&s},h.prototype.dispose=function(){this._timer&&this._timer.dispose(),this._removeA11yAttributes(),this._removePaddles(),this._removePagination(),this._carouselEl.style[t.Dom.TRANSFORM]="",this._carouselEl.style[t.Dom.TRANSITION]="",this.options.isFade?(this.pointer.off(i.EventType.END,this._onPointerEnd),this.pointer.dispose(),this.getSlides().forEach(function(e){e.style[t.Dom.TRANSITION]=""})):(this.draggable.off(s.EventType.START,this._onDragStart),this.draggable.off(s.EventType.MOVE,this._onDragMove),this.draggable.off(s.EventType.END,this._onDragEnd),this.draggable.dispose()),this.element.removeEventListener("click",this._onClick),this._slides.forEach(function(e){e.classList.remove(h.Classes.PAST_SLIDE,h.Classes.PREVIOUS_SLIDE,h.Classes.ACTIVE_SLIDE,h.Classes.NEXT_SLIDE,h.Classes.FUTURE_SLIDE,h.Classes.VISIBLE,h.Classes.BEHIND)}),this._isBidirectional&&(this._carouselEl.removeChild(this._slides[2]),this._carouselEl.removeChild(this._slides[3])),this.element=null,this._slideContainerParentEl=null,this._carouselEl=null,this._paddlePrevious=null,this._paddleNext=null,this._paginationDots=null,this.draggable=null,this.pointer=null,this._slides.length=0},h.getOptions=function(e){var t=Object.assign({},h.Defaults.template,e.template),i=Object.assign({},h.Defaults,e);return i.template=t,i},a(h,[{key:"isEnabled",get:function(){return this._isEnabled},set:function(e){this._isEnabled=e,this._setDraggableEnabled(e)}}]),h}(e);return Object.assign(_,{EventType:{WILL_NAVIGATE:"odocarousel:willnavigate",SLIDE_START:"odocarousel:slidestart",SLIDE_END:"odocarousel:slideend"},Classes:{BASE:"odo-carousel",FADE:"odo-carousel--fade",VERTICAL:"odo-carousel--vertical",WRAPPER:"odo-carousel__wrapper",CAROUSEL_ELEMENT:"odo-carousel__element",SLIDE:"odo-carousel__slide",ACTIVE_SLIDE:"odo-carousel__slide--active",PREVIOUS_SLIDE:"odo-carousel__slide--previous",PAST_SLIDE:"odo-carousel__slide--past",NEXT_SLIDE:"odo-carousel__slide--next",FUTURE_SLIDE:"odo-carousel__slide--future",VISIBLE:"odo-carousel__slide--visible",BEHIND:"odo-carousel__slide--behind",PAGINATION:"odo-carousel__pagination",PAGINATION_DOT:"odo-carousel__pagination-dot",PAGINATION_DOT_SELECTED:"is-selected",PADDLES:"odo-carousel__nav-paddles",PADDLE:"odo-carousel__nav-paddle",PADDLE_NEXT:"odo-carousel__nav-next",PADDLE_PREV:"odo-carousel__nav-prev",PADDLE_DISABLED:"is-disabled",SLIDE_CHILD:"odo-carousel__slide-child"},Defaults:{startIndex:0,isVertical:!1,isLooped:!1,isJumped:!1,isFade:!1,isCentered:!1,neighborCount:1,slideshowSpeed:1e3,animationSpeed:400,crossfadeAmount:.875,easing:"cubic-bezier(0.250, 0.460, 0.450, 0.940)",pagination:!1,getNavPaddleHtml:null,getPaginationHtml:null,template:{paddles:'<nav class="odo-carousel__nav-paddles">{{ prev }}{{ next }}</nav>',paddleNext:'<a href="javascript:void(0)" role="button" aria-label="next slide" class="odo-carousel__nav-paddle odo-carousel__nav-next">{{ paddleInner }}</a>',paddlePrev:'<a href="javascript:void(0)" role="button" aria-label="previous slide" class="odo-carousel__nav-paddle odo-carousel__nav-prev">{{ paddleInner }}</a>',paddleNextInner:'<svg viewBox="75.4 27 461.2 738"><path d="M167.7 27l368.9 369-368.9 369-92.3-92.3 276.7-276.7-276.7-276.7z"/></svg>',paddlePrevInner:'<svg viewBox="75.396 26.994 461.208 738.012"><path d="M444.336 765.006l-368.94-369.006 368.94-369.006 92.268 92.268-276.738 276.738 276.738 276.738z"/></svg>',pagination:'<nav class="odo-carousel__pagination" role="tablist">{{ dots }}</nav>',paginationDot:'<a href="javascript:void(0)" role="tab" aria-label="Go to slide {{ index1 }}" aria-controls="{{ slideId }}" aria-selected="false" class="odo-carousel__pagination-dot" data-index="{{ index }}"></a>',paginationDotSecondary:'<a href="javascript:void(0)" role="tab" aria-label="Go to slide {{ index1 }}" aria-controls="{{ slideId }}" aria-selected="false" class="odo-carousel__pagination-dot" data-index="{{ index }}" data-secondary-index="{{ secondaryIndex }}" aria-hidden="{{ hidden }}"></a>'}},TRANSITION_END_WAIT:32}),_.template=function(e,t){return e.replace(/{{\s?((.)?.*?)\s?}}/g,function(e,i){var s=i.split("."),o=t,n=void 0;if(s.length>1){n=o;for(var a=0;a<s.length;a++)o=n,n=n[s[a]]||i}else n=o[i];return"function"==typeof n?n.call(o):null!=n&&n!==i?n:i})},_._getTranslate=l,_}); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("tiny-emitter"),require("@odopod/odo-device"),require("@odopod/odo-pointer"),require("@odopod/odo-draggable"),require("@odopod/odo-helpers")):"function"==typeof define&&define.amd?define(["tiny-emitter","@odopod/odo-device","@odopod/odo-pointer","@odopod/odo-draggable","@odopod/odo-helpers"],t):e.OdoCarousel=t(e.TinyEmitter,e.OdoDevice,e.OdoPointer,e.OdoDraggable,e.OdoHelpers)}(this,function(e,t,i,s,o){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,i=i&&i.hasOwnProperty("default")?i.default:i,s=s&&s.hasOwnProperty("default")?s.default:s;var n=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},a=function(){function e(e,t){for(var i=0;i<t.length;i++){var s=t[i];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,i,s){return i&&e(t.prototype,i),s&&e(t,s),t}}(),r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},d=function(){function e(t,i,s,o){n(this,e),this.type=t,this.target=i.element,this.from=s,this.to=o,this.hasSlideChanged=s!==o,this.defaultPrevented=!1}return e.prototype.preventDefault=function(){this.defaultPrevented=!0},e}();function l(e){if("none"===e)return{x:0,y:0};var t=e.match(/(-?[\d.]+)/g);return{x:parseFloat(t[4]),y:parseFloat(t[5])}}var h=0;function p(){return"odo-carousel"+(h+=1)}var _=function(e){function h(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};n(this,h);var s=r(this,e.call(this));if(!(t instanceof HTMLElement))throw new TypeError('OdoCarousel requires an element. Got: "'+t+'"');return s.element=t,s.options=h.getOptions(i),s.isVertical=s.options.isVertical,s._isSlidingLooped=s.options.isLooped&&!s.options.isFade,s.domIndex=0,s.lastDomIndex=0,s._selectedIndex=0,s._slideContainerParentEl=null,s._carouselEl=null,s._slides=[],s._isJumped=!1,s._isEnabled=!0,s._posAttr=s.isVertical?"top":"left",s._offsetPosition="offset"+o.capitalize(s._posAttr),s._dimensionAttr=s.isVertical?"height":"width",s._translateAxis=s.isVertical?"Y":"X",s.isTransitioning=!1,s._transitionId=null,s._hasSlideChildren=!1,s._isDraggable=!0,s.hasDragged=!1,s._isOffset=!1,s._timer=null,s._crossfadeTimeout=s.options.animationSpeed-s.options.animationSpeed*s.options.crossfadeAmount,s._startEdge=0,s.draggable=null,s.pointer=null,s._isBidirectional=!1,s.resetSync=s.reset,s.decorate(),s}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(h,e),h.prototype.getElementsByClass=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.element;return Array.from(t.getElementsByClassName(e))},h.prototype.getElementByClass=function(e,t){return this.getElementsByClass(e,t)[0]||null},h.prototype.decorate=function(){this._saveDomElements(),this.options.isLooped&&2===this._slides.length&&this._decorateBidirectionalCarousel(),this._setA11yAttributes(),this._renderPaddles(),this.options.pagination&&this._renderPagination(),this._saveRenderedElements(),this._setSlideIndices(),this.options.isFade?this._decorateFadeCarousel():this._decorateRegularCarousel(),this._onClick=this._handleClick.bind(this),this.element.addEventListener("click",this._onClick),this.setSelectedIndex(this._getSafeIndex(this.options.startIndex),!0),this._isSlidingLooped&&(this._setNeighborSlides(),this._snapToCurrentSlide())},h.prototype._decorateRegularCarousel=function(){this._carouselEl.style[t.Dom.TRANSITION_PROPERTY]=t.Css.TRANSFORM,this._carouselEl.style[t.Dom.TRANSITION_TIMING_FUNCTION]=this.options.easing,this._hasSlideChildren=this._getSlideChildren().length>0,this.bindDragEvents()},h.prototype._decorateFadeCarousel=function(){var e=this;this._isDraggable=!1,this.getSlides().forEach(function(i,s){i.style[t.Dom.TRANSITION]="opacity "+e.options.animationSpeed+"ms linear",0===s&&i.classList.add(h.Classes.VISIBLE)}),this.bindSwipeEvents()},h.prototype._decorateBidirectionalCarousel=function(){var e=this;this._isBidirectional=!0,this._isJumped=!0,this._slides.forEach(function(t){e.getCarouselElement().appendChild(t.cloneNode(!0))}),this._slides=this.getElementsByClass(h.Classes.SLIDE)},h.prototype._setA11yAttributes=function(){this.getWrapper().setAttribute("aria-live","polite"),this.getCarouselElement().setAttribute("role","list"),this.getSlides().forEach(function(e){o.giveId(e,p),e.setAttribute("role","listitem")})},h.prototype._removeA11yAttributes=function(){this.getWrapper().removeAttribute("aria-live"),this.getCarouselElement().removeAttribute("role"),this.getSlides().forEach(function(e){e.removeAttribute("role")})},h.prototype._saveDomElements=function(){this._slideContainerParentEl=this.getElementByClass(h.Classes.WRAPPER),this._carouselEl=this.getElementByClass(h.Classes.CAROUSEL_ELEMENT),this._slides=this.getElementsByClass(h.Classes.SLIDE)},h.prototype._saveRenderedElements=function(){this._paddlePrevious=this.getElementByClass(h.Classes.PADDLE_PREV),this._paddleNext=this.getElementByClass(h.Classes.PADDLE_NEXT),this._paginationDots=this.getElementsByClass(h.Classes.PAGINATION_DOT).map(function(e){return{dot:e,i:parseInt(e.getAttribute("data-index"),10),i2:parseInt(e.getAttribute("data-secondary-index"),10)}})},h.prototype._renderPaddles=function(){this.element.insertAdjacentHTML("beforeend",this._getNavPaddleHtml())},h.prototype._removePaddles=function(){this._removeByClass(h.Classes.PADDLES)},h.prototype._removeByClass=function(e){var t=this.getElementByClass(e);t&&t.parentNode.removeChild(t)},h.prototype._getNavPaddleHtml=function(){return"function"==typeof this.options.getNavPaddleHtml?this.options.getNavPaddleHtml.call(this,this):h.template(this.options.template.paddles,{prev:h.template(this.options.template.paddlePrev,{paddleInner:this.options.template.paddlePrevInner}),next:h.template(this.options.template.paddleNext,{paddleInner:this.options.template.paddleNextInner})})},h.prototype._renderPagination=function(){this.element.insertAdjacentHTML("beforeend",this._getPaginationHtml())},h.prototype._removePagination=function(){this._removeByClass(h.Classes.PAGINATION)},h.prototype._getPaginationHtml=function(){if("function"==typeof this.options.getPaginationHtml)return this.options.getPaginationHtml.call(this,this);var e=this._buildPaginationHtml();return h.template(this.options.template.pagination,{dots:e})},h.prototype._buildPaginationHtml=function(){var e=this,t=this._isBidirectional?this.options.template.paginationDotSecondary:this.options.template.paginationDot;return this.getSlides().reduce(function(i,s,o,n){var a={index:o,index1:o+1,slideId:s.id};return e._isBidirectional&&(a.secondaryIndex=o>1?o%2:o+2,a.hidden=o>=n.length/2),i+h.template(t,a)},"")},h.prototype.bindDragEvents=function(){this.draggable=new s(this._carouselEl,{axis:this.isVertical?i.Axis.Y:i.Axis.X}),this._onDragStart=this._handleDragStart.bind(this),this._onDragMove=this._handleDragMove.bind(this),this._onDragEnd=this._handleDragEnd.bind(this),this.draggable.on(s.EventType.START,this._onDragStart),this.draggable.on(s.EventType.MOVE,this._onDragMove),this.draggable.on(s.EventType.END,this._onDragEnd)},h.prototype.bindSwipeEvents=function(){this.pointer=new i(this._carouselEl,{axis:i.Axis.X,preventEventDefault:!0}),this._onPointerEnd=this._handlePointerEnd.bind(this),this.pointer.on(i.EventType.END,this._onPointerEnd)},h.prototype.addSlide=function(e){this._setSlidesToLogicalOrder(),this._carouselEl.insertAdjacentHTML("beforeend",e),this.reset()},h.prototype.reset=function(){this._saveDomElements(),this._removePaddles(),this._removePagination(),this._setA11yAttributes(),this._renderPaddles(),this.options.pagination&&this._renderPagination(),this._saveRenderedElements(),this._setSlideIndices();var e=this.getSelectedIndex();this.setSelectedIndex(0,!0),this.setSelectedIndex(e,!0),this._isSlidingLooped&&(this._setNeighborSlides(),this._snapToCurrentSlide())},h.prototype.getWrapper=function(){return this._slideContainerParentEl},h.prototype.getCarouselElement=function(){return this._carouselEl},h.prototype.getSlides=function(){return this._slides},h.prototype.getSlide=function(e){return this.getSlides()[e]},h.prototype.getSelectedIndex=function(){return this._selectedIndex},h.prototype._getDomIndex=function(e){return this.getSlideIndices().indexOf(e)},h.prototype._getLogicalIndex=function(e){return this.getSlideIndices()[e]},h.prototype._getSafeIndex=function(e){return this.isIndexOutOfRange(e)?this.options.isLooped?this._getRelativeIndex(e,0):this.clampIndexToSlides(e):e},h.prototype._getRelativeIndex=function(e,t){return o.wrapAroundList(e,t,this._slides.length)},h.prototype.isIndexOutOfRange=function(e){return e<=-1||e>=this._slides.length},h.prototype.clampIndexToSlides=function(e){return o.clamp(e,0,this._slides.length-1)},h.prototype.isFirstSlide=function(){return 0===this.getSelectedIndex()},h.prototype.isLastSlide=function(){return this.getSelectedIndex()===this._slides.length-1},h.prototype._setSlideIndices=function(){this._slideIndices=new Array(this._slides.length);for(var e=0,t=this._slides.length;e<t;e++)this._slideIndices[e]=e},h.prototype.getSlideIndices=function(){return this._slideIndices},h.prototype._getSlideChildren=function(e){return this.getElementsByClass(h.Classes.SLIDE_CHILD,e)},h.prototype._moveIndex=function(e,t){var i=this.clampIndexToSlides(t),s=this._getDomIndex(e),o=this._slideIndices;o.splice(i,0,o.splice(s,1)[0])},h.prototype._swapIndexes=function(e,t){var i=this._getDomIndex(e);this._slideIndices[i]=-1,this._slideIndices[this._getDomIndex(t)]=e,this._slideIndices[i]=t},h.prototype._getPositions=function(e){var t=this,i=this.getWrapper().getBoundingClientRect()[this._posAttr];return e.map(function(e){return e.getBoundingClientRect()[t._posAttr]-i})},h.prototype._setDraggableEnabled=function(e){this.draggable?this.draggable.isEnabled=e:this.pointer.isEnabled=e},h.prototype.setDraggable=function(e){this._isDraggable=e,this._setDraggableEnabled(e)},h.prototype._getNewPosition=function(e){var t=e[this._offsetPosition],i=o.getSize(this.getCarouselElement())[this._dimensionAttr];if(this.options.isCentered){var s=o.getSize(e)[this._dimensionAttr],n=o.getSize(this.getWrapper())[this._dimensionAttr];this._startEdge=(n-s)/2,t-=this._startEdge}var a=t/i;return this._hasSlideChildren&&this.isLastSlide()&&(a=this._getPositionForSlideChildren(e,t,i)),a},h.prototype._getPositionForSlideChildren=function(e,t,i){var s=o.getElementsSize(this._getSlideChildren(e),this._dimensionAttr);return(t-(o.getSize(e)[this._dimensionAttr]-s))/i},h.prototype._getCssPosition=function(e){return"translate"+this._translateAxis+"("+e+")"},h.prototype._setSlidesToLogicalOrder=function(){var e=document.createDocumentFragment();this._slides.forEach(e.appendChild,e),this._carouselEl.appendChild(e),this._setSlideIndices()},h.prototype._setNeighborSlidesForJump=function(e){var t=this._getLogicalIndex(e),i=this._getLogicalIndex(this.domIndex);this._isJumped=!0;var s=t>i?this.domIndex+1:this.domIndex-1;return this._swapSlides(t,this._getLogicalIndex(s)),s},h.prototype._swapSlides=function(e,t){this._swapIndexes(e,t),o.swapElements(this.getSlide(e),this.getSlide(t))},h.prototype.startSlideshow=function(){this._timer||(this._timer=new o.Timer(this._slideshowTimerExpired.bind(this),this.options.slideshowSpeed,!0)),this._timer.start()},h.prototype.pauseSlideshow=function(){this._isSlideshowPlaying()&&this._timer.stop()},h.prototype._isSlideshowPlaying=function(){return!!this._timer&&this._timer.isTicking},h.prototype.getInnocentNeighbor=function(e,t){var i=this.getSlide(this.getSelectedIndex());return t?o.getNthSibling(i,e+1):o.getNthSibling(i,e,!1)||this._carouselEl.firstElementChild},h.prototype.getNeighborInsertionIndex=function(e,t,i){return t?i+e+1:i-e},h.prototype._setNeighborSlide=function(e,t,i){var s=this.getSelectedIndex(),o=this.getSlideIndices(),n=this._getDomIndex(s),a=this._getRelativeIndex(s,t);if(o[n+t]!==a){var r=this.getInnocentNeighbor(e,i),d=this.getNeighborInsertionIndex(e,i,n),l=this.getSlide(a);this._moveIndex(a,d),this._carouselEl.insertBefore(l,r)}},h.prototype._setNeighborSlides=function(){var e=void 0;for(e=0;e<this.options.neighborCount;e++)this._setNeighborSlide(e,-(e+1),!1);for(e=0;e<this.options.neighborCount;e++)this._setNeighborSlide(e,e+1,!0)},h.prototype._snapToCurrentSlide=function(){this.goToSlide(this._getDomIndex(this.getSelectedIndex()),!0)},h.prototype._maybeSetJumpedSlides=function(e,t){return this.options.isJumped&&!t&&Math.abs(this.domIndex-e)>1?this._setNeighborSlidesForJump(e):e},h.prototype._canNavigate=function(e,t){var i=e===this.domIndex&&!t,s=this.hasDragged||this._isOffset;return!(!this._isEnabled||!this.options.isLooped&&this.isIndexOutOfRange(e)||i&&!s)},h.prototype._toNewSlide=function(){this.isTransitioning=!0,this._emitEvent(new d(h.EventType.SLIDE_START,this,this._getLogicalIndex(this.lastDomIndex),this._getLogicalIndex(this.domIndex)))},h.prototype._moveToPosition=function(e,i){this._carouselEl.style[t.Dom.TRANSFORM]=this._getCssPosition(e),i?this._carouselEl.style[t.Dom.TRANSITION_DURATION]="0ms":(this._carouselEl.style[t.Dom.TRANSITION_DURATION]=this.options.animationSpeed+"ms",this._transitionId=o.onTransitionEnd(this._carouselEl,this._transitionDone,this,t.Dom.TRANSFORM,this.options.animationSpeed+h.TRANSITION_END_WAIT),this._toNewSlide())},h.prototype._getCarouselOffset=function(){var e=getComputedStyle(this._carouselEl)[t.Dom.TRANSFORM],i=Math.round(10*l(e)[this._translateAxis.toLowerCase()])/10;return this.getSlide(this.getSelectedIndex())[this._offsetPosition]+i},h.prototype._cancelMovement=function(){if(this.isTransitioning&&(this.isTransitioning=!1,o.cancelTransitionEnd(this._transitionId),!this.options.isFade)){var e=o.getSize(this.getCarouselElement())[this._dimensionAttr],t=this._getCarouselOffset();this._isJumped&&this._setSlidesToLogicalOrder(),this._isSlidingLooped&&this._setNeighborSlides();var i=(this.getSlide(this.getSelectedIndex())[this._offsetPosition]-t)/e;this._moveToPosition(-100*i+"%",!0),this.draggable.update()}},h.prototype.fadeToSlide=function(e,t){var i=this.getSlide(e),s=this.getSlide(this.domIndex);t||(this._transitionId=o.onTransitionEnd(i,this._transitionDone,this)),i.classList.add(h.Classes.VISIBLE),s!==i&&(s.classList.add(h.Classes.BEHIND),setTimeout(function(){s.classList.remove(h.Classes.VISIBLE)},this._crossfadeTimeout)),this.lastDomIndex=this.domIndex,this.domIndex=e,t||this._toNewSlide()},h.prototype.goToSlide=function(e,t){var i=this.getSlide(this._getLogicalIndex(e)),s=this._maybeSetJumpedSlides(e,t),o=-100*this._getNewPosition(i)+"%";this.lastDomIndex=this.domIndex,this.domIndex=s,this._moveToPosition(o,t)},h.prototype.setSelectedIndex=function(e,t){var i=this._getDomIndex(e),s=this._canNavigate(i,t);if(s){if(this._emitEvent(new d(h.EventType.WILL_NAVIGATE,this)))return!1;this._cancelMovement(),this._selectedIndex=this._getSafeIndex(e),i=this._getDomIndex(this._selectedIndex),this._setSlidesState(),this._setPaddleState(),this._setPaginationState(),this.options.isFade?this.fadeToSlide(i,t):this.goToSlide(i,t)}return s},h.prototype.goToNearestSlide=function(e){var t=this._getPositions(this.getSlides()),i=t.indexOf(o.closest(t,this._startEdge));return i===this.getSelectedIndex()&&(!0===e?i=this._getSafeIndex(i+1):!1===e&&(i=this._getSafeIndex(i-1))),this.setSelectedIndex(i)},h.prototype.goToNextSlide=function(){return this.setSelectedIndex(this.getSelectedIndex()+1)},h.prototype.goToPreviousSlide=function(){return this.setSelectedIndex(this.getSelectedIndex()-1)},h.prototype._setSlidesState=function(){var e=this.getSelectedIndex(),t=this._getSafeIndex(e-2),i=this._getSafeIndex(e-1),s=this._getSafeIndex(e+1),o=this._getSafeIndex(e+2);this.getSlides().forEach(function(n,a){var r=a===e;!function(e,t){var i="a[href],button,details,iframe,input,textarea,select,*[tabindex]",s=Array.from(e.querySelectorAll(i));e.matches(i)&&s.push(e);for(var o=s.length-1;o>=0;o--)t?s[o].removeAttribute("tabindex"):s[o].tabIndex=-1}(n,r),n.setAttribute("aria-hidden",!r),n.classList.toggle(h.Classes.ACTIVE_SLIDE,r),n.classList.toggle(h.Classes.PAST_SLIDE,a===t&&e!==t&&i!==t),n.classList.toggle(h.Classes.PREVIOUS_SLIDE,a===i&&e!==i),n.classList.toggle(h.Classes.NEXT_SLIDE,a===s&&e!==s),n.classList.toggle(h.Classes.FUTURE_SLIDE,a===o&&e!==o&&s!==o)})},h.prototype._setPaginationState=function(){if(this.options.pagination){var e=this.getSelectedIndex();this._paginationDots.forEach(function(t){var i=t.dot,s=t.i,o=t.i2,n=e===s||e===o;i.classList.toggle(h.Classes.PAGINATION_DOT_SELECTED,n),i.setAttribute("aria-selected",n)})}},h.prototype._setPaddleState=function(){var e=!this.options.isLooped;if(e&&this._paddlePrevious){var t=this.isFirstSlide();this._paddlePrevious.classList.toggle(h.Classes.PADDLE_DISABLED,t),this._paddlePrevious.setAttribute("aria-disabled",t)}if(e&&this._paddleNext){var i=this.isLastSlide();this._paddleNext.classList.toggle(h.Classes.PADDLE_DISABLED,i),this._paddleNext.setAttribute("aria-disabled",i)}},h.prototype._slideshowTimerExpired=function(){!this.options.isLooped&&this.isLastSlide()?this.pauseSlideshow():this.goToNextSlide()},h.prototype._transitionDone=function(){var e=this._getLogicalIndex(this.lastDomIndex),t=this._getLogicalIndex(this.domIndex);this.isTransitioning=!1,this._isJumped&&this._setSlidesToLogicalOrder(),this._isSlidingLooped&&this._setNeighborSlides(),(this._isJumped||this._isSlidingLooped)&&this._snapToCurrentSlide(),this.options.isFade&&this.getSlide(e).classList.remove(h.Classes.BEHIND),this._isJumped=!1,this._emitEvent(new d(h.EventType.SLIDE_END,this,e,t))},h.prototype._handlePointerEnd=function(e){this.pointer.hasVelocity(e.velocity)&&(e.direction===i.Direction.RIGHT?this.goToPreviousSlide():e.direction===i.Direction.LEFT&&this.goToNextSlide())},h.prototype._handleClick=function(e){var t=e.target,i=!1,s=t.closest("."+h.Classes.PAGINATION_DOT),o=t.closest("."+h.Classes.PADDLE_PREV),n=t.closest("."+h.Classes.PADDLE_NEXT);s?(i=!0,this.setSelectedIndex(parseInt(s.getAttribute("data-index"),10))):o?(i=!0,this.goToPreviousSlide()):n?(i=!0,this.goToNextSlide()):this.isTransitioning&&e.preventDefault(),i&&(e.preventDefault(),this.pauseSlideshow())},h.prototype._handleDragStart=function(){this.pauseSlideshow(),this._cancelMovement(),this._carouselEl.style[t.Dom.TRANSITION_DURATION]="0ms"},h.prototype._handleDragMove=function(e){var t=e.delta;if(this.hasDragged=this.isVertical?Math.abs(t.y)>0:Math.abs(t.x)>0,!this.options.isLooped){var i=this._isMovingTowardsEdge(t.x,t.y)?.4:1;this.draggable.friction=i}},h.prototype._handleDragEnd=function(e){this.draggable.friction=1,this.navigateAfterDrag(e.velocity,e.axisDirection,e.didMoveOnAxis),this.hasDragged=!1,this._isOffset=!1},h.prototype._shouldGoToPrevious=function(e,t){return e&&(this.options.isLooped||!this.isFirstSlide())&&(t===i.Direction.RIGHT||t===i.Direction.DOWN)},h.prototype._shouldGoToNext=function(e,t){return e&&(this.options.isLooped||!this.isLastSlide())&&(t===i.Direction.LEFT||t===i.Direction.UP)},h.prototype.navigateAfterDrag=function(e,t,i){var s=this.hasDragged&&this.draggable.pointer.hasVelocity(e);this.hasDragged||(this._isOffset=Math.abs(Math.round(this._getCarouselOffset()))>Math.round(this._startEdge)),this._shouldGoToPrevious(s,t)?this.goToNearestSlide(!1):this._shouldGoToNext(s,t)?this.goToNearestSlide(!0):(i||this._isOffset)&&this.goToNearestSlide()},h.prototype._emitEvent=function(e){return this.emit(e.type,e),e.defaultPrevented},h.prototype._isMovingTowardsEdge=function(e,t){var i=this.isVertical?t>0:e>0,s=this.isVertical?t<0:e<0;return this.isFirstSlide()&&i||this.isLastSlide()&&s},h.prototype.dispose=function(){this._timer&&this._timer.dispose(),this._removeA11yAttributes(),this._removePaddles(),this._removePagination(),this._carouselEl.style[t.Dom.TRANSFORM]="",this._carouselEl.style[t.Dom.TRANSITION]="",this.options.isFade?(this.pointer.off(i.EventType.END,this._onPointerEnd),this.pointer.dispose(),this.getSlides().forEach(function(e){e.style[t.Dom.TRANSITION]=""})):(this.draggable.off(s.EventType.START,this._onDragStart),this.draggable.off(s.EventType.MOVE,this._onDragMove),this.draggable.off(s.EventType.END,this._onDragEnd),this.draggable.dispose()),this.element.removeEventListener("click",this._onClick),this._slides.forEach(function(e){e.classList.remove(h.Classes.PAST_SLIDE,h.Classes.PREVIOUS_SLIDE,h.Classes.ACTIVE_SLIDE,h.Classes.NEXT_SLIDE,h.Classes.FUTURE_SLIDE,h.Classes.VISIBLE,h.Classes.BEHIND)}),this._isBidirectional&&(this._carouselEl.removeChild(this._slides[2]),this._carouselEl.removeChild(this._slides[3])),this.element=null,this._slideContainerParentEl=null,this._carouselEl=null,this._paddlePrevious=null,this._paddleNext=null,this._paginationDots=null,this.draggable=null,this.pointer=null,this._slides.length=0},h.getOptions=function(e){var t=Object.assign({},h.Defaults.template,e.template),i=Object.assign({},h.Defaults,e);return i.template=t,i},a(h,[{key:"isEnabled",get:function(){return this._isEnabled},set:function(e){this._isEnabled=e,this._setDraggableEnabled(e)}}]),h}(e);return Object.assign(_,{EventType:{WILL_NAVIGATE:"odocarousel:willnavigate",SLIDE_START:"odocarousel:slidestart",SLIDE_END:"odocarousel:slideend"},Classes:{BASE:"odo-carousel",FADE:"odo-carousel--fade",VERTICAL:"odo-carousel--vertical",WRAPPER:"odo-carousel__wrapper",CAROUSEL_ELEMENT:"odo-carousel__element",SLIDE:"odo-carousel__slide",ACTIVE_SLIDE:"odo-carousel__slide--active",PREVIOUS_SLIDE:"odo-carousel__slide--previous",PAST_SLIDE:"odo-carousel__slide--past",NEXT_SLIDE:"odo-carousel__slide--next",FUTURE_SLIDE:"odo-carousel__slide--future",VISIBLE:"odo-carousel__slide--visible",BEHIND:"odo-carousel__slide--behind",PAGINATION:"odo-carousel__pagination",PAGINATION_DOT:"odo-carousel__pagination-dot",PAGINATION_DOT_SELECTED:"is-selected",PADDLES:"odo-carousel__nav-paddles",PADDLE:"odo-carousel__nav-paddle",PADDLE_NEXT:"odo-carousel__nav-next",PADDLE_PREV:"odo-carousel__nav-prev",PADDLE_DISABLED:"is-disabled",SLIDE_CHILD:"odo-carousel__slide-child"},Defaults:{startIndex:0,isVertical:!1,isLooped:!1,isJumped:!1,isFade:!1,isCentered:!1,neighborCount:1,slideshowSpeed:1e3,animationSpeed:400,crossfadeAmount:.875,easing:"cubic-bezier(0.250, 0.460, 0.450, 0.940)",pagination:!1,getNavPaddleHtml:null,getPaginationHtml:null,template:{paddles:'<nav class="odo-carousel__nav-paddles">{{ prev }}{{ next }}</nav>',paddleNext:'<a href="javascript:void(0)" role="button" aria-label="next slide" class="odo-carousel__nav-paddle odo-carousel__nav-next">{{ paddleInner }}</a>',paddlePrev:'<a href="javascript:void(0)" role="button" aria-label="previous slide" class="odo-carousel__nav-paddle odo-carousel__nav-prev">{{ paddleInner }}</a>',paddleNextInner:'<svg viewBox="75.4 27 461.2 738"><path d="M167.7 27l368.9 369-368.9 369-92.3-92.3 276.7-276.7-276.7-276.7z"/></svg>',paddlePrevInner:'<svg viewBox="75.396 26.994 461.208 738.012"><path d="M444.336 765.006l-368.94-369.006 368.94-369.006 92.268 92.268-276.738 276.738 276.738 276.738z"/></svg>',pagination:'<nav class="odo-carousel__pagination" role="tablist">{{ dots }}</nav>',paginationDot:'<a href="javascript:void(0)" role="tab" aria-label="Go to slide {{ index1 }}" aria-controls="{{ slideId }}" aria-selected="false" class="odo-carousel__pagination-dot" data-index="{{ index }}"></a>',paginationDotSecondary:'<a href="javascript:void(0)" role="tab" aria-label="Go to slide {{ index1 }}" aria-controls="{{ slideId }}" aria-selected="false" class="odo-carousel__pagination-dot" data-index="{{ index }}" data-secondary-index="{{ secondaryIndex }}" aria-hidden="{{ hidden }}"></a>'}},TRANSITION_END_WAIT:32}),_.template=function(e,t){return e.replace(/{{\s?((.)?.*?)\s?}}/g,function(e,i){var s=i.split("."),o=t,n=void 0;if(s.length>1){n=o;for(var a=0;a<s.length;a++)o=n,n=n[s[a]]||i}else n=o[i];return"function"==typeof n?n.call(o):void 0!==n&&null!==n&&n!==i?n:i})},_.CarouselEvent=d,_._getTranslate=l,_}); | ||
//# sourceMappingURL=odo-carousel.min.js.map |
{ | ||
"name": "@odopod/odo-carousel", | ||
"description": "Performant, awesome carousels.", | ||
"version": "2.0.0", | ||
"version": "2.1.0", | ||
"main": "dist/odo-carousel.js", | ||
@@ -9,2 +9,3 @@ "module": "dist/odo-carousel.esm.js", | ||
"odoModule": "src/carousel.js", | ||
"types": "index.d.ts", | ||
"sideEffects": false, | ||
@@ -19,6 +20,6 @@ "author": "Odopod", | ||
"dependencies": { | ||
"@odopod/odo-device": "^1.1.0", | ||
"@odopod/odo-draggable": "^1.1.0", | ||
"@odopod/odo-helpers": "^2.0.0", | ||
"@odopod/odo-pointer": "^1.1.0", | ||
"@odopod/odo-device": "^1.2.0", | ||
"@odopod/odo-draggable": "^1.2.0", | ||
"@odopod/odo-helpers": "^2.0.1", | ||
"@odopod/odo-pointer": "^1.2.0", | ||
"tiny-emitter": "^2.0.1" | ||
@@ -30,3 +31,4 @@ }, | ||
"dist", | ||
"src" | ||
"src", | ||
"index.d.ts" | ||
], | ||
@@ -33,0 +35,0 @@ "odoKeywords": [ |
@@ -14,3 +14,3 @@ | ||
/** @type {Element} */ | ||
/** @type {HTMLElement} */ | ||
this.target = carousel.element; | ||
@@ -17,0 +17,0 @@ |
@@ -5,3 +5,3 @@ /** | ||
* | ||
* @author glen@odopod.com (Glen Cheney) | ||
* @author Glen Cheney <glen@odopod.com> | ||
*/ | ||
@@ -35,3 +35,3 @@ | ||
/** | ||
* @param {Element} element The outermost carousel element. | ||
* @param {HTMLElement} element The outermost carousel element. | ||
* @param {Object} [options] An options object. | ||
@@ -44,3 +44,3 @@ * @constructor | ||
if (!(element instanceof Element)) { | ||
if (!(element instanceof HTMLElement)) { | ||
throw new TypeError(`OdoCarousel requires an element. Got: "${element}"`); | ||
@@ -92,3 +92,3 @@ } | ||
* The slide container's parent. | ||
* @type {Element} | ||
* @type {HTMLElement} | ||
* @private | ||
@@ -101,3 +101,3 @@ */ | ||
* transforms or absolute positioning. | ||
* @type {Element} | ||
* @type {HTMLElement} | ||
* @private | ||
@@ -109,3 +109,3 @@ */ | ||
* An array of slides (elements) in the carousel. | ||
* @type {Array.<!Element>} | ||
* @type {Array.<!HTMLElement>} | ||
* @private | ||
@@ -172,3 +172,3 @@ */ | ||
* the transitionend listener. | ||
* @type {string} | ||
* @type {number} | ||
*/ | ||
@@ -238,3 +238,3 @@ this._transitionId = null; | ||
* Pointer attached to the main element. Used for fading carousels. | ||
* @type {OdoDraggable} | ||
* @type {OdoPointer} | ||
*/ | ||
@@ -265,5 +265,5 @@ this.pointer = null; | ||
* @param {string} className Class name to search for. | ||
* @param {Element} [context] Optionally provide the context (scope) | ||
* @param {HTMLElement} [context] Optionally provide the context (scope) | ||
* for the query. Default is the main element of the class. | ||
* @return {Array.<Element>} An array which may or may not contain the element | ||
* @return {HTMLElement[]} An array which may or may not contain the element | ||
* which was searched for. | ||
@@ -278,4 +278,4 @@ */ | ||
* @param {string} className Class name to search for. | ||
* @param {Element} [context] Optinal scope for search. | ||
* @return {?Element} The element or null if it isn't found. | ||
* @param {HTMLElement} [context] Optinal scope for search. | ||
* @return {HTMLElement|null} The element or null if it isn't found. | ||
*/ | ||
@@ -638,3 +638,3 @@ getElementByClass(className, context) { | ||
* Retreives the cached carousel wrapper element. | ||
* @return {Element} | ||
* @return {HTMLElement} | ||
*/ | ||
@@ -647,3 +647,3 @@ getWrapper() { | ||
* Retreives the cached carousel element. | ||
* @return {Element} | ||
* @return {HTMLElement} | ||
*/ | ||
@@ -656,3 +656,3 @@ getCarouselElement() { | ||
* Returns the array of slides in the carousel. | ||
* @return {!Array.<!Element>} The slides array. | ||
* @return {!Array.<!HTMLElement>} The slides array. | ||
*/ | ||
@@ -666,3 +666,3 @@ getSlides() { | ||
* @param {number} index The logical index of the slide you want. | ||
* @return {Element} The slide element. | ||
* @return {HTMLElement} The slide element. | ||
*/ | ||
@@ -723,3 +723,2 @@ getSlide(index) { | ||
* or positive. For example, -2 or 2. | ||
* @param {number} length Length of the list. | ||
* @return {number} The index of the relative displacement, wrapping around | ||
@@ -729,7 +728,8 @@ * the end of the list to the start when the displacement is larger than | ||
*/ | ||
_getRelativeIndex(index, displacment) { | ||
return wrapAroundList(index, displacment, this._slides.length); | ||
_getRelativeIndex(index, displacement) { | ||
return wrapAroundList(index, displacement, this._slides.length); | ||
} | ||
/** | ||
* @param {number} index Index to test. | ||
* @return {boolean} Whether a given index is out of range of the carousel. | ||
@@ -741,2 +741,7 @@ */ | ||
/** | ||
* Constrain an index within bounds. | ||
* @param {number} index Index to clamp. | ||
* @return {number} | ||
*/ | ||
clampIndexToSlides(index) { | ||
@@ -780,4 +785,4 @@ return clamp(index, 0, this._slides.length - 1); | ||
* Retrieves the slide children. | ||
* @param {Element=} optSlide Slide to look within. | ||
* @return {Array.<Element>} NodeList of slide children. | ||
* @param {HTMLElement} [optSlide] Slide to look within. | ||
* @return {HTMLElement[]} NodeList of slide children. | ||
* @private | ||
@@ -823,3 +828,3 @@ */ | ||
* Gets the slide positions (offsets from the left|top) array. | ||
* @param {Array.<Element>} slideSet the slides array. | ||
* @param {HTMLElement[]} slideSet the slides array. | ||
* @return {Array.<number>} array of slide positions. | ||
@@ -875,3 +880,3 @@ * @private | ||
* Gets the adjusted position. | ||
* @param {Element} destinationSlide The slide the carousel is headed to. | ||
* @param {HTMLElement} destinationSlide The slide the carousel is headed to. | ||
* @return {number} The position it is. | ||
@@ -909,3 +914,3 @@ * @private | ||
* Adjust the destination position again if there are slide children. | ||
* @param {Element} destinationSlide Slide element. | ||
* @param {HTMLElement} destinationSlide Slide element. | ||
* @param {number} destinationPosition Where the slide would initially go. | ||
@@ -1264,12 +1269,12 @@ * @param {number} carouselSize Width or height of the carousel element. | ||
* @param {!number} domIndex The slide index relative to DOM order. | ||
* @param {boolean=} optNoAnimation Whether going to the slide should animate. | ||
* @param {boolean} [noAnimation] Whether going to the slide should animate. | ||
* @protected | ||
*/ | ||
fadeToSlide(domIndex, optNoAnimation) { | ||
fadeToSlide(domIndex, noAnimation) { | ||
// Get next and previous slides. | ||
const nextSlide = this.getSlide(domIndex, true); | ||
const previousSlide = this.getSlide(this.domIndex, true); | ||
const nextSlide = this.getSlide(domIndex); | ||
const previousSlide = this.getSlide(this.domIndex); | ||
// Listen for transitionend if it will animate. | ||
if (!optNoAnimation) { | ||
if (!noAnimation) { | ||
// Going to a new slide, wait for callback. | ||
@@ -1299,3 +1304,3 @@ this._transitionId = onTransitionEnd(nextSlide, this._transitionDone, this); | ||
// Emit event for slide start. | ||
if (!optNoAnimation) { | ||
if (!noAnimation) { | ||
this._toNewSlide(); | ||
@@ -1308,6 +1313,6 @@ } | ||
* @param {!number} domIndex The slide index relative to DOM order. | ||
* @param {boolean=} optNoAnimation Whether going to the slide should animate. | ||
* @param {boolean} [noAnimation] Whether going to the slide should animate. | ||
* @protected | ||
*/ | ||
goToSlide(domIndex, optNoAnimation) { | ||
goToSlide(domIndex, noAnimation) { | ||
// Get the destion slide element from the current DOM order. | ||
@@ -1319,3 +1324,3 @@ const destinationSlide = this.getSlide(this._getLogicalIndex(domIndex)); | ||
// the DOM index of the carousel changes. | ||
const updatedDomIndex = this._maybeSetJumpedSlides(domIndex, optNoAnimation); | ||
const updatedDomIndex = this._maybeSetJumpedSlides(domIndex, noAnimation); | ||
@@ -1331,3 +1336,3 @@ // The position the container will go to. | ||
// the slide start event if the carousel element will move with animation. | ||
this._moveToPosition(adjustedPosition, optNoAnimation); | ||
this._moveToPosition(adjustedPosition, noAnimation); | ||
} | ||
@@ -1340,8 +1345,8 @@ | ||
* the carousel to go to. | ||
* @param {boolean=} optNoAnimation Optional skip the animation in goToSlide. | ||
* @param {boolean} [noAnimation] Optional skip the animation in goToSlide. | ||
* @return {boolean} Whether the carousel will go to the specified slide. | ||
*/ | ||
setSelectedIndex(index, optNoAnimation) { | ||
setSelectedIndex(index, noAnimation) { | ||
let domIndex = this._getDomIndex(index); | ||
const canNavigate = this._canNavigate(domIndex, optNoAnimation); | ||
const canNavigate = this._canNavigate(domIndex, noAnimation); | ||
@@ -1368,5 +1373,5 @@ // Will go the the give slide. | ||
if (this.options.isFade) { | ||
this.fadeToSlide(domIndex, optNoAnimation); | ||
this.fadeToSlide(domIndex, noAnimation); | ||
} else { | ||
this.goToSlide(domIndex, optNoAnimation); | ||
this.goToSlide(domIndex, noAnimation); | ||
} | ||
@@ -1381,3 +1386,3 @@ } | ||
* Find the nearest slide, and move the carousel to that. | ||
* @param {boolean} isNext Whether it should go to the nearest slide, but | ||
* @param {boolean} [isNext] Whether it should go to the nearest slide, but | ||
* only in the next direction. False means it should go previous and | ||
@@ -1659,2 +1664,9 @@ * anything not true or false will go to the nearest slide regardless | ||
/** | ||
* Decide what to do after the user drags the carousel. | ||
* @param {Coordinate} velocity Velocity for x and y directions. | ||
* @param {OdoPointer.Direction} direction Drag direction. | ||
* @param {boolean} didMoveOnAxis Whether the drag direction was on the defined axis. | ||
* @protected | ||
*/ | ||
navigateAfterDrag(velocity, direction, didMoveOnAxis) { | ||
@@ -1800,2 +1812,3 @@ const hasVelocity = this.hasDragged && this.draggable.pointer.hasVelocity(velocity); | ||
Carousel.template = templateEngine; | ||
Carousel.CarouselEvent = CarouselEvent; | ||
@@ -1802,0 +1815,0 @@ // Export for testing. |
@@ -5,23 +5,25 @@ /** | ||
* | ||
* Usage: | ||
* template("Today is {{ day }}", { | ||
* day: 'Friday' | ||
* }); // "Today is Friday" | ||
* @example | ||
* // "Today is Thursday" | ||
* template("Today is {{ day }}", { | ||
* day: 'Thursday', | ||
* }); | ||
* | ||
* template("Today is {{ month.day }}", { | ||
* month: { | ||
* day: "Friday" | ||
* } | ||
* }); // "Today is Friday | ||
* // "Today is Friday" | ||
* template("Today is {{ month.day }}", { | ||
* month: { | ||
* day: 'Friday', | ||
* }, | ||
* }); | ||
* | ||
* template("Today is {{ day }}", { | ||
* dayOfTheWeek: 'Friday', | ||
* day: function() { | ||
* return this.dayOfTheWeek; | ||
* } | ||
* }); // "Today is Friday" | ||
* // "Today is Saturday" | ||
* template("Today is {{ day }}", { | ||
* today: 'Saturday', | ||
* day() { | ||
* return this.today; | ||
* }, | ||
* }); | ||
* | ||
* | ||
* @param {string} str Template. | ||
* @param {Object} data Data object with keys which match your template. | ||
* @param {object} data Data object with keys which match your template. | ||
* @return {string} | ||
@@ -28,0 +30,0 @@ */ |
@@ -0,1 +1,6 @@ | ||
/** | ||
* Parse the transform matrix into x and y translation values. | ||
* @param {string} str Transform matrix, or "none". | ||
* @return {{ x: number, y: number}} | ||
*/ | ||
export function getTranslate(str) { | ||
@@ -2,0 +7,0 @@ // If no transform is set, the computed transform will be "none". |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
529138
17
5774
Updated@odopod/odo-device@^1.2.0
Updated@odopod/odo-draggable@^1.2.0
Updated@odopod/odo-helpers@^2.0.1
Updated@odopod/odo-pointer@^1.2.0