var productInfo = {
	init : function () {
	}
}

var vanneDropdownForm = {
	init : function () {
		$('.searchCount:first').addClass('first');
				
		$('.vanneDropdownForm').each(function () {
			var formElement = $(this);
			var dropDownElement = $(this).find('.vanneDropdown');
			var button = $(this).find('.vanneButton');
			var select = $(this).find('.vanneSelect');

			select.unbind('click');
			
			select.click(function () {
				button.trigger('click');
			});
			
			button.unbind('click');
			
			button.click(function (event) {
				$(window).trigger('resize');
											
				if(dropDownElement.find('.vanneDropdownOption').length == 0) {
					if(!dropDownElement.hasClass('disabled')) dropDownElement.addClass('disabled');
					return;
				}
				
				dropDownElement.removeClass('disabled');
				
				dropDownElement.find('.vanneDropdownOption').each(function (index, element) {
					if(index == 0) $(element).addClass('first');
					if(index == dropDownElement.find('.vanneDropdownOption').length - 1) $(element).addClass('last');
				});
				
				if($(event.currentTarget) != button) {
					$('.vanneDropdown:visible').slideUp(200);
				}

				dropDownElement.css({'height' : 'auto', 'overflowY' : 'visible'});
			/*ie shait*/
			if ($.browser.msie) 
			{
			 /* ie shait ends*/
			} else {	
				if(dropDownElement.outerHeight() > 400) {
					dropDownElement.css({
						'height' : '400px',
						'overflowY' : 'scroll'
					});
				}
			}
				
				if(dropDownElement.is(':hidden')) {
					dropDownElement.slideDown(500);

					vanneDropdownCurtain = $('<div>').addClass('vanneDropdownOptionCurtain');
					
					$('body').append(vanneDropdownCurtain);

					vanneDropdownCurtain.click(function (event) {
						button.trigger('click');
					});
								
				} else {
					dropDownElement.slideUp(500);
					vanneDropdownCurtain.remove();	
				}				
			});

			dropDownElement.find('.vanneDropdownOption').live('click', function (event) {
				dropDownElement.find('.vanneDropdownOption.selected').removeClass('selected');
				
				$(event.currentTarget).addClass('selected');
				
				select.text($(event.currentTarget).text());
				button.trigger('click');
				carMakeForm.fetchResults();
			});
			
			$(window).resize(function () {
				var position = select.position();
				var padding = formElement.outerWidth(true) - formElement.width();
								
				dropDownElement.width(button.outerWidth(true) + select.outerWidth(true));
				dropDownElement.css({'top' : position.top + formElement.outerHeight() - 1, 'left' : position.left - 1});
			});
		});
	}
}

var carModelAndBoltPatternForm = {
	init : function () {
		$('.carModelForm').data('last-value', $('.carModelForm .vanneSelect').text());
	}
}

var carRimDiameterForm = {
	init : function () {
		$('.rimDiameter').click(function () {
			carMakeForm.fetchResults();
		});
		
	}
}

