jQuery.noConflict();
jQuery(document).ready(function($) {

	// rollover handler
	$('.rollover').each(function() {
		var img = $(this).find('img:first-child');
		var imgName = img.attr('src');
		$(this).hover(
				function() {
                    if(imgName.search('0.png')>=0){
					    img.attr('src', imgName.replace(/0.png$/, '1.png'));
                    }else if(imgName.search('0.gif')>=0){
                        img.attr('src', imgName.replace(/0.gif$/, '1.gif'));
                    }
				},
				function() {
					img.attr('src', imgName);
				}
				);
	});
	$('.prod-link').hover(
			function() {
				$(this).find('.prod-mask').fadeOut('slow');
			},
			function() {
				$(this).find('.prod-mask').fadeIn('fast');
			}
			);


	// homepage promo boxes
	$('.home-section a').hover(
			function() {
				$(this).find('.hs-label').css('background-color', '#885200');
			},
			function() {
				$(this).find('.hs-label').css('background-color', '#000000');
			}
			);

	// dealer search
	var defaultDealer = 'FIND A RETAILER';
	var defaultDealerOver = 'ENTER ZIP CODE';
	$('#search-dealer')
			.val(defaultDealer)
			.focus(function() {
				var text = jQuery.trim($(this).val());
				if (text == defaultDealer || text == defaultDealerOver) {
					$(this).val('');
					$(this).addClass('in-focus');
				}
			})
			.blur(function() {
				var text = jQuery.trim($(this).val());
				if (text.length == 0) {
					$(this).val(defaultDealer);
					$(this).removeClass('in-focus');
				}
			});
	$('#search-form-dealer')
			.hover(
				function() {
					if (!$('#search-dealer').hasClass('in-focus')) {
						var text = jQuery.trim($('#search-dealer').val());
						if (text.length == 0 || text == defaultDealer) {
							$('#search-dealer').val(defaultDealerOver);
						}
					}
				},
				function() {
					if (!$('#search-dealer').hasClass('in-focus')) {
						var text = jQuery.trim($('#search-dealer').val());
						if (text.length == 0 || text == defaultDealerOver) {
							$('#search-dealer').val(defaultDealer);
						}
					}
				})
			.submit(function() {
				var text = jQuery.trim($('#search-dealer').val());
				if (text == defaultDealer || text == defaultDealerOver) {
					$('#search-dealer').val('');
				}
			});

	// site search
	var defaultSite = 'SEARCH';
	$('#search-site')
			.val(defaultSite)
			.focus(function() {
				var text = jQuery.trim($(this).val());
				if (text == defaultSite) {
					$(this).val('');
					$(this).addClass('in-focus');
				}
			})
			.blur(function() {
				var text = jQuery.trim($(this).val());
				if (text.length == 0) {
					$(this).val(defaultSite);
					$(this).removeClass('in-focus');
				}
			});
	$('#search-form-site')
			.hover(
				function() {
					if (!$('#search-site').hasClass('in-focus')) {
						var text = jQuery.trim($('#search-site').val());
						if (text.length == 0) {
							$('#search-site').val(defaultSite);
						}
					}
				},
				function() {
					if (!$('#search-site').hasClass('in-focus')) {
						var text = jQuery.trim($('#search-site').val());
						if (text.length == 0) {
							$('#search-site').val(defaultSite);
						}
					}
				})
			.submit(function() {
				var text = jQuery.trim($('#search-site').val());
				if (text == defaultSite) {
					$('#search-site').val('');
				}
			});

    //fabric search
    var defaultFabric = 'SEARCH BY SKU#';
	$('#search-fabric')
			.val(defaultFabric)
			.focus(function() {
				var text = jQuery.trim($(this).val());
				if (text == defaultFabric) {
					$(this).val('');
					$(this).addClass('in-focus');
				}
			})
			.blur(function() {
				var text = jQuery.trim($(this).val());
				if (text.length == 0) {
					$(this).val(defaultFabric);
					$(this).removeClass('in-focus');
				}
			});


    //design board add notification
    function designBoardNotify(itemName){
        var blurb = document.createElement('p');
        var bText = "<span>"+itemName+"</span> was successfully added to your design board.";
        $('.design-board').append($(blurb).html(bText).addClass('design-board-notification'));
        $(blurb).fadeIn(1000).delay(4000).fadeOut(1000, function(){
            $(this).remove();
        });
    }

	//design board interactivity

    $('.design-board-content').jScrollPane();
    var throttleTimeout;

    $(window).resize(function(){
       if($(this).width() < 940){
           $('.design-board-tab p').css('right', 940-$(this).width()+'px');
       }else{
           $('.design-board-tab p').css('right', '0px');
       }

       if($('.design-board-body').css('display') == 'block'){
           $('.design-board-body').css('height', $('body').height()*.85+'px');
           $('.design-board-content').css('height', $('.design-board-body').height()-42+'px');
           if ($.browser.msie) {
						// IE fires multiple resize events while you are dragging the browser window which
						// causes it to crash if you try to update the scrollpane on every one. So we need
						// to throttle it to fire a maximum of once every 50 milliseconds
						if (!throttleTimeout) {
							throttleTimeout = setTimeout(function(){
									$('.design-board-content').data('jsp').reinitialise();
									throttleTimeout = null;
								},
								50
							);
                        }
           }else{
               $('.design-board-content').data('jsp').reinitialise();
           }
       }
    });

	$('.design-board-tab p').click(toggleBehavior);
	$('.overlay').click(toggleBehavior);

	function toggleBehavior(){
        if($('.overlay').css('display')=='none'){
            $('body').css('overflow','hidden');
            $('.design-board-body').css('height', $('body').height()*.85+'px');
            $('.design-board-content').css('height', $('.design-board-body').height()-42+'px');
			$('.filters').css('display','none');
		}else{
			$('.filters').css('display','block');
           $('body').css('overflow','visible');
		}
        $('.overlay').fadeToggle();
        $('.design-board-tab p').toggleClass('active');
        $('.design-board-body').slideToggle('',function(){
            $('.design-board-content').data('jsp').reinitialise();
            /*experiment*/
            if($('.jsPane').height() >= $('.design-board-content').height()){
                $('.my-styles, .my-fabrics, .my-finishes').css('min-height', $('.jspPane').height()-60+'px');
            }else{
                $('.my-styles, .my-fabrics, .my-finishes').css('min-height', $('.design-board-content').height()-40+'px');
            }
        });
		$('.close-label').toggle();
		$('.arrow').toggleClass('arrow-up');
	}
	$('.remove-item').live('click', function(){
		 var item = $(this).attr('id').split("__"); //item[0] = 'product', item[1] =SKU
		 //call ajax to delete the SKU
          $.ajax({ type: "GET",   
                   url: "/delete_product.php",   
                   async: false,
			       data: ({id : item[1]})
                   });
		  // reset the total count for design board
		  var total = parseInt($("#totalItems").text()) - 1 ;
		  $("#totalItems").empty().append(total);
		$(this).parents('.item').fadeOut();
	});	



	
	// Add product to design board
	$("p[id*=addProduct_]").click(function(){
		var name = this.id;
		//take the id name and take off the "addProduct_" from name, the rest are SKU
		var SKU = name.replace("addProduct_", " ");
      
        var output = addProduct(SKU, "product");
     

        $(".db-add").addClass(" Added");

       return false;

	});

	// Add product to design board
	$("p[id*=addFabric_]").live("click", function(){
		//alert("haa");
		var name = this.id;
		//take the id name and take off the "addProduct_" from name, the rest are SKU
		var SKU = name.replace("addFabric_", " ");
      
        var output = addProduct(SKU, "fabric");
		$(".db-add").addClass(" Added");

        return false;

	});

	// Add product to design board
	$("p[id*=addFinish_]").live("click",function(){
		
		var name = this.id;
		//take the id name and take off the "addProduct_" from name, the rest are SKU
		var SKU = name.replace("addFinish_", " ");
     
        var output = addProduct(SKU, "finish");

		$(".db-add").addClass(" Added");

        return false;

	});

	function addProduct(SKU, type_name)
	{
		//alert(SKU);

		 $.getJSON("/select.php",{id : SKU, type: type_name}, function(j){
				

				var a = parseInt(j.add);
				 

					if (a === 1 )//if product been added, and the first array element returned the product group name to be add
					{
						var addString = '<div class="item"><div class="img-container"><img src="'+ j.image +'" alt="style"/><div class="remove-item" id="'+ type_name + '__' + j.id + '"></div></div><p class="item-name">' + j.id + '</p><p class="item-desc">'+ j.name + '</p></div>';
                         $("#"+j.list).append(addString);
						 var total = parseInt($("#totalItems").text()) +1 ;
						
                         $("#totalItems").empty().append(total);
						 designBoardNotify(j.name);
						
                     }
					else {
						alert("This item has been added to your design board already!");
					}
				
		         
        })//end of the json call
				
            
	}

	$(".Show").click(function() {
	
		if($(this).children('p').hasClass('hideShow')) // "this" refers to the element that fired the event
    {
		
        $(this).children('p').removeClass('hideShow');
	}
	else  {
		   $(this).children('p').addClass('hideShow');
	}

	});

	//Print Design board
	$("#printBoard").click( function() {
                    $('.design-board-content').jqprint();
                    return false;
                });

	$("#downloadLink").click( function() {
		var total = parseInt($("#totalItems").text());
		    if (total>0)
		    {
		    }
			else  {
				    alert("There is no product on your design board yet! Please select product first!");
					return false;
			}
       //   Content-Disposition = 'attachment; filename=filename.pdf';
                  
                });
	
    $("a[rel^='prettyPhoto']").prettyPhoto({
		theme: 'light_square', 
		iframe_markup: '<iframe src ="{path}" width="{width}" height="{height}" frameborder="no"></iframe>',
		autoplay: false,
		social_tools: '',
		custom_markup: '',
        changepicturecallback: styleBody
	});

    function styleBody(){
        $('iframe').contents().find('body').css('height','auto');
    }
});