function createDivBg (which) {
	var divWhich = $(which);
	var divWrapper      = new Element ('div', {'id' : which+'Wrapper'});
	var divBg           = new Element ('div', {'id' : which+'Bg'});
	var divBgContent    = new Element ('div', {'id' : which+'BgContent'});
	var divBgTop        = new Element ('div', {'id' : which+'BgTop'});
	
	if (aBgVertSizing [which]) {
		var divBgBottom     = new Element ('div', {'id' : which+'BgBottom'});
		var divBgBottomLeft = new Element ('div', {'id' : which+'BgBottomLeft'});
	}
	
	divWhich       .setStyle  ('background-color' , 'transparent');

	var bgFileURL = 'url(' + aBgImages[which] + ')';
	divBgContent   .setStyles({'background-image' : bgFileURL, 'position' : 'absolute', 'background-position' : 'top right'});
	divBgTop       .setStyles({'background-image' : bgFileURL, 'position' : 'absolute', 'background-position' : 'top left'});
	if (aBgVertSizing [which]) {
		divBgBottom    .setStyles({'background-image' : bgFileURL, 'position' : 'absolute', 'background-position' : 'bottom right'});
		divBgBottomLeft.setStyles({'background-image' : bgFileURL, 'position' : 'absolute', 'background-position' : 'bottom left'});
	}

	var offset = 0;
	(which=='container_div' | which=='bigBanner_div') ? offset = 0 : offset = 3;
	divWrapper .setStyles ({'position' : 'absolute', 'z-index' : 1 + offset});
	divBg      .setStyles ({'position' : 'absolute', 'z-index' : 2 + offset});
	divWhich   .setStyles ({'position' : 'absolute', 'z-index' : 3 + offset});
	
	divWrapper     .inject (divWhich,     'before');
	divWhich       .inject (divWrapper,   'top');
	divBg          .inject (divWrapper,   'top');
	divBgContent   .inject (divBg,        'top');
	divBgTop       .inject (divBgContent, 'top');
	if (aBgVertSizing [which]) {
		divBgBottom    .inject (divBgContent, 'after');
		divBgBottomLeft.inject (divBgBottom,  'bottom');
	}
}

function updateDiv(which){

	var bottomHeight = aBgVertSizing[which] ? 15 : 0;

	switch (which) {
		
		case 'container_div':
			var w=containerDims[2];
			var h=containerDims[3];
			var l=containerDims[0];
			var t=containerDims[1];
			break;
			
		case 'bigBanner_div':
			var w=winCoords.width;
			var h=200;
			var l=0;
			var t=0;
			break;
			
		case 'slogan_div':
			var w=containerDims[2]-733;
			var h=120;
			var l=220;
			var t=25;
			break;
			
		case 'languageBar_div':
			var w=containerDims[2] - 250;
			var h=25;
			var l=220;
			var t=160;
			
			$('cityscape_div').morph ({ 'left' : 225, 'top' : 62 } );
			break;
			
		case 'leftButtons_div':
			w = 160;
			h = containerDims[3] - 255 - 190 - 32;
			l = 30;
			t = 232;
			break;
			
		case 'sl_div':
			var w = slDims[2] = containerDims[2] - 514;
			var h = slDims[3] = containerDims[3] - 255;
			var l = slDims[0] = 220;
			var t = slDims[1] = 200;

			var remainingWidth = w - fixedColumnWidthTotal;
			aSlColumnWidths['slTitle'       ] = parseInt(remainingWidth * .30);
			aSlColumnWidths['slArtist'      ] = parseInt(remainingWidth * .32);
			aSlColumnWidths['slMediaName'   ] = parseInt(remainingWidth * .32);
//			aSlColumnWidths['slPopularity'  ] = parseInt(remainingWidth * .08);
			
			changeSlColumnWidth ('slTitle'       , aSlColumnWidths['slTitle']);
			changeSlColumnWidth ('slArtist'      , aSlColumnWidths['slArtist']);
			changeSlColumnWidth ('slMediaName'   , aSlColumnWidths['slMediaName']);
			changeSlColumnWidth ('slDetail'      , aSlColumnWidths['slMediaName']);	// Same size as slMediaName
//			changeSlColumnWidth ('slPopularity'  , aSlColumnWidths['slPopularity']);
			
//					changecss('test', 'width', '500px');

			$('slStatus_div').setStyle('left', parseInt((w-400)/2));
			

			break;
			
		case 'player_div':
			var w = 234;
			var grow = (playerType == 'v') ? 120 : 0;
			var h = 195 + grow;
			var t = 200;
//			var l = popupOpen ? winCoords.width+5 : containerDims[2] - 264;
			var l = containerDims[2] - 264;
			bottomHeight = 80;
			
			var playerLeft = (winCoords.width > 980) ? parseInt((winCoords.width - containerDims[2]) / 2) + l + 1 :
													   parseInt((980 - containerDims[2]) / 2) + l + 1;
			
			$('flashAudioPlayer_div'  ).setStyles ( { left : playerLeft, top : t + 28 } );
			$('flashYoutubePlayer_div').setStyles ( { left : playerLeft, top : t + 28 } );
			
			break;
			
	}
	var leftSliceWidth = parseInt (w / 2);
//	if (!($(which + 'Wrapper'))) alert ('no ' + which + ', currentPage=' + currentPage);
	$(which+'Wrapper')     .setStyles({'width' : w,    'height' : h,    'left'   : l,       'top' : t});
	$(which+'Bg')          .setStyles({'width' : w,    'height' : h});
	$(which+'BgContent')   .setStyles({'width' : w-leftSliceWidth, 'height' : h-bottomHeight, 'right' : 0,        'top' : 0});
	$(which+'BgTop')       .setStyles({'left'  : -leftSliceWidth,  'top'    : 0,    'width'  : leftSliceWidth,   'height' : h-bottomHeight});

	if (aBgVertSizing [which]) {
		$(which+'BgBottom')    .setStyles({'right' : 0,    'bottom' : 0,    'width'  : w-leftSliceWidth, 'height' : bottomHeight});
		$(which+'BgBottomLeft').setStyles({'left' : -leftSliceWidth,   'bottom' : 0,    'width'  : leftSliceWidth,   'height' : bottomHeight});
	}

	$(which)               .setStyles({'left'  : 0,    'top'    : 0,    'width' : w,    'height' : h});

	if (which == 'player_div') $('playerContents_div').tween('height', 70+grow);
}
		
