$(function() {
  var viewport = $('.slider .slides');
  var slidecount = viewport.find('.slide').size();

  if (Browser.isWebkit && Browser.supportsTouch) {
    var controller = new CE.TouchSlider();
  } else {
    var controller = new CE.Slider();
  }

  controller.init(viewport);
  controller.subscribe('transition_end', function(c) {
    var page_num = c.page(c.current_x);
    $('.boxes a').removeClass('current').eq(page_num).addClass('current');
  });
  controller.subscribe('end_no_move', function(c) {
    unBindEvent(c.element[0], 'webKitTransitionEnd', c);
  });
	
	/*$('#features-area .popout a').each(function() {
    $(this).click(function() {
    	var index = ($(this).index()-1);
    	controller.current_x = controller.pageX(index);
    	controller.update(controller.current_x);
    	return false;
    }).mouseenter(stopAutoPlay)
    .mouseleave(startAutoplay);
	});*/
	
	var boxes = $('<div class="boxes"></div>');
	for(var i = 0; i < slidecount; i++) {
	  var box = $('<a href="#"></a>');
	  if (i == 0)
	    box.addClass('current');
	  
	  box.click(function() {
	    var page_num = $(this).index();
      controller.current_x = controller.pageX(page_num);
      controller.update(controller.current_x);  
      return false;
	  });	
	  
	  boxes.append(box);
	  
	}
	
	$('.slider').append(boxes);
	
	var autoplay;
  var ap_count = 0;
	function startAutoplay() {
    autoplay = setInterval(function() {
      var page_num = controller.page(controller.current_x);
      next = page_num + 1;
      if (next == slidecount)
        next = 0;
      controller.current_x = controller.pageX(next);
      controller.update(controller.current_x);  
    }, 7000);
	}
	function stopAutoPlay() {
    clearInterval(autoplay);	
	}
	function resetAutoPlay() {
	  stopAutoPlay();
	  startAutoplay();
	}
	
  startAutoplay();

  if (Browser.isWebkit && Browser.supportsTouch) {
    window.addEventListener('scroll', function() { resetAutoPlay(); }, false);
  }
  controller.subscribe('first_move', function(c) { resetAutoPlay(); });

});