$(document).bind('ready', function(){
	_load_dropnav();
	_load_productdrop();
	_load_feature();
});

function _load_productdrop(){
	$('#p_id').bind('change', function(){
		window.location = $(this).val();
	});
}

function _load_dropnav(){
	var over_nav = {'drop-bar':false, 'header':false};
	$('#drop-bar').bind('mouseenter', function(){ over_nav['drop-bar']=true; });
	$('#header').bind('mouseenter', function(){ over_nav['header']=true; });

	$('#drop-bar').bind('mouseleave', function(){
		over_nav['drop-bar']=false;
		if(!over_nav['header']) $('#drop-bar').css('display', 'none');
	});

	$('#header').bind('mouseleave', function(){
		over_nav['header']=false;
		if(!over_nav['drop-bar']){
			$('#drop-bar').css('display', 'none');
			$('.nav-two a').removeClass('hover');
		}
	});

	$('.nav-two a').bind(
		'mouseenter',
		function(){
			$('#drop-bar').css('display', 'none');
			if($(this).parent().is('.products, .services')){
				$('#drop-bar p').css('display', 'none');
				if($(this).parent().is('.services')) $('#drop-bar .services-list').css('display', 'block');
				if($(this).parent().is('.products')) $('#drop-bar .product-list').css('display', 'block');
				$('.nav-two a').removeClass('hover');
				$('#drop-bar').css('display', 'block');
				$(this).addClass('hover');
			}else{
				$('.nav-two a').removeClass('hover');
			}
		}
	);

}

function _load_feature(){
	if($('#feature-image').length){
		var slideshow_images = Array();
		$.getJSON('api/?method=slideshow_image.getList', function(data){
			for(i in data.slideshow_images){
				if(!data.slideshow_images[i].image) continue;
				slideshow_images.push(data.slideshow_images[i].image);
			}

			var sets = {};
			var settings = {
				'slideshow' : 0,
				'set' : 0,
				'stage' : 0,
				'pause' : false,
				'action' : null
			};
	
			$('#image-control li.play-control a').bind('click', function(){
				if(settings.pause) _feature_play();
				else _feature_pause();
				return false;
			});
	
			$('#image-control li.button a')
				.bind('click', function(){
					clearTimeout(settings.action);
					if($(this).closest('li').is('.design')) 			settings.stage=0;
					else if($(this).closest('li').is('.construction')) 	settings.stage=1;
					else 												settings.stage=2;
					_feature_load_next();
					return false;
				});
	
			var _feature_pause = function(){
				settings.pause = true;
				$('li.play-control a').addClass('paused');
			}
	
			var _feature_play = function(){
				settings.pause = false;
				$('li.play-control a').removeClass('paused');
			}
	
			var _feature_load_next = function(){
				var delay = 5000;
				if(settings.pause){
					settings.action = setTimeout(function(){ _feature_load_next(); }, delay);
				}else{
					if(!sets || (!sets[settings.set] && !settings.slideshow)){
						settings.slideshow = 1;
						$('#image-control').fadeOut(500);
					}
		
					if(settings.slideshow){
						$('img#image')
							.fadeOut(500, function(){
								$('.feature-detail, .feature-point').remove();
								$(this)
									.removeAttr('src')
									.unbind('load')
									.bind('load', function(){
										$(this).fadeIn(500, function(){
											if(slideshow_images.length <= settings.slideshow) settings.slideshow=1;
											else settings.slideshow++;
											settings.action = setTimeout(function(){ _feature_load_next(); }, delay);
										});
									})
									.attr('src', slideshow_images[settings.slideshow-1]);
							});
					}else{
						var current_set = sets[settings.set][settings.stage];
						$('#image-control li a').removeClass('selected');
						if(settings.stage==2)		$('#image-control li.detail a').addClass('selected');
						else if(settings.stage==1)	$('#image-control li.construction a').addClass('selected');
						else						$('#image-control li.design a').addClass('selected');
	
						$('img#image')
							.fadeOut(500, function(){
								$('.feature-detail, .feature-point').remove();
								$(this)
									.removeAttr('src')
									.unbind('load')
									.bind('load', function(){
										$(this).fadeIn(500, function(){
											if(current_set.details){
												for(key in current_set.details){
													var new_button = $('<a id="feature-'+key+'" href="" style="left:'+current_set.details[key]['x']+'px;top:'+current_set.details[key]['y']+'px;" class="feature-point"></a>');
													$('#feature-image')
														.prepend('<div class="feature-detail feature-'+key+''+(current_set.details[key]['x']>240?' feature-detail-left':'')+'">'
																				+'<div style="background-image:url('+current_set.details[key]['image']+')" class="detail-image"></div>'
																				+'<h4>'+current_set.details[key]['title']+'</h4>'
																				+current_set.details[key]['content']
																				+'</div>')
														.prepend(new_button);
													$(new_button)
														.hover(
															function(){
																_feature_pause();
																var target_class = '.'+$(this).attr('id');
																if($(target_class).is('.feature-detail-left')) 	$(target_class).animate({ 'left' : '0px' }, 250);
																else 											$(target_class).animate({ 'right' : '0px' }, 250);
															},
															function(){
																_feature_play();
																var target_class = '.'+$(this).attr('id');
																if($(target_class).is('.feature-detail-left')) 	$(target_class).animate({ 'left' : '-174px' }, 250);
																else 											$(target_class).animate({ 'right' : '-174px' }, 250);
															}
														)
														.bind('click', function(){ return false; });
												}
											}
											settings.action = setTimeout(function(){ _feature_load_next(); }, delay);
										 });
									})
									.attr('src', current_set.image);
						   });
							
						if(settings.stage == 2 && !settings.slideshow){
							settings.stage = 0;
							settings.set++;
						}else settings.stage++;
			
					}
				}
			}
	
			_feature_load_next();

		});

	}
}