"use strict";
/*global $, jQuery*/

var YIT_KOTI = {};

/* --------------------------------------------------------------------

Check if DOM has loaded

-------------------------------------------------------------------- */

$(function () {
	
	YIT_KOTI.Ui = (function () {		
		
		function verticalCenterImage(image, imageHeight) {
			var containerHeight = $('.big-picture').height();
			/*alert(containerHeight);
			alert(imageHeight);*/
			// center image vertically if container height is bigger than image height
			if (containerHeight >= imageHeight) {
				image = $(image).css({'position' : 'relative', 'top' : containerHeight / 2 - imageHeight / 2});
			}
			return image;
		}
		
		function resizeImage(image, maxWidth) {
			var newWidth, newHeight;
			
			/* resize image if it's wider than max width */
			if (image.width > maxWidth) {
				// calculate new image dimensions
				newWidth = maxWidth;
				newHeight = image.height / (image.width / maxWidth);
				
				// return resized and centered  image
				return verticalCenterImage($(image).height(newHeight).width(newWidth), newHeight);
			} else {
				// return orginal and centered image
				return verticalCenterImage($(image), image.height);
			}
		}
		
		function showCarouselImage(imageSrc, maxWidth, appendTo) {
			var bigImg;
			
			if ($('.big-picture img').length > 0) {
				$('.big-picture img').remove();
			}
			bigImg = document.createElement("img");
			$(bigImg).attr('alt', '');
			$(bigImg).attr('src', imageSrc);			
			
			if ($.browser.msie || $.browser.opera) {
			    if (bigImg.height == 0) {
			        bigImg.onload = function() {
			            $(appendTo).append(resizeImage(bigImg, maxWidth));
	                }
	            } else {
	                $(appendTo).append(resizeImage(bigImg, maxWidth));
	            }	            
			} else {
				$(bigImg).bind('load', function () {
					$(appendTo).append(resizeImage(bigImg, maxWidth));
				});
			}
		}
		
		//function apartmentCarusel() {
		function imageCarousel(carousel, size, maxWidth, vertical) {
			var api;
			
			if ($(carousel).length > 0) {				
				$('div').removeClass('no-js');
				
				// show first item big picture
				showCarouselImage($('.scrollable a:first').attr('href'), maxWidth, $('.big-picture'));
				
				// initialize carousel
				$(carousel).scrollable({
					size: size,
					vertical: vertical,
					clickable: false
				}).circular();
				
				api = $("div.scrollable").scrollable({api: true});
				
				// remove next-button if all the thumbs fits in one screen
				if (api.getPageAmount() <= 1) {
					$(api.getNaviButtons()).remove();
				}
				
				// show first visible image when next button is clicked
				api.onSeek(function () {
					var firstItem, imageSrc;
					firstItem = this.getVisibleItems();
					imageSrc = $(firstItem).children('a:first').attr('href');
					showCarouselImage(imageSrc, maxWidth, $('.big-picture'));
				});
				
				// show big picture when item is selected
				$('.scrollable a').bind('click', function () {
					
					// show big image
					showCarouselImage($(this).attr('href'), maxWidth, $('.big-picture'));
					
					return false;
				});
			}
		}
		
		function toggleSearchForm() {
			$('.apartment_search .close').bind('click', function () {
				if ($('.apartment_search').hasClass('closed')) {
					$('.apartment_search').removeClass('closed');
				} else {
					$('.apartment_search').addClass('closed');
				}
				return false;
			});
		}
		
		function searchResults() {		
			if ($('.sort-types').length > 0) {
				var sortOptions = $('.sort-types ul a'), i;
				
				$('.sort-types .sort-type').removeClass('hide');
				$('.sort-types ul').addClass('hide options');
				
				$('.sort-types').mouseenter(function () {
					$('.sort-types .options').removeClass('hide');
				}).mouseleave(function () {
					$('.sort-types .options').addClass('hide');
				});
				
				for (i = 0; i < sortOptions.length; i += 1) {
					if ($(sortOptions[i]).hasClass('selected')) {
						$('.sort-types .sort-type').html($(sortOptions[i]).html());
					}
				}
			}
		}
		
		function htmlspecialchars(string) {
			return $('<span>').text(string).html();
		}
		
		function useSearchCriterias() {
			var searchCriterias = [], addItem = true, temp, i;
			
			if ($('.apartment_search').length > 0) {
				$('.search_criterias_list').removeClass('hide');
				$('.apartment_search .add').removeClass('hide');
				
				// if search criterias hidden field is not empty add items
				if ($('#search_criterias').val() !== '') {
					temp = $('#search_criterias').val();
					searchCriterias = temp.split('?');
					
					for (i = 0; i < searchCriterias.length; i += 1) {
						$('.search_criterias_list').append('<div class="item"><a href="#" class="remove"><span>Remove</span></a> <span class="search-text">' + searchCriterias[i] + '</span></div>');
					}
				}
				
				$('.apartment_search .add').bind('click', function () {
					if ($('#district').val() !== '') {
						// if search text is allready in the array, do nothing
						for (i = 0; i < searchCriterias.length; i += 1) {
							if ($('#district').val() === searchCriterias[i]) {
								addItem = false;
							}
						}
						
						if (addItem === true) {
							// add search text
							temp = jQuery.trim(htmlspecialchars($('#district').val()));
							$('.search_criterias_list').append('<div class="item"><a href="#" class="remove"><span>Remove</span></a> <span class="search-text">' + temp + '</span></div>');
							searchCriterias.push(temp);
							// add search text to hidden field
							$('#search_criterias').val(searchCriterias.join('?'));
							$('#district').val('');
							$('#district').focus();
						}
						addItem = true;
					}
					return false;				
				});
				
				$('.apartment_search .remove').live("click", function () {
					// remove search text from array
					for (i = 0; i < searchCriterias.length; i += 1) {
						if ($(this).siblings('.search-text').text() === searchCriterias[i]) {
							searchCriterias.splice(i, 1);
							$('#search_criterias').val(searchCriterias.join('?'));
						}
					}				
					// remove search item
					$(this).parent().remove();
					
					return false;
				});
			}
		}
		
		function frontpageMenu() {
			if ($('.frontpage .menu').length > 0) {
				
				$('.menu .accordion').accordion({
				    event: 'mouseover',
				    autoHeight: false,
				    clearStyle: true,
				    animated: 'swing',
				    active: 0
				});
				
				$('.frontpage .menu .menu_navigation').bind('mouseover', function () {
				    if ($(this).parent('div').siblings('.level2').is(':visible') === false) {
				        // hide showings list
				        $('.showings .showings_list').addClass('hide');
				        $('.showings .district').removeClass('bold');
				    }
				});
			}
		}
		
		function hideEmptyColumns(tableId) {
			var tableColumns, i;
			tableColumns = $('#' + tableId + ' tr:eq(0) th').length;
											
			// Loop table columns
			for (i = 1; i < tableColumns; i += 1) {
				// if column cells are empty or contains zero (doesn't count header (th) cells): hide cells
				if (jQuery.trim($('#' + tableId + ' td:nth-child(' + i + ')').html()) === '' || jQuery.trim($('#' + tableId + ' td:nth-child(' + i + ')').html()) === '0') {
					$('#' + tableId + ' td:nth-child(' + i + '), #' + tableId + ' th:nth-child(' + i + ')').addClass('hide');
				}
			}		
		}
        
        function sendApartmentListForm() {
			var i, moreInfoCheckboxes, query = '';

			try {
			    if (infoRequestFormURL) {
			        if (infoRequestFormURL === '') {
			            return false;
			        };
			    }
            }
            catch (err) {
                return false;
            }
			
			moreInfoCheckboxes = $('.more-info-selector input:checked');
			
			// get selected values from checkboxes
			for (i = 0; i < moreInfoCheckboxes.length; i += 1) {
				if (query === '') {
					query = $(moreInfoCheckboxes[i]).val();
				} else {
					query += ',' + $(moreInfoCheckboxes[i]).val();
				}
			}
			if (query !== '') {
				window.location = infoRequestFormURL + "&params=moreInformationIds="+query; 
				$('.more-info').attr('href',infoRequestFormURL + "&params=moreInformationIds="+query); 
				$('#second-more-info').attr('href',infoRequestFormURL + "&params=moreInformationIds="+query); 
				return false;       
			}
		}

		function apartmentListForm() {
		    var i, moreInfoCheckboxes, showMoreInfo;
		    
		    $('#second-more-info').bind('click', function () { 
					    sendApartmentListForm();
					});
		    $('.more-info').bind('click', function () { 
					    sendApartmentListForm();
					});		
		
			if ($('.apertment_list_sort').length > 0) {

				// hide empty columns
				hideEmptyColumns('apartment_list');
				hideEmptyColumns('non_apartment_list');
				
				// by default more info -link is doesn't do anything
				showMoreInfo = false;
				$('a.RequireChecked').addClass('unclickable');
				$('a.RequireChecked').bind('click', function () { 
					return false;
				});				
				
				// highlight row if "more info" checkbox is checked
				moreInfoCheckboxes = $('.more-info-selector input');
				for (i = 0; i < moreInfoCheckboxes.length; i += 1) {
					if ($(moreInfoCheckboxes[i]).is(':checked')) {
						$(moreInfoCheckboxes[i]).parents('tr').addClass('highlight');
						showMoreInfo = true;
					}
				}
				
				// if one or more "more info" checkboxes are checked show "more info" link
				if (showMoreInfo) { 
					$('a.RequireChecked').unbind('click');
					$('a.RequireChecked').bind('click', function () { 
					    sendApartmentListForm();
					});
					$('a.RequireChecked').removeClass('unclickable');
				}
				
				// bind highlight event for "more info" checkboxes
				$('.more-info-selector input').bind('click', function () { 
					if ($(this).parents('tr').hasClass('highlight')) {
						$(this).parents('tr').removeClass('highlight');
						if ($('.more-info-selector input').is(':checked') === false) {
						    $('a.RequireChecked').addClass('unclickable');
						    $('a.RequireChecked').bind('click', function () { 
							    $(this).addClass('unclickable');
							    return false;
						    });
						 }
					} else {
						$(this).parents('tr').addClass('highlight');
						$('a.RequireChecked').removeClass('unclickable');
						$('a.RequireChecked').unbind('click');
						$('a.RequireChecked').bind('click', function () { 
					        sendApartmentListForm();
					    });
					}
				});
			}
		}
		
        function showCallPricing() {
			if ($('.show_call_pricing').length > 0) {
				$('.call_pricing').addClass('hide');
				$('.show_call_pricing').bind('mouseenter', function () { //MODIFIED WL 2009/08/24
					$('.call_pricing').removeClass('hide');
					return false;
				});
				$('.show_call_pricing').bind('mouseleave', function () { //MODIFIED WL 2009/08/24
					$('.call_pricing').addClass('hide');
					return false;
				});
			}
		}

		
		/*  ----------------------------------------------
		    apartement search in frontpage				
        ---------------------------------------------- */
        
        //remove area from selection
        function removeArea(element, areaName)
        {
            //remove area from selection, must parse array to do this        
            var areas = $(".areas_selection").val();   
            var areasArray = areas.split("?");
            
            var j = 0;
            while(j < areasArray.length)
            {      
         
                if(areasArray[j] == areaName.toString())
                {
                    areasArray.splice(j,1);
                }
                else
                {
                    j++;
                }
            }        
            areas = areasArray.join("?");                
            
            //update value in hidden field
            $(".areas_selection").val(areas);
                    
            //remove element                    
            //$(element).remove();
            // remove search item
			$(element).parent().remove();                                        
            
            return false;            
        }
        
        //adds area selected from autocomplete to list of selected areas
        function addArea(event, data, areaName)
        {
            var areas, link, areasArray;
            var alreadyInSelected = false; 
            
            if ($(".areas_selection").length > 0) {
                //get areas from textbox
                areas = $(".areas_selection").val();
                
                //check if area isn't in selection already
                areasArray = areas.split("?");
                for(var i=0; i <areasArray.length; i++)
                {
                    if(areasArray[i] == areaName.toString())
                    {
                        alreadyInSelected = true;
                    }
                }          
                               
                //if area isn't there
                if(alreadyInSelected == false)
                {
                    //add area to textbox and create link with delete option
                    $(".areas_selection").val(areas + areaName + "?");
                    
                    /*link = $("<a class='remove_area' href='#'>" + areaName + "</a>").bind("click", function ()
                    {
                        return removeArea(this, areaName);
                    });
                    
                    link.appendTo($(".selected_areas"));*/
                    $(".selected_areas").append('<div class="item"><a href="#" class="remove"><span>Remove</span></a> <span class="search-text">' + areaName + '</span></div>');
                   
                }        
                
                //remove text from autocomplete textbox
                $("#dummyAutocomplete").val("");        
                
            }
            
            return false;            
        }
                
        //Initializes appartement search options in bluebox
        function initializeApartementSearch() {
            
            if ($(".selected_areas").length > 0) {
                //binds function which marks checkboxes
                $(".property_types_select_all").bind("click", function() {           
                    $(".property_types_section input[type='checkbox']").attr("checked", "true");
                    return false;
                });
            
                $(".areas_selection").hide();
                
                //create dummy field which will be used for autocomplete
                var autocompleteInput =  $("#dummyAutocomplete");
                $(".areas_selection").after(autocompleteInput);
                
                //load data from SearchWords.aspx
                $.get("SearchWords.aspx", {}, function (jsonData) {
                    //provide data taken from json to autocomplete and start it
                    autocompleteInput.autocomplete(jsonData.words).result(addArea);
                }, "json");
                
                $('.selected_areas .remove').live("click", function () {
					// remove search text from array
					removeArea(this, $(this).siblings('.search-text').text());
					
					return false;
				});                                   

                return true;
            }
        }
    		
        /*  ----------------------------------------------
               end apartement search in frontpage 
            ---------------------------------------------- */
        
        function frontpageShowings() {
            var objShowings, itemHtml, boxWidth = 0;
            
            if ($(".frontpage .showings").length > 0) {
            
                // get showings data                        
                $.getJSON('HouseholdShowings.aspx', function(data) {                                              
                    objShowings = data;
                    
                    // if there is no showing remove showgins item from menu and do nothing
                    if (data.regions.length === 0) {
                        $('.menu li.showings').remove();
                        return false;
                    }
                    
                    $.each(objShowings.regions, function(i,item){
                        // add region-links to menu
                        $('.showings ul.districts').append('<li><a href="#" class="district" rel="id_' + item.id + '">' + item.name + '</a></li>');
                    });
                });
                
                // bind open showings
                $('.showings ul a.district').live('click', function(){
                    var regionId = $(this).attr('rel'), i, itemHtml = '', regionIdTemp, itemHeight = 0;
                    
                    // hide open showings
                    $('.showings_list').addClass('hide');
                    
                    // make district link active
                    $('.showings ul a.district').removeClass('bold');
                    $(this).addClass('bold');
                    
                    // do not create box if it exists. Just remove hide-class from selected showing
                    if ($(this).siblings().hasClass('showings_list')) {                    
                        $(this).siblings().removeClass('hide');
                                                          
                        return false;
                    }
                    
                    // get showings
                    $.each(objShowings.regions, function(i,item){
                        regionIdTemp = regionId.split('_');
                        if (regionIdTemp[1] === item.id) {
                            for (i = 0; i < item.showings.length; i += 1) {
                                // create showing item
                                itemHtml += '<div class="item"><div class="wrap">';
                                itemHtml += '<a href="' + item.showings[i].LinkURL + '">' + item.showings[i].Name + '</a>';
                                itemHtml += '<img src="' + item.showings[i].ImageURL + '" width="80" height="66" alt="" />';
                                itemHtml += '<div class="city">' + item.showings[i].City;
                                if (item.showings[i].LocalDistrict !== '') {
                                    itemHtml += ' (' + item.showings[i].LocalDistrict + ')';
                                }
                                itemHtml += '</div>';
                                itemHtml += '<div class="address">' + item.showings[i].Address + '</div>';
                                //itemHtml += '<div class="showingTime">' + item.showings[i].ShowingTime;
                                itemHtml += '<div class="showingTime">';
                                // if there is extra information show info-icon and create info-box
                                if (item.showings[i].ShowingDetails !== '') {
                                    itemHtml += '<div class="ShowingDetailsIcon" rel="id_' + regionIdTemp[1] + i + '" />';
                                    // move info box outside carousel main div
                                    $('body').append('<div class="ShowingDetails hide" rel="id_' + regionIdTemp[1] + i + '"><div class="wrap png"><div class="close" />' + item.showings[i].ShowingDetails + '</div></div>');
                                }
                                itemHtml += item.showings[i].ShowingTime;
                                itemHtml += '</div></div></div>';
                            }
                        }
                    });
                    
                    // add box for showings
                    if (itemHtml !== '') {                        
                        if ($(itemHtml).length > 3) {
                            $(this).before('<div class="showings_list"><div class="section png"><div class="top png"><span class="png"></span></div><div class="wrap png"><div class="scrollable"><div class="items">' + itemHtml + '</div></div><div class="next" /><div class="prev" /><div class="close" /></div></div><div class="bottom png"><span class="png"></span></div></div>');
                            // add scrollable carousel for showing list items
                            $('.showings_list .scrollable').scrollable({
                                size : 3,
                                prev : '.prev',
                                next : '.next'
                            });
                        } else {
                            boxWidth = ($(itemHtml).length * 180) + 60;
                            $(this).before('<div class="showings_list" style="width:' + boxWidth + 'px;"><div class="section png"><div class="top png"><span class="png"></span></div><div class="wrap png"><div class="scrollable" style="width:' + $(itemHtml).length * 180 + 'px;"><div class="items">' + itemHtml + '</div></div><div class="close" /></div></div><div class="bottom png"><span class="png"></span></div></div>');
                        }
                    }
                    
                    // close showings box
                    $('.showings .close').live('click', function(){
                        $('.showings_list').addClass('hide');
                        $('.showings ul a.district').removeClass('bold');                    
                    });
                    
                    // open showings details box
                    $('.showings .ShowingDetailsIcon').bind('mouseenter', function(){
                        var detailId = $(this).attr('rel'), showingDetails = $('.ShowingDetails'), infoIconOffset = $(this).offset();
                        
                        for (i = 0; i < showingDetails.length; i += 1) {
                            if (detailId === $(showingDetails[i]).attr('rel')) {
                                $(showingDetails[i]).css("top", infoIconOffset.top - 10 + "px"); 
                                $(showingDetails[i]).css("left", infoIconOffset.left - 10 + "px");
                                $(showingDetails[i]).removeClass('hide');
                            }
                        }
                    });
                    
                    // hide showings details box
                    $('.ShowingDetails').bind('mouseleave', function(){
                        $(this).addClass('hide');                    
                    });
                    
                    // make showing items equal height
                    $($(this).siblings('.showings_list').find('.item')).equalHeights();
                    
                    return false;
                });
            }
        }
        
        jQuery.fn.equalHeights=function() {
            var maxHeight = 0;
            this.each(function(){
                if (this.offsetHeight>maxHeight) {
                    maxHeight = this.offsetHeight;
                }
            });
            this.each(function() {
                $(this).height(maxHeight + "px");
                if (this.offsetHeight>maxHeight) {
                    $(this).height((maxHeight-(this.offsetHeight-maxHeight))+"px");
                }
            });
        };		
		
		function init() {

			/* ------------------------------------------------------------------

			Initialize all YIT_KOTI.Ui functions

			------------------------------------------------------------------ */
			imageCarousel($('.apartment-pictures .scrollable'), 4, 504, true);
			imageCarousel($('.pictures .scrollable'), 6, 588, false);
			toggleSearchForm();
			//useSearchCriterias();
			searchResults();
			frontpageShowings();
			frontpageMenu();
			apartmentListForm();
			showCallPricing();
			initializeApartementSearch();
			
			if ($('a.lightbox').length > 0) {
			    $('a.lightbox').lightBox({
				    txtImage: '',
				    txtOf: '/',
				    imageBtnClose: '/img/lightbox-btn-close.gif',
				    imageBtnPrev: '/img/lightbox-btn-prev.gif',
				    imageBtnNext: '/img/lightbox-btn-next.gif',
				    imageLoading: '/img/lightbox-ico-loading.gif'
			    });
			}
		}
		
		return {
			
			/* --------------------------------------------------------------------

			Public methods

			-------------------------------------------------------------------- */
			Init: init
		};
	}());
	
	YIT_KOTI.Ui.Init();
	
});