var carMakeForm = {
	init : function () {
		var currentModelValue = $('.carModelForm .vanneSelect').text();
		var currentMakeValue = $('.carMakeForm .vanneSelect').text();
		
		$('.start-over-button').click(function () {
			$('.carModelForm .vanneSelect').text(currentModelValue);
			$('.carMakeForm .vanneSelect').text(currentMakeValue);
			
			$('.vanneDropdownOption.selected').removeClass('selected');

			$('.searchCount .countNumber').html("0");
			$('.resultPageWrapper').html("");
			$('.resultsRow').html("");
			
			$('.rimDiameter').attr('checked', false);
						
			carMakeForm.fetchResults();
			carMakeForm.checkWhatsNext();
		});
	
		$('.carMakesAlphabetListPrev').click(function (event) {
			event.preventDefault();

			var index = $('.carMakesAlphabetListLetterLink.selected').index();
					
			if(index != 0) {
				$('.carMakesAlphabetListLetterLink.selected').prev().trigger('click');
			}
		});

		$('.carMakesAlphabetListNext').click(function (event) {
			event.preventDefault();
	
			var index = $('.carMakesAlphabetListLetterLink.selected').index();
			
			if((index + 1) != $('.carMakesAlphabetListLetters').children().length) {
				$('.carMakesAlphabetListLetterLink.selected').next().trigger('click');
			}
		});
		
		$('.carMakesAlphabetListLetterLink').each(function (index, element) {
			if(index == 0) $(element).addClass('selected');
			
			$(element).click(function (event) {
				event.preventDefault();
				
				$('.carMakesAlphabetListLetterLink').removeClass('selected');
	
				$(element).addClass('selected');
				
				$('.carMakesList').animate({left : -($('.carMakesListRow').outerWidth() * (index))}, 600);
			});
		});
		
		$('.carMakeForm .vanneDropdownOption').click(function () {
			$('.carModelForm .vanneSelect').text(currentModelValue);
		});
		
		$(document).keyup(function (event) {
			if(event.which == 27) {
				$('.productInfoMainWrapper').fadeOut(500);
			}
		});
		
		
		
		
		
		var resultPageWrapper = $('<div>').addClass('resultPageWrapper');
		$('.resultsWrapper').before(resultPageWrapper);
	},

	fetchResults : function () {

			$('.resultsRow').css('left', 0);
			$('.resultsWrapper .resultsRow').html("");
			
			$('.resultPageLinkNext.bigbutton').remove();
			$('.resultPageLinkPrevious.bigbutton').remove();
		
			if($('.carMakeForm .vanneDropdownOption.selected').length == 0) return;
		
			$.ajax({
				data : {
					method : 'fetchResults',
					target : vannevalitsinWidgetID,
					carMake : $('.carMakeForm .vanneDropdownOption.selected').text(),
					carModel : $('.carModelForm .vanneDropdownOption.selected').data("modelName"),
					rimsDiameter : $('.rimDiameter:checked').val(),
					carModelFromDate : $('.carModelForm .vanneDropdownOption.selected').data('fromDate')
				},
				dataType : 'json',
				beforeSend : function () {
					if($('.carModelForm .selected').length == 0) {
						$('.carModelAndBoltPattern').prepend('<div class="ajax-loader">');
					} else if($('.rimDiameter:checked').length == 0){
						$('.rimSizeWrapper').prepend('<div class="ajax-loader">');
						$('.results').prepend('<div class="ajax-loader">');
					} else {
						$('.results').prepend('<div class="ajax-loader">');
					}
				},
				
				success : function (data) {
					var carModels = [];
					var resultsPerPage = 5;
				
					if(data.models.length > 0) {
						currentModelValue = $('.carModelForm .vanneDropdownOption.selected').data("modelName");
						currentModelFromDate = $('.carModelForm .vanneDropdownOption.selected').data("fromDate");
						
						$('.carModelForm .vanneDropdown').html("");
					
						for(i = 0; i < data.models.length; i++) {					
							var carModelFromDate = data.models[i].fromDate.split("-");
							var carModelFromYear = carModelFromDate[0];
							var carModelDropdownOption = $('<div>').addClass('vanneDropdownOption');
							
							var carModelListName = data.models[i].carModel + ' (' + carModelFromYear + ')';

							if($.inArray(carModelListName, carModels) != -1 || $.trim(data.models[i].carModel) == '') {
								continue;
							}							

							carModels.push(carModelListName);
							
							if(carModelFromYear == '0000') carModelListName = data.models[i].carModel;
								
							carModelDropdownOption.text(carModelListName);
							
							carModelDropdownOption.data('fromDate', data.models[i].fromDate);
							carModelDropdownOption.data('modelName', data.models[i].carModel);
						
							if(currentModelValue == data.models[i].carModel && data.models[i].fromDate == currentModelFromDate) {
								carModelDropdownOption.addClass('selected');
							}
							
							$('.carModelForm .vanneDropdown').append(carModelDropdownOption);

							carModelDropdownOption.click(function (event) {
								$('.rimDiameter').attr('checked', false);
							});
						}
					}
					
					if($('.carModelAndBoltPattern .selected').length > 0) {
						$('.searchCount .countNumber').html(data.products.length);
						$('.resultPageWrapper').html("");
					}

										
					if(data.products.length > 0 && $('.carModelAndBoltPattern .selected').length > 0) {
						productResultCount = 0;
						productWidthCount = 0;
						
						for(i = 0; i < data.products.length; i++) {
							productResultCount++;
														
							var resultColumnImage = $('<div>').addClass('resultImage');
							var resultColumnTitle = $('<div>').addClass('resultTitle');	
							var resultColumnDescription = $('<div>').addClass('resultDescription');
							var resultColumn = $('<div>').addClass('resultColumn').attr('id', 'product_' + data.products[i].productID).data('rowID', data.products[i].rowID);
							
							var resultColumnMoreInfo = $('<div>').addClass('resultMoreInfo');
							
							resultColumnMoreInfo.append('<a href="#">Lisätietoja »</a>');
							
							resultColumnDescription.append('Väri: ' + data.products[i].description);
							resultColumnDescription.append('<br />Offset: ' + data.products[i].offset);
							resultColumnDescription.append('<br />Vanteen koko: ' + data.products[i].diameter);
							resultColumnDescription.append('<br />Pulttijako: ' + data.products[i].boltCount + ' x ' + data.products[i].boltDistance);
							
							resultColumnTitleLink = $('<a href="javascript: void(0);" />').addClass('resultTitleLink').html(data.products[i].name);
							resultColumnTitle.append(resultColumnTitleLink);
							
							resultColumnTitleLink.click(function (event) {
								carMakeForm.fetchProductInfo(event.currentTarget);
							
							
							});
							
							resultColumnMoreInfo.find('a').click(function (event) {
								event.preventDefault();
								carMakeForm.fetchProductInfo(event.currentTarget);
							});
							
							resultColumnImage.click(function (event) {
								carMakeForm.fetchProductInfo(event.currentTarget);
							});
							
							if(typeof(data.products[i].image) != 'undefined') {
								resultColumnImage.append('<img src="' + data.products[i].image.replace('/userData/turvallisetrenkaat/', '/userData/turvallisetrenkaat/thumb/f150x150/') + '" />');
							}
							
							resultColumn.append(resultColumnTitle);
							resultColumn.append(resultColumnImage);
							resultColumn.append(resultColumnDescription);
							resultColumn.append(resultColumnMoreInfo);
							
							resultColumn.hide();
																					
							$('.resultsWrapper .resultsRow').append(resultColumn);
						
							productWidthCount += resultColumn.outerWidth(true);
							
							if(productResultCount >= resultsPerPage) {
								var marginRight = $('.resultsWrapper').outerWidth(true) - productWidthCount;

								resultColumn.css('marginRight', marginRight);
								
								productResultCount = 0;
								productWidthCount = 0;
							}
														
							resultColumn.fadeIn(500);
						}
												
						if(data.products.length > resultsPerPage) {
							
							var previousLink = $('<a>').addClass('resultPageLinkPrevious').attr('href', 'javascript: void(0);').text("Edellinen");
							var nextLink = $('<a>').addClass('resultPageLinkNext').attr('href', 'javascript: void(0);').text("Seuraava");
							
							var nextLinkButton = $('<a>').addClass('resultPageLinkNext bigbutton').attr('href', 'javascript: void(0);').text('Next');
							var previousLinkButton = $('<a>').addClass('resultPageLinkPrevious bigbutton').attr('href', 'javascript: void(0);').text('Previous');
							
							$('.resultPageWrapper').append(previousLink);
							
							previousLinkButton.addClass('inactive');
							previousLink.addClass('inactive');

							for(var i = 0; i < Math.ceil(data.products.length / resultsPerPage); i++) {
							
								resultPageLink = $('<a>').attr('href', 'javascript: void(0);');
								resultPageLink.addClass('resultPageLink');
								resultPageLink.text(i + 1);
							
								resultPageLink.click(function (event) {
									var pageIndex = $(event.currentTarget).index();

									$('.resultPageWrapper').find('.selected').removeClass('selected');
									
									$(event.currentTarget).addClass('selected');
									
									$('.resultsRow').animate({
										left : -((pageIndex - 1) * $('.resultsWrapper').outerWidth(true))
									}, 500);
									
									$('.resultPageLinkPrevious').removeClass('inactive');
									$('.resultPageLinkNext').removeClass('inactive');
									
									if(pageIndex == 1) {
										$('.resultPageLinkPrevious').addClass('inactive');
									}
									
									if(pageIndex == Math.ceil(data.products.length / resultsPerPage)) {
										$('.resultPageLinkNext').addClass('inactive');
									}
								});
								
								$('.resultPageWrapper').append(resultPageLink);
																
								$('.resultPageWrapper .resultPageLink:first').addClass('selected');
								
								$('.resultPageWrapper').append(nextLink);
							}
							
							$('.results').append(previousLinkButton);
							$('.results').append(nextLinkButton);
														
							$('.resultPageLinkNext').click(function (event) {
								if($('.resultPageLink.selected').index() < Math.ceil(data.products.length / resultsPerPage)) {
									$('.resultPageLink.selected').next().trigger('click');
								}
							});
							
							$('.resultPageLinkPrevious').click(function (event) {
								if(($('.resultPageLink.selected').index() - 1) > 0) {
									$('.resultPageLink.selected').prev().trigger('click');
								}
							});
						}

						if(data.rimSizes.length > 0 && $('.carModelForm').data('last-value') != $('.carModelForm .vanneDropdownOption.selected').text()) {
							$('.rimSizes').fadeOut(500, function () {
								$('.rimSize').each(function () {
									if($.inArray($(this).find('.rimDiameter').val(), data.rimSizes) == -1) {
										$(this).hide();
									} else {
										$(this).show();
									}
									
									if(data.rimSizes.length == 1){
										$(this).find('.rimDiameter').attr('checked', true);
									}
								});
								
								$('.rimSizes').fadeIn(500);
							});
							$('.carModelForm').data('last-value', $('.carModelForm .vanneDropdownOption.selected').text());
						}
					}
				
					$('.ajax-loader').remove();
				}

			});
			
			
			carMakeForm.checkWhatsNext();	
	},
	
	fetchProductInfo : function (target) {
		vanneID = $(target).closest('.resultColumn').data('rowID');
		
		$.ajax({
			data : {method: 'fetchProductInfo', target : vannevalitsinWidgetID, rowID : vanneID},
			success : function (data) {
				var productInfoMainCenter = $('<div>').addClass('productInfoMainContent');
				
				
			
				productInfoMainCenter.html(data);
				
				productInfoMainCenter.find('table tr').each(function () {
					$(this).find('td:first').addClass('first');
				});
				
				$('.productInfoMainWrapper').html(productInfoMainCenter).fadeIn(500);
								
				$('.productInfoMainWrapper .productRetailerWrapper .productRetailerList').html($('.retailerList .listContent').html());
				
				$('.productInfoMainWrapper .productRetailerWrapper .productRetailerList .retailer').hide();

				$('.productRetailerLocation').remove();
				
				var productRetailerLocationForm = $('<div>').addClass('productRetailerLocation vanneDropdownForm');
				var productRetailerLocationSelect = $('<div>').addClass('productRetailerLocationSelect vanneSelect').appendTo(productRetailerLocationForm);
				var productRetailerLocationButton = $('<div>').addClass('productRetailerLocationButton vanneButton').appendTo(productRetailerLocationForm);
				var productRetailerLocationDropdown = $('<div>').addClass('productRetailerLocationDropdown vanneDropdown').appendTo(productRetailerLocationForm);
				
		
				
				
				productRetailerLocationHeadertext = $('<div>').addClass('productRetailerLocationHeadertext').text("Jälleenmyyjät");
				
				$('.productRetailerForm').append(productRetailerLocationHeadertext);
				$('.productRetailerForm').append(productRetailerLocationForm);
				
				vanneDropdownForm.init();
								
							
				$('.productRetailerForm').click(function(event) {
				$('.productInfoMainWrapper').draggable("destroy");
				
				});		
				
				$('.productWrapper').click(function(event) {
						$('.productInfoMainWrapper').draggable();
				});
				
				
				productRetailerLocationSelect.text("Valitse");
								
				cityList = [];
				
				$('.productInfoMainWrapper .productRetailerWrapper .retailer').each(function (index, element) {
					var city = $.trim($(element).find('.retailerPostarea').text().toUpperCase());
					
					if($.inArray(city, cityList) == -1 && city.length != 0) {
						cityList.push(city);
					}
				});
				
				cityList.sort();
				
				for(var i = 0; i < cityList.length; i++) {
					var city = cityList[i];
					
					var option = $('<div class="vanneDropdownOption retailerCity">' + city + '</div>');
											
					productRetailerLocationDropdown.append(option);
				}
				
				$('.productRetailerLocation .vanneDropdownOption').click(function (event) {
					selectedOption = $(event.currentTarget);
				
					$('.productInfoMainWrapper .productRetailerWrapper .retailer').hide();
					
					$('.productInfoMainWrapper .productRetailerWrapper .retailer').each(function (index, element) {
						if($.trim($(element).find('.retailerPostarea').text()).toUpperCase() == selectedOption.text()) {
							$(element).fadeIn(500);
						}
					});
				});
				
				$('.productInfoMainWrapper .productCloseWindow a').click(function (event) {
					$(event.currentTarget).closest('.productInfoMainWrapper').fadeOut(500);
				});								
			}									
		});
	},
	checkWhatsNext : function () {

		$('.vanneFormCycleNext').removeClass('vanneFormCycleNext');

		$('.searchCount').html('Valitse vähintään automalli ja –merkki');
		
		if($('.carMakes .vanneDropdownOption.selected').length > 0) {	
			
			if($('.carModelAndBoltPattern .vanneDropdownOption.selected').length > 0) {
				$('.searchCount').html('Vanteita valitsemallasi haulla: <span class="countNumber">0</span>');
			}
			
			if($('.carModelAndBoltPattern .vanneDropdownOption.selected').length == 0) {
				$('.carModelAndBoltPattern').addClass('vanneFormCycleNext');
			} else if($('.rimDiameter:checked').length == 0) {
				
				
				$('.rimSizeWrapper').addClass('vanneFormCycleNext');
			} else {
				//$('.results').addClass('vanneFormCycleNext');
			}
		} else {
			$('.carMakes').addClass('vanneFormCycleNext');
		}
	}
}




$('document').ready(function () {
	
	vanneDropdownForm.init();
	carModelAndBoltPatternForm.init();
	carMakeForm.init();
	carRimDiameterForm.init();
	carMakeForm.checkWhatsNext();
	
	$('.productInfoMainWrapper').draggable({ disabled: false });


});