$(function() {
  // nav
  (function() {
    var $nav = $('#nav');
    var $navSec = $('.nav-sec');
    var curClass = 'cur';
    var navCur = false;
    $nav.find('ul:first').children('li').hover(function() {
      if ($(this).find($navSec).length > 0) {
        $(this).addClass(curClass);
      }
    }, function() {
      $(this).removeClass(curClass);
    });
  })();

  // search
  (function() {
    var $btn = $('.btn-search'),
      $search = $('#h-search');

    $btn.on('click', function(e) {
      e.stopPropagation();
      if ($search.is(':hidden')) {
        $search.show();
      } else {
        $search.hide();
      }
    });

    $search.on('click', function(e) {
      e.stopPropagation();
    });

    $(document).on('click', function() {
      $search.hide();
    });
  })();

  // LINKS
  (function() {
    var $select = $('.select-group'),
      $selected = $select.find('.select-selected'),
      $options = $select.find('.select-options');

    $select.on('click', function(e) {
      e.stopPropagation();
    });

    $selected.on('click', function() {
      $options.is(':hidden') ? optionsShow() : optionsHide();
    });

    $options.on('click', function() {
      $options.hide();
    });

    $(window).on('click', function() {
      $options.hide();
    });

    function optionsShow() {
      $options.show();
      $select.css('zIndex', 101);
    }

    function optionsHide() {
      $options.hide();
      $select.css('zIndex', 1);
    }
  })();

  // banner
  (function() {
    var $banner = $('#banner'),
      $inner = $banner.find('.sliderInner'),
      $next = $banner.find('.btn-next'),
      $prev = $banner.find('.btn-prev'),
      $cur = $banner.find('.slider-cur');
    var index = 0;
    var itemSize = $inner.find('li').size();
    var timer = null;

    var $video = $('#banner-video');

    if ($banner.length <= 0) {
      return;
    }

    function init() {
      $inner.find('li:first').css('display', 'block');
      $.each($inner.find('li'), function(index, item) {
        $(this).attr('data-index', index);
      });

      resetZIndex();

      startFunc();

      $banner.hover(stopFunc, startFunc);

      $cur.find('a').on('click', function() {
        var index = $(this).index();

        displayCurrentItem(index);
      });
    }

    function startFunc() {
      timer = setInterval(nextFunc, 4500);
    }

    function stopFunc() {
      clearInterval(timer);
    }

    function nextFunc() {
      var nextIndex = index + 1;
      nextIndex = nextIndex > (itemSize - 1) ? 0 : nextIndex;

      displayCurrentItem(nextIndex);
    }

    function prevFunc() {
      var nextIndex = index - 1;
      nextIndex = nextIndex < 0 ? (itemSize - 1) : nextIndex;

      displayCurrentItem(nextIndex);
    }

    function resetZIndex() {
      $inner.find('li').each(function() {
        var _index = $(this).index();

        if (_index === index) {
          if ($(this).hasClass('vItem')) {
            if ($video[0] && $video[0].play) {
              $video[0].play();
              stopFunc();
              $video[0].onended = function() {
                setTimeout(startFunc, 1000);
              }
            }
          } else {
            if ($video[0] && $video[0].play) {
              $video[0].currentTime = 0;
            }
          }
        }
      });
    }

    init();
    $next.on('click', nextFunc);
    $prev.on('click', prevFunc);

    function displayCurrentItem(nextIndex) {
      var $indexItem = $inner.find('li').eq(index);
      var $nextIndexItem = $inner.find('li').eq(nextIndex);

      if ($nextIndexItem.hasClass('vItem')) {
        if ($video[0] && $video[0].play) {
          $video[0].play();
          stopFunc();
          $video[0].onended = function() {
            setTimeout(startFunc, 1000);
          }
        }
      }

      $indexItem.css('zIndex', 99);
      $nextIndexItem.css({
        display: 'block',
        zIndex: 9
      });

      $cur.find('a').removeClass('cur');
      $cur.find('a').eq(nextIndex).addClass('cur');

      $indexItem.animate({
        'opacity': 0
      }, 500, function() {
        index = nextIndex;
        $(this).css({
          opacity: 1,
          zIndex: 0
        });
        resetZIndex();
      });
    }
  })();

  (function() {
    var $slider = $('#comp-slider');
    var $inner = $slider.find('.sliderInner');
    var $moveDOM = $inner.find('ul:first');
    var $prev = $slider.find('.btn-prev');
    var $next = $slider.find('.btn-next');
    var $cur = $slider.find('.slider-cur');

    var len = $inner.find('li').length;
    var moveWidth = $inner.width();
    var itemWidth = $inner.find('li:first').outerWidth(true);

    var pageTotal = Math.ceil(itemWidth * len / moveWidth);

    var curIndex = 0;
    var timer = null;
    var ctime = 4500;
    var etime = moveWidth / 2;

    function init() {
      $moveDOM.width(itemWidth * len);

      $prev.on('click', prevFunc);
      $next.on('click', nextFunc);

      startFunc();

      $slider.hover(stopFunc, startFunc);
    }

    function startFunc() {
      timer = setInterval(nextFunc, ctime);
    }

    function stopFunc() {
      clearInterval(timer);
    }

    function nextFunc() {
      curIndex = ++curIndex > pageTotal - 1 ? 0 : curIndex;
      moveFunc();
    }

    function prevFunc() {
      curIndex = --curIndex < 0 ? pageTotal - 1 : curIndex;
      moveFunc();
    }

    function moveFunc() {
      $moveDOM.stop(true).animate({
        marginLeft: -moveWidth * curIndex
      }, etime, function() {
        renderCur();
      });
    }

    function renderCur() {
      $cur.find('a').removeClass().eq(curIndex).addClass('cur');
    }

    init();

  })();

  (function() {
    var $slider = $('#pho-slider');
    var $inner = $slider.find('.sliderInner');
    var $moveDOM = $inner.find('ul:first');
    var $prev = $slider.find('.btn-prev');
    var $next = $slider.find('.btn-next');
    // var $cur = $slider.find('.slider-cur');

    var len = $inner.find('li').length;
    var moveWidth = $inner.width();
    var itemWidth = $inner.find('li:first').outerWidth(true);

    // var pageTotal = Math.ceil(itemWidth * len / moveWidth);
    var pageTotal = len;

    var curIndex = 0;
    var timer = null;
    var ctime = 4500;
    var etime = moveWidth / 2;

    function init() {
      $moveDOM.width(itemWidth * len);

      $prev.on('click', prevFunc);
      $next.on('click', nextFunc);

      startFunc();

      $slider.hover(stopFunc, startFunc);
    }

    function startFunc() {
      timer = setInterval(nextFunc, ctime);
    }

    function stopFunc() {
      clearInterval(timer);
    }

    function nextFunc() {
      curIndex = ++curIndex > pageTotal - 1 ? 0 : curIndex;
      moveFunc();
    }

    function prevFunc() {
      curIndex = --curIndex < 0 ? pageTotal - 1 : curIndex;
      moveFunc();
    }

    function moveFunc() {
      $moveDOM.stop(true).animate({
        marginLeft: -moveWidth * curIndex
      }, etime, function() {
        renderCur();
      });
    }

    function renderCur() {
      // $cur.find('a').removeClass().eq(curIndex).addClass('cur');
    }

    init();

  })();
});