$(document).ready(function() {

    var $slider = $(".slider"),
        $slidebgs = $(".slide__bg"),
        diff = 0,
        curslide = 0,
        numofslides = $(".slide").length-1,
        animating = false,
        animtime = 500,
        autoslidetimeout,
        autoslidedelay = 6000,
        $pagination = $(".slider-pagi");

    function createbullets() {
        for (var i = 0; i < numofslides+1; i++) {
            var $li = $("<li class='slider-pagi__elem'></li>");
            $li.addclass("slider-pagi__elem-"+i).data("page", i);
            if (!i) $li.addclass("active");
            $pagination.append($li);
        }
    };

    createbullets();

    function managecontrols() {
        $(".slider-control").removeclass("inactive");
        if (!curslide) $(".slider-control.left").addclass("inactive");
        if (curslide === numofslides) $(".slider-control.right").addclass("inactive");
    };

    function autoslide() {
        autoslidetimeout = settimeout(function() {
            curslide++;
            if (curslide > numofslides) curslide = 0;
            changeslides();
        }, autoslidedelay);
    };

    autoslide();

    function changeslides(instant) {
        if (!instant) {
            animating = true;
            managecontrols();
            $slider.addclass("animating");
            $slider.css("top");
            $(".slide").removeclass("active");
            $(".slide-"+curslide).addclass("active");
            settimeout(function() {
                $slider.removeclass("animating");
                animating = false;
            }, animtime);
        }
        window.cleartimeout(autoslidetimeout);
        $(".slider-pagi__elem").removeclass("active");
        $(".slider-pagi__elem-"+curslide).addclass("active");
        $slider.css("transform", "translate3d("+ -curslide*100 +"%,0,0)");
        $slidebgs.css("transform", "translate3d("+ curslide*50 +"%,0,0)");
        diff = 0;
        autoslide();
    }

    function navigateleft() {
        if (animating) return;
        if (curslide > 0) curslide--;
        changeslides();
    }

    function navigateright() {
        if (animating) return;
        if (curslide < numofslides) curslide++;
        changeslides();
    }

    $(document).on("mousedown touchstart", ".slider", function(e) {
        if (animating) return;
        window.cleartimeout(autoslidetimeout);
        var startx = e.pagex || e.originalevent.touches[0].pagex,
            winw = $(window).width();
        diff = 0;

        $(document).on("mousemove touchmove", function(e) {
            var x = e.pagex || e.originalevent.touches[0].pagex;
            diff = (startx - x) / winw * 70;
            if ((!curslide && diff < 0) || (curslide === numofslides && diff > 0)) diff /= 2;
            $slider.css("transform", "translate3d("+ (-curslide*100 - diff) +"%,0,0)");
            $slidebgs.css("transform", "translate3d("+ (curslide*50 + diff/2) +"%,0,0)");
        });
    });

    $(document).on("mouseup touchend", function(e) {
        $(document).off("mousemove touchmove");
        if (animating) return;
        if (!diff) {
            changeslides(true);
            return;
        }
        if (diff > -8 && diff < 8) {
            changeslides();
            return;
        }
        if (diff <= -8) {
            navigateleft();
        }
        if (diff >= 8) {
            navigateright();
        }
    });

    $(document).on("click", ".slider-control", function() {
        if ($(this).hasclass("left")) {
            navigateleft();
        } else {
            navigateright();
        }
    });

    $(document).on("click", ".slider-pagi__elem", function() {
        curslide = $(this).data("page");
        changeslides();
    });

});