swiper-transition.js 4.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. import { isHorizontal, maxTranslate, minTranslate, round, transform, transition } from './swiper-utils';
  2. import { parallaxSetTransition, parallaxSetTranslate } from './swiper-parallax';
  3. import { updateProgress } from './swiper-progress';
  4. import { updateActiveIndex } from './swiper-index';
  5. import { SWIPER_CONTROLLER } from './swiper-controller';
  6. import { SWIPER_EFFECTS } from './swiper-effects';
  7. export function setWrapperTranslate(s, plt, translate, shouldUpdateActiveIndex, byController) {
  8. var x = 0, y = 0, z = 0;
  9. if (isHorizontal(s)) {
  10. x = s._rtl ? -translate : translate;
  11. }
  12. else {
  13. y = translate;
  14. }
  15. if (s.roundLengths) {
  16. x = round(x);
  17. y = round(y);
  18. }
  19. if (!s.virtualTranslate) {
  20. transform(s._wrapper, 'translate3d(' + x + 'px, ' + y + 'px, ' + z + 'px)');
  21. }
  22. s._translate = isHorizontal(s) ? x : y;
  23. // Check if we need to update progress
  24. var progress;
  25. var translatesDiff = maxTranslate(s) - minTranslate(s);
  26. if (translatesDiff === 0) {
  27. progress = 0;
  28. }
  29. else {
  30. progress = (translate - minTranslate(s)) / (translatesDiff);
  31. }
  32. if (progress !== s.progress) {
  33. updateProgress(s, translate);
  34. }
  35. if (shouldUpdateActiveIndex) {
  36. updateActiveIndex(s);
  37. }
  38. if (s.effect !== 'slide' && SWIPER_EFFECTS[s.effect]) {
  39. SWIPER_EFFECTS[s.effect].setTranslate(s, plt);
  40. }
  41. if (s.parallax) {
  42. parallaxSetTranslate(s);
  43. }
  44. if (s.control) {
  45. SWIPER_CONTROLLER.setTranslate(s, plt, s._translate, byController, setWrapperTranslate);
  46. }
  47. }
  48. export function getTranslate(s, plt, el, axis) {
  49. var win = plt.win();
  50. var matrix;
  51. var curTransform;
  52. var curStyle;
  53. var transformMatrix;
  54. // automatic axis detection
  55. if (typeof axis === 'undefined') {
  56. axis = 'x';
  57. }
  58. if (s.virtualTranslate) {
  59. return s._rtl ? -s._translate : s._translate;
  60. }
  61. curStyle = plt.getElementComputedStyle(el);
  62. if (win.WebKitCSSMatrix) {
  63. curTransform = curStyle.transform || curStyle.webkitTransform;
  64. if (curTransform.split(',').length > 6) {
  65. curTransform = curTransform.split(', ').map(function (a) {
  66. return a.replace(',', '.');
  67. }).join(', ');
  68. }
  69. // Some old versions of Webkit choke when 'none' is passed; pass
  70. // empty string instead in this case
  71. transformMatrix = new win.WebKitCSSMatrix(curTransform === 'none' ? '' : curTransform);
  72. }
  73. else {
  74. transformMatrix = curStyle.MozTransform || curStyle.OTransform || curStyle.MsTransform || curStyle.msTransform || curStyle.transform || curStyle.getPropertyValue('transform').replace('translate(', 'matrix(1, 0, 0, 1,');
  75. matrix = transformMatrix.toString().split(',');
  76. }
  77. if (axis === 'x') {
  78. if (win.WebKitCSSMatrix) {
  79. // Latest Chrome and webkits Fix
  80. curTransform = transformMatrix.m41;
  81. }
  82. else if (matrix.length === 16) {
  83. // Crazy IE10 Matrix
  84. curTransform = parseFloat(matrix[12]);
  85. }
  86. else {
  87. // Normal Browsers
  88. curTransform = parseFloat(matrix[4]);
  89. }
  90. }
  91. if (axis === 'y') {
  92. if (win.WebKitCSSMatrix) {
  93. // Latest Chrome and webkits Fix
  94. curTransform = transformMatrix.m42;
  95. }
  96. else if (matrix.length === 16) {
  97. // Crazy IE10 Matrix
  98. curTransform = parseFloat(matrix[13]);
  99. }
  100. else {
  101. // Normal Browsers
  102. curTransform = parseFloat(matrix[5]);
  103. }
  104. }
  105. if (s._rtl && curTransform) {
  106. curTransform = -curTransform;
  107. }
  108. return curTransform || 0;
  109. }
  110. export function getWrapperTranslate(s, plt, axis) {
  111. if (typeof axis === 'undefined') {
  112. axis = isHorizontal(s) ? 'x' : 'y';
  113. }
  114. return getTranslate(s, plt, s._wrapper, axis);
  115. }
  116. export function setWrapperTransition(s, plt, duration, byController) {
  117. transition(s._wrapper, duration);
  118. if (s.effect !== 'slide' && SWIPER_EFFECTS[s.effect]) {
  119. SWIPER_EFFECTS[s.effect].setTransition(s, plt, duration);
  120. }
  121. if (s.parallax) {
  122. parallaxSetTransition(s, duration);
  123. }
  124. if (s.control) {
  125. SWIPER_CONTROLLER.setTransition(s, plt, duration, byController, setWrapperTransition);
  126. }
  127. }
  128. //# sourceMappingURL=swiper-transition.js.map