123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241 |
- import {
- now
- } from '../../shared/utils.js';
- export default function freeMode({
- swiper,
- extendParams,
- emit,
- once
- }) {
- extendParams({
- freeMode: {
- enabled: false,
- momentum: true,
- momentumRatio: 1,
- momentumBounce: true,
- momentumBounceRatio: 1,
- momentumVelocityRatio: 1,
- sticky: false,
- minimumVelocity: 0.02
- }
- });
- function onTouchMove() {
- const {
- touchEventsData: data,
- touches
- } = swiper; // Velocity
- if (data.velocities.length === 0) {
- data.velocities.push({
- position: touches[swiper.isHorizontal() ? 'startX' : 'startY'],
- time: data.touchStartTime
- });
- }
- data.velocities.push({
- position: touches[swiper.isHorizontal() ? 'currentX' : 'currentY'],
- time: now()
- });
- }
- function onTouchEnd({
- currentPos
- }) {
- const {
- params,
- $wrapperEl,
- rtlTranslate: rtl,
- snapGrid,
- touchEventsData: data
- } = swiper; // Time diff
- const touchEndTime = now();
- const timeDiff = touchEndTime - data.touchStartTime;
- if (currentPos < -swiper.minTranslate()) {
- swiper.slideTo(swiper.activeIndex);
- return;
- }
- if (currentPos > -swiper.maxTranslate()) {
- if (swiper.slides.length < snapGrid.length) {
- swiper.slideTo(snapGrid.length - 1);
- } else {
- swiper.slideTo(swiper.slides.length - 1);
- }
- return;
- }
- if (params.freeMode.momentum) {
- if (data.velocities.length > 1) {
- const lastMoveEvent = data.velocities.pop();
- const velocityEvent = data.velocities.pop();
- const distance = lastMoveEvent.position - velocityEvent.position;
- const time = lastMoveEvent.time - velocityEvent.time;
- swiper.velocity = distance / time;
- swiper.velocity /= 2;
- if (Math.abs(swiper.velocity) < params.freeMode.minimumVelocity) {
- swiper.velocity = 0;
- } // this implies that the user stopped moving a finger then released.
- // There would be no events with distance zero, so the last event is stale.
- if (time > 150 || now() - lastMoveEvent.time > 300) {
- swiper.velocity = 0;
- }
- } else {
- swiper.velocity = 0;
- }
- swiper.velocity *= params.freeMode.momentumVelocityRatio;
- data.velocities.length = 0;
- let momentumDuration = 1000 * params.freeMode.momentumRatio;
- const momentumDistance = swiper.velocity * momentumDuration;
- let newPosition = swiper.translate + momentumDistance;
- if (rtl) newPosition = -newPosition;
- let doBounce = false;
- let afterBouncePosition;
- const bounceAmount = Math.abs(swiper.velocity) * 20 * params.freeMode.momentumBounceRatio;
- let needsLoopFix;
- if (newPosition < swiper.maxTranslate()) {
- if (params.freeMode.momentumBounce) {
- if (newPosition + swiper.maxTranslate() < -bounceAmount) {
- newPosition = swiper.maxTranslate() - bounceAmount;
- }
- afterBouncePosition = swiper.maxTranslate();
- doBounce = true;
- data.allowMomentumBounce = true;
- } else {
- newPosition = swiper.maxTranslate();
- }
- if (params.loop && params.centeredSlides) needsLoopFix = true;
- } else if (newPosition > swiper.minTranslate()) {
- if (params.freeMode.momentumBounce) {
- if (newPosition - swiper.minTranslate() > bounceAmount) {
- newPosition = swiper.minTranslate() + bounceAmount;
- }
- afterBouncePosition = swiper.minTranslate();
- doBounce = true;
- data.allowMomentumBounce = true;
- } else {
- newPosition = swiper.minTranslate();
- }
- if (params.loop && params.centeredSlides) needsLoopFix = true;
- } else if (params.freeMode.sticky) {
- let nextSlide;
- for (let j = 0; j < snapGrid.length; j += 1) {
- if (snapGrid[j] > -newPosition) {
- nextSlide = j;
- break;
- }
- }
- if (Math.abs(snapGrid[nextSlide] - newPosition) < Math.abs(snapGrid[nextSlide - 1] - newPosition) ||
- swiper.swipeDirection === 'next') {
- newPosition = snapGrid[nextSlide];
- } else {
- newPosition = snapGrid[nextSlide - 1];
- }
- newPosition = -newPosition;
- }
- if (needsLoopFix) {
- once('transitionEnd', () => {
- swiper.loopFix();
- });
- } // Fix duration
- if (swiper.velocity !== 0) {
- if (rtl) {
- momentumDuration = Math.abs((-newPosition - swiper.translate) / swiper.velocity);
- } else {
- momentumDuration = Math.abs((newPosition - swiper.translate) / swiper.velocity);
- }
- if (params.freeMode.sticky) {
- const moveDistance = Math.abs((rtl ? -newPosition : newPosition) - swiper.translate);
- const currentSlideSize = swiper.slidesSizesGrid[swiper.activeIndex];
- if (moveDistance < currentSlideSize) {
- momentumDuration = params.speed;
- } else if (moveDistance < 2 * currentSlideSize) {
- momentumDuration = params.speed * 1.5;
- } else {
- momentumDuration = params.speed * 2.5;
- }
- }
- } else if (params.freeMode.sticky) {
- swiper.slideToClosest();
- return;
- }
- if (params.freeMode.momentumBounce && doBounce) {
- swiper.updateProgress(afterBouncePosition);
- swiper.setTransition(momentumDuration);
- swiper.setTranslate(newPosition);
- swiper.transitionStart(true, swiper.swipeDirection);
- swiper.animating = true;
- $wrapperEl.transitionEnd(() => {
- if (!swiper || swiper.destroyed || !data.allowMomentumBounce) return;
- emit('momentumBounce');
- swiper.setTransition(params.speed);
- setTimeout(() => {
- swiper.setTranslate(afterBouncePosition);
- $wrapperEl.transitionEnd(() => {
- if (!swiper || swiper.destroyed) return;
- swiper.transitionEnd();
- }, momentumDuration);
- }, 0);
- }, momentumDuration);
- } else if (swiper.velocity) {
- emit('_freeModeNoMomentumRelease');
- swiper.updateProgress(newPosition);
- swiper.setTransition(momentumDuration);
- swiper.setTranslate(newPosition);
- swiper.transitionStart(true, swiper.swipeDirection);
- if (!swiper.animating) {
- swiper.animating = true;
- $wrapperEl.transitionEnd(() => {
- if (!swiper || swiper.destroyed) return;
- swiper.transitionEnd();
- }, momentumDuration);
- }
- } else {
- swiper.updateProgress(newPosition);
- }
- swiper.updateActiveIndex();
- swiper.updateSlidesClasses();
- } else if (params.freeMode.sticky) {
- swiper.slideToClosest();
- return;
- } else if (params.freeMode) {
- emit('_freeModeNoMomentumRelease');
- }
- if (!params.freeMode.momentum || timeDiff >= params.longSwipesMs) {
- swiper.updateProgress();
- swiper.updateActiveIndex();
- swiper.updateSlidesClasses();
- }
- }
- Object.assign(swiper, {
- freeMode: {
- onTouchMove,
- onTouchEnd
- }
- });
- }
|