/* ROTATING IMAGES */

function doImgReplace(newImg) {
	this.src = newImg;
}

function doImgReplaceEl(el, newImg) {
	el.src = newImg;
}

function doImgReplaceElId(elId, newImg) {
	el = $(elId);
	el.src = newImg;
}

function doImgClear() {
	this.style.width="1px";
	this.src = '/img/spcr.gif';
}

function doImgClearEl(el) {
	el.style.width="1px";
	el.src = '/img/spcr.gif';
}

function doSlideOut() {
	this.slideOut();
}

function doSlideIn() {
	this.slideIn();
}

function doBounceOut(elId, dur, w0, w1, h0, h1) {
	$(elId).effects({
		duration: dur,
		transition: Fx.Transitions.bounceOut
	}).start({
		'width':[w0,w1],
		'height':[h0,h1]
	});
}

function decrementPos(domRegion, imgType) {
	var posType = imgType + "Pos";
	jsonFarm[domRegion][posType]--;
	if (jsonFarm[domRegion][posType] < 0) {
		jsonFarm[domRegion][posType] = jsonFarm[domRegion][imgType].length - 1;
	}
}

function decrementPosMany(domRegion, imgType, howMany) {
	var i=0;
	while (i < howMany) {
		decrementPos(domRegion, imgType);
		i++;
	}
}

function incrementPos(domRegion, imgType) {
	var posType = imgType + "Pos";
	jsonFarm[domRegion][posType]++;
	if (jsonFarm[domRegion][posType] >= jsonFarm[domRegion][imgType].length) {
		jsonFarm[domRegion][posType] = 0;
	}
}

function incrementPosMany(domRegion, imgType, howMany) {
	var i=0;
	while (i < howMany) {
		incrementPos(domRegion, imgType);
		i++;
	}
}

function swapMedium(fromImgType, posDiff, domRegion) {
	var imgBankObject = jsonFarm[domRegion];
	var posType = fromImgType + "Pos";
	var pos = imgBankObject[posType];
	var domBankObject = domBank[domRegion];	
	
	if (posDiff > -1) {
		pos = pos - posDiff;
	}
	else {
		pos = imgBankObject.mediumsPos;
	}
	if (pos < 0) {
		pos = imgBankObject.mediums.length + pos;
	}
	doImgReplaceElId(domBankObject.mediumEl, imgBankObject.mediums[pos]);
}


function goToSingleShow(domRegion) {
	var showId = jsonFarm[domRegion].showId;
	window.location="http://www.1louder.org/?view=singleShow&showId=" + showId;
}

/*
function swapMediumTest() {
	swapMedium('squares', 3, 'ss_r1');
}
*/

var highlightedElId = "r0_c0";

function highlightMargin(elId) {
	var el = $(elId);
	//doBounceOut(elId, 500, 0, 75, 0, 75);
	//el.effect('borderWidth').start(1,4);
	
	var exampleFx = new Fx.Styles(elId);
	exampleFx.start({
		'border-color':['black','red'],
		'padding':[2,4]
	});
	
	//el.border = '2px solid green';
}

function unhighlightMargin(elId) {
	if (highlightedElId != elId) {
		var el = $(elId);
		el.border = "2px solid black";
		//el.src = "http://static.flickr.com/144/378174764_0eec66dd7d_s.jpg";
	}
}

function persistHighlightMargin(elId) {
	var el = $(elId);
	el.border = "2px solid red";
	setHighlightedElId(elId);
}

function setHighlightedElId(elId) {
	highlightedElId = elId;
}

function writeImageGrid(domRegion, imgType, rCount, cCount) {
	var r=0;
	var c=0;
	var imgBankObject = jsonFarm[domRegion];
	var squares = imgBankObject.squares;  // TODO: make generic to imgType
	var el;
	var elId;
	var i=0;
	while (r < rCount) {
		while (c < cCount) {
			if (i < squares.length) {
				elId = "r" + r + "_c" + c; 
				el = $(elId);
				doImgReplaceEl(el, squares[i]);
				//el.onclick = swapMediumTest;
				i++;
			}
			c++;
		}
		c=0;
		r++;
	}
}


