vhad/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/gosticks/DefinitelyTyped.git synced 2026-10-05 07:17:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

addd module instalarion test

Browse Source
This commit is contained in:
Luiz Filipe Machado Barni
2018-08-31 11:08:13 -03:00
parent a412f55a1b
commit 716cc06a89
1 changed files with 73 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
types/swiper/swiper-tests.ts
+73 -46
View File
@@ -3,54 +3,62 @@
* for more details, please see http://idangero.us/swiper/demos/
* @author Eugene Matseruk
*/
import { Swiper } from 'swiper';
import { Swiper, Navigation, History } from 'swiper';
const containerSelector = '.swiper-container';
/**
* 010-default
*/
function defaultDemo() {
const swiper = new Swiper('.swiper-container');
const swiper = new Swiper(containerSelector);
}
/**
* 020-navigation
*/
function navigation() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
swiper.navigation.update();
}
/**
* 030-pagination
*/
function pagination() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
},
});
swiper.pagination.update();
}
/**
* 040-pagination-dynamic
*/
function paginationDynamic() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
dynamicBullets: true,
},
});
swiper.pagination.update();
}
/**
* 050-progress-pagination
*/
function paginationProgress() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
type: 'progressbar',
@@ -60,13 +68,16 @@ function paginationProgress() {
prevEl: '.swiper-button-prev',
},
});
swiper.pagination.update();
swiper.navigation.update();
}
/**
* 060-pagination-fraction
*/
function paginationFraction() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
type: 'fraction',
@@ -76,13 +87,16 @@ function paginationFraction() {
prevEl: '.swiper-button-prev',
},
});
swiper.pagination.update();
swiper.navigation.update();
}
/**
* 070-pagination-custom
*/
function paginationCustom() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
clickable: true,
@@ -91,25 +105,29 @@ function paginationCustom() {
},
},
});
swiper.pagination.render();
}
/**
* 080-scrollbar
*/
function scrollbar() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
scrollbar: {
el: '.swiper-scrollbar',
hide: true,
},
});
swiper.scrollbar.updateSize();
}
/**
* Vertical Slider
*/
function verticalSlider() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
direction: 'vertical',
pagination: {
el: '.swiper-pagination',
@@ -122,7 +140,7 @@ function verticalSlider() {
* Space Between Slides
*/
function spaceBetween() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
spaceBetween: 30,
pagination: {
el: '.swiper-pagination',
@@ -135,7 +153,7 @@ function spaceBetween() {
* Multiple Slides Per View
*/
function multipleSlidesPerView() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
spaceBetween: 30,
pagination: {
@@ -149,7 +167,7 @@ function multipleSlidesPerView() {
* Auto Slides Per View / Carousel Mode
*/
function autoSlidesPerViewAndCarouserMode() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 'auto',
spaceBetween: 30,
pagination: {
@@ -163,7 +181,7 @@ function autoSlidesPerViewAndCarouserMode() {
* Centered Slides
*/
function centeredSlides() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 4,
spaceBetween: 30,
centeredSlides: true,
@@ -178,7 +196,7 @@ function centeredSlides() {
* Centered Slides + Auto Slides Per View
*/
function centeredSlidesAndAutoSlidesPerView() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 'auto',
centeredSlides: true,
spaceBetween: 30,
@@ -193,7 +211,7 @@ function centeredSlidesAndAutoSlidesPerView() {
* Free Mode / No Fixed Positions
*/
function freeModeAndNoFixedPositions() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
spaceBetween: 30,
freeMode: true,
@@ -208,7 +226,7 @@ function freeModeAndNoFixedPositions() {
* Scroll Container
*/
function scrollContainer() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
direction: 'vertical',
slidesPerView: 'auto',
freeMode: true,
@@ -223,7 +241,7 @@ function scrollContainer() {
* Multi Row Slides Layout
*/
function multiRowSlides() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
slidesPerColumn: 2,
spaceBetween: 30,
@@ -258,7 +276,7 @@ function nestedSwipers() {
* Grab Cursor
*/
function grabCursor() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 4,
centeredSlides: true,
spaceBetween: 30,
@@ -274,7 +292,7 @@ function grabCursor() {
* Loop Mode / Infinite Loop
*/
function loopMode() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 1,
spaceBetween: 30,
loop: true,
@@ -293,7 +311,7 @@ function loopMode() {
* Loop Mode with Multiple Slides Per Group
*/
function loopModeWithMultipleSlides() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
spaceBetween: 30,
slidesPerGroup: 3,
@@ -314,7 +332,7 @@ function loopModeWithMultipleSlides() {
* Fade Effect
*/
function fadeEffect() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
spaceBetween: 30,
effect: 'fade',
pagination: {
@@ -332,7 +350,7 @@ function fadeEffect() {
* 3D Cube Effect
*/
function cube3dEffect() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
effect: 'cube',
grabCursor: true,
cubeEffect: {
@@ -351,7 +369,7 @@ function cube3dEffect() {
* 3D Coverflow Effect
*/
function coverflow3dEffect() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
effect: 'coverflow',
grabCursor: true,
centeredSlides: true,
@@ -373,7 +391,7 @@ function coverflow3dEffect() {
* 3D Flip Effect
*/
function flip3dEffect() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
effect: 'flip',
grabCursor: true,
pagination: {
@@ -390,7 +408,7 @@ function flip3dEffect() {
* Keyboard Control (Open in new window)
*/
function keyboardControl() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 1,
spaceBetween: 30,
keyboard: {
@@ -411,7 +429,7 @@ function keyboardControl() {
* Mousewheel Control
*/
function mouseWheelControl() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
direction: 'vertical',
slidesPerView: 1,
spaceBetween: 30,
@@ -427,7 +445,7 @@ function mouseWheelControl() {
* Autoplay
*/
function autoplay() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
spaceBetween: 30,
centeredSlides: true,
autoplay: {
@@ -451,7 +469,7 @@ function autoplay() {
function dynamicSlides() {
let appendNumber = 4;
let prependNumber = 1;
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
centeredSlides: true,
spaceBetween: 30,
@@ -464,22 +482,22 @@ function dynamicSlides() {
prevEl: '.swiper-button-prev',
},
});
document.querySelector('.prepend-2-slides').addEventListener('click', (e) => {
document.querySelector('.prepend-2-slides').addEventListener('click', e => {
e.preventDefault();
swiper.prependSlide([
`<div class="swiper-slide">Slide ${--prependNumber}</div>`,
`<div class="swiper-slide">Slide ${--prependNumber}</div>`,
]);
});
document.querySelector('.prepend-slide').addEventListener('click', (e) => {
document.querySelector('.prepend-slide').addEventListener('click', e => {
e.preventDefault();
swiper.prependSlide(`<div class="swiper-slide">Slide ${--prependNumber}</div>`);
});
document.querySelector('.append-slide').addEventListener('click', (e) => {
document.querySelector('.append-slide').addEventListener('click', e => {
e.preventDefault();
swiper.appendSlide(`<div class="swiper-slide">Slide ${--appendNumber}</div>`);
});
document.querySelector('.append-2-slides').addEventListener('click', (e) => {
document.querySelector('.append-2-slides').addEventListener('click', e => {
e.preventDefault();
swiper.appendSlide([
`<div class="swiper-slide">Slide ${--appendNumber}</div>`,
@@ -514,7 +532,7 @@ function thumbsGalleryWithTwoWayControl() {
* Hash Navigation (Open in new window)
*/
function hashNavigation() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
spaceBetween: 30,
hashNavigation: {
watchState: true,
@@ -534,7 +552,7 @@ function hashNavigation() {
* History API (Open in new window)
*/
function historyApi() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
spaceBetween: 50,
slidesPerView: 1,
navigation: {
@@ -554,7 +572,7 @@ function historyApi() {
* RTL Layout
*/
function rtlLayout() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
pagination: {
el: '.swiper-pagination',
clickable: true,
@@ -570,7 +588,7 @@ function rtlLayout() {
* Parallax
*/
function parallax() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
speed: 600,
parallax: true,
pagination: {
@@ -588,7 +606,7 @@ function parallax() {
* Lazy Loading Images
*/
function lazyLoadingImages() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
// Enable lazy loading
lazy: true,
pagination: {
@@ -606,7 +624,7 @@ function lazyLoadingImages() {
* Responsive Breakpoints
*/
function responsiveBreakpoints() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 5,
spaceBetween: 50,
// init: false,
@@ -639,7 +657,7 @@ function responsiveBreakpoints() {
* Auto Height
*/
function autoHeight() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
autoHeight: true, // enable auto height
spaceBetween: 20,
pagination: {
@@ -657,7 +675,7 @@ function autoHeight() {
* Zoom
*/
function zoom() {
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
zoom: true,
pagination: {
el: '.swiper-pagination',
@@ -686,7 +704,7 @@ function virtualSlides() {
slides.push('Slide ' + (i + 1));
}
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 3,
centeredSlides: true,
spaceBetween: 30,
@@ -702,15 +720,15 @@ function virtualSlides() {
slides
},
});
document.querySelector('.slide-1').addEventListener('click', (e) => {
document.querySelector('.slide-1').addEventListener('click', e => {
e.preventDefault();
swiper.slideTo(0, 0);
});
document.querySelector('.slide-250').addEventListener('click', (e) => {
document.querySelector('.slide-250').addEventListener('click', e => {
e.preventDefault();
swiper.slideTo(249, 0);
});
document.querySelector('.slide-500').addEventListener('click', (e) => {
document.querySelector('.slide-500').addEventListener('click', e => {
e.preventDefault();
swiper.slideTo(499, 0);
});
@@ -721,7 +739,7 @@ function virtualSlides() {
*/
function slideableNavigation() {
const menuButton = document.querySelector('.menu-button');
const swiper = new Swiper('.swiper-container', {
const swiper = new Swiper(containerSelector, {
slidesPerView: 'auto',
initialSlide: 1,
resistanceRatio: 0,
@@ -748,3 +766,12 @@ function slideableNavigation() {
}
});
}
/**
* Swiper module instalation.
*/
function staticUseModules() {
Swiper.use([Navigation, History]);
const swiper = new Swiper(containerSelector);
}