var player = null;
var pause = null;
var play = null;
var progress_bar = null;
var duration_bar = null;

function playerReady(thePlayer) {
	player = document.getElementById(thePlayer.id);
	load_player_controls();
}

function player_change_time(obj){
	
	var width = duration_bar.width();
	var block_width = width / obj.duration;
	var position = Math.ceil(block_width*obj.position);
		position = position > width ? width : position;
	progress_bar.css('left', position+'px');
}

function player_change_state(obj){
	if(obj.newstate == 'PAUSED'){
		player_control_enable(play);
		player_control_disable(pause);
	}else if(obj.newstate == 'PLAYING'){
		player_control_enable(pause);
		player_control_disable(play);
	}else if(obj.newstate == 'COMPLETED'){
		player_control_enable(play);
		player_control_disable(pause);
	}
}

function player_control_enable(obj){
	obj
		.removeClass('disabled')
		.fadeTo(100, 1);
}

function player_control_disable(obj){
	obj
		.addClass('disabled')
		.fadeTo(100, 0.3);
}

function load_player_controls(){
	var video_controls = $('.video-controls');
	pause = $('li.pause', video_controls);
	play = $('li.play', video_controls);
	progress_bar = $('li.duration div.progress', video_controls);
	duration_bar = $('li.duration', video_controls);

	player.addModelListener('STATE', 'player_change_state');
	player.addModelListener('TIME', 'player_change_time');
	player_control_disable(pause);

	$('a', play).bind('click', function(){
		if(!play.is('.disabled')){
			player.sendEvent('PLAY');
		}
		return false;
	});

	$('a', pause).bind('click', function(){
		if(!pause.is('.disabled')){
			player.sendEvent('PLAY');
		}
		return false;
	});
}


$(document).bind('ready', function(){
	_load_house_location();
	_load_prompt_hide();

	/* Load handlers for public art comments & videos */
	$('#home #main-content a.video, #public-art-single #main-content a.video, #public-view #main-content a.video').each(function(){
		new public_art_video(this);
	});

	$('#home #main-content a.comment, #public-art-single #main-content a.comment, #public-view #main-content a.comment').each(function(){
		new public_art_comment(this);
	});

	public_art_gallery();
	
	$('.container').each(function(){
		scroller(this);
	})
	
	var public_art_submit_items = $('.public-art ul li');

	$('.public-art ul li.selected').each(function(){
		var target = $(this).find('input');
		$('input[name=public-art]').val(target.val());
	});

	public_art_submit_items.find('a').live('click', function(){
		var target = $(this).parent();
		var publicart_id = target.find('input').val();
		if(target.is('.selected')){
			public_art_submit_items.removeClass('selected');
			$('input[name=public-art]').val(0);
		}else{
			public_art_submit_items.removeClass('selected');
			target.addClass('selected');
			$('input[name=public-art]').val(publicart_id);
		}
		return false;
	});
	
});

var scroller = function(container){
	var hover = false;
	var moving = false;

	var main_container = $(container);
	var item_list = main_container.find('ul.list');
	var item_container = item_list.parent();
	var item_list_items = item_list.find('li.item');
	var item_width = item_list_items.outerWidth(true);
	var item_num = item_list_items.length;
	var item_list_width = Math.ceil(item_num*item_width)+5;
	var container_width = main_container.outerWidth(true);
	var max_offset = Math.ceil(item_container.outerWidth(true)-item_list_width);
		max_offset = max_offset>0?0:max_offset;

	item_list.width(item_list_width);

	$('a.next, a.previous')
		.live('mouseenter', function(){
			 if(!moving){
				moving = true;
				scroller($(this).is('.next')?true:false);
			 }
			hover=true;
		})
		.live('mouseleave', function(){
			hover = false;
		})
		.live('click', function(){
			return false
		});
	
	var scroller = function(forward){
		var left = parseInt(item_list.css('margin-left'));
		if(forward){
			var new_position = max_offset<=left-50?left-50:max_offset;
		}else{
			var new_position = left+50>=0?-0:left+50;
		}
		item_list.animate({
		   marginLeft : (new_position)+'px'
		}, 200, function(){
			if(hover){
				scroller(forward);
			}else{
				moving = false;	
			}
		});
	}
	
}