function writeShowText(domRegion) {
	var showDate;
	var showVenue;
	var showBandA = new Array();
	var attributeNames;
	var attributeValues;
	
	var imgBankObject = jsonFarm[domRegion];	
	var j;
	//if (imgBankObject != null) {
		showDate = imgBankObject.general[0];
		showVenue = imgBankObject.general[1];
		for (j=2;j<imgBankObject.general.length;j++) {
			showBandA[j-2] = imgBankObject.general[j];
		}
		attributeNames = imgBankObject.attributeNames;
		attributeValues = imgBankObject.attributeValues;
	//}
	
	var domBankObject = domBank[domRegion];
	var textElId = domBankObject.textEl;
	
	var text = "<div class=\"text\"><span class=\"bold\">" + showBandA[0] + " @ " + showVenue + " (" + showDate + ")</span></div>";
	if (showBandA.length > 1) {
		text += "<div class=\"text\">With ";
		for (j=1;j<showBandA.length;j++) {
			if (j > 1) { text += ", "; }
			text += showBandA[j];
		}
		text += "</div>";
	}
	
	if (domRegion == "r1") {
		for (i=0;i<attributeNames.length;i++) {
			text += "<div class=\"text\">" + attributeNames[i] + ": " + attributeValues[i] + "</div>";
		}
	}
	
	$(textElId).innerHTML = text;
}


function paradeThumbTrio(direction) {
	var domRegion = "r1";
	var imgBankObject = jsonFarm[domRegion];
	var thumbs = imgBankObject.thumbs;
	
	var elId1 = 'r1_th1';
	var elId2 = 'r1_th2';
	var elId3 = 'r1_th3';
	var el1 = $(elId1);
	var el2 = $(elId2);
	var el3 = $(elId3);
	var style1 = new Fx.Style(elId1, 'width');
	var style2 = new Fx.Style(elId2, 'width');
	var style3 = new Fx.Style(elId3, 'width');
	
	doImgClearEl(el1);
	doImgClearEl(el2);
	doImgClearEl(el3);
	
	if (direction == "forward") {
		// nada
	}
	if (direction == "backward") {
		decrementPosMany(domRegion, thumbs, 6);
	}
	
	doImgReplaceEl(el3, thumbs[imgBankObject.thumbsPos]);
	incrementPos(domRegion, "thumbs");
	style3.start(0,100).addEvent('onComplete', function(){
		doImgReplaceEl(el2, thumbs[imgBankObject.thumbsPos]);
		incrementPos(domRegion, "thumbs");
		style2.start(0,100).addEvent('onComplete', function(){
		doImgReplaceEl(el1, thumbs[imgBankObject.thumbsPos]);
		incrementPos(domRegion, "thumbs");
		style1.start(0,100);
	})})
}

function r2_showCycle(domRegion) {
	var imgBankObject = jsonFarm[domRegion];
	var squares = imgBankObject.squares;
	var smalls = imgBankObject.smalls;
	
	var domBankObject = domBank[domRegion];
	var sqElId1 = domBankObject.squareEls[0];
	var sqElId2 = domBankObject.squareEls[1];
	var smElId = domBankObject.smallEl;

	smEl = $(smElId);
	sqEl1 = $(sqElId1);
	sqEl2 = $(sqElId2);
	var slide1 = new Fx.Slide(sqElId1, {duration: 500});
	var slide2 = new Fx.Slide(sqElId2, {duration: 500});
	
	// replace spcr image
	doImgReplace.pass(smalls[0], smEl).delay(1);
	doImgReplace.pass(squares[imgBankObject.squaresPos], sqEl1).delay(1);
	incrementPos(domRegion, "squares");
	doImgReplace.pass(squares[imgBankObject.squaresPos], sqEl2).delay(1);
	incrementPos(domRegion, "squares");
	
	// bounce out
	doBounceOut(smElId, 2500, 240, 240, 0, 180);
	doBounceOut(sqElId1, 2500, 75, 75, 0, 75);
	doBounceOut(sqElId2, 2700, 75, 75, 0, 75);
	
	startTime = 5000;
	while (startTime < 300000) {
		incrementPos(domRegion, "squares");
		r2_sqCycle(sqEl1, slide1, squares[imgBankObject.squaresPos], startTime);
		incrementPos(domRegion, "squares");
		r2_sqCycle(sqEl2, slide2, squares[imgBankObject.squaresPos], startTime + 200);
		startTime = startTime + 5000;
	}
}

