$(document).ready(function(){
    
	// Method to trigger when a tab on the navigation bar has been clicked
    $('.thumbnail').click( function (e) {
        e.stopPropagation();
        e.preventDefault(); 
        
		// Retrieve the index of the tabs that has been clicked
		var clicked_index = $(this).attr('id');
        clicked_index = clicked_index.replace('thumbnail_','');
        //window.alert(clicked_index);
        
		// Turn off (gray) all tabs on navigation bar
		$('.large_picture').each(function(i) {  
            $(this).removeClass('active');
        });
        $("#large_picture_" + clicked_index).hide();
        $("#large_picture_" + clicked_index).addClass("active");
        
        $("#large_picture_" + clicked_index).stop(true, true).fadeIn('fast');
    
	});
    
    $('.thumbnail').click( function (e) {
        e.stopPropagation();
        e.preventDefault(); 
    });
    
    $('.facebook_icon, .twitter_icon').hover(
      function () {
        var src = $(this).attr("src").split('.').reverse().slice(1).reverse().join('.') + "_roll.png";
        $(this).attr("src", src);
      }, 
      function () {
        var src = $(this).attr("src").replace("_roll", ""); 
        $(this).attr("src", src);
      }
    );
    
    if ($.browser.msie && parseInt($.browser.version, 10) <= 6) {
    }
    else {
        $('.scroll-pane').jScrollPane({
            showArrows:true,
            verticalDragMinHeight:33,
            verticalDragMaxHeight:33,
            horizontalDragMinWidth:33,
            horizontalDragMaxWidth:33,
            mouseWheelSpeed:5,
            arrowButtonSpeed: 5,
            trackClickSpeed: 5
        });
    };
    
    $("#products_button_bg").hover(
      function () {
        $('#products_button_bg').addClass('active');
        $('.submenu_item').addClass('showing');
      }, 
      function () {
        $('#products_button_bg').removeClass('active');
        $('.submenu_item').removeClass('showing');
      }
    );
    
    $("#home_button_bg, #contact_button_bg").hover(
      function () {
        $(this).addClass('active');
      }, 
      function () {
        $(this).removeClass('active');
      }
    );
    
    $(".submenu_item").hover(
      function () {
        $(this).addClass('active');
      }, 
      function () {
        $(this).removeClass('active');
      }
    );
    
    $("#home_button img").hover(
      function () {
        var src = $(this).attr("src").split('.').reverse().slice(1).reverse().join('.') + "_roll.jpg"; 
        $(this).attr("src", src);
      }, 
      function () {
        var src = $(this).attr("src").replace("_roll", ""); 
        $(this).attr("src", src);
      }
    );
    
    $(".overlay").hover(
      function () {
        var src = $(this).attr("src").split('.').reverse().slice(1).reverse().join('.') + "_roll.png";
        $(this).attr("src", src);
      }, 
      function () {
        var src = $(this).attr("src").replace("_roll", ""); 
        $(this).attr("src", src);
      }
    );
    
    $(".products_off").hover(
      function () {
        var style = $(this).css("background-image").replace("\"", "").split('.').reverse().slice(1).reverse().join('.') + "_roll.png)"; 
        $(this).css("background-image", style);
      }, 
      function () {
        var style = $(this).css("background-image").replace("_roll", ""); 
        $(this).css("background-image", style);
      }
    );
    
    $("#send_to_friends a").click( function (e) {
        e.stopPropagation();
        e.preventDefault(); 
        
        $('#field_name .error').html('');
        $('#field_email .error').html('');
        $('#field_friend_email .error').html('');
        $('#field_message .error').html('');
        $('.entry input').val('');
        $('.entry textarea').html('');
        $('.send_to_friend_success').hide();
        $('.entry, .send_btn').show();
        
        $("#send_to_friend_popup_bg").hide().show();
        $("#send_to_friend_popup").hide().stop(true, true).fadeIn('fast');
    
	});
    
    $("#send_to_friend_popup .close_button a").click( function (e) {
        e.stopPropagation();
        e.preventDefault(); 
        
        $("#send_to_friend_popup_bg").hide();
        $("#send_to_friend_popup").hide();
    
	});
    
    $('#send_to_friend_form').submit(function(e){
        e.preventDefault(); 
        $(this).ajaxSubmit({
            type: 'post',
            dataType:'json',
            timeout:15000,
            success: function(data){
                if(data.status=='ok')
                {
                    $('.entry, .send_btn').hide();
                    $('.send_to_friend_success').fadeIn('fast');
                }
                else// if(data.status=='ng')
                {
                    $('#field_name .error').html(data.result.name);
                    $('#field_email .error').html(data.result.email);
                    $('#field_friend_email .error').html(data.result.friend_email);
                    $('#field_message .error').html(data.result.message);
                }
            },
            error: function(data, t, a)
            {
                alert(t);
            }
        });
        return false;
    });

    // How To: array('onKeyUp' => "return imposeMaxLength(this, 500);", 'onKeyDown' => "return imposeMaxLength(this, 500);")
    function imposeMaxLength(Object, MaxLen)	/* For textarea */
    {
        if( Object.value.length <= MaxLen )
            return true;
        Object.value = Object.value.substring(0, MaxLen);
        return false;
    }
    
});