//var globalNewRight = 0;

function ImageStrip(container,cellWidth,speed,pages,section,startPos) {
	if (startPos == 0) disableLeftButton();
	this.startPos = parseInt(startPos);
	this.container = $(container);
	this.cellWidth = parseInt(cellWidth);
	this.speed = speed;
	this.pages = (pages)?pages:4;
	this.section = section;
} 

ImageStrip.prototype = {
	move: function() {
		var newRight;
		newRight = (this.startPos + this.cellWidth);
		if (newRight<(this.cellWidth*this.pages)) 
		{
			this.container.animate({right:newRight},this.speed,function() {setColorForward.call(this, newRight)});
			this.startPos = newRight;
			showLeftButton();
		} else {
			return false;
		}
		return true;
	},
	moveBack: function() {
		var newRight;
		newRight = (this.startPos - this.cellWidth);
		if(newRight>=0){
			this.container.animate({right:newRight},this.speed,function() {setColorBackward.call(this, newRight)});
			this.startPos = newRight;
			if (this.startPos == 0) {
				setFirstButtons();	
				disableLeftButton();
				}
			}
			else {
				setMiddleButtons();
			}
	return true;
}
}


function setColorForward(position) {
	this.position = position;
	if (this.position == 1420) {
	setBackground("#fff");
	setOnWhiteButtons();
	}
	else if (this.position == 2130) {
		setBackground("#bdc753");
		fadeNextSecButton();
		setOnOliveButtons()
	}
}

function setColorBackward(position) {
	this.position = position;
		if (this.position == 1420) {
			setBackground("#fff");
			setOnWhiteButtons();
			showRightButton();
		}
		else if (this.position <= 710) {
			setBackground("#000");
			showRightButton();
			setOnBlackButtons();
		}
}

function setBackground(color) {
	//alert(color);
		$("body").css("background-color", color);
}

function disableLeftButton() {
    $("#left").fadeOut();
}

function showLeftButton(){
    $("#left").fadeIn();
}

function disableRightButton() {
    $("#right").fadeOut();
}

function showRightButton() {
	$("#right").replaceWith('<div id="right" class="button"><a href="#" onclick="mystrip.move(); return false;" id="rightScroll"><img src="../images/rightScrollBtn.png" alt="right" id="rightScroll" /></a></div>');
}

function fadeNextSecButton() {
	$("#right").replaceWith('<div id="right" class="button"><a href="section2.php"><img src="../images/rightScrollBtn.png" alt="right" id="rightScroll" /></a></div>');
}

function fadeOutNextSecButton() {
	$("#right").replaceWith('<div id="right" class="button"><a href="#" onclick="mystrip.move(); return false;" id="rightScroll"><img src="../images/rightScrollBtn.png" alt="go right" /></a></div>');
}

function setOnWhiteButtons() {
	$("#left img").attr({'src': '../images/leftScrollBtnOnWhite.png'});
	$("#right img").attr({'src': '../images/rightScrollBtnOnWhite.png'});
}

function setOnBlackButtons() {
	$("#left img").attr({'src': '../images/leftScrollBtn.png'});
	$("#right img").attr({'src': '../images/rightScrollBtn.png'});
}

function setOnOliveButtons() {
	$("#left img").attr({'src': '../images/leftScrollBtnOnOlive.png'});
	$("#right img").attr({'src': '../images/rightScrollBtnOnOlive.png'});
}


function goTo(pos){
	this.pos = parseInt(pos);
	$("#content").css({"right":this.pos});
	setColorForward(pos);
}

function previousSectionButton(sec, position){
		$("#left").replaceWith('<div id="left" class="button"><a href="section' + (sec - 1) + '.php?position=' + position + '"><img src="../images/leftScrollBtnOnWhite.png" alt="go to previous section" /></a></div>');
		$('#left a').click(function(){$('body').scrollTo(400)});
}

function setRegularLeftButton(){
		$("#left").replaceWith('<div id="left" class="button"><a href="#" onclick="mystrip.moveBack(); return false;" id="leftScroll"><img src="../images/leftScrollBtnOnWhite.png" alt="go to previous section" /></a></div>');
		$('#left a').click(function(){$('body').scrollTo(400)});
}

function nextSecButton(section) {
	$("#right").replaceWith('<div id="right" class="button"><a href="section' + (section + 1) + '.php"><img src="../images/rightScrollBtnOnWhite.png" alt="right"></a></div>');
	$('#right a').click(function(){$('body').scrollTo(400)});
}

function setRegularRightButton() {
	$("#right").replaceWith('<div id="right" class="button"><a href="#" onclick="mystrip.move(); return false;" id="rightScroll"><img src="../images/rightScrollBtnOnWhite.png" alt="go right" /></a></div>');
	$('#right a').click(function(){$('body').scrollTo(400)});
}


function setFirstButtons(sec, pos){
	setRegularRightButton();
	    rightButtonOver();
	    rightButtonOff();
}

function setLastButtons(sec, pos){
	nextSecButton(sec, pos);
	setRegularLeftButton();
	leftButtonOver();
	leftButtonOff();
}

function setMiddleButtons(){
	setRegularLeftButton();
	setRegularRightButton();
	leftButtonOver();
    leftButtonOff();
}

function showNext() {
	$("div#future img").fadeOut("slow", function() {setTimeout(changeImg, 1000);});
}

function changeImg() {
	$("div#future img").attr('src', "../images/preparingTomorrow.png");
	$("div#future img").fadeIn("slow");
}