Merge pull request #892 from sgaliano/master

Added definitions for Swiper

README.md

@@ -172,6 +172,7 @@ List of Definitions
 * [Spin](http://fgnass.github.com/spin.js/) (by [Boris Yankov](https://github.com/borisyankov))
 * [Store.js](https://github.com/marcuswestin/store.js/) (by [Vincent Bortone](https://github.com/vbortone))
 * [Sugar](http://sugarjs.com/) (by [Josh Baldwin](https://github.com/jbaldwin/))
+* [Swiper](www.idangero.us/sliders/swiper/‎) (by [Sebastián Galiano](https://github.com/sgaliano))
 * [SwipeView](http://cubiq.org/swipeview) (by [Boris Yankov](https://github.com/borisyankov))
 * [Tags Manager](http://welldonethings.com/tags/manager) (by [Vincent Bortone](https://github.com/vbortone))
 * [Teechart](http://www.steema.com) (by [Steema](http://www.steema.com))

swiper/swiper-tests.ts

@@ -0,0 +1,330 @@
+/// <reference path="swiper.d.ts" />
+/// <reference path="../jquery/jquery.d.ts" />
+
+//
+// Main demos
+//
+
+// 01-default.html
+function defaultDemo() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        loop: true,
+        grabCursor: true,
+        paginationClickable: true
+    });
+
+    $('.arrow-left').on('click', function (e) {
+        e.preventDefault();
+        mySwiper.swipePrev();
+    });
+
+    $('.arrow-right').on('click', function (e) {
+        e.preventDefault();
+        mySwiper.swipeNext();
+    });
+}
+
+// 02-vertical-mode.html
+function verticalMode() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        mode: 'vertical'
+    });
+}
+
+// 03-dynamic-slides.html
+function dynamicSlides() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true
+    });
+    
+    function randomColor() {
+        var colors = ('blue red green orange pink').split(' ');
+        return colors[Math.floor(Math.random() * colors.length)];
+    }
+
+    var count = 4;
+
+    $('.sdl-append').click(function (e) {
+        e.preventDefault();
+        mySwiper.appendSlide('<div class="title">Slide ' + (++count) + '</div>', 'swiper-slide ' + randomColor() + '-slide')
+    });
+
+    $('.sdl-prepend').click(function (e) {
+        e.preventDefault();
+        mySwiper.prependSlide('<div class="title">Slide  ' + (++count) + '</div>', 'swiper-slide ' + randomColor() + '-slide')
+    });
+
+    $('.sdl-swap').click(function (e) {
+        e.preventDefault();
+        mySwiper
+            .getFirstSlide()
+            .insertAfter(1);
+    });
+
+    $('.sdl-insert').click(function (e) {
+        e.preventDefault();
+        mySwiper
+            .createSlide('<div class="title">Slide  ' + (++count) + '</div>', 'swiper-slide ' + randomColor() + '-slide')
+            .insertAfter(0);
+    });
+
+    $('.sdl-remove1').click(function (e) {
+        e.preventDefault();
+        mySwiper.removeSlide(0);
+    });
+
+    $('.sdl-removel').click(function (e) {
+        e.preventDefault();
+        mySwiper.removeLastSlide();
+    });
+
+    $('.sdl-remove2').click(function (e) {
+        e.preventDefault();
+        mySwiper.removeSlide(1);
+    });
+}
+
+// 04-scroll-container.html
+function scrollContainer() {
+    var mySwiper = new Swiper('.swiper-container', {
+        scrollContainer: true,
+        scrollbar: {
+            container: '.swiper-scrollbar'
+        }
+    });
+}
+
+// 05-free-mode.html
+function freeMode() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        freeMode: true,
+        freeModeFluid: true
+    });
+}
+
+// 06-carousel-mode.html 
+function carouselMode() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        slidesPerView: 3
+    });
+}
+
+// 07-carousel-loop.html
+function carouselLoop() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        slidesPerView: 3,
+        loop: true
+    });
+}
+
+// 08-nested.html
+function nested() {
+    var swiperParent = new Swiper('.swiper-parent', {
+        pagination: '.pagination-parent',
+        paginationClickable: true,
+        slidesPerView: 3
+    });
+
+    var swiperNested1 = new Swiper('.swiper-nested-1', {
+        mode: 'vertical',
+        pagination: '.pagination-nested-1',
+        paginationClickable: true,
+        slidesPerView: 2
+    });
+
+    var swiperNested2 = new Swiper('.swiper-nested-2', {
+        mode: 'vertical',
+        pagination: '.pagination-nested-2',
+        paginationClickable: true,
+        slidesPerView: 2
+    });
+}
+
+// 09-nested-loop.html
+function nestedLoop() {
+    var swiperParent = new Swiper('.swiper-parent', {
+        pagination: '.pagination-parent',
+        paginationClickable: true,
+        loop: true,
+        slidesPerView: 3
+    });
+
+    var swiperNested1 = new Swiper('.swiper-nested', {
+        mode: 'vertical',
+        pagination: '.pagination-nested',
+        paginationClickable: true,
+        slidesPerView: 2
+    });
+}
+
+// 10-tabs.html
+function tabs() {
+    var tabsSwiper = new Swiper('.swiper-container', {
+        onlyExternal: true,
+        speed: 500
+    });
+
+    $(".tabs a").on('touchstart mousedown', function (e) {
+        e.preventDefault();
+        $(".tabs .active").removeClass('active');
+        $(this).addClass('active');
+        tabsSwiper.swipeTo($(this).index());
+    });
+
+    $(".tabs a").click(function (e) {
+        e.preventDefault();
+    });
+}
+
+// 11-tabs-feedback.html
+function tabsFeedback() {
+    var tabsSwiper = new Swiper('.swiper-container', {
+        speed: 500,
+        onSlideChangeStart: function () {
+            $(".tabs .active").removeClass('active');
+            $(".tabs a").eq(tabsSwiper.activeIndex).addClass('active');
+        }
+    });
+
+    $(".tabs a").on('touchstart mousedown', function (e) {
+        e.preventDefault();
+        $(".tabs .active").removeClass('active');
+        $(this).addClass('active');
+        tabsSwiper.swipeTo($(this).index());
+    });
+
+    $(".tabs a").click(function (e) {
+        e.preventDefault();
+    });
+}
+
+// 12-partial-display.html
+function partialDisplay() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        slidesPerView: 'auto'
+    });
+}
+
+// 13-threshold.html
+function threshold() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        moveStartThreshold: 100
+    });
+}
+
+// 14-different-widths.html
+function differentWidths() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        slidesPerView: 'auto'
+    });
+}
+
+// 15-centered-slides.html
+function centeredSlides() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        centeredSlides: true,
+        slidesPerView: 'auto'
+    });
+}
+
+// 16-visibility-api.html
+function visibilityApi() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true,
+        centeredSlides: true,
+        slidesPerView: 3,
+        watchActiveIndex: true
+    });
+}
+
+// 17 - responsive.html 
+function responsive() {
+    var mySwiper = new Swiper('.swiper-container', {
+        pagination: '.pagination',
+        paginationClickable: true
+    });
+}
+
+
+//
+// Scrollbar
+//
+
+// demo-1.html
+function demo1() {
+    var mySwiper = new Swiper('.swiper-container', {
+        scrollbar: {
+            container: '.swiper-scrollbar',
+            hide: false,
+            draggable: false
+        }
+    });
+}
+
+// demo-2.html
+function demo2() {
+    var mySwiper = new Swiper('.swiper-container', {
+        scrollbar: {
+            container: '.swiper-scrollbar',
+            hide: false,
+            draggable: true
+        }
+    });
+}
+
+// demo-3.html
+function demo3() {
+    var mySwiper = new Swiper('.swiper-container', {
+        scrollbar: {
+            container: '.swiper-scrollbar',
+            hide: true,
+            draggable: true
+        }
+    });
+}
+
+// demo-4.html
+function demo4() {
+    var mySwiper = new Swiper('.swiper-container', {
+        slidesPerView: 3,
+        scrollbar: {
+            container: '.swiper-scrollbar',
+            hide: false,
+            draggable: true,
+            snapOnRelease: true
+        }
+    });
+}
+
+// demo-5.html
+function demo5() {
+    var mySwiper = new Swiper('.swiper-container', {
+        scrollContainer: true,
+        mousewheelControl: true,
+        mode: 'vertical',
+        scrollbar: {
+            container: '.swiper-scrollbar',
+            hide: true,
+            draggable: false
+        }
+    });
+}