var public_art_gallery = function(){
	$('#public-art ul.gallery li a').live('mouseenter', function(e){
		var position = $(e.target).offset();
		var parent = $(e.target).parent();
		var colour = parent.find('input[name=colour]').val();
		var pageid = parent.find('input[name=pageid]').val();
		var title = parent.find('input[name=title]').val();
		var url = parent.find('input[name=link]').val();
		var image = 'geisha/inc/img.php/'+parent.find('input[name=image]').val()+'/100/100/fill';

		$('.pop-box .text-area .title a')
			.attr('href', url)
			.html(title+'<span>&nbsp;&nbsp;<img src="tpl/img/icon-arrow-white-bg.gif" /></span>');

		$('.pop-box .image-area')
			.removeClass('cyan green grey lime orange purple red yellow')
			.addClass(colour);
		$('.pop-box .image-area img').attr('src', image);
		$('.pop-box .image-area a').attr('href', url);
		$('.pop-box a.public-art').attr('href', 'public-view/submit.html?public_art='+pageid);

		$('.pop-box').css({
			'left' : Math.ceil(position.left)+'px',
			'top' : Math.ceil(position.top)+'px',
			'display' : 'block'
		});
	});

	$('.pop-box').live('mouseleave', function(e){
		$(this).css({
			'display' : 'none'
		});
	});
}

var public_art_video = function(_target){

	var original_x;
	var original_y;											// Original Y position of the 
	var target = $(_target);								// Reference to video link
	var id = target.find('input[name=id]').val();			// This element's id
	var converted_video = target.find('input[name=converted_video]').val();			// This element's id
	var image = target.find('input[name=image]').val();			// This element's id
	var colour = target.find('input[name=colour]').val();			// This element's id
	var href = target.attr('href');							// This element's link (for jQuery.load)
	var full_view = $('div.large-v');						// Reference to main video player
	var full_view_container = $('div.content-overlay');						// Reference to main video player
	var full_view_all = $('div.large-c, div.large-v');		// Reference to all popups
	var delay = 300;										// Global time delay in milliseconds

	target.bind('click', function(){
		load_feature();
		return false;
	});

	var load_feature = function(){
		full_view_all = $('div.large-c, div.large-v');
		var total_executions = full_view_all.length;

		if(full_view_all.is(':visible')){
			var counter=0;
			full_view_all.fadeOut(delay, function(){
				counter++;
				if(total_executions===counter){
					var total_comments_videos = $('a.video, a.comment').length;
					var item_counter = 0;
					$('a.video, a.comment').fadeIn(delay, function(){
						item_counter++;
						if(total_comments_videos===item_counter){
							target.fadeOut(delay);
						}
					});
					full_view_handler();
				}
			});
		}else{
			full_view_handler();
			target.fadeOut(delay);
		}
		return false;
	}

	var full_view_handler = function(){
		$('.content-overlay').load(href+' .large-v', null, function(responseText){
			// IE Problem
			var content = $('.content-overlay').html();
			if(content.length < 1){
				document.location = href;
			}

			var flashvars = {
				file : converted_video,
				image : image,
				screencolor : colour, 
				controlbar : "none",
				icons : false
			};

			var params = {
				allowscriptaccess : "always",
				wmode : "opaque"
			};

			var attributes = {
				id : "flash-movie",
				name : "flash-movie"
			};

			swfobject.embedSWF("tpl/swf/player.swf", "flash-area", "380", "214", "9.0.0", "expressInstall.swf", flashvars, params, attributes);

			full_view = $('div.large-v');
			full_view_container.fadeIn(delay, function(){
				full_view.find('.close-window')
					.unbind('click')
					.bind('click', function(){
						full_view_container.fadeOut(delay, function(){
							full_view_container.html('');
							target.fadeIn(delay);
						});
						return false;
					});
			});
		});
	}

}

var public_art_comment = function(_target){

	var original_x;
	var original_y;											// Original Y position of the 
	var target = $(_target);								// Reference to video link
	var id = target.find('input[name=id]').val();			// This element's id
	var href = target.attr('href');							// This element's link (for jQuery.load)
	var full_view = $('div.large-c');						// Reference to main video player
	var full_view_container = $('div.content-overlay');						// Reference to main video player
	var full_view_all = $('div.large-c, div.large-v');		// Reference to all popups
	var delay = 300;										// Global time delay in milliseconds

	target.bind('click', function(){
		load_feature();
		return false;
	});

	var load_feature = function(){
		full_view_all = $('div.large-c, div.large-v');
		var total_executions = full_view_all.length;

		if(full_view_all.is(':visible')){
			var counter=0;
			full_view_all.fadeOut(delay, function(){
				counter++;
				if(total_executions===counter){
					var total_comments_videos = $('a.video, a.comment').length;
					var item_counter = 0;
					$('a.video, a.comment').fadeIn(delay, function(){
						item_counter++;
						if(total_comments_videos===item_counter){
							target.fadeOut(delay);
						}
					});
					full_view_handler();
				}
			});
		}else{
			full_view_handler();
			target.fadeOut(delay);
		}
		return false;
	}

	var full_view_handler = function(){
		$('.content-overlay').load(href+' .large-c', null, function(){
			// IE Problem
			var content = $('.content-overlay').html();
			if(content.length < 1){
				document.location = '/'+href;
			}
			full_view = $('div.large-c');
			full_view_container.fadeIn(delay, function(){
				full_view.find('.close-window')
					.unbind('click')
					.bind('click', function(){
						full_view_container.fadeOut(delay, function(){
							full_view.remove();
							target.fadeIn(delay);
						});
						return false;
					});
			});
		});
	}

}

