/*** Cross-browser event stopping ***/

function stop(e) {
	if (!e) {
		var e = window.event;
	}
	e.cancelBubble = true;
	if (e.stopPropagation) {
		e.stopPropagation();
	}
	if (e.preventDefault) {
		e.preventDefault();
	}
}

/** Browse Zoopy ***/

$(function () {
	var h2 = $('#layout-header div.browse h2');
	var div = $('#layout-header div.browse');
	h2.show();
	div.hover(
		function () { h2.addClass('visible'); div.find('div').show(); },
		function () { h2.removeClass('visible'); div.find('div').hide(); }
	);
});

/*** embed ***/

$(function () {
	$('fieldset.embed-code textarea').focus(function () {
		this.select();
	});
});

/*** location selector ***/

function LocationSelector(button, block, field, text)
{
	button = $('#'+button);
	block = $('#'+block);
	field = $('#'+field);
	text = $('#'+text);

	var loader;
	var countrySelect;
	var rangeSelect;
	var citySelect;
	var mySelect;
	var selectButton;

	function checkButton() {
		var selected = citySelect.find(':selected').length + mySelect.find(':selected').length;
		selectButton.attr('disabled', selected < 1);
	}

	function closeBlock(e) {
		if (e) {
			stop(e);
		}
		block.hide('fast');
		button.attr('disabled', '');
	}

	function select(e) {
		stop(e);
		closeBlock();
	}

	function build() {
		var countryTitle = $('<h2/>').html('Country');
		countrySelect = $('<select/>').attr('size', '20');
		var country = $('<div/>').addClass('section').append(countryTitle).append(countrySelect);

		var rangeTitle = $('<h2/>').html('Letter range');
		rangeSelect = $('<select/>').attr('size', '20');
		var range = $('<div/>').addClass('section').append(rangeTitle).append(rangeSelect);

		var cityTitle = $('<h2/>').html('Location');
		citySelect = $('<select/>').attr('size', '20');
		var city = $('<div/>').addClass('section').append(cityTitle).append(citySelect);

		var myTitle = $('<h2/>').html('My Locations');
		mySelect = $('<select/>').attr('size', '20');
		var my = $('<div/>').addClass('section').addClass('last').append(myTitle).append(mySelect);

		var closeButton = $('<button/>').html('Cancel').addClass('close-button').click(closeBlock);

		selectButton = $('<button/>').html('Select').click(select).attr('disabled', true);

		loader = $('<img/>').attr('src', STATIC_BASE+'/img/ajax-loader-upload.gif').attr('alt', 'Loading...').addClass('loader').hide();

		var instructions = $('<div/>').html('Select a country, letter range and location, or select from My Locations.').addClass('instructions');

		var actions = $('<div/>').addClass('actions');
		actions.append(closeButton).append(selectButton);

		block.append(country).append(range).append(city).append(my).append(actions).append(loader).append(instructions);
	}

	function my() {
		var url = DYNAMIC_BASE+'/ajax/city/selector-my';
		$.getJSON(url, function (d) {
			mySelect.children().remove();
			for (i in d.cities) {
				var option = $('<option/>').val(d.cities[i]).text(i);
				mySelect.append(option);
			}
		});
	}

	function initial(value) {
		loader.show();
		var url = DYNAMIC_BASE+'/ajax/city/selector-initial';
		$.getJSON(url, { value: value }, function (d) {
			countrySelect.children().remove();
			for (i in d.countries) {
				var option = $('<option/>').val(d.countries[i]).text(i);
				if (d.countries[i] == d.selectedCountry) {
					option.attr('selected', true);
				}
				countrySelect.append(option);
			}
			rangeSelect.children().remove();
			for (i in d.ranges) {
				var option = $('<option/>').val(d.ranges[i]).text(i);
				if (d.ranges[i] == d.selectedRange) {
					option.attr('selected', true);
				}
				rangeSelect.append(option);
			}
			citySelect.children().remove();
			for (i in d.cities) {
				var option = $('<option/>').val(d.cities[i]).text(i);
				if (d.cities[i] == d.selectedCity) {
					option.attr('selected', true);
				}
				citySelect.append(option);
			}

			loader.hide();
			checkButton();
		});
	}

	function countries() {
		loader.show();
		var url = DYNAMIC_BASE+'/ajax/city/selector-countries';
		$.getJSON(url, function (d) {
			countrySelect.children().remove();
			for (i in d.countries) {
				var option = $('<option/>').val(d.countries[i]).text(i);
				countrySelect.append(option);
			}
			loader.hide();
			checkButton();
		});
	}

	function ranges(countryId) {
		loader.show();
		var url = DYNAMIC_BASE+'/ajax/city/selector-ranges';
		$.getJSON(url, { countryId: countryId }, function (d) {
			rangeSelect.children().remove();
			citySelect.children().remove();
			for (i in d.ranges) {
				var option = $('<option/>').val(d.ranges[i]).text(i);
				rangeSelect.append(option);
			}
			loader.hide();
			checkButton();
		});
	}

	function cities(countryId, range) {
		loader.show();
		var url = DYNAMIC_BASE+'/ajax/city/selector-cities';
		$.getJSON(url, { countryId: countryId, range: range }, function (d) {
			citySelect.children().remove();
			for (i in d.cities) {
				var option = $('<option/>').val(d.cities[i]).text(i);
				citySelect.append(option);
			}
			loader.hide();
			checkButton();
		});
	}

	function changeCountry(e) {
		var countryId = countrySelect.val();
		ranges(countryId);
		checkButton();
	}

	function changeRange(e) {
		var countryId = countrySelect.val();
		var range = rangeSelect.val();
		cities(countryId, range);
		checkButton();
	}

	function changeCity(e) {
		//mySelect.find(':selected').attr('selected', false);
		//document.getElementById(mySelect.attr('id')).selectedIndex = -1;
		var select = mySelect[0];
		select.selectedIndex = -1; // unfortunately the jquery way of doing this doesn't work in IE so we need pure DOM
		checkButton();
	}

	function changeMy(e) {
		//citySelect.find(':selected').attr('selected', false);
		//document.getElementById(citySelect.attr('id')).selectedIndex = -1;
		var select = citySelect[0];
		select.selectedIndex = -1; // unfortunately the jquery way of doing this doesn't work in IE so we need pure DOM
		checkButton();
	}

	function select(e) {
		stop(e);

		if (citySelect.find(':selected').length > 0) { // city selected
			var cityId = citySelect.val();
			var cityName = citySelect.find(':selected').text()+', '+countrySelect.find(':selected').text();
		}
		else if (mySelect.find(':selected').length > 0) { // my location selected
			var cityId = mySelect.val();
			var cityName = mySelect.find(':selected').text();
		}

		text.html(cityName);
		field.attr('value', cityId);

		// If a city is selected, hide the

		$('p.geoTag').remove();

		closeBlock();
	}

	function showBlock(e) {
		stop(e);
		block.show('fast');
		button.attr('disabled', true);
		var value = parseInt(field.attr('value'));
		if (value > 0) {
			initial(value); // we've got a value, so can fetch countries + cities + selected values
		}
		else {
			countries();
		}
		my();
		countrySelect.change(changeCountry);
		rangeSelect.change(changeRange);
		citySelect.change(changeCity);
		mySelect.change(changeMy);
		selectButton.click(select);
	}

	build();
	block.addClass('location-selector').hide();
	button.click(showBlock);
}