function r2_sqCycle(el, slide, nextImg, startTime) {
	doSlideOut.delay(startTime, slide);
	doImgReplace.pass(nextImg, el).delay(startTime + 500);
	doSlideIn.delay(startTime + 700, slide);
}


/* sticky win */

function makeStickyWin(domRegion, fromImgType, posDiff) {
	var i = 0;
	var pos;
	var mediums;
	var largeUrls;
	var imgBankPos = -1;
	while ((i < imgBank.length) && (imgBankPos < 0)) {
		if (imgBank[i].name == domRegion) {
			imgBankPos = i;
		}
		i++;
	}
	
	mediums = imgBank[imgBankPos].mediums;
	largeUrls = imgBank[imgBankPos].largeUrls;
	if (fromImgType == "squares") {
		pos = imgBank[imgBankPos].squaresPos;
	}
	if (fromImgType == "thumbs") {
		pos = imgBank[imgBankPos].thumbsPos;
	}
	if (fromImgType == "smalls") {
		pos = imgBank[imgBankPos].smallsPos;
	}
	
	pos = pos - posDiff;
	if (pos < 0) {
		pos = imgBank[imgBankPos].mediums.length + pos;
	}
	
	var prevPos = pos - 1;
	var nextPos = pos + 1;
	if (pos < 0) {
		pos = pos + mediums.length;
	}
	if (prevPos < 0) {
		prevPos = prevPos + mediums.length;
	}
	if (nextPos < 0) {
		nextPos = nextPos + mediums.length;
	}
	if (nextPos > mediums.length) {
		nextPos = nextPos - mediums.length;
	}
	
	var content = '<div class="sw" id="mainStickyWin">' +
		'<table class="swt">' +
			'<tr><td class="r1_edgeX r1_edgeY edgeTopLeft"></td>' +
				'<td class="r1_edgeX sw_Xmid edgeTopBorder" colspan=3></td>' +
				'<td class="r1_edgeX r1_edgeY edgeTopRight"></td></tr>' +
			'<tr><td class="r1_edgeY sw_Ymid edgeLeftBorder"></td>' +
				'<td class="sw_Xmid sw_Ymid" colspan=3>' +
					'<img class="flickrMedium" id="mainStickyWinImg" src="' + mediums[pos] + '"></td>' +
				'<td class="r1_edgeY sw_Ymid edgeRightBorder"></td></tr>' +
			'<tr><td class="sw_bottom r1_edgeY swBottomLeft"></td>' +
				'<td class="sw_bottom swBottomArrowLeft">' +
					'<a onclick="prevStickyWinImg(&#39;r1&#39;)">' +
					'<img src="/img/home/stickyWin/stickyWinBottomArrowLeft.gif"></a></td>' +
				'<td class="sw_bottom swBottomBorder">' +
					'<a href="' + largeUrls[pos] + '">fullsize on flickr</a> | ' +
					'<a href="javascript:void(0);" class="closeSticky">close</a></td>' +
				'<td class="sw_bottom swBottomArrowRight">' +
					'<a onclick="nextStickyWinImg(&#39;r1&#39;)">' +
					'<img src="/img/home/stickyWin/stickyWinBottomArrowRight.gif"></a></td>' +
				'<td class="sw_bottom r1_edgeY swBottomRight"></td></tr>' +
		'</table></div>';
	var myWin = new StickyWin({
		content: stickyWinHTML('the caption', 'the body', {width: '400px'})});
	myWin.setContent(content);
	myWin.show();
}

function nextStickyWinImg(domRegion) {
	incrementPos(domRegion, "mediums");
	var i = 0;
	var mediums;
	var mediumsPos;
	var imgBankPos = -1;
	while ((i < imgBank.length) && (imgBankPos < 0)) {
		if (imgBank[i].name == domRegion) {
			imgBankPos = i;
			mediums = imgBank[imgBankPos].mediums;
			mediumsPos = imgBank[imgBankPos].mediumsPos
		}
		i++;
	}
	doImgReplaceElId('mainStickyWinImg', mediums[mediumsPos]);
}

function prevStickyWinImg(domRegion) {
	// this is old
	decrementPos(domRegion);
	if (domRegion == "r2_1") {
		doImgReplaceElId('mainStickyWinImg', r2_1mediums[r2_1mediumsPos]);
	}
	if (domRegion == "r2_2") {
		doImgReplaceElId('mainStickyWinImg', r2_2mediums[r2_2mediumsPos]);
	}
}