swiper.js 33KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871
  1. /**
  2. * Adopted from Swiper
  3. * Most modern mobile touch slider and framework with hardware
  4. * accelerated transitions.
  5. *
  6. * http://www.idangero.us/swiper/
  7. *
  8. * Copyright 2016, Vladimir Kharlampidi
  9. * The iDangero.us
  10. * http://www.idangero.us/
  11. *
  12. * Licensed under MIT
  13. */
  14. (function (factory) {
  15. if (typeof module === "object" && typeof module.exports === "object") {
  16. var v = factory(require, exports);
  17. if (v !== undefined) module.exports = v;
  18. }
  19. else if (typeof define === "function" && define.amd) {
  20. define(["require", "exports", "./swiper-utils", "./swiper-transition", "./swiper-progress", "./swiper-classes", "./swiper-parallax", "./swiper-index", "./swiper-effects", "./swiper-pagination", "./swiper-zoom"], factory);
  21. }
  22. })(function (require, exports) {
  23. "use strict";
  24. Object.defineProperty(exports, "__esModule", { value: true });
  25. var swiper_utils_1 = require("./swiper-utils");
  26. var swiper_transition_1 = require("./swiper-transition");
  27. var swiper_progress_1 = require("./swiper-progress");
  28. var swiper_classes_1 = require("./swiper-classes");
  29. var swiper_parallax_1 = require("./swiper-parallax");
  30. var swiper_index_1 = require("./swiper-index");
  31. var swiper_effects_1 = require("./swiper-effects");
  32. var swiper_pagination_1 = require("./swiper-pagination");
  33. var swiper_zoom_1 = require("./swiper-zoom");
  34. function initSwiper(s, plt) {
  35. // Classname
  36. s._classNames = [];
  37. /*=========================
  38. Preparation - Define Container, Wrapper and Pagination
  39. ===========================*/
  40. if (!s.container) {
  41. return;
  42. }
  43. // Save instance in container HTML Element and in data
  44. s.container.swiper = s;
  45. var containerModifierClass = swiper_utils_1.CLS.containerModifier;
  46. s._classNames.push(containerModifierClass + s.direction);
  47. if (s.freeMode) {
  48. s._classNames.push(containerModifierClass + 'free-mode');
  49. }
  50. if (s.autoHeight) {
  51. s._classNames.push(containerModifierClass + 'autoheight');
  52. }
  53. // Enable slides progress when required
  54. if (s.parallax || s.watchSlidesVisibility) {
  55. s.watchSlidesProgress = true;
  56. }
  57. // Max resistance when touchReleaseOnEdges
  58. if (s.touchReleaseOnEdges) {
  59. s.resistanceRatio = 0;
  60. }
  61. var effect = s.effect;
  62. // Coverflow / 3D
  63. if (['cube', 'coverflow', 'flip'].indexOf(effect) >= 0) {
  64. s.watchSlidesProgress = true;
  65. s._classNames.push(containerModifierClass + '3d');
  66. }
  67. if (effect !== 'slide') {
  68. s._classNames.push(containerModifierClass + effect);
  69. }
  70. if (effect === 'cube') {
  71. s.resistanceRatio = 0;
  72. s.slidesPerView = 1;
  73. s.slidesPerColumn = 1;
  74. s.slidesPerGroup = 1;
  75. s.centeredSlides = false;
  76. s.spaceBetween = 0;
  77. s.virtualTranslate = true;
  78. s.setWrapperSize = false;
  79. }
  80. if (effect === 'fade' || effect === 'flip') {
  81. s.slidesPerView = 1;
  82. s.slidesPerColumn = 1;
  83. s.slidesPerGroup = 1;
  84. s.watchSlidesProgress = true;
  85. s.spaceBetween = 0;
  86. s.setWrapperSize = false;
  87. s.virtualTranslate = true;
  88. }
  89. // Wrapper
  90. s._wrapper = s.container.querySelector('.' + swiper_utils_1.CLS.wrapper);
  91. // Pagination
  92. if (s.paginationType) {
  93. s._paginationContainer = s.container.querySelector('.swiper-pagination');
  94. if (s.paginationType === 'bullets') {
  95. s._paginationContainer.classList.add(swiper_utils_1.CLS.paginationModifier + 'clickable');
  96. }
  97. s._paginationContainer.classList.add(swiper_utils_1.CLS.paginationModifier + s.paginationType);
  98. }
  99. // Next/Prev Buttons
  100. // if (s.nextButton || s.prevButton) {
  101. // if (s.nextButton) {
  102. // s.nextButton = <any>s.container.closest('ion-content').querySelector(s.nextButton);
  103. // }
  104. // if (s.prevButton) {
  105. // s.prevButton = <any>s.container.closest('ion-content').querySelector(s.prevButton);
  106. // }
  107. // }
  108. // RTL
  109. s._rtl = swiper_utils_1.isHorizontal(s) && (s.container.dir.toLowerCase() === 'rtl' || s.container.style.direction === 'rtl');
  110. if (s._rtl) {
  111. s._classNames.push(containerModifierClass + 'rtl');
  112. }
  113. // Columns
  114. if (s.slidesPerColumn > 1) {
  115. s._classNames.push(containerModifierClass + 'multirow');
  116. }
  117. // Check for Android
  118. if (plt.is('android')) {
  119. s._classNames.push(containerModifierClass + 'android');
  120. }
  121. // Add classes
  122. s._classNames.forEach(function (clsName) {
  123. s.container.classList.add(clsName);
  124. });
  125. // Translate
  126. s._translate = 0;
  127. // Progress
  128. s.progress = 0;
  129. // Velocity
  130. s.velocity = 0;
  131. /*=========================
  132. Autoplay
  133. ===========================*/
  134. s._autoplayTimeoutId = undefined;
  135. s._autoplaying = false;
  136. s._autoplayPaused = false;
  137. s._allowClick = true;
  138. // Animating Flag
  139. s._animating = false;
  140. // Touches information
  141. s._touches = {
  142. startX: 0,
  143. startY: 0,
  144. currentX: 0,
  145. currentY: 0,
  146. diff: 0
  147. };
  148. if (s.loop) {
  149. createLoop(s);
  150. }
  151. updateContainerSize(s, plt);
  152. updateSlidesSize(s, plt);
  153. swiper_pagination_1.updatePagination(s);
  154. if (effect !== 'slide' && swiper_effects_1.SWIPER_EFFECTS[effect]) {
  155. if (!s.loop) {
  156. swiper_progress_1.updateProgress(s);
  157. }
  158. swiper_effects_1.SWIPER_EFFECTS[effect].setTranslate(s, plt);
  159. }
  160. if (s.loop) {
  161. slideTo(s, plt, s.initialSlide + s.loopedSlides, 0, s.runCallbacksOnInit);
  162. }
  163. else {
  164. slideTo(s, plt, s.initialSlide, 0, s.runCallbacksOnInit);
  165. if (s.initialSlide === 0) {
  166. swiper_parallax_1.parallaxSetTranslate(s);
  167. }
  168. }
  169. if (s.autoplay) {
  170. startAutoplay(s, plt);
  171. }
  172. }
  173. exports.initSwiper = initSwiper;
  174. /*=========================
  175. Autoplay
  176. ===========================*/
  177. function autoplay(s, plt) {
  178. var autoplayDelay = s.autoplay;
  179. var activeSlide = s._slides[s._activeIndex];
  180. if (activeSlide.hasAttribute('data-swiper-autoplay')) {
  181. autoplayDelay = (activeSlide.getAttribute('data-swiper-autoplay') || s.autoplay);
  182. }
  183. s._autoplayTimeoutId = plt.timeout(function () {
  184. s._zone.run(function () {
  185. if (s.loop) {
  186. fixLoop(s, plt);
  187. slideNext(s, plt, true, undefined, true);
  188. s.ionSlideAutoplay.emit(s);
  189. }
  190. else {
  191. if (!s._isEnd) {
  192. slideNext(s, plt, true, undefined, true);
  193. s.ionSlideAutoplay.emit(s);
  194. }
  195. else {
  196. if (!s.autoplayStopOnLast) {
  197. slideTo(s, plt, 0);
  198. s.ionSlideAutoplay.emit(s);
  199. }
  200. else {
  201. stopAutoplay(s);
  202. }
  203. }
  204. }
  205. });
  206. }, autoplayDelay);
  207. }
  208. function startAutoplay(s, plt) {
  209. if (typeof s._autoplayTimeoutId !== 'undefined')
  210. return false;
  211. if (!s.autoplay || s._autoplaying) {
  212. return false;
  213. }
  214. s._autoplaying = true;
  215. s._zone.run(function () {
  216. s.ionSlideAutoplayStart.emit(s);
  217. });
  218. autoplay(s, plt);
  219. }
  220. exports.startAutoplay = startAutoplay;
  221. function stopAutoplay(s) {
  222. if (!s._autoplayTimeoutId)
  223. return;
  224. if (s._autoplayTimeoutId)
  225. clearTimeout(s._autoplayTimeoutId);
  226. s._autoplaying = false;
  227. s._autoplayTimeoutId = undefined;
  228. s._zone.run(function () {
  229. s.ionSlideAutoplayStop.emit(s);
  230. });
  231. }
  232. exports.stopAutoplay = stopAutoplay;
  233. function pauseAutoplay(s, plt, speed) {
  234. if (s._autoplayPaused)
  235. return;
  236. if (s._autoplayTimeoutId)
  237. clearTimeout(s._autoplayTimeoutId);
  238. s._autoplayPaused = true;
  239. if (speed === 0) {
  240. s._autoplayPaused = false;
  241. autoplay(s, plt);
  242. }
  243. else {
  244. plt.transitionEnd(s._wrapper, function () {
  245. if (!s)
  246. return;
  247. s._autoplayPaused = false;
  248. if (!s._autoplaying) {
  249. stopAutoplay(s);
  250. }
  251. else {
  252. autoplay(s, plt);
  253. }
  254. });
  255. }
  256. }
  257. exports.pauseAutoplay = pauseAutoplay;
  258. /*=========================
  259. Slider/slides sizes
  260. ===========================*/
  261. function updateAutoHeight(s) {
  262. var activeSlides = [];
  263. var newHeight = 0;
  264. var i;
  265. // Find slides currently in view
  266. if (s.slidesPerView !== 'auto' && s.slidesPerView > 1) {
  267. for (i = 0; i < Math.ceil(s.slidesPerView); i++) {
  268. var index = s._activeIndex + i;
  269. if (index > s._slides.length)
  270. break;
  271. activeSlides.push(s._slides[index]);
  272. }
  273. }
  274. else {
  275. activeSlides.push(s._slides[s._activeIndex]);
  276. }
  277. // Find new height from heighest slide in view
  278. for (i = 0; i < activeSlides.length; i++) {
  279. if (typeof activeSlides[i] !== 'undefined') {
  280. var height = activeSlides[i].offsetHeight;
  281. newHeight = height > newHeight ? height : newHeight;
  282. }
  283. }
  284. // Update Height
  285. if (newHeight) {
  286. s._wrapper.style.height = newHeight + 'px';
  287. }
  288. }
  289. exports.updateAutoHeight = updateAutoHeight;
  290. function updateContainerSize(s, plt) {
  291. var container = s.container;
  292. var width;
  293. var height;
  294. if (typeof s.width !== 'undefined') {
  295. // manually assign user width
  296. width = s.width;
  297. }
  298. else {
  299. width = container.clientWidth;
  300. }
  301. if (typeof s.renderedHeight !== 'undefined') {
  302. // manually assign user height
  303. height = s.renderedHeight;
  304. }
  305. else {
  306. height = container.clientHeight;
  307. }
  308. if (width === 0 && swiper_utils_1.isHorizontal(s) || height === 0 && !swiper_utils_1.isHorizontal(s)) {
  309. return;
  310. }
  311. // Subtract paddings
  312. var containerStyles = plt.getElementComputedStyle(container);
  313. width = width - parseInt(containerStyles.paddingLeft, 10) - parseInt(containerStyles.paddingRight, 10);
  314. height = height - parseInt(containerStyles.paddingTop, 10) - parseInt(containerStyles.paddingBottom, 10);
  315. // Store values
  316. s.renderedWidth = width;
  317. s.renderedHeight = height;
  318. s._renderedSize = swiper_utils_1.isHorizontal(s) ? width : height;
  319. }
  320. exports.updateContainerSize = updateContainerSize;
  321. function updateSlidesSize(s, plt) {
  322. s._slides = s._wrapper.querySelectorAll('.' + swiper_utils_1.CLS.slide);
  323. s._snapGrid = [];
  324. s._slidesGrid = [];
  325. s._slidesSizesGrid = [];
  326. var spaceBetween = s.spaceBetween;
  327. var slidePosition = -s.slidesOffsetBefore;
  328. var i;
  329. var prevSlideSize = 0;
  330. var index = 0;
  331. if (typeof s._renderedSize === 'undefined')
  332. return;
  333. if (typeof spaceBetween === 'string' && spaceBetween.indexOf('%') >= 0) {
  334. spaceBetween = parseFloat(spaceBetween.replace('%', '')) / 100 * s._renderedSize;
  335. }
  336. s._virtualSize = -spaceBetween;
  337. // reset margins
  338. if (s._rtl) {
  339. swiper_utils_1.inlineStyle(s._slides, { marginLeft: '', marginTop: '' });
  340. }
  341. else {
  342. swiper_utils_1.inlineStyle(s._slides, { marginRight: '', marginBottom: '' });
  343. }
  344. var slidesNumberEvenToRows;
  345. if (s.slidesPerColumn > 1) {
  346. if (Math.floor(s._slides.length / s.slidesPerColumn) === s._slides.length / s.slidesPerColumn) {
  347. slidesNumberEvenToRows = s._slides.length;
  348. }
  349. else {
  350. slidesNumberEvenToRows = Math.ceil(s._slides.length / s.slidesPerColumn) * s.slidesPerColumn;
  351. }
  352. if (s.slidesPerView !== 'auto' && s.slidesPerColumnFill === 'row') {
  353. slidesNumberEvenToRows = Math.max(slidesNumberEvenToRows, s.slidesPerView * s.slidesPerColumn);
  354. }
  355. }
  356. // Calc slides
  357. var slideSize;
  358. var slidesPerColumn = s.slidesPerColumn;
  359. var slidesPerRow = slidesNumberEvenToRows / slidesPerColumn;
  360. var numFullColumns = slidesPerRow - (s.slidesPerColumn * slidesPerRow - s._slides.length);
  361. for (i = 0; i < s._slides.length; i++) {
  362. slideSize = 0;
  363. var slide = s._slides[i];
  364. if (s.slidesPerColumn > 1) {
  365. // Set slides order
  366. var newSlideOrderIndex;
  367. var column;
  368. var row;
  369. if (s.slidesPerColumnFill === 'column') {
  370. column = Math.floor(i / slidesPerColumn);
  371. row = i - column * slidesPerColumn;
  372. if (column > numFullColumns || (column === numFullColumns && row === slidesPerColumn - 1)) {
  373. if (++row >= slidesPerColumn) {
  374. row = 0;
  375. column++;
  376. }
  377. }
  378. newSlideOrderIndex = column + row * slidesNumberEvenToRows / slidesPerColumn;
  379. swiper_utils_1.inlineStyle(slide, {
  380. '-webkit-box-ordinal-group': newSlideOrderIndex,
  381. '-moz-box-ordinal-group': newSlideOrderIndex,
  382. '-ms-flex-order': newSlideOrderIndex,
  383. '-webkit-order': newSlideOrderIndex,
  384. 'order': newSlideOrderIndex
  385. });
  386. }
  387. else {
  388. row = Math.floor(i / slidesPerRow);
  389. column = i - row * slidesPerRow;
  390. }
  391. var cssVal = (row !== 0 && s.spaceBetween) && (s.spaceBetween + 'px');
  392. var cssObj = {};
  393. if (swiper_utils_1.isHorizontal(s)) {
  394. cssObj['marginTop'] = cssVal;
  395. }
  396. else {
  397. cssObj['marginLeft'] = cssVal;
  398. }
  399. swiper_utils_1.inlineStyle(slide, cssObj);
  400. slide.setAttribute('data-swiper-column', column);
  401. slide.setAttribute('data-swiper-row', row);
  402. }
  403. if (slide.style.display === 'none') {
  404. continue;
  405. }
  406. if (s.slidesPerView === 'auto') {
  407. var styles = plt.getElementComputedStyle(slide);
  408. if (swiper_utils_1.isHorizontal(s)) {
  409. slideSize = slide.offsetWidth + parseFloat(styles.marginRight) + parseFloat(styles.marginLeft);
  410. }
  411. else {
  412. slideSize = slide.offsetHeight + parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
  413. }
  414. if (s.roundLengths)
  415. slideSize = swiper_utils_1.round(slideSize);
  416. }
  417. else {
  418. slideSize = (s._renderedSize - (s.slidesPerView - 1) * spaceBetween) / s.slidesPerView;
  419. if (s.roundLengths)
  420. slideSize = swiper_utils_1.round(slideSize);
  421. if (swiper_utils_1.isHorizontal(s)) {
  422. s._slides[i].style.width = slideSize + 'px';
  423. }
  424. else {
  425. s._slides[i].style.height = slideSize + 'px';
  426. }
  427. }
  428. s._slides[i].swiperSlideSize = slideSize;
  429. s._slidesSizesGrid.push(slideSize);
  430. if (s.centeredSlides) {
  431. slidePosition = slidePosition + slideSize / 2 + prevSlideSize / 2 + spaceBetween;
  432. if (i === 0)
  433. slidePosition = slidePosition - s._renderedSize / 2 - spaceBetween;
  434. if (Math.abs(slidePosition) < 1 / 1000)
  435. slidePosition = 0;
  436. if ((index) % s.slidesPerGroup === 0)
  437. s._snapGrid.push(slidePosition);
  438. s._slidesGrid.push(slidePosition);
  439. }
  440. else {
  441. if ((index) % s.slidesPerGroup === 0)
  442. s._snapGrid.push(slidePosition);
  443. s._slidesGrid.push(slidePosition);
  444. slidePosition = slidePosition + slideSize + spaceBetween;
  445. }
  446. s._virtualSize += slideSize + spaceBetween;
  447. prevSlideSize = slideSize;
  448. index++;
  449. }
  450. s._virtualSize = Math.max(s._virtualSize, s._renderedSize) + s.slidesOffsetAfter;
  451. var newSlidesGrid;
  452. if (s._rtl && (s.effect === 'slide' || s.effect === 'coverflow')) {
  453. swiper_utils_1.inlineStyle(s._wrapper, { width: s._virtualSize + s.spaceBetween + 'px' });
  454. }
  455. if (s.setWrapperSize) {
  456. if (swiper_utils_1.isHorizontal(s)) {
  457. swiper_utils_1.inlineStyle(s._wrapper, { width: s._virtualSize + s.spaceBetween + 'px' });
  458. }
  459. else {
  460. swiper_utils_1.inlineStyle(s._wrapper, { height: s._virtualSize + s.spaceBetween + 'px' });
  461. }
  462. }
  463. if (s.slidesPerColumn > 1) {
  464. s._virtualSize = (slideSize + s.spaceBetween) * slidesNumberEvenToRows;
  465. s._virtualSize = Math.ceil(s._virtualSize / s.slidesPerColumn) - s.spaceBetween;
  466. if (swiper_utils_1.isHorizontal(s)) {
  467. swiper_utils_1.inlineStyle(s._wrapper, { width: s._virtualSize + s.spaceBetween + 'px' });
  468. }
  469. else {
  470. swiper_utils_1.inlineStyle(s._wrapper, { height: s._virtualSize + s.spaceBetween + 'px' });
  471. }
  472. if (s.centeredSlides) {
  473. newSlidesGrid = [];
  474. for (i = 0; i < s._snapGrid.length; i++) {
  475. if (s._snapGrid[i] < s._virtualSize + s._snapGrid[0])
  476. newSlidesGrid.push(s._snapGrid[i]);
  477. }
  478. s._snapGrid = newSlidesGrid;
  479. }
  480. }
  481. // Remove last grid elements depending on width
  482. if (!s.centeredSlides) {
  483. newSlidesGrid = [];
  484. for (i = 0; i < s._snapGrid.length; i++) {
  485. if (s._snapGrid[i] <= s._virtualSize - s._renderedSize) {
  486. newSlidesGrid.push(s._snapGrid[i]);
  487. }
  488. }
  489. s._snapGrid = newSlidesGrid;
  490. if (Math.floor(s._virtualSize - s._renderedSize) - Math.floor(s._snapGrid[s._snapGrid.length - 1]) > 1) {
  491. s._snapGrid.push(s._virtualSize - s._renderedSize);
  492. }
  493. }
  494. if (s._snapGrid.length === 0)
  495. s._snapGrid = [0];
  496. if (s.spaceBetween !== 0) {
  497. if (swiper_utils_1.isHorizontal(s)) {
  498. if (s._rtl) {
  499. swiper_utils_1.inlineStyle(s._slides, { marginLeft: spaceBetween + 'px' });
  500. }
  501. else {
  502. swiper_utils_1.inlineStyle(s._slides, { marginRight: spaceBetween + 'px' });
  503. }
  504. }
  505. else {
  506. swiper_utils_1.inlineStyle(s._slides, { marginBottom: spaceBetween + 'px' });
  507. }
  508. }
  509. if (s.watchSlidesProgress) {
  510. swiper_utils_1.updateSlidesOffset(s);
  511. }
  512. }
  513. exports.updateSlidesSize = updateSlidesSize;
  514. /*=========================
  515. Dynamic Slides Per View
  516. ===========================*/
  517. function currentSlidesPerView(s) {
  518. var spv = 1;
  519. var i;
  520. var j;
  521. if (s.centeredSlides) {
  522. var size = s._slides[s._activeIndex].swiperSlideSize;
  523. var breakLoop;
  524. for (i = s._activeIndex + 1; i < s._slides.length; i++) {
  525. if (s._slides[i] && !breakLoop) {
  526. size += s._slides[i].swiperSlideSize;
  527. spv++;
  528. if (size > s._renderedSize)
  529. breakLoop = true;
  530. }
  531. }
  532. for (j = s._activeIndex - 1; j >= 0; j--) {
  533. if (s._slides[j] && !breakLoop) {
  534. size += s._slides[j].swiperSlideSize;
  535. spv++;
  536. if (size > s._renderedSize)
  537. breakLoop = true;
  538. }
  539. }
  540. }
  541. else {
  542. for (i = s._activeIndex + 1; i < s._slides.length; i++) {
  543. if (s._slidesGrid[i] - s._slidesGrid[s._activeIndex] < s._renderedSize) {
  544. spv++;
  545. }
  546. }
  547. }
  548. return spv;
  549. }
  550. exports.currentSlidesPerView = currentSlidesPerView;
  551. /*=========================
  552. Common update method
  553. ===========================*/
  554. function update(s, plt, updateTranslate) {
  555. if (!s)
  556. return;
  557. updateContainerSize(s, plt);
  558. updateSlidesSize(s, plt);
  559. swiper_progress_1.updateProgress(s);
  560. swiper_pagination_1.updatePagination(s);
  561. swiper_classes_1.updateClasses(s);
  562. if (s.zoom) {
  563. swiper_zoom_1.resetZoomEvents(s, plt);
  564. }
  565. var translated;
  566. var newTranslate;
  567. function forceSetTranslate() {
  568. newTranslate = Math.min(Math.max(s._translate, swiper_utils_1.maxTranslate(s)), swiper_utils_1.minTranslate(s));
  569. swiper_transition_1.setWrapperTranslate(s, plt, newTranslate);
  570. swiper_index_1.updateActiveIndex(s);
  571. swiper_classes_1.updateClasses(s);
  572. }
  573. if (updateTranslate) {
  574. if (s._spline) {
  575. s._spline = undefined;
  576. }
  577. if (s.freeMode) {
  578. forceSetTranslate();
  579. if (s.autoHeight) {
  580. updateAutoHeight(s);
  581. }
  582. }
  583. else {
  584. if ((s.slidesPerView === 'auto' || s.slidesPerView > 1) && s._isEnd && !s.centeredSlides) {
  585. translated = slideTo(s, plt, s._slides.length - 1, 0, false, true);
  586. }
  587. else {
  588. translated = slideTo(s, plt, s._activeIndex, 0, false, true);
  589. }
  590. if (!translated) {
  591. forceSetTranslate();
  592. }
  593. }
  594. }
  595. else if (s.autoHeight) {
  596. updateAutoHeight(s);
  597. }
  598. }
  599. exports.update = update;
  600. /*=========================
  601. Loop
  602. ===========================*/
  603. // Create looped slides
  604. function createLoop(s) {
  605. // Remove duplicated slides
  606. swiper_utils_1.eachChild(s._wrapper, '.' + swiper_utils_1.CLS.slide + '.' + swiper_utils_1.CLS.slideDuplicate, function (ele) {
  607. ele.parentElement.removeChild(ele);
  608. });
  609. var slides = s._wrapper.querySelectorAll('.' + swiper_utils_1.CLS.slide);
  610. if (s.slidesPerView === 'auto' && !s.loopedSlides) {
  611. s.loopedSlides = slides.length;
  612. }
  613. s.loopedSlides = parseInt((s.loopedSlides || s.slidesPerView), 10);
  614. s.loopedSlides = s.loopedSlides + s.loopAdditionalSlides;
  615. if (s.loopedSlides > slides.length) {
  616. s.loopedSlides = slides.length;
  617. }
  618. var prependSlides = [];
  619. var appendSlides = [];
  620. for (var i = 0; i < slides.length; i++) {
  621. var slide = slides[i];
  622. if (i < s.loopedSlides)
  623. appendSlides.push(slide);
  624. if (i < slides.length && i >= slides.length - s.loopedSlides)
  625. prependSlides.push(slide);
  626. slide.setAttribute('data-swiper-slide-index', i);
  627. }
  628. for (i = 0; i < appendSlides.length; i++) {
  629. var appendClone = appendSlides[i].cloneNode(true);
  630. swiper_utils_1.addClass(appendClone, swiper_utils_1.CLS.slideDuplicate);
  631. s._wrapper.appendChild(appendClone);
  632. }
  633. for (i = prependSlides.length - 1; i >= 0; i--) {
  634. var prependClone = prependSlides[i].cloneNode(true);
  635. swiper_utils_1.addClass(prependClone, swiper_utils_1.CLS.slideDuplicate);
  636. s._wrapper.insertBefore(prependClone, s._wrapper.firstElementChild);
  637. }
  638. }
  639. function destroyLoop(s) {
  640. swiper_utils_1.eachChild(s._wrapper, '.' + swiper_utils_1.CLS.slide + '.' + swiper_utils_1.CLS.slideDuplicate, function (ele) {
  641. ele.parentElement.removeChild(ele);
  642. });
  643. if (s._slides) {
  644. for (var i = 0; i < s._slides.length; i++) {
  645. s._slides[i].removeAttribute('data-swiper-slide-index');
  646. }
  647. }
  648. }
  649. function fixLoop(s, plt) {
  650. var newIndex;
  651. if (s._activeIndex < s.loopedSlides) {
  652. // Fix For Negative Oversliding
  653. newIndex = s._slides.length - s.loopedSlides * 3 + s._activeIndex;
  654. newIndex = newIndex + s.loopedSlides;
  655. slideTo(s, plt, newIndex, 0, false, true);
  656. }
  657. else if ((s.slidesPerView === 'auto' && s._activeIndex >= s.loopedSlides * 2) || (s._activeIndex > s._slides.length - s.slidesPerView * 2)) {
  658. // Fix For Positive Oversliding
  659. newIndex = -s._slides.length + s._activeIndex + s.loopedSlides;
  660. newIndex = newIndex + s.loopedSlides;
  661. slideTo(s, plt, newIndex, 0, false, true);
  662. }
  663. }
  664. exports.fixLoop = fixLoop;
  665. /*=========================
  666. Transitions
  667. ===========================*/
  668. function slideTo(s, plt, slideIndex, speed, runCallbacks, internal) {
  669. if (runCallbacks === void 0) { runCallbacks = true; }
  670. if (typeof slideIndex === 'undefined')
  671. slideIndex = 0;
  672. if (slideIndex < 0)
  673. slideIndex = 0;
  674. s._snapIndex = Math.floor(slideIndex / s.slidesPerGroup);
  675. if (s._snapIndex >= s._snapGrid.length)
  676. s._snapIndex = s._snapGrid.length - 1;
  677. var translate = -s._snapGrid[s._snapIndex];
  678. // Stop autoplay
  679. if (s.autoplay && s._autoplaying) {
  680. if (internal || !s.autoplayDisableOnInteraction) {
  681. pauseAutoplay(s, plt, speed);
  682. }
  683. else {
  684. stopAutoplay(s);
  685. }
  686. }
  687. // Update progress
  688. swiper_progress_1.updateProgress(s, translate);
  689. // Directions locks
  690. if (!s._allowSwipeToNext && translate < s._translate && translate < swiper_utils_1.minTranslate(s)) {
  691. return false;
  692. }
  693. if (!s._allowSwipeToPrev && translate > s._translate && translate > swiper_utils_1.maxTranslate(s)) {
  694. if ((s._activeIndex || 0) !== slideIndex)
  695. return false;
  696. }
  697. // Update Index
  698. if (typeof speed === 'undefined')
  699. speed = s.speed;
  700. s._previousIndex = s._activeIndex || 0;
  701. s._activeIndex = slideIndex;
  702. swiper_index_1.updateRealIndex(s);
  703. if ((s._rtl && -translate === s._translate) || (!s._rtl && translate === s._translate)) {
  704. // Update Height
  705. if (s.autoHeight) {
  706. updateAutoHeight(s);
  707. }
  708. swiper_classes_1.updateClasses(s);
  709. if (s.effect !== 'slide') {
  710. swiper_transition_1.setWrapperTranslate(s, plt, translate);
  711. }
  712. return false;
  713. }
  714. swiper_classes_1.updateClasses(s);
  715. onTransitionStart(s, runCallbacks);
  716. if (speed === 0) {
  717. swiper_transition_1.setWrapperTranslate(s, plt, translate);
  718. swiper_transition_1.setWrapperTransition(s, plt, 0);
  719. onTransitionEnd(s, plt, runCallbacks);
  720. }
  721. else {
  722. swiper_transition_1.setWrapperTranslate(s, plt, translate);
  723. swiper_transition_1.setWrapperTransition(s, plt, speed);
  724. if (!s._animating) {
  725. s._animating = true;
  726. plt.transitionEnd(s._wrapper, function () {
  727. if (!s)
  728. return;
  729. onTransitionEnd(s, plt, runCallbacks);
  730. });
  731. }
  732. }
  733. return true;
  734. }
  735. exports.slideTo = slideTo;
  736. function onTransitionStart(s, runCallbacks) {
  737. if (runCallbacks === void 0) { runCallbacks = true; }
  738. if (s.autoHeight) {
  739. updateAutoHeight(s);
  740. }
  741. if (runCallbacks) {
  742. s._zone.run(function () {
  743. s.ionSlideTransitionStart.emit(s);
  744. if (s._activeIndex !== s._previousIndex) {
  745. s.ionSlideWillChange.emit(s);
  746. if (s._activeIndex > s._previousIndex) {
  747. s.ionSlideNextStart.emit(s);
  748. }
  749. else {
  750. s.ionSlidePrevStart.emit(s);
  751. }
  752. }
  753. });
  754. }
  755. }
  756. exports.onTransitionStart = onTransitionStart;
  757. function onTransitionEnd(s, plt, runCallbacks) {
  758. if (runCallbacks === void 0) { runCallbacks = true; }
  759. s._animating = false;
  760. swiper_transition_1.setWrapperTransition(s, plt, 0);
  761. if (runCallbacks) {
  762. s._zone.run(function () {
  763. s.ionSlideTransitionEnd.emit(s);
  764. if (s._activeIndex !== s._previousIndex) {
  765. s.ionSlideDidChange.emit(s);
  766. if (s._activeIndex > s._previousIndex) {
  767. s.ionSlideNextEnd.emit(s);
  768. }
  769. else {
  770. s.ionSlidePrevEnd.emit(s);
  771. }
  772. }
  773. });
  774. }
  775. }
  776. exports.onTransitionEnd = onTransitionEnd;
  777. function slideNext(s, plt, runCallbacks, speed, internal) {
  778. if (s.loop) {
  779. if (s._animating)
  780. return false;
  781. fixLoop(s, plt);
  782. s.container.clientLeft;
  783. return slideTo(s, plt, s._activeIndex + s.slidesPerGroup, speed, runCallbacks, internal);
  784. }
  785. var nextSlide = s._activeIndex + s.slidesPerGroup;
  786. if (nextSlide < s._slides.length) {
  787. return slideTo(s, plt, nextSlide, speed, runCallbacks, internal);
  788. }
  789. return false;
  790. }
  791. exports.slideNext = slideNext;
  792. function slidePrev(s, plt, runCallbacks, speed, internal) {
  793. if (s.loop) {
  794. if (s._animating)
  795. return false;
  796. fixLoop(s, plt);
  797. s.container.clientLeft;
  798. return slideTo(s, plt, s._activeIndex - 1, speed, runCallbacks, internal);
  799. }
  800. var previousSlide = s._activeIndex - 1;
  801. if (previousSlide >= 0) {
  802. return slideTo(s, plt, s._activeIndex - 1, speed, runCallbacks, internal);
  803. }
  804. return false;
  805. }
  806. exports.slidePrev = slidePrev;
  807. function slideReset(s, plt, runCallbacks, speed) {
  808. return slideTo(s, plt, s._activeIndex, speed, runCallbacks, true);
  809. }
  810. exports.slideReset = slideReset;
  811. function disableTouchControl(s) {
  812. s.onlyExternal = true;
  813. return true;
  814. }
  815. exports.disableTouchControl = disableTouchControl;
  816. function enableTouchControl(s) {
  817. s.onlyExternal = false;
  818. return true;
  819. }
  820. exports.enableTouchControl = enableTouchControl;
  821. /*=========================
  822. Translate/transition helpers
  823. ===========================*/
  824. // Cleanup dynamic styles
  825. function cleanupStyles(s) {
  826. if (!s.container || !s._wrapper) {
  827. // fix #10830
  828. return;
  829. }
  830. // Container
  831. if (s.container) {
  832. swiper_utils_1.removeClass(s.container, s._classNames);
  833. s.container.removeAttribute('style');
  834. }
  835. // Wrapper
  836. s._wrapper.removeAttribute('style');
  837. // Slides
  838. if (s._slides && s._slides.length) {
  839. swiper_utils_1.removeClass(s._slides, [
  840. swiper_utils_1.CLS.slideVisible,
  841. swiper_utils_1.CLS.slideActive,
  842. swiper_utils_1.CLS.slideNext,
  843. swiper_utils_1.CLS.slidePrev
  844. ]);
  845. for (var i = 0; i < s._slides.length; i++) {
  846. var slide = s._slides[i];
  847. slide.removeAttribute('style');
  848. slide.removeAttribute('data-swiper-column');
  849. slide.removeAttribute('data-swiper-row');
  850. }
  851. }
  852. // Pagination/Bullets
  853. swiper_utils_1.removeClass(s._bullets, swiper_utils_1.CLS.bulletActive);
  854. // Buttons
  855. swiper_utils_1.removeClass(s.prevButton, swiper_utils_1.CLS.buttonDisabled);
  856. swiper_utils_1.removeClass(s.nextButton, swiper_utils_1.CLS.buttonDisabled);
  857. }
  858. // Destroy
  859. function destroySwiper(s) {
  860. // Stop autoplay
  861. stopAutoplay(s);
  862. // Destroy loop
  863. if (s.loop) {
  864. destroyLoop(s);
  865. }
  866. // Cleanup styles
  867. cleanupStyles(s);
  868. }
  869. exports.destroySwiper = destroySwiper;
  870. });
  871. //# sourceMappingURL=swiper.js.map