innerSliderUtils.js 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. // import supportsPassive from '../../../_util/supportsPassive';
  3. export function clamp(number, lowerBound, upperBound) {
  4. return Math.max(lowerBound, Math.min(number, upperBound));
  5. }
  6. export var safePreventDefault = function safePreventDefault(event) {
  7. var passiveEvents = ['touchstart', 'touchmove', 'wheel'];
  8. if (!passiveEvents.includes(event.type)) {
  9. event.preventDefault();
  10. }
  11. };
  12. export var getOnDemandLazySlides = function getOnDemandLazySlides(spec) {
  13. var onDemandSlides = [];
  14. var startIndex = lazyStartIndex(spec);
  15. var endIndex = lazyEndIndex(spec);
  16. for (var slideIndex = startIndex; slideIndex < endIndex; slideIndex++) {
  17. if (spec.lazyLoadedList.indexOf(slideIndex) < 0) {
  18. onDemandSlides.push(slideIndex);
  19. }
  20. }
  21. return onDemandSlides;
  22. };
  23. // return list of slides that need to be present
  24. export var getRequiredLazySlides = function getRequiredLazySlides(spec) {
  25. var requiredSlides = [];
  26. var startIndex = lazyStartIndex(spec);
  27. var endIndex = lazyEndIndex(spec);
  28. for (var slideIndex = startIndex; slideIndex < endIndex; slideIndex++) {
  29. requiredSlides.push(slideIndex);
  30. }
  31. return requiredSlides;
  32. };
  33. // startIndex that needs to be present
  34. export var lazyStartIndex = function lazyStartIndex(spec) {
  35. return spec.currentSlide - lazySlidesOnLeft(spec);
  36. };
  37. export var lazyEndIndex = function lazyEndIndex(spec) {
  38. return spec.currentSlide + lazySlidesOnRight(spec);
  39. };
  40. export var lazySlidesOnLeft = function lazySlidesOnLeft(spec) {
  41. return spec.centerMode ? Math.floor(spec.slidesToShow / 2) + (parseInt(spec.centerPadding) > 0 ? 1 : 0) : 0;
  42. };
  43. export var lazySlidesOnRight = function lazySlidesOnRight(spec) {
  44. return spec.centerMode ? Math.floor((spec.slidesToShow - 1) / 2) + 1 + (parseInt(spec.centerPadding) > 0 ? 1 : 0) : spec.slidesToShow;
  45. };
  46. // get width of an element
  47. export var getWidth = function getWidth(elem) {
  48. return elem && elem.offsetWidth || 0;
  49. };
  50. export var getHeight = function getHeight(elem) {
  51. return elem && elem.offsetHeight || 0;
  52. };
  53. export var getSwipeDirection = function getSwipeDirection(touchObject) {
  54. var verticalSwiping = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
  55. var swipeAngle;
  56. var xDist = touchObject.startX - touchObject.curX;
  57. var yDist = touchObject.startY - touchObject.curY;
  58. var r = Math.atan2(yDist, xDist);
  59. swipeAngle = Math.round(r * 180 / Math.PI);
  60. if (swipeAngle < 0) {
  61. swipeAngle = 360 - Math.abs(swipeAngle);
  62. }
  63. if (swipeAngle <= 45 && swipeAngle >= 0 || swipeAngle <= 360 && swipeAngle >= 315) {
  64. return 'left';
  65. }
  66. if (swipeAngle >= 135 && swipeAngle <= 225) {
  67. return 'right';
  68. }
  69. if (verticalSwiping === true) {
  70. if (swipeAngle >= 35 && swipeAngle <= 135) {
  71. return 'up';
  72. } else {
  73. return 'down';
  74. }
  75. }
  76. return 'vertical';
  77. };
  78. // whether or not we can go next
  79. export var canGoNext = function canGoNext(spec) {
  80. var canGo = true;
  81. if (!spec.infinite) {
  82. if (spec.centerMode && spec.currentSlide >= spec.slideCount - 1) {
  83. canGo = false;
  84. } else if (spec.slideCount <= spec.slidesToShow || spec.currentSlide >= spec.slideCount - spec.slidesToShow) {
  85. canGo = false;
  86. }
  87. }
  88. return canGo;
  89. };
  90. // given an object and a list of keys, return new object with given keys
  91. export var extractObject = function extractObject(spec, keys) {
  92. var newObject = {};
  93. keys.forEach(function (key) {
  94. return newObject[key] = spec[key];
  95. });
  96. return newObject;
  97. };
  98. // get initialized state
  99. export var initializedState = function initializedState(spec) {
  100. // spec also contains listRef, trackRef
  101. var slideCount = spec.children.length;
  102. var listNode = spec.listRef;
  103. var listWidth = Math.ceil(getWidth(listNode));
  104. var trackNode = spec.trackRef;
  105. var trackWidth = Math.ceil(getWidth(trackNode));
  106. var slideWidth;
  107. if (!spec.vertical) {
  108. var centerPaddingAdj = spec.centerMode && parseInt(spec.centerPadding) * 2;
  109. if (typeof spec.centerPadding === 'string' && spec.centerPadding.slice(-1) === '%') {
  110. centerPaddingAdj *= listWidth / 100;
  111. }
  112. slideWidth = Math.ceil((listWidth - centerPaddingAdj) / spec.slidesToShow);
  113. } else {
  114. slideWidth = listWidth;
  115. }
  116. var slideHeight = listNode && getHeight(listNode.querySelector('[data-index="0"]'));
  117. var listHeight = slideHeight * spec.slidesToShow;
  118. var currentSlide = spec.currentSlide === undefined ? spec.initialSlide : spec.currentSlide;
  119. if (spec.rtl && spec.currentSlide === undefined) {
  120. currentSlide = slideCount - 1 - spec.initialSlide;
  121. }
  122. var lazyLoadedList = spec.lazyLoadedList || [];
  123. var slidesToLoad = getOnDemandLazySlides(_objectSpread(_objectSpread({}, spec), {}, {
  124. currentSlide: currentSlide,
  125. lazyLoadedList: lazyLoadedList
  126. }), spec);
  127. lazyLoadedList = lazyLoadedList.concat(slidesToLoad);
  128. var state = {
  129. slideCount: slideCount,
  130. slideWidth: slideWidth,
  131. listWidth: listWidth,
  132. trackWidth: trackWidth,
  133. currentSlide: currentSlide,
  134. slideHeight: slideHeight,
  135. listHeight: listHeight,
  136. lazyLoadedList: lazyLoadedList
  137. };
  138. if (spec.autoplaying === null && spec.autoplay) {
  139. state['autoplaying'] = 'playing';
  140. }
  141. return state;
  142. };
  143. export var slideHandler = function slideHandler(spec) {
  144. var waitForAnimate = spec.waitForAnimate,
  145. animating = spec.animating,
  146. fade = spec.fade,
  147. infinite = spec.infinite,
  148. index = spec.index,
  149. slideCount = spec.slideCount,
  150. lazyLoad = spec.lazyLoad,
  151. currentSlide = spec.currentSlide,
  152. centerMode = spec.centerMode,
  153. slidesToScroll = spec.slidesToScroll,
  154. slidesToShow = spec.slidesToShow,
  155. useCSS = spec.useCSS;
  156. var lazyLoadedList = spec.lazyLoadedList;
  157. if (waitForAnimate && animating) return {};
  158. var animationSlide = index;
  159. var finalSlide;
  160. var animationLeft;
  161. var finalLeft;
  162. var state = {};
  163. var nextState = {};
  164. var targetSlide = infinite ? index : clamp(index, 0, slideCount - 1);
  165. if (fade) {
  166. if (!infinite && (index < 0 || index >= slideCount)) return {};
  167. if (index < 0) {
  168. animationSlide = index + slideCount;
  169. } else if (index >= slideCount) {
  170. animationSlide = index - slideCount;
  171. }
  172. if (lazyLoad && lazyLoadedList.indexOf(animationSlide) < 0) {
  173. lazyLoadedList = lazyLoadedList.concat(animationSlide);
  174. }
  175. state = {
  176. animating: true,
  177. currentSlide: animationSlide,
  178. lazyLoadedList: lazyLoadedList,
  179. targetSlide: animationSlide
  180. };
  181. nextState = {
  182. animating: false,
  183. targetSlide: animationSlide
  184. };
  185. } else {
  186. finalSlide = animationSlide;
  187. if (animationSlide < 0) {
  188. finalSlide = animationSlide + slideCount;
  189. if (!infinite) finalSlide = 0;else if (slideCount % slidesToScroll !== 0) {
  190. finalSlide = slideCount - slideCount % slidesToScroll;
  191. }
  192. } else if (!canGoNext(spec) && animationSlide > currentSlide) {
  193. animationSlide = finalSlide = currentSlide;
  194. } else if (centerMode && animationSlide >= slideCount) {
  195. animationSlide = infinite ? slideCount : slideCount - 1;
  196. finalSlide = infinite ? 0 : slideCount - 1;
  197. } else if (animationSlide >= slideCount) {
  198. finalSlide = animationSlide - slideCount;
  199. if (!infinite) finalSlide = slideCount - slidesToShow;else if (slideCount % slidesToScroll !== 0) finalSlide = 0;
  200. }
  201. if (!infinite && animationSlide + slidesToShow >= slideCount) {
  202. finalSlide = slideCount - slidesToShow;
  203. }
  204. animationLeft = getTrackLeft(_objectSpread(_objectSpread({}, spec), {}, {
  205. slideIndex: animationSlide
  206. }));
  207. finalLeft = getTrackLeft(_objectSpread(_objectSpread({}, spec), {}, {
  208. slideIndex: finalSlide
  209. }));
  210. if (!infinite) {
  211. if (animationLeft === finalLeft) animationSlide = finalSlide;
  212. animationLeft = finalLeft;
  213. }
  214. if (lazyLoad) {
  215. lazyLoadedList = lazyLoadedList.concat(getOnDemandLazySlides(_objectSpread(_objectSpread({}, spec), {}, {
  216. currentSlide: animationSlide
  217. })));
  218. }
  219. if (!useCSS) {
  220. state = {
  221. currentSlide: finalSlide,
  222. trackStyle: getTrackCSS(_objectSpread(_objectSpread({}, spec), {}, {
  223. left: finalLeft
  224. })),
  225. lazyLoadedList: lazyLoadedList,
  226. targetSlide: targetSlide
  227. };
  228. } else {
  229. state = {
  230. animating: true,
  231. currentSlide: finalSlide,
  232. trackStyle: getTrackAnimateCSS(_objectSpread(_objectSpread({}, spec), {}, {
  233. left: animationLeft
  234. })),
  235. lazyLoadedList: lazyLoadedList,
  236. targetSlide: targetSlide
  237. };
  238. nextState = {
  239. animating: false,
  240. currentSlide: finalSlide,
  241. trackStyle: getTrackCSS(_objectSpread(_objectSpread({}, spec), {}, {
  242. left: finalLeft
  243. })),
  244. swipeLeft: null,
  245. targetSlide: targetSlide
  246. };
  247. }
  248. }
  249. return {
  250. state: state,
  251. nextState: nextState
  252. };
  253. };
  254. export var changeSlide = function changeSlide(spec, options) {
  255. var previousInt, slideOffset, targetSlide;
  256. var slidesToScroll = spec.slidesToScroll,
  257. slidesToShow = spec.slidesToShow,
  258. slideCount = spec.slideCount,
  259. currentSlide = spec.currentSlide,
  260. previousTargetSlide = spec.targetSlide,
  261. lazyLoad = spec.lazyLoad,
  262. infinite = spec.infinite;
  263. var unevenOffset = slideCount % slidesToScroll !== 0;
  264. var indexOffset = unevenOffset ? 0 : (slideCount - currentSlide) % slidesToScroll;
  265. if (options.message === 'previous') {
  266. slideOffset = indexOffset === 0 ? slidesToScroll : slidesToShow - indexOffset;
  267. targetSlide = currentSlide - slideOffset;
  268. if (lazyLoad && !infinite) {
  269. previousInt = currentSlide - slideOffset;
  270. targetSlide = previousInt === -1 ? slideCount - 1 : previousInt;
  271. }
  272. if (!infinite) {
  273. targetSlide = previousTargetSlide - slidesToScroll;
  274. }
  275. } else if (options.message === 'next') {
  276. slideOffset = indexOffset === 0 ? slidesToScroll : indexOffset;
  277. targetSlide = currentSlide + slideOffset;
  278. if (lazyLoad && !infinite) {
  279. targetSlide = (currentSlide + slidesToScroll) % slideCount + indexOffset;
  280. }
  281. if (!infinite) {
  282. targetSlide = previousTargetSlide + slidesToScroll;
  283. }
  284. } else if (options.message === 'dots') {
  285. // Click on dots
  286. targetSlide = options.index * options.slidesToScroll;
  287. } else if (options.message === 'children') {
  288. // Click on the slides
  289. targetSlide = options.index;
  290. if (infinite) {
  291. var direction = siblingDirection(_objectSpread(_objectSpread({}, spec), {}, {
  292. targetSlide: targetSlide
  293. }));
  294. if (targetSlide > options.currentSlide && direction === 'left') {
  295. targetSlide = targetSlide - slideCount;
  296. } else if (targetSlide < options.currentSlide && direction === 'right') {
  297. targetSlide = targetSlide + slideCount;
  298. }
  299. }
  300. } else if (options.message === 'index') {
  301. targetSlide = Number(options.index);
  302. }
  303. return targetSlide;
  304. };
  305. export var keyHandler = function keyHandler(e, accessibility, rtl) {
  306. if (e.target.tagName.match('TEXTAREA|INPUT|SELECT') || !accessibility) {
  307. return '';
  308. }
  309. if (e.keyCode === 37) return rtl ? 'next' : 'previous';
  310. if (e.keyCode === 39) return rtl ? 'previous' : 'next';
  311. return '';
  312. };
  313. export var swipeStart = function swipeStart(e, swipe, draggable) {
  314. e.target.tagName === 'IMG' && safePreventDefault(e);
  315. if (!swipe || !draggable && e.type.indexOf('mouse') !== -1) return '';
  316. return {
  317. dragging: true,
  318. touchObject: {
  319. startX: e.touches ? e.touches[0].pageX : e.clientX,
  320. startY: e.touches ? e.touches[0].pageY : e.clientY,
  321. curX: e.touches ? e.touches[0].pageX : e.clientX,
  322. curY: e.touches ? e.touches[0].pageY : e.clientY
  323. }
  324. };
  325. };
  326. export var swipeMove = function swipeMove(e, spec) {
  327. // spec also contains, trackRef and slideIndex
  328. var scrolling = spec.scrolling,
  329. animating = spec.animating,
  330. vertical = spec.vertical,
  331. swipeToSlide = spec.swipeToSlide,
  332. verticalSwiping = spec.verticalSwiping,
  333. rtl = spec.rtl,
  334. currentSlide = spec.currentSlide,
  335. edgeFriction = spec.edgeFriction,
  336. edgeDragged = spec.edgeDragged,
  337. onEdge = spec.onEdge,
  338. swiped = spec.swiped,
  339. swiping = spec.swiping,
  340. slideCount = spec.slideCount,
  341. slidesToScroll = spec.slidesToScroll,
  342. infinite = spec.infinite,
  343. touchObject = spec.touchObject,
  344. swipeEvent = spec.swipeEvent,
  345. listHeight = spec.listHeight,
  346. listWidth = spec.listWidth;
  347. if (scrolling) return;
  348. if (animating) return safePreventDefault(e);
  349. if (vertical && swipeToSlide && verticalSwiping) safePreventDefault(e);
  350. var swipeLeft;
  351. var state = {};
  352. var curLeft = getTrackLeft(spec);
  353. touchObject.curX = e.touches ? e.touches[0].pageX : e.clientX;
  354. touchObject.curY = e.touches ? e.touches[0].pageY : e.clientY;
  355. touchObject.swipeLength = Math.round(Math.sqrt(Math.pow(touchObject.curX - touchObject.startX, 2)));
  356. var verticalSwipeLength = Math.round(Math.sqrt(Math.pow(touchObject.curY - touchObject.startY, 2)));
  357. if (!verticalSwiping && !swiping && verticalSwipeLength > 10) {
  358. return {
  359. scrolling: true
  360. };
  361. }
  362. if (verticalSwiping) touchObject.swipeLength = verticalSwipeLength;
  363. var positionOffset = (!rtl ? 1 : -1) * (touchObject.curX > touchObject.startX ? 1 : -1);
  364. if (verticalSwiping) {
  365. positionOffset = touchObject.curY > touchObject.startY ? 1 : -1;
  366. }
  367. var dotCount = Math.ceil(slideCount / slidesToScroll);
  368. var swipeDirection = getSwipeDirection(spec.touchObject, verticalSwiping);
  369. var touchSwipeLength = touchObject.swipeLength;
  370. if (!infinite) {
  371. if (currentSlide === 0 && (swipeDirection === 'right' || swipeDirection === 'down') || currentSlide + 1 >= dotCount && (swipeDirection === 'left' || swipeDirection === 'up') || !canGoNext(spec) && (swipeDirection === 'left' || swipeDirection === 'up')) {
  372. touchSwipeLength = touchObject.swipeLength * edgeFriction;
  373. if (edgeDragged === false && onEdge) {
  374. onEdge(swipeDirection);
  375. state['edgeDragged'] = true;
  376. }
  377. }
  378. }
  379. if (!swiped && swipeEvent) {
  380. swipeEvent(swipeDirection);
  381. state['swiped'] = true;
  382. }
  383. if (!vertical) {
  384. if (!rtl) {
  385. swipeLeft = curLeft + touchSwipeLength * positionOffset;
  386. } else {
  387. swipeLeft = curLeft - touchSwipeLength * positionOffset;
  388. }
  389. } else {
  390. swipeLeft = curLeft + touchSwipeLength * (listHeight / listWidth) * positionOffset;
  391. }
  392. if (verticalSwiping) {
  393. swipeLeft = curLeft + touchSwipeLength * positionOffset;
  394. }
  395. state = _objectSpread(_objectSpread({}, state), {}, {
  396. touchObject: touchObject,
  397. swipeLeft: swipeLeft,
  398. trackStyle: getTrackCSS(_objectSpread(_objectSpread({}, spec), {}, {
  399. left: swipeLeft
  400. }))
  401. });
  402. if (Math.abs(touchObject.curX - touchObject.startX) < Math.abs(touchObject.curY - touchObject.startY) * 0.8) {
  403. return state;
  404. }
  405. if (touchObject.swipeLength > 10) {
  406. state['swiping'] = true;
  407. safePreventDefault(e);
  408. }
  409. return state;
  410. };
  411. export var swipeEnd = function swipeEnd(e, spec) {
  412. var dragging = spec.dragging,
  413. swipe = spec.swipe,
  414. touchObject = spec.touchObject,
  415. listWidth = spec.listWidth,
  416. touchThreshold = spec.touchThreshold,
  417. verticalSwiping = spec.verticalSwiping,
  418. listHeight = spec.listHeight,
  419. swipeToSlide = spec.swipeToSlide,
  420. scrolling = spec.scrolling,
  421. onSwipe = spec.onSwipe,
  422. targetSlide = spec.targetSlide,
  423. currentSlide = spec.currentSlide,
  424. infinite = spec.infinite;
  425. if (!dragging) {
  426. if (swipe) safePreventDefault(e);
  427. return {};
  428. }
  429. var minSwipe = verticalSwiping ? listHeight / touchThreshold : listWidth / touchThreshold;
  430. var swipeDirection = getSwipeDirection(touchObject, verticalSwiping);
  431. // reset the state of touch related state variables.
  432. var state = {
  433. dragging: false,
  434. edgeDragged: false,
  435. scrolling: false,
  436. swiping: false,
  437. swiped: false,
  438. swipeLeft: null,
  439. touchObject: {}
  440. };
  441. if (scrolling) {
  442. return state;
  443. }
  444. if (!touchObject.swipeLength) {
  445. return state;
  446. }
  447. if (touchObject.swipeLength > minSwipe) {
  448. safePreventDefault(e);
  449. if (onSwipe) {
  450. onSwipe(swipeDirection);
  451. }
  452. var slideCount, newSlide;
  453. var activeSlide = infinite ? currentSlide : targetSlide;
  454. switch (swipeDirection) {
  455. case 'left':
  456. case 'up':
  457. newSlide = activeSlide + getSlideCount(spec);
  458. slideCount = swipeToSlide ? checkNavigable(spec, newSlide) : newSlide;
  459. state['currentDirection'] = 0;
  460. break;
  461. case 'right':
  462. case 'down':
  463. newSlide = activeSlide - getSlideCount(spec);
  464. slideCount = swipeToSlide ? checkNavigable(spec, newSlide) : newSlide;
  465. state['currentDirection'] = 1;
  466. break;
  467. default:
  468. slideCount = activeSlide;
  469. }
  470. state['triggerSlideHandler'] = slideCount;
  471. } else {
  472. // Adjust the track back to it's original position.
  473. var currentLeft = getTrackLeft(spec);
  474. state['trackStyle'] = getTrackAnimateCSS(_objectSpread(_objectSpread({}, spec), {}, {
  475. left: currentLeft
  476. }));
  477. }
  478. return state;
  479. };
  480. export var getNavigableIndexes = function getNavigableIndexes(spec) {
  481. var max = spec.infinite ? spec.slideCount * 2 : spec.slideCount;
  482. var breakpoint = spec.infinite ? spec.slidesToShow * -1 : 0;
  483. var counter = spec.infinite ? spec.slidesToShow * -1 : 0;
  484. var indexes = [];
  485. while (breakpoint < max) {
  486. indexes.push(breakpoint);
  487. breakpoint = counter + spec.slidesToScroll;
  488. counter += Math.min(spec.slidesToScroll, spec.slidesToShow);
  489. }
  490. return indexes;
  491. };
  492. export var checkNavigable = function checkNavigable(spec, index) {
  493. var navigables = getNavigableIndexes(spec);
  494. var prevNavigable = 0;
  495. if (index > navigables[navigables.length - 1]) {
  496. index = navigables[navigables.length - 1];
  497. } else {
  498. for (var n in navigables) {
  499. if (index < navigables[n]) {
  500. index = prevNavigable;
  501. break;
  502. }
  503. prevNavigable = navigables[n];
  504. }
  505. }
  506. return index;
  507. };
  508. export var getSlideCount = function getSlideCount(spec) {
  509. var centerOffset = spec.centerMode ? spec.slideWidth * Math.floor(spec.slidesToShow / 2) : 0;
  510. if (spec.swipeToSlide) {
  511. var swipedSlide;
  512. var slickList = spec.listRef;
  513. var slides = slickList.querySelectorAll && slickList.querySelectorAll('.slick-slide') || [];
  514. Array.from(slides).every(function (slide) {
  515. if (!spec.vertical) {
  516. if (slide.offsetLeft - centerOffset + getWidth(slide) / 2 > spec.swipeLeft * -1) {
  517. swipedSlide = slide;
  518. return false;
  519. }
  520. } else {
  521. if (slide.offsetTop + getHeight(slide) / 2 > spec.swipeLeft * -1) {
  522. swipedSlide = slide;
  523. return false;
  524. }
  525. }
  526. return true;
  527. });
  528. if (!swipedSlide) {
  529. return 0;
  530. }
  531. var currentIndex = spec.rtl === true ? spec.slideCount - spec.currentSlide : spec.currentSlide;
  532. var slidesTraversed = Math.abs(swipedSlide.dataset.index - currentIndex) || 1;
  533. return slidesTraversed;
  534. } else {
  535. return spec.slidesToScroll;
  536. }
  537. };
  538. export var checkSpecKeys = function checkSpecKeys(spec, keysArray) {
  539. return keysArray.reduce(function (value, key) {
  540. return value && spec.hasOwnProperty(key);
  541. }, true) ? null : console.error('Keys Missing:', spec);
  542. };
  543. export var getTrackCSS = function getTrackCSS(spec) {
  544. checkSpecKeys(spec, ['left', 'variableWidth', 'slideCount', 'slidesToShow', 'slideWidth']);
  545. var trackWidth, trackHeight;
  546. var trackChildren = spec.slideCount + 2 * spec.slidesToShow;
  547. if (!spec.vertical) {
  548. trackWidth = getTotalSlides(spec) * spec.slideWidth;
  549. } else {
  550. trackHeight = trackChildren * spec.slideHeight;
  551. }
  552. var style = {
  553. opacity: 1,
  554. transition: '',
  555. WebkitTransition: ''
  556. };
  557. if (spec.useTransform) {
  558. var WebkitTransform = !spec.vertical ? 'translate3d(' + spec.left + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)';
  559. var transform = !spec.vertical ? 'translate3d(' + spec.left + 'px, 0px, 0px)' : 'translate3d(0px, ' + spec.left + 'px, 0px)';
  560. var msTransform = !spec.vertical ? 'translateX(' + spec.left + 'px)' : 'translateY(' + spec.left + 'px)';
  561. style = _objectSpread(_objectSpread({}, style), {}, {
  562. WebkitTransform: WebkitTransform,
  563. transform: transform,
  564. msTransform: msTransform
  565. });
  566. } else {
  567. if (spec.vertical) {
  568. style['top'] = spec.left;
  569. } else {
  570. style['left'] = spec.left;
  571. }
  572. }
  573. if (spec.fade) style = {
  574. opacity: 1
  575. };
  576. if (trackWidth) style.width = trackWidth + 'px';
  577. if (trackHeight) style.height = trackHeight + 'px';
  578. // Fallback for IE8
  579. if (window && !window.addEventListener && window.attachEvent) {
  580. if (!spec.vertical) {
  581. style.marginLeft = spec.left + 'px';
  582. } else {
  583. style.marginTop = spec.left + 'px';
  584. }
  585. }
  586. return style;
  587. };
  588. export var getTrackAnimateCSS = function getTrackAnimateCSS(spec) {
  589. checkSpecKeys(spec, ['left', 'variableWidth', 'slideCount', 'slidesToShow', 'slideWidth', 'speed', 'cssEase']);
  590. var style = getTrackCSS(spec);
  591. // useCSS is true by default so it can be undefined
  592. if (spec.useTransform) {
  593. style.WebkitTransition = '-webkit-transform ' + spec.speed + 'ms ' + spec.cssEase;
  594. style.transition = 'transform ' + spec.speed + 'ms ' + spec.cssEase;
  595. } else {
  596. if (spec.vertical) {
  597. style.transition = 'top ' + spec.speed + 'ms ' + spec.cssEase;
  598. } else {
  599. style.transition = 'left ' + spec.speed + 'ms ' + spec.cssEase;
  600. }
  601. }
  602. return style;
  603. };
  604. export var getTrackLeft = function getTrackLeft(spec) {
  605. if (spec.unslick) {
  606. return 0;
  607. }
  608. checkSpecKeys(spec, ['slideIndex', 'trackRef', 'infinite', 'centerMode', 'slideCount', 'slidesToShow', 'slidesToScroll', 'slideWidth', 'listWidth', 'variableWidth', 'slideHeight']);
  609. var slideIndex = spec.slideIndex,
  610. trackRef = spec.trackRef,
  611. infinite = spec.infinite,
  612. centerMode = spec.centerMode,
  613. slideCount = spec.slideCount,
  614. slidesToShow = spec.slidesToShow,
  615. slidesToScroll = spec.slidesToScroll,
  616. slideWidth = spec.slideWidth,
  617. listWidth = spec.listWidth,
  618. variableWidth = spec.variableWidth,
  619. slideHeight = spec.slideHeight,
  620. fade = spec.fade,
  621. vertical = spec.vertical;
  622. var slideOffset = 0;
  623. var targetLeft;
  624. var targetSlide;
  625. var verticalOffset = 0;
  626. if (fade || spec.slideCount === 1) {
  627. return 0;
  628. }
  629. var slidesToOffset = 0;
  630. if (infinite) {
  631. slidesToOffset = -getPreClones(spec); // bring active slide to the beginning of visual area
  632. // if next scroll doesn't have enough children, just reach till the end of original slides instead of shifting slidesToScroll children
  633. if (slideCount % slidesToScroll !== 0 && slideIndex + slidesToScroll > slideCount) {
  634. slidesToOffset = -(slideIndex > slideCount ? slidesToShow - (slideIndex - slideCount) : slideCount % slidesToScroll);
  635. }
  636. // shift current slide to center of the frame
  637. if (centerMode) {
  638. slidesToOffset += parseInt(slidesToShow / 2);
  639. }
  640. } else {
  641. if (slideCount % slidesToScroll !== 0 && slideIndex + slidesToScroll > slideCount) {
  642. slidesToOffset = slidesToShow - slideCount % slidesToScroll;
  643. }
  644. if (centerMode) {
  645. slidesToOffset = parseInt(slidesToShow / 2);
  646. }
  647. }
  648. slideOffset = slidesToOffset * slideWidth;
  649. verticalOffset = slidesToOffset * slideHeight;
  650. if (!vertical) {
  651. targetLeft = slideIndex * slideWidth * -1 + slideOffset;
  652. } else {
  653. targetLeft = slideIndex * slideHeight * -1 + verticalOffset;
  654. }
  655. if (variableWidth === true) {
  656. var targetSlideIndex;
  657. var trackElem = trackRef;
  658. targetSlideIndex = slideIndex + getPreClones(spec);
  659. targetSlide = trackElem && trackElem.childNodes[targetSlideIndex];
  660. targetLeft = targetSlide ? targetSlide.offsetLeft * -1 : 0;
  661. if (centerMode === true) {
  662. targetSlideIndex = infinite ? slideIndex + getPreClones(spec) : slideIndex;
  663. targetSlide = trackElem && trackElem.children[targetSlideIndex];
  664. targetLeft = 0;
  665. for (var slide = 0; slide < targetSlideIndex; slide++) {
  666. targetLeft -= trackElem && trackElem.children[slide] && trackElem.children[slide].offsetWidth;
  667. }
  668. targetLeft -= parseInt(spec.centerPadding);
  669. targetLeft += targetSlide && (listWidth - targetSlide.offsetWidth) / 2;
  670. }
  671. }
  672. return targetLeft;
  673. };
  674. export var getPreClones = function getPreClones(spec) {
  675. if (spec.unslick || !spec.infinite) {
  676. return 0;
  677. }
  678. if (spec.variableWidth) {
  679. return spec.slideCount;
  680. }
  681. return spec.slidesToShow + (spec.centerMode ? 1 : 0);
  682. };
  683. export var getPostClones = function getPostClones(spec) {
  684. if (spec.unslick || !spec.infinite) {
  685. return 0;
  686. }
  687. return spec.slideCount;
  688. };
  689. export var getTotalSlides = function getTotalSlides(spec) {
  690. return spec.slideCount === 1 ? 1 : getPreClones(spec) + spec.slideCount + getPostClones(spec);
  691. };
  692. export var siblingDirection = function siblingDirection(spec) {
  693. if (spec.targetSlide > spec.currentSlide) {
  694. if (spec.targetSlide > spec.currentSlide + slidesOnRight(spec)) {
  695. return 'left';
  696. }
  697. return 'right';
  698. } else {
  699. if (spec.targetSlide < spec.currentSlide - slidesOnLeft(spec)) {
  700. return 'right';
  701. }
  702. return 'left';
  703. }
  704. };
  705. export var slidesOnRight = function slidesOnRight(_ref) {
  706. var slidesToShow = _ref.slidesToShow,
  707. centerMode = _ref.centerMode,
  708. rtl = _ref.rtl,
  709. centerPadding = _ref.centerPadding;
  710. // returns no of slides on the right of active slide
  711. if (centerMode) {
  712. var right = (slidesToShow - 1) / 2 + 1;
  713. if (parseInt(centerPadding) > 0) right += 1;
  714. if (rtl && slidesToShow % 2 === 0) right += 1;
  715. return right;
  716. }
  717. if (rtl) {
  718. return 0;
  719. }
  720. return slidesToShow - 1;
  721. };
  722. export var slidesOnLeft = function slidesOnLeft(_ref2) {
  723. var slidesToShow = _ref2.slidesToShow,
  724. centerMode = _ref2.centerMode,
  725. rtl = _ref2.rtl,
  726. centerPadding = _ref2.centerPadding;
  727. // returns no of slides on the left of active slide
  728. if (centerMode) {
  729. var left = (slidesToShow - 1) / 2 + 1;
  730. if (parseInt(centerPadding) > 0) left += 1;
  731. if (!rtl && slidesToShow % 2 === 0) left += 1;
  732. return left;
  733. }
  734. if (rtl) {
  735. return slidesToShow - 1;
  736. }
  737. return 0;
  738. };
  739. export var canUseDOM = function canUseDOM() {
  740. return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
  741. };