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