/*** invite banner ***/

$(function () {
	$('#invite-banner a').hide().fadeIn('slow');
});

/*** video thumb rollovers ***/

window.onload = function () {
		
	function Thumbs(el) {
		
		var img = el.find('img');
		
		var src = img.attr('src');
		var rexp = /\/(\d+)\/thumb/;
		var matches = rexp.exec(src);
		
		var width = img.width();
		var height = img.height();
		img.attr('width', width);
		img.attr('height', height);
		
		var id = parseInt(matches[1]);
		if (id < 24570) {
			return;
		}
		
		var timeout;
		
		function setStill(still)
		{
			var tempSrc = DYNAMIC_BASE+'/data/media/'+id+'/still'+still+'-'+width+'x'+height+'f.jpg';
			img.attr('src', tempSrc);			
			
			still ++;
			if (still > 4) {
				still = 0;
			}
			timeout = setTimeout(function () { setStill(still) }, 1000);
		}
		
		el.hover(
			function () {
				setStill(0);							
			},
			function () {
				img.attr('src', src);	
				if (typeof timeout != 'undefined') {
					clearTimeout(timeout);
				}
			}		
		);		
	}
	
	$('a.thumbnail').each(function () {
		if ($(this).find('span.thumbnail-icon-video').length > 0 || $(this).find('span.thumbnail-icon-tv').length > 0) {
			new Thumbs($(this));
		}
	});
	
};

/*** timestamp links ***/

$(function () {
	$('a.timestamp').live('click', function (e) {
		stop(e);
		var rel = $(this).attr('rel');
		if (navigator.appName.indexOf('Microsoft') != -1) {
			var flash = window.video_player;
		}
		else {
			var flash = window.document.video_player;
		}
		try {
			flash.seek_v(rel);
		}
		catch (e) {  }
	});
});