dots.js 2.7 KB

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