diff options
author | Gleb Mazovetskiy <glex.spb@gmail.com> | 2017-09-11 17:23:33 +0300 |
---|---|---|
committer | Gleb Mazovetskiy <glex.spb@gmail.com> | 2017-09-11 17:23:33 +0300 |
commit | eb2e1a606e2c3324e7c511ba07c5ba0195801b00 (patch) | |
tree | 37c6441979f159dc13e6021fdc5322a42f374099 /assets/javascripts/bootstrap/carousel.js | |
parent | b12fdcd48c26cee905c3365626247f452fb941f2 (diff) |
rake update[v4-dev]
Diffstat (limited to 'assets/javascripts/bootstrap/carousel.js')
-rw-r--r-- | assets/javascripts/bootstrap/carousel.js | 597 |
1 files changed, 310 insertions, 287 deletions
diff --git a/assets/javascripts/bootstrap/carousel.js b/assets/javascripts/bootstrap/carousel.js index c657834..55444d0 100644 --- a/assets/javascripts/bootstrap/carousel.js +++ b/assets/javascripts/bootstrap/carousel.js @@ -1,3 +1,5 @@ +'use strict'; + var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var _createClass = function () { 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); @@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons * -------------------------------------------------------------------------- */ -var Carousel = function ($) { +var Carousel = function () { /** * ------------------------------------------------------------------------ @@ -83,14 +85,14 @@ var Carousel = function ($) { INDICATORS: '.carousel-indicators', DATA_SLIDE: '[data-slide], [data-slide-to]', DATA_RIDE: '[data-ride="carousel"]' + }; - /** - * ------------------------------------------------------------------------ - * Class Definition - * ------------------------------------------------------------------------ - */ + /** + * ------------------------------------------------------------------------ + * Class Definition + * ------------------------------------------------------------------------ + */ - }; var Carousel = function () { function Carousel(element, config) { _classCallCheck(this, Carousel); @@ -113,360 +115,381 @@ var Carousel = function ($) { // getters - // public + _createClass(Carousel, [{ + key: 'next', - Carousel.prototype.next = function next() { - if (!this._isSliding) { - this._slide(Direction.NEXT); - } - }; - Carousel.prototype.nextWhenVisible = function nextWhenVisible() { - // Don't call next when the page isn't visible - // or the carousel or its parent isn't visible - if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') { - this.next(); - } - }; + // public - Carousel.prototype.prev = function prev() { - if (!this._isSliding) { - this._slide(Direction.PREV); + value: function next() { + if (!this._isSliding) { + this._slide(Direction.NEXT); + } } - }; - - Carousel.prototype.pause = function pause(event) { - if (!event) { - this._isPaused = true; + }, { + key: 'nextWhenVisible', + value: function nextWhenVisible() { + // Don't call next when the page isn't visible + // or the carousel or its parent isn't visible + if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') { + this.next(); + } } - - if ($(this._element).find(Selector.NEXT_PREV)[0] && Util.supportsTransitionEnd()) { - Util.triggerTransitionEnd(this._element); - this.cycle(true); + }, { + key: 'prev', + value: function prev() { + if (!this._isSliding) { + this._slide(Direction.PREV); + } } + }, { + key: 'pause', + value: function pause(event) { + if (!event) { + this._isPaused = true; + } - clearInterval(this._interval); - this._interval = null; - }; - - Carousel.prototype.cycle = function cycle(event) { - if (!event) { - this._isPaused = false; - } + if ($(this._element).find(Selector.NEXT_PREV)[0] && Util.supportsTransitionEnd()) { + Util.triggerTransitionEnd(this._element); + this.cycle(true); + } - if (this._interval) { clearInterval(this._interval); this._interval = null; } + }, { + key: 'cycle', + value: function cycle(event) { + if (!event) { + this._isPaused = false; + } - if (this._config.interval && !this._isPaused) { - this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval); - } - }; - - Carousel.prototype.to = function to(index) { - var _this = this; - - this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0]; - - var activeIndex = this._getItemIndex(this._activeElement); - - if (index > this._items.length - 1 || index < 0) { - return; - } + if (this._interval) { + clearInterval(this._interval); + this._interval = null; + } - if (this._isSliding) { - $(this._element).one(Event.SLID, function () { - return _this.to(index); - }); - return; + if (this._config.interval && !this._isPaused) { + this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval); + } } + }, { + key: 'to', + value: function to(index) { + var _this = this; - if (activeIndex === index) { - this.pause(); - this.cycle(); - return; - } + this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0]; - var direction = index > activeIndex ? Direction.NEXT : Direction.PREV; + var activeIndex = this._getItemIndex(this._activeElement); - this._slide(direction, this._items[index]); - }; + if (index > this._items.length - 1 || index < 0) { + return; + } - Carousel.prototype.dispose = function dispose() { - $(this._element).off(EVENT_KEY); - $.removeData(this._element, DATA_KEY); + if (this._isSliding) { + $(this._element).one(Event.SLID, function () { + return _this.to(index); + }); + return; + } - this._items = null; - this._config = null; - this._element = null; - this._interval = null; - this._isPaused = null; - this._isSliding = null; - this._activeElement = null; - this._indicatorsElement = null; - }; + if (activeIndex === index) { + this.pause(); + this.cycle(); + return; + } - // private + var direction = index > activeIndex ? Direction.NEXT : Direction.PREV; - Carousel.prototype._getConfig = function _getConfig(config) { - config = $.extend({}, Default, config); - Util.typeCheckConfig(NAME, config, DefaultType); - return config; - }; + this._slide(direction, this._items[index]); + } + }, { + key: 'dispose', + value: function dispose() { + $(this._element).off(EVENT_KEY); + $.removeData(this._element, DATA_KEY); + + this._items = null; + this._config = null; + this._element = null; + this._interval = null; + this._isPaused = null; + this._isSliding = null; + this._activeElement = null; + this._indicatorsElement = null; + } - Carousel.prototype._addEventListeners = function _addEventListeners() { - var _this2 = this; + // private - if (this._config.keyboard) { - $(this._element).on(Event.KEYDOWN, function (event) { - return _this2._keydown(event); - }); + }, { + key: '_getConfig', + value: function _getConfig(config) { + config = $.extend({}, Default, config); + Util.typeCheckConfig(NAME, config, DefaultType); + return config; } + }, { + key: '_addEventListeners', + value: function _addEventListeners() { + var _this2 = this; - if (this._config.pause === 'hover') { - $(this._element).on(Event.MOUSEENTER, function (event) { - return _this2.pause(event); - }).on(Event.MOUSELEAVE, function (event) { - return _this2.cycle(event); - }); - if ('ontouchstart' in document.documentElement) { - // 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 - $(this._element).on(Event.TOUCHEND, function () { - _this2.pause(); - if (_this2.touchTimeout) { - clearTimeout(_this2.touchTimeout); - } - _this2.touchTimeout = setTimeout(function (event) { - return _this2.cycle(event); - }, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval); + if (this._config.keyboard) { + $(this._element).on(Event.KEYDOWN, function (event) { + return _this2._keydown(event); }); } - } - }; - Carousel.prototype._keydown = function _keydown(event) { - if (/input|textarea/i.test(event.target.tagName)) { - return; + if (this._config.pause === 'hover') { + $(this._element).on(Event.MOUSEENTER, function (event) { + return _this2.pause(event); + }).on(Event.MOUSELEAVE, function (event) { + return _this2.cycle(event); + }); + if ('ontouchstart' in document.documentElement) { + // 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 + $(this._element).on(Event.TOUCHEND, function () { + _this2.pause(); + if (_this2.touchTimeout) { + clearTimeout(_this2.touchTimeout); + } + _this2.touchTimeout = setTimeout(function (event) { + return _this2.cycle(event); + }, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval); + }); + } + } } - - switch (event.which) { - case ARROW_LEFT_KEYCODE: - event.preventDefault(); - this.prev(); - break; - case ARROW_RIGHT_KEYCODE: - event.preventDefault(); - this.next(); - break; - default: + }, { + key: '_keydown', + value: function _keydown(event) { + if (/input|textarea/i.test(event.target.tagName)) { return; + } + + switch (event.which) { + case ARROW_LEFT_KEYCODE: + event.preventDefault(); + this.prev(); + break; + case ARROW_RIGHT_KEYCODE: + event.preventDefault(); + this.next(); + break; + default: + return; + } } - }; - - Carousel.prototype._getItemIndex = function _getItemIndex(element) { - this._items = $.makeArray($(element).parent().find(Selector.ITEM)); - return this._items.indexOf(element); - }; - - Carousel.prototype._getItemByDirection = function _getItemByDirection(direction, activeElement) { - var isNextDirection = direction === Direction.NEXT; - var isPrevDirection = direction === Direction.PREV; - var activeIndex = this._getItemIndex(activeElement); - var lastItemIndex = this._items.length - 1; - var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex; - - if (isGoingToWrap && !this._config.wrap) { - return activeElement; + }, { + key: '_getItemIndex', + value: function _getItemIndex(element) { + this._items = $.makeArray($(element).parent().find(Selector.ITEM)); + return this._items.indexOf(element); } + }, { + key: '_getItemByDirection', + value: function _getItemByDirection(direction, activeElement) { + var isNextDirection = direction === Direction.NEXT; + var isPrevDirection = direction === Direction.PREV; + var activeIndex = this._getItemIndex(activeElement); + var lastItemIndex = this._items.length - 1; + var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex; + + if (isGoingToWrap && !this._config.wrap) { + return activeElement; + } - var delta = direction === Direction.PREV ? -1 : 1; - var itemIndex = (activeIndex + delta) % this._items.length; - - return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex]; - }; - - Carousel.prototype._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) { - var targetIndex = this._getItemIndex(relatedTarget); - var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]); - var slideEvent = $.Event(Event.SLIDE, { - relatedTarget: relatedTarget, - direction: eventDirectionName, - from: fromIndex, - to: targetIndex - }); + var delta = direction === Direction.PREV ? -1 : 1; + var itemIndex = (activeIndex + delta) % this._items.length; - $(this._element).trigger(slideEvent); + return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex]; + } + }, { + key: '_triggerSlideEvent', + value: function _triggerSlideEvent(relatedTarget, eventDirectionName) { + var targetIndex = this._getItemIndex(relatedTarget); + var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]); + var slideEvent = $.Event(Event.SLIDE, { + relatedTarget: relatedTarget, + direction: eventDirectionName, + from: fromIndex, + to: targetIndex + }); - return slideEvent; - }; + $(this._element).trigger(slideEvent); - Carousel.prototype._setActiveIndicatorElement = function _setActiveIndicatorElement(element) { - if (this._indicatorsElement) { - $(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE); + return slideEvent; + } + }, { + key: '_setActiveIndicatorElement', + value: function _setActiveIndicatorElement(element) { + if (this._indicatorsElement) { + $(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE); - var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)]; + var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)]; - if (nextIndicator) { - $(nextIndicator).addClass(ClassName.ACTIVE); + if (nextIndicator) { + $(nextIndicator).addClass(ClassName.ACTIVE); + } } } - }; - - Carousel.prototype._slide = function _slide(direction, element) { - var _this3 = this; - - var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0]; - var activeElementIndex = this._getItemIndex(activeElement); - var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement); - var nextElementIndex = this._getItemIndex(nextElement); - var isCycling = Boolean(this._interval); - - var directionalClassName = void 0; - var orderClassName = void 0; - var eventDirectionName = void 0; - - if (direction === Direction.NEXT) { - directionalClassName = ClassName.LEFT; - orderClassName = ClassName.NEXT; - eventDirectionName = Direction.LEFT; - } else { - directionalClassName = ClassName.RIGHT; - orderClassName = ClassName.PREV; - eventDirectionName = Direction.RIGHT; - } + }, { + key: '_slide', + value: function _slide(direction, element) { + var _this3 = this; + + var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0]; + var activeElementIndex = this._getItemIndex(activeElement); + var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement); + var nextElementIndex = this._getItemIndex(nextElement); + var isCycling = Boolean(this._interval); + + var directionalClassName = void 0; + var orderClassName = void 0; + var eventDirectionName = void 0; + + if (direction === Direction.NEXT) { + directionalClassName = ClassName.LEFT; + orderClassName = ClassName.NEXT; + eventDirectionName = Direction.LEFT; + } else { + directionalClassName = ClassName.RIGHT; + orderClassName = ClassName.PREV; + eventDirectionName = Direction.RIGHT; + } - if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) { - this._isSliding = false; - return; - } + if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) { + this._isSliding = false; + return; + } - var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName); - if (slideEvent.isDefaultPrevented()) { - return; - } + var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName); + if (slideEvent.isDefaultPrevented()) { + return; + } - if (!activeElement || !nextElement) { - // some weirdness is happening, so we bail - return; - } + if (!activeElement || !nextElement) { + // some weirdness is happening, so we bail + return; + } - this._isSliding = true; + this._isSliding = true; - if (isCycling) { - this.pause(); - } + if (isCycling) { + this.pause(); + } - this._setActiveIndicatorElement(nextElement); + this._setActiveIndicatorElement(nextElement); - var slidEvent = $.Event(Event.SLID, { - relatedTarget: nextElement, - direction: eventDirectionName, - from: activeElementIndex, - to: nextElementIndex - }); + var slidEvent = $.Event(Event.SLID, { + relatedTarget: nextElement, + direction: eventDirectionName, + from: activeElementIndex, + to: nextElementIndex + }); - if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) { + if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) { - $(nextElement).addClass(orderClassName); + $(nextElement).addClass(orderClassName); - Util.reflow(nextElement); + Util.reflow(nextElement); - $(activeElement).addClass(directionalClassName); - $(nextElement).addClass(directionalClassName); + $(activeElement).addClass(directionalClassName); + $(nextElement).addClass(directionalClassName); - $(activeElement).one(Util.TRANSITION_END, function () { - $(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE); + $(activeElement).one(Util.TRANSITION_END, function () { + $(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE); - $(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName); + $(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName); - _this3._isSliding = false; + _this3._isSliding = false; - setTimeout(function () { - return $(_this3._element).trigger(slidEvent); - }, 0); - }).emulateTransitionEnd(TRANSITION_DURATION); - } else { - $(activeElement).removeClass(ClassName.ACTIVE); - $(nextElement).addClass(ClassName.ACTIVE); + setTimeout(function () { + return $(_this3._element).trigger(slidEvent); + }, 0); + }).emulateTransitionEnd(TRANSITION_DURATION); + } else { + $(activeElement).removeClass(ClassName.ACTIVE); + $(nextElement).addClass(ClassName.ACTIVE); - this._isSliding = false; - $(this._element).trigger(slidEvent); - } + this._isSliding = false; + $(this._element).trigger(slidEvent); + } - if (isCycling) { - this.cycle(); + if (isCycling) { + this.cycle(); + } } - }; - // static + // static - Carousel._jQueryInterface = function _jQueryInterface(config) { - return this.each(function () { - var data = $(this).data(DATA_KEY); - var _config = $.extend({}, Default, $(this).data()); + }], [{ + key: '_jQueryInterface', + value: function _jQueryInterface(config) { + return this.each(function () { + var data = $(this).data(DATA_KEY); + var _config = $.extend({}, Default, $(this).data()); - if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') { - $.extend(_config, config); - } - - var action = typeof config === 'string' ? config : _config.slide; + if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') { + $.extend(_config, config); + } - if (!data) { - data = new Carousel(this, _config); - $(this).data(DATA_KEY, data); - } + var action = typeof config === 'string' ? config : _config.slide; - if (typeof config === 'number') { - data.to(config); - } else if (typeof action === 'string') { - if (data[action] === undefined) { - throw new Error('No method named "' + action + '"'); + if (!data) { + data = new Carousel(this, _config); + $(this).data(DATA_KEY, data); } - data[action](); - } else if (_config.interval) { - data.pause(); - data.cycle(); - } - }); - }; - - Carousel._dataApiClickHandler = function _dataApiClickHandler(event) { - var selector = Util.getSelectorFromElement(this); - if (!selector) { - return; + if (typeof config === 'number') { + data.to(config); + } else if (typeof action === 'string') { + if (typeof data[action] === 'undefined') { + throw new Error('No method named "' + action + '"'); + } + data[action](); + } else if (_config.interval) { + data.pause(); + data.cycle(); + } + }); } + }, { + key: '_dataApiClickHandler', + value: function _dataApiClickHandler(event) { + var selector = Util.getSelectorFromElement(this); - var target = $(selector)[0]; + if (!selector) { + return; + } - if (!target || !$(target).hasClass(ClassName.CAROUSEL)) { - return; - } + var target = $(selector)[0]; - var config = $.extend({}, $(target).data(), $(this).data()); - var slideIndex = this.getAttribute('data-slide-to'); + if (!target || !$(target).hasClass(ClassName.CAROUSEL)) { + return; + } - if (slideIndex) { - config.interval = false; - } + var config = $.extend({}, $(target).data(), $(this).data()); + var slideIndex = this.getAttribute('data-slide-to'); - Carousel._jQueryInterface.call($(target), config); + if (slideIndex) { + config.interval = false; + } - if (slideIndex) { - $(target).data(DATA_KEY).to(slideIndex); - } + Carousel._jQueryInterface.call($(target), config); - event.preventDefault(); - }; + if (slideIndex) { + $(target).data(DATA_KEY).to(slideIndex); + } - _createClass(Carousel, null, [{ + event.preventDefault(); + } + }, { key: 'VERSION', get: function get() { return VERSION; |