$(document).ready(function() {
	jQuery.easing.def = "easeInOutQuart";
	
	var slideNum = 0;
	var strip = $(".article .wrap");
	var total = $(".article .wrap #text-3 .textwidget").children().length;
	
	for (i=0;i<=total -1;i++){
		$(".article .nav").append("<div id="+ i + " class='btn'></div>");
	}
	
	articleBtnChange();
	
	$(".article .nav .btn").click(function() {
		var btnID = $(this).attr("id") 
		$(strip).animate({ left: -btnID * 512, easing: "swing" }, 500);
		slideNum = -btnID;
		articleBtnChange()
	});
	
	$(".article .left").click(function() {
		if(slideNum != 0){
			slideNum += 1;
		} else {
			slideNum = -total + 1;
		}
		$(strip).animate({ left: slideNum * 512, easing: "swing" }, 500);
		
		articleBtnChange();
		
	});
	
	$(".article .right").click(function() {

		if(slideNum != -total + 1){
			slideNum -= 1;
		} else {
			slideNum = 0;
		}
		$(strip).animate({ left: slideNum * 512, easing: "swing" }, 500);
		
		articleBtnChange();
		
	});
	
	function articleBtnChange() {
		
		$(".article .nav #" + -slideNum).removeAttr("class");
		$(".article .nav .btn").attr("class", "btn");
		$(".article .nav #" + -slideNum).attr("class", "btn active");
	};
	
});