function changeSlColumnWidth (column, width) {
	$$('.'+column).setStyle('width', width);
}

function resized() {
//			if (!avoidRedraw) {

	if (iPhone) {
		containerDims[0] = 20;
		containerDims[1] =  0; // was 20
		containerDims[2] = 1024; // was 940
		containerDims[3] = 800; // was 1050 then 670
	} else {
		winCoords = bod.getCoordinates();
//				docCoords = bod.getCoordinates();
/*		if (winCoords.height > 720) {
			containerDims[3] = winCoords.height - 40;
			containerDims[1] = 20;
		} else if (winCoords.height > 680) {
			containerDims[3] = winCoords.height - parseInt (((winCoords.height-680) / 40) * 40);
			containerDims[1] = parseInt (((winCoords.height-680) / 40) * 20);
		} else if (winCoords.height > 640) {
			containerDims[3] = winCoords.height;
			containerDims[1] = 0;
		} else {
			containerDims[3] = 640;
			containerDims[1] = 0;
		} */
		
		containerDims[1] = 0; // always at the top of the window
		
		if (winCoords.height>665) {
			containerDims[3] = winCoords.height - 20;
		} else {
			containerDims[3] = 645;
		}

		if (winCoords.width > 1532) {
			containerDims[2] = winCoords.width * .8;
			containerDims[0] = parseInt ((winCoords.width - containerDims[2]) / 2);
		} else if (winCoords.width > 1225) {
			containerDims[2] = winCoords.width - ((winCoords.width-1225) / 307 * 307);
			containerDims[0] = parseInt ((winCoords.width - containerDims[2]) / 2);
		} else if (winCoords.width > 980) {
			containerDims[2] = winCoords.width;
			containerDims[0] = 0;
		} else {
			containerDims[2] = 980;
			containerDims[0] = 0;
		}

//				winCoords.width  > 1153 ? containerDims[2] = (winCoords.width  * .85) : containerDims[2] = 980;   // width
//				containerDims[0] = (winCoords.width  - containerDims[2]) / 2;           // left

//				winCoords.height > 680  ? containerDims[3] = (winCoords.height - 40) : containerDims[3] = 640;   // height
//				var deltaY = winCoords.height - 640;
//				(deltaY > 40) ? containerDims[1] = 20 : containerDims[1] = deltaY / 2;  // top
//				(containerDims[1] < 0) ? containerDims[1] = 0 : containerDims[1] = containerDims[1];
	}
	
		if (currentPage == 'landing') {
			$('landing_div').setStyles ( { 'width'  : 800,
										   'height' : winCoords.height,
										   'left'   : parseInt ((winCoords.width - 800) / 2),
										   'top'    : 0 } );
		} else if (currentPage == 'main') {
			updateDiv('container_div');
			updateDiv('bigBanner_div');
			updateDiv('slogan_div');
			updateDiv('languageBar_div');
			updateDiv('sl_div');
			updateDiv('player_div');
	
	
			var vertOffset = aButtonStates["search_btn"] ? 85 : 0;
			$('slScroll_div'  ).setStyle('height', containerDims[3]-255-53-25-vertOffset);
//			$('slContents_div').setStyle('height', containerDims[3]-255-53-25-vertOffset);
			$('leftButtonsContents_div').setStyle('height', containerDims[3] - 255 - 205 - bannerHeight - 1);
	
		
			$('slSearch_div').setStyle('width', slDims[2]-1);
	
			$('slColumnHeaders').setStyle('width', slDims[2]-2);
			$('slColumnHeaders').setStyle('margin-left', 1);
		
			$('slScroll_div'  ).setStyle('width', slDims[2]-2);
			$('slScroll_div'  ).setStyle('margin-left', 0);
			$('slContents_div').setStyle('width', slDims[2]-20);
			$('slContents_div').setStyle('margin-left', 1);
			
			updatePopup();
		}
		
//				avoidRedraw = true;
//				setTimeout('avoidRedraw = false;', 500);

//			} else {  //if we're avoiding a redraw, try again
//				setTimeout('resized();', 500);
//			}

	updateStatus();
//	updateSignIn();
}