function _load_house_location(){
	var map_config = {
		'dragging' : false,
		'mousestart' : {'x' : 0, 'y' : 0},
		'targetstart' : {'x' : 0, 'y' : 0},
		'targetoffset' : {'x' : 0, 'y' : 0}
	};
	$('#house-location #location-map')
		.mouseover(function(){
			$(this).css('cursor', 'pointer');
		})
		.mouseout(function(){
			$(this).css('cursor', 'default');
		})
		.find('#map')
			.bind('dragstart', function(event){
				$(this).css('cursor', 'move');
				var pos = $(this).parent().offset();
				var pos_target_left = parseInt($(this).css('left'));
					pos_target_left = pos_target_left ? pos_target_left : 0;
				var pos_target_top = parseInt($(this).css('top'));
					pos_target_top = pos_target_top ? pos_target_top : 0;
				map_config['mousestart']['x']=event.pageX;
				map_config['mousestart']['y']=event.pageY;
				map_config['targetstart']['x'] = pos_target_left;
				map_config['targetstart']['y'] = pos_target_top;
				map_config['targetoffset']['x'] = pos.left;
				map_config['targetoffset']['y'] = pos.top;

			})
			.bind('dragend', function(event){
				$(this).css('cursor', 'pointer');
				map_config['dragging']=true;
				var pos = $(this).parent().offset();
				var pos_target_left = parseInt($(this).css('left'));
					pos_target_left = pos_target_left ? pos_target_left : 0;
				var pos_target_top = parseInt($(this).css('top'));
					pos_target_top = pos_target_top ? pos_target_top : 0;
				map_config['mousestart']['x']=event.pageX;
				map_config['mousestart']['y']=event.pageY;
				map_config['targetstart']['x'] = pos_target_left;
				map_config['targetstart']['y'] = pos_target_top;
				map_config['targetoffset']['x'] = pos.left;
				map_config['targetoffset']['y'] = pos.top;
			})
			.bind('drag', function(event){
				var new_left = (event.pageX+map_config['targetstart']['x'])-(map_config['mousestart']['x']);
				var new_top = (event.pageY+map_config['targetstart']['y'])-(map_config['mousestart']['y']);

				_load_house_location_change_position(this, new_left, new_top);
			})
			.bind('click', function(e){
				if(map_config['dragging']){
					map_config['dragging']=false;
				}else{					
					var bounding_div = this.parentNode;
					house_x = (Math.ceil(e.pageX-bounding_div.offsetLeft)-13)-map_config['targetstart']['x'];
					house_y = (Math.ceil(e.pageY-bounding_div.offsetTop)-34)-map_config['targetstart']['y'];

					$(bounding_div).parent().find('input').val(house_x+':'+house_y);

					$(bounding_div).find('#point')
							.css('left', house_x)
							.css('top', house_y)
							.css('display', 'block');
				}
			})
			.find('.point')
				.hover(
					function(){
						$(this).addClass('selected');
						$(this).find('.details').css('display', 'block');
					},
					function(){
						$(this).removeClass('selected');
						$(this).find('.details').css('display', 'none');
					}
				);
}

function _load_prompt_hide(){
	var element_list = Array();
	$('.prompt')
		.each(function(){
			var target = this;
			element_list[$(target).attr('id')]=$(target).val();
			$(this).closest('form').bind('submit', function(){
				if(element_list[$(target).attr('id')]==$(target).val()) $(target).val('');
			});
		})
		.bind('blur', function(){
			var this_id = '#'+$(this).attr('id');
			if($(this_id).val().length == 0){
				$(this_id).val(element_list[$(this).attr('id')]);
			}
		})
		.bind('focus', function(){
			var this_id = '#'+$(this).attr('id');
			if($(this_id).val() == element_list[$(this).attr('id')]){
				$(this_id).val('');
			}
		});
}

function _load_house_location_change_position(object, new_left, new_top){

	var bounding_height = $(object).parent().height();
	var bounding_width = $(object).parent().width();
	var max_top = $(object).height()-bounding_height;
	max_top = max_top-(max_top*2);
	var max_left = $(object).width()-bounding_width;
	max_left = max_left-(max_left*2);


	if(new_top>0){
		$(object).css('top', '0px');
	}else if(new_top<max_top){
		$(object).css('top', max_top+'px');
	}else{
		$(object).css('top', new_top+'px');
	}

	if(new_left>0){
		$(object).css('left', '0px');
	}else if(new_left<max_left){
		$(object).css('left', max_left+'px');
	}else{
		$(object).css('left', new_left+'px');
	}
}

