(function () {

  var _carousel,
    _timer,
    _mouse = {},
    TIME = 4000;

  var _html = `<section class="ads-box">
    <ul class="ads-container"></ul>
    <ul class="ads-icon-container"></ul>
  </section>
  `
  var _width = 0;
  var _$box = null,
    _$view = null,
    _$icon = null;

  var $ = function (selector) {
    return document.querySelector(selector);
  }

  function mount(ele, srcs) {
    var div = document.createElement('div');
    var iconHTML = '', t = [];

    div.innerHTML = _html;
    ele.appendChild(div.children[0]);
    for(var i in srcs) {
      t.push('<li class="ads-item"><img src="' + srcs[i] + '"></li>');
    }
    t.push( t[0] );
    t.unshift( t.slice(-2, -1) );
    ele.querySelector('.ads-container').innerHTML = t.join('');

    _width = ele.querySelector('li').getBoundingClientRect().width;

    ele = ele.querySelector('.ads-container');
    ele.style.width = _width * t.length + 'px';
    ele.style.left  = -_width + 'px';
    ele.style.transition = 'all .6s ease-in-out';

    for (var i = 0; i < srcs.length; i++) {
      iconHTML += '<li class="ads-icon ' + (i == 0 ? 'current-icon' : '') + '"></li>';
    }

    ele.parentNode.querySelector('.ads-icon-container').innerHTML = iconHTML

    return {
      view: ele.parentNode,
      box: ele,
      icon: ele.querySelector('.ads-icon-container')
    }
  }

  function init(ele, pics, time) {
    var t = mount(ele, pics);

    _$view = t.view;
    _$box = t.box;
    _$icon = t.icon;

    TIME = time || TIME;

    _$view.addEventListener('touchstart', function (e) {
      _mouse.start = e.touches[0];
    });

    _$view.addEventListener('touchmove', function (e) {
      _mouse.end = e.touches[e.touches.length - 1]
    });

    _$view.addEventListener('touchend', function (e) {
      var t = _mouse.end.clientX - _mouse.start.clientX;
      if (t > 30) {
        _carousel(-1);
      } else if (t < -30) {
        _carousel(1);
      } else {
        return;
      }

      clearInterval(_timer);
      _timer = setInterval(_carousel, TIME);
    });

    _carousel = carousel();
    _timer = setInterval(_carousel, TIME);
  }

  function carousel() {
    var $iconBox,
      length = _$box.querySelectorAll('.ads-item').length;

    if (length == 0) {
      return function () {
        clearInterval(_timer);
      };
    }

    var _index = 0,
      boxWidth;
      
    var iconHTML = '';
    var prop = -_width;

    function move(offset) {
      _index += offset || 1;

      prop = -_width * (_index + 1);

      if (_index == -1) {
        prop = 0;

        setTimeout(function () {
          _index = 1;
          _$box.style.transition = 'initial';
          _$box.style.left = -_width * length + 'px';
        }, 700);
      }

      _$box.style.transition = 'all .6s ease-in-out',
      _$box.style.left =  prop + 'px';
      

      if (_index == length) {
        _index = 0;
        prop = -_width;

        setTimeout(function () {
          _$box.css({
            transition: 'initial',
            left: prop + 'px'
          });
        }, 700)
      }

      $iconBox.find('.current-icon').removeClass('current-icon');
      $iconBox.find('i').eq(_index).addClass('current-icon');
    }

    return move;
  }

  window.carousel = init;
}());
@@ -1298,24 +1298,35 @@
   icon: ele.
+parentNode.
 querySelecto
@@ -1423,24 +1423,51 @@
 le, pics);%0A%0A
+    _length = pics.length;%0A
     _$view =
@@ -2191,94 +2191,16 @@
 ) %7B%0A
-    var $iconBox,%0A      length = _$box.querySelectorAll('.ads-item').length;%0A%0A
     if (
 leng
@@ -2195,16 +2195,17 @@
     if (
+_
 length =
@@ -2657,16 +2657,17 @@
 width * 
+_
 length +
@@ -2820,16 +2820,17 @@
 ndex == 
+_
 length) 
@@ -2929,26 +2929,14 @@
 box.
-css(%7B%0A            
+style.
 tran
@@ -2941,17 +2941,18 @@
 ansition
-:
+ =
  'initia
@@ -2969,15 +2969,27 @@
     
-  
+_$box.style.
 left
-:
+ = 
  pro
@@ -3000,21 +3000,8 @@
 'px'
-%0A          %7D)
 ;%0A  
@@ -3033,50 +3033,93 @@
     
-$iconBox.find('.current-icon').removeClass
+let t = _$icon.querySelector('.current-icon')%0A      t.className = t.className.replace
 ('cu
@@ -3125,24 +3125,28 @@
 urrent-icon'
+, ''
 );%0A      $ic
@@ -3146,47 +3146,98 @@
     
-$iconBox.find('i').eq(_index).addClass(
+t = _$icon.querySelectorAll('.ads-icon')%5B_index%5D;%0A      t.className = t.className + ' ' + 
 'cur
@@ -3246,17 +3246,16 @@
 nt-icon'
-)
 ;%0A    %7D%0A

fix carousel