function updateStatus() {
	if (statusDisplay) {
		$('status').set('text', "Screen: " + winCoords.width + " x " + winCoords.height + ", CityLove: " + containerDims[2] + "x" + containerDims[3]);
//			$('status2') .set('text', 'Second Set: ' + docCoords.width + "x" + docCoords.height);
//			iPhone ? $('status3') .set('text', 'I believe you ARE using an iPhone: ') :
//					 $('status3') .set('text', 'I believe you ARE NOT using an iPhone: ');
//			$('status4') .set('text', "In fact, I think you're using " + navigator.userAgent);
	}
}

function fnHideDivs() {
	for (var i=0; i<aHiddenDivs.length; i++) {
		which=aHiddenDivs[i];
		$(which).fade('hide');
		$(which).setStyle ('display', 'inline');		
	}
}

function displayBanners() {
	$('topBanner1_div'  ).set('html', bannersObj.t1.html);
	$('topBanner2_div'  ).set('html', bannersObj.t2.html);
	$('leftBanner1_div' ).set('html', bannersObj.l1.html);
	$('leftBanner2_div' ).set('html', bannersObj.l2.html);
	$('leftBanner3_div' ).set('html', bannersObj.l3.html);
	$('rightBanner1_div').set('html', bannersObj.r1.html);
	$('rightBanner2_div').set('html', bannersObj.r2.html);
	$('rightBanner3_div').set('html', bannersObj.r3.html);
	
	$('rightBanner1_div').setStyles( { 'right'  : (30 + parseInt((234 - bannersObj.r1.width) / 2)) + 'px',
 									   'width'  : bannersObj.r1.width + 'px',
									   'border' : bannersObj.r1.border_style + ' ' +
									              bannersObj.r1.border_width + 'px ' +
												  bannersObj.r1.border_color } );
	
	$('rightBanner2_div').setStyles( { 'right'  : (30 + parseInt((234 - bannersObj.r2.width) / 2)) + 'px',
 									   'width'  : bannersObj.r2.width + 'px',
									   'border' : bannersObj.r2.border_style + ' ' +
									              bannersObj.r2.border_width + 'px ' +
												  bannersObj.r2.border_color } );
	
	$('rightBanner3_div').setStyles( { 'right'  : (30 + parseInt((234 - bannersObj.r3.width) / 2)) + 'px',
 									   'width'  : bannersObj.r3.width + 'px',
									   'border' : bannersObj.r3.border_style + ' ' +
									              bannersObj.r3.border_width + 'px ' +
												  bannersObj.r3.border_color } );
}

function fnRotateSlogan() {
	currentSlogan++;
	if (currentSlogan >= aSloganText.length) currentSlogan = 0;

	if (currentSloganDiv == 1) {
		$('sloganDiv2Line1_span').innerHTML = aSloganText[currentSlogan][0];
		$('sloganDiv2Line2_span').innerHTML = aSloganText[currentSlogan][1];
		sloganDiv1Fade.start ('opacity', 0);
		sloganDiv2Fade.start ('opacity', 1);
		currentSloganDiv = 2;
	} else {
		$('sloganDiv1Line1_span').innerHTML = aSloganText[currentSlogan][0];
		$('sloganDiv1Line2_span').innerHTML = aSloganText[currentSlogan][1];
		sloganDiv1Fade.start ('opacity', 1);
		sloganDiv2Fade.start ('opacity', 0);
		currentSloganDiv = 1;
	}
}
