Add yet-another-react-lightbox package and update .gitignore to exclude node_modules
This commit is contained in:
174
frontend/node_modules/swiper/modules/effect-cube.mjs
generated
vendored
174
frontend/node_modules/swiper/modules/effect-cube.mjs
generated
vendored
@@ -1,174 +0,0 @@
|
||||
import { e as effectInit } from '../shared/effect-init.mjs';
|
||||
import { c as createElement, o as getRotateFix } from '../shared/utils.mjs';
|
||||
|
||||
function EffectCube(_ref) {
|
||||
let {
|
||||
swiper,
|
||||
extendParams,
|
||||
on
|
||||
} = _ref;
|
||||
extendParams({
|
||||
cubeEffect: {
|
||||
slideShadows: true,
|
||||
shadow: true,
|
||||
shadowOffset: 20,
|
||||
shadowScale: 0.94
|
||||
}
|
||||
});
|
||||
const createSlideShadows = (slideEl, progress, isHorizontal) => {
|
||||
let shadowBefore = isHorizontal ? slideEl.querySelector('.swiper-slide-shadow-left') : slideEl.querySelector('.swiper-slide-shadow-top');
|
||||
let shadowAfter = isHorizontal ? slideEl.querySelector('.swiper-slide-shadow-right') : slideEl.querySelector('.swiper-slide-shadow-bottom');
|
||||
if (!shadowBefore) {
|
||||
shadowBefore = createElement('div', `swiper-slide-shadow-cube swiper-slide-shadow-${isHorizontal ? 'left' : 'top'}`.split(' '));
|
||||
slideEl.append(shadowBefore);
|
||||
}
|
||||
if (!shadowAfter) {
|
||||
shadowAfter = createElement('div', `swiper-slide-shadow-cube swiper-slide-shadow-${isHorizontal ? 'right' : 'bottom'}`.split(' '));
|
||||
slideEl.append(shadowAfter);
|
||||
}
|
||||
if (shadowBefore) shadowBefore.style.opacity = Math.max(-progress, 0);
|
||||
if (shadowAfter) shadowAfter.style.opacity = Math.max(progress, 0);
|
||||
};
|
||||
const recreateShadows = () => {
|
||||
// create new ones
|
||||
const isHorizontal = swiper.isHorizontal();
|
||||
swiper.slides.forEach(slideEl => {
|
||||
const progress = Math.max(Math.min(slideEl.progress, 1), -1);
|
||||
createSlideShadows(slideEl, progress, isHorizontal);
|
||||
});
|
||||
};
|
||||
const setTranslate = () => {
|
||||
const {
|
||||
el,
|
||||
wrapperEl,
|
||||
slides,
|
||||
width: swiperWidth,
|
||||
height: swiperHeight,
|
||||
rtlTranslate: rtl,
|
||||
size: swiperSize,
|
||||
browser
|
||||
} = swiper;
|
||||
const r = getRotateFix(swiper);
|
||||
const params = swiper.params.cubeEffect;
|
||||
const isHorizontal = swiper.isHorizontal();
|
||||
const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
|
||||
let wrapperRotate = 0;
|
||||
let cubeShadowEl;
|
||||
if (params.shadow) {
|
||||
if (isHorizontal) {
|
||||
cubeShadowEl = swiper.wrapperEl.querySelector('.swiper-cube-shadow');
|
||||
if (!cubeShadowEl) {
|
||||
cubeShadowEl = createElement('div', 'swiper-cube-shadow');
|
||||
swiper.wrapperEl.append(cubeShadowEl);
|
||||
}
|
||||
cubeShadowEl.style.height = `${swiperWidth}px`;
|
||||
} else {
|
||||
cubeShadowEl = el.querySelector('.swiper-cube-shadow');
|
||||
if (!cubeShadowEl) {
|
||||
cubeShadowEl = createElement('div', 'swiper-cube-shadow');
|
||||
el.append(cubeShadowEl);
|
||||
}
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < slides.length; i += 1) {
|
||||
const slideEl = slides[i];
|
||||
let slideIndex = i;
|
||||
if (isVirtual) {
|
||||
slideIndex = parseInt(slideEl.getAttribute('data-swiper-slide-index'), 10);
|
||||
}
|
||||
let slideAngle = slideIndex * 90;
|
||||
let round = Math.floor(slideAngle / 360);
|
||||
if (rtl) {
|
||||
slideAngle = -slideAngle;
|
||||
round = Math.floor(-slideAngle / 360);
|
||||
}
|
||||
const progress = Math.max(Math.min(slideEl.progress, 1), -1);
|
||||
let tx = 0;
|
||||
let ty = 0;
|
||||
let tz = 0;
|
||||
if (slideIndex % 4 === 0) {
|
||||
tx = -round * 4 * swiperSize;
|
||||
tz = 0;
|
||||
} else if ((slideIndex - 1) % 4 === 0) {
|
||||
tx = 0;
|
||||
tz = -round * 4 * swiperSize;
|
||||
} else if ((slideIndex - 2) % 4 === 0) {
|
||||
tx = swiperSize + round * 4 * swiperSize;
|
||||
tz = swiperSize;
|
||||
} else if ((slideIndex - 3) % 4 === 0) {
|
||||
tx = -swiperSize;
|
||||
tz = 3 * swiperSize + swiperSize * 4 * round;
|
||||
}
|
||||
if (rtl) {
|
||||
tx = -tx;
|
||||
}
|
||||
if (!isHorizontal) {
|
||||
ty = tx;
|
||||
tx = 0;
|
||||
}
|
||||
const transform = `rotateX(${r(isHorizontal ? 0 : -slideAngle)}deg) rotateY(${r(isHorizontal ? slideAngle : 0)}deg) translate3d(${tx}px, ${ty}px, ${tz}px)`;
|
||||
if (progress <= 1 && progress > -1) {
|
||||
wrapperRotate = slideIndex * 90 + progress * 90;
|
||||
if (rtl) wrapperRotate = -slideIndex * 90 - progress * 90;
|
||||
}
|
||||
slideEl.style.transform = transform;
|
||||
if (params.slideShadows) {
|
||||
createSlideShadows(slideEl, progress, isHorizontal);
|
||||
}
|
||||
}
|
||||
wrapperEl.style.transformOrigin = `50% 50% -${swiperSize / 2}px`;
|
||||
wrapperEl.style['-webkit-transform-origin'] = `50% 50% -${swiperSize / 2}px`;
|
||||
if (params.shadow) {
|
||||
if (isHorizontal) {
|
||||
cubeShadowEl.style.transform = `translate3d(0px, ${swiperWidth / 2 + params.shadowOffset}px, ${-swiperWidth / 2}px) rotateX(89.99deg) rotateZ(0deg) scale(${params.shadowScale})`;
|
||||
} else {
|
||||
const shadowAngle = Math.abs(wrapperRotate) - Math.floor(Math.abs(wrapperRotate) / 90) * 90;
|
||||
const multiplier = 1.5 - (Math.sin(shadowAngle * 2 * Math.PI / 360) / 2 + Math.cos(shadowAngle * 2 * Math.PI / 360) / 2);
|
||||
const scale1 = params.shadowScale;
|
||||
const scale2 = params.shadowScale / multiplier;
|
||||
const offset = params.shadowOffset;
|
||||
cubeShadowEl.style.transform = `scale3d(${scale1}, 1, ${scale2}) translate3d(0px, ${swiperHeight / 2 + offset}px, ${-swiperHeight / 2 / scale2}px) rotateX(-89.99deg)`;
|
||||
}
|
||||
}
|
||||
const zFactor = (browser.isSafari || browser.isWebView) && browser.needPerspectiveFix ? -swiperSize / 2 : 0;
|
||||
wrapperEl.style.transform = `translate3d(0px,0,${zFactor}px) rotateX(${r(swiper.isHorizontal() ? 0 : wrapperRotate)}deg) rotateY(${r(swiper.isHorizontal() ? -wrapperRotate : 0)}deg)`;
|
||||
wrapperEl.style.setProperty('--swiper-cube-translate-z', `${zFactor}px`);
|
||||
};
|
||||
const setTransition = duration => {
|
||||
const {
|
||||
el,
|
||||
slides
|
||||
} = swiper;
|
||||
slides.forEach(slideEl => {
|
||||
slideEl.style.transitionDuration = `${duration}ms`;
|
||||
slideEl.querySelectorAll('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').forEach(subEl => {
|
||||
subEl.style.transitionDuration = `${duration}ms`;
|
||||
});
|
||||
});
|
||||
if (swiper.params.cubeEffect.shadow && !swiper.isHorizontal()) {
|
||||
const shadowEl = el.querySelector('.swiper-cube-shadow');
|
||||
if (shadowEl) shadowEl.style.transitionDuration = `${duration}ms`;
|
||||
}
|
||||
};
|
||||
effectInit({
|
||||
effect: 'cube',
|
||||
swiper,
|
||||
on,
|
||||
setTranslate,
|
||||
setTransition,
|
||||
recreateShadows,
|
||||
getEffectParams: () => swiper.params.cubeEffect,
|
||||
perspective: () => true,
|
||||
overwriteParams: () => ({
|
||||
slidesPerView: 1,
|
||||
slidesPerGroup: 1,
|
||||
watchSlidesProgress: true,
|
||||
resistanceRatio: 0,
|
||||
spaceBetween: 0,
|
||||
centeredSlides: false,
|
||||
virtualTranslate: true
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
export { EffectCube as default };
|
||||
Reference in New Issue
Block a user