$(document).ready(function() {
  
  var $slider = $(".slider"),
      $slidebgs = $(".slide__bg"),
      diff = 0,
      curslide = 0,
      numofslides = $(".slide").length-1,
      animating = false,
      animtime = 200,
      autoslidetimeout,
      autoslidedelay =2400,
      $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();
  });
  
});