dots.js 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  9. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  10. var _vnode = require("../_util/vnode");
  11. var _innerSliderUtils = require("./utils/innerSliderUtils");
  12. const getDotCount = function (spec) {
  13. let dots;
  14. if (spec.infinite) {
  15. dots = Math.ceil(spec.slideCount / spec.slidesToScroll);
  16. } else {
  17. dots = Math.ceil((spec.slideCount - spec.slidesToShow) / spec.slidesToScroll) + 1;
  18. }
  19. return dots;
  20. };
  21. const Dots = (_, _ref) => {
  22. let {
  23. attrs
  24. } = _ref;
  25. const {
  26. slideCount,
  27. slidesToScroll,
  28. slidesToShow,
  29. infinite,
  30. currentSlide,
  31. appendDots,
  32. customPaging,
  33. clickHandler,
  34. dotsClass,
  35. onMouseenter,
  36. onMouseover,
  37. onMouseleave
  38. } = attrs;
  39. const dotCount = getDotCount({
  40. slideCount,
  41. slidesToScroll,
  42. slidesToShow,
  43. infinite
  44. });
  45. // Apply join & split to Array to pre-fill it for IE8
  46. //
  47. // Credit: http://stackoverflow.com/a/13735425/1849458
  48. const mouseEvents = {
  49. onMouseenter,
  50. onMouseover,
  51. onMouseleave
  52. };
  53. let dots = [];
  54. for (let i = 0; i < dotCount; i++) {
  55. const _rightBound = (i + 1) * slidesToScroll - 1;
  56. const rightBound = infinite ? _rightBound : (0, _innerSliderUtils.clamp)(_rightBound, 0, slideCount - 1);
  57. const _leftBound = rightBound - (slidesToScroll - 1);
  58. const leftBound = infinite ? _leftBound : (0, _innerSliderUtils.clamp)(_leftBound, 0, slideCount - 1);
  59. const className = (0, _classNames.default)({
  60. 'slick-active': infinite ? currentSlide >= leftBound && currentSlide <= rightBound : currentSlide === leftBound
  61. });
  62. const dotOptions = {
  63. message: 'dots',
  64. index: i,
  65. slidesToScroll,
  66. currentSlide
  67. };
  68. function onClick(e) {
  69. // In Autoplay the focus stays on clicked button even after transition
  70. // to next slide. That only goes away by click somewhere outside
  71. if (e) {
  72. e.preventDefault();
  73. }
  74. clickHandler(dotOptions);
  75. }
  76. dots = dots.concat((0, _vue.createVNode)("li", {
  77. "key": i,
  78. "class": className
  79. }, [(0, _vnode.cloneElement)(customPaging({
  80. i
  81. }), {
  82. onClick
  83. })]));
  84. }
  85. return (0, _vnode.cloneElement)(appendDots({
  86. dots
  87. }), (0, _extends2.default)({
  88. class: dotsClass
  89. }, mouseEvents));
  90. };
  91. Dots.inheritAttrs = false;
  92. var _default = exports.default = Dots;