swiper/swiper.d.ts

@@ -0,0 +1,195 @@
+// Type definitions for Swiper 2.0.0
+// Project: https://github.com/nolimits4web/Swiper
+// Definitions by: Sebastián Galiano <https://github.com/sgaliano/>
+// Definitions: https://github.com/borisyankov/DefinitelyTyped
+
+
+interface SwiperOptions {
+    speed?: number;
+    autoplay?: number;
+    mode?: string;
+    loop?: boolean;
+    loopAdditionalSlides?: number;
+    slidesPerView?: any;
+    slidesPerGroup?: number;
+    calculateHeight?: boolean;
+    updateOnImagesReady?: boolean;
+    releaseFormElements?: boolean;
+    watchActiveIndex?: boolean;
+    visibilityFullFit?: boolean;
+    autoResize?: boolean;
+    resizeReInit?: boolean;
+    DOMAnimation?: boolean;
+    resistance?: any;
+    noSwiping?: boolean;
+    preventLinks?: boolean;
+    initialSlide?: number;
+    useCSS3Transforms?: boolean;
+
+    // Free Mode and Scroll Container
+    freeMode?: boolean;
+    freeModeFluid?: boolean;
+    scrollContainer?: boolean;
+    momentumRatio?: number;
+    momentumBounce?: boolean;
+    momentumBounceRatio?: number;
+
+    // Slides offset
+    centeredSlides?: boolean;
+    offsetPxBefore?: number;
+    offsetPxAfter?: number;
+    offsetSlidesBefore?: number;
+    offsetSlidesAfter?: number;
+
+    // Touch/mouse interactions
+    touchRatio?: number;
+    simulateTouch?: boolean;
+    onlyExternal?: boolean;
+    followFinger?: boolean;
+    grabCursor?: boolean;
+    shortSwipes?: boolean;
+    moveStartThreshold?: number;
+
+    // Navigation
+    keyboardControl?: boolean;
+    mousewheelControl?: boolean;
+
+    // Pagination
+    pagination?: any;
+    paginationClickable?: boolean;
+    paginationAsRange?: boolean;
+    createPagination?: boolean;
+
+    // Namespace
+    wrapperClass?: string;
+    slideClass?: string;
+    slideActiveClass?: string;
+    slideVisibleClass?: string;
+    slideElement?: string;
+    noSwipingClass?: string;
+    paginationElement?: string;
+    paginationElementClass?: string;
+    paginationActiveClass?: string;
+    paginationVisibleClass?: string;
+
+    // Callbacks
+    queueStartCallbacks?: boolean;
+    queueEndCallbacks?: boolean;
+    onTouchStart?: (swiper: Swiper) => void;
+    onTouchMove?: (swiper: Swiper) => void;
+    onTouchEnd?: (swiper: Swiper) => void;
+    onSlideReset?: (swiper: Swiper) => void;
+    onSlideChangeStart?: (swiper: Swiper) => void;
+    onSlideChangeEnd?: (swiper: Swiper) => void;
+    onSlideClick?: (swiper: Swiper) => void;
+    onSlideTouch?: (swiper: Swiper) => void;
+    onImagesReady?: (swiper: Swiper) => void;
+    onMomentumBounce?: (swiper: Swiper) => void;
+    onResistanceBefore?: (swiper: Swiper, distance) => void;
+    onResistanceAfter?: (swiper: Swiper, distance) => void;
+
+    // Slides Loader
+    loader?: {
+        slides?: Array;
+        slidesHTMLType?: string;
+        surroundGroups?: number;
+        logic?: string;
+        loadAllSlides?: boolean;
+    };
+
+    // Plugins
+    scrollbar?: SwiperScrollbarOptions;
+}
+
+interface SwiperScrollbarOptions {
+    container: string;          // Default: '.swiper-scrollbar'
+    draggable?: boolean;        // Default: true
+    hide?: boolean;             // Default: true
+    snapOnRelease?: boolean;    // Default: false
+}
+
+declare class SwiperSlide {
+    append(): SwiperSlide;
+    clone(): SwiperSlide;
+    getWidth(): number;
+    getHeight(): number;
+    getOffset(): { top: number; left: number; };
+    insertAfter(index: number): SwiperSlide;
+    prepend(): SwiperSlide;
+    remove(): void;
+}
+
+declare class Swiper {
+    constructor(container: string, options?: SwiperOptions);
+    constructor(container: Element, options?: SwiperOptions);
+
+    // Properties
+    width: number;
+    height: number;
+    params;
+    positions;
+
+    // Feature detection
+    support: {
+        touch: boolean;
+        transforms: boolean;
+        transforms3d: boolean;
+        transitions: boolean;
+    };
+
+    // Browser detection
+    browser: {
+        ie8: boolean;
+        ie10: boolean;
+    };
+
+    // Navigation
+    activeIndex: number;
+    activeLoopIndex: number;
+    activeLoaderIndex: number;
+    previousIndex: number;
+    swipeNext(internal?: boolean): boolean;
+    swipePrev(internal?: boolean): boolean;
+    swipeReset(): boolean;
+    swipeTo(index: number, speed?: number, runCallbacks?: boolean): boolean;
+    activeSlide(): SwiperSlide;
+    updateActiveSlide(index: number): void;
+
+    // Events
+    touches;
+    isTouched: boolean;
+    clickedSlideIndex: number;
+    clickedSlide: SwiperSlide;
+    wrapperTransitionEnd(callback: () => void, permanent: boolean): void;
+
+    // Init/reset
+    destroy(removeResizeEvent?: boolean): void;
+    reInit(forceCalcSlides?: boolean): void;
+    resizeFix(reInit?: boolean): void;
+
+    // Autoplaying
+    autoplay: boolean;
+    startAutoplay(): void;
+    stopAutoplay(): void;
+
+    // Other methods
+    getWrapperTranslate(axis: string): number;  // 'x' or 'y'
+    setWrapperTranslate(x: number, y: number, z: number): void;
+    setWrapperTransition(duration): void;
+
+    // Slides API
+    slides: Array<SwiperSlide>;
+    createSlide(html: string, slideClassList?: string, element?: string): SwiperSlide;
+    appendSlide(html: string, slideClassList?: string, element?: string): SwiperSlide;
+    appendSlide(slideInstance: HTMLElement): SwiperSlide;
+    prependSlide(html: string, slideClassList?: string, element?: string): SwiperSlide;
+    prependSlide(slideInstance: HTMLElement): SwiperSlide;
+    insertSlideAfter(index: number, html: string, slideClassList?: string, element?: string): SwiperSlide;
+    insertSlideAfter(index: number, slideInstance: HTMLElement): SwiperSlide;
+    removeSlide(index: number): boolean;
+    removeLastSlide(): boolean;
+    removeAllSlides(): void;
+    getSlide(index: number): SwiperSlide;
+    getLastSlide(): SwiperSlide;
+    getFirstSlide(): SwiperSlide;
+}