$(document).ready(function(){
    var left_image_width = 320;
    var left_image_height = 360;
            
    $('.show-bigger-image').livequery(function(){
        $(this).click(function(){
            var productId = $(this).attr('product-id');
            var img = $(this).find('img:first-child');                
            var img_src = img.attr('src');
                          
            var imgHover = $(this).find('img:nth-child(2)');
            var imgHover_src = imgHover.attr('src');
            
            $('.left-container').html('<a href="CollectionProductImages.aspx?id='+ productId +'" class="use_fancybox" onclick="return false;"><img src="'+img_src+'" width="'+left_image_width+'" height="'+left_image_height+'" /><img src="'+imgHover_src+'" width="'+left_image_width+'" height="'+left_image_height+'" style="display:none;" /></a>');
            
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "Collections.aspx/GetProductSideImage",
                data: "{productId:'"+productId+"'}",
                dataType: "json",
                success: function(msg){    
                    $('#pnlRight').html(msg.d);
                },
                error: function(msg){
                    
                }
            });
        });
    });
    
    $('.show-name').livequery(function(){
        $(this).mouseover(function(){
            $('#product-name-container').html($(this).prev().html());
        });
    });
    $('.show-name').livequery(function(){
        $(this).mouseout(function(){
            $('#product-name-container').html('');
        });
    });
    
    $('.left-container').livequery(function(){
        $(this).mouseover(function(){
            if($(this).find('img:nth-child(2)').attr('src') != 'undefined'){
                $(this).find('img:first-child').attr('style', 'width:'+left_image_width+'px; height:'+left_image_height+'px; display:none');
                $(this).find('img:nth-child(2)').attr('style', 'width:'+left_image_width+'px; height:'+left_image_height+'px; display:block');
            }                                
        });
    });
    
    $('.left-container').livequery(function(){
        $(this).mouseout(function(){
            if($(this).find('img:nth-child(2)').attr('src') != 'undefined'){
                $(this).find('img:first-child').attr('style', 'width:'+left_image_width+'px; height:'+left_image_height+'px; display:block');
                $(this).find('img:nth-child(2)').attr('style', 'width:'+left_image_width+'px; height:'+left_image_height+'px; display:none');
            }                
        });
    });  
    
    //scroller
    var i = 0;    
    var width = 0;
    
    $('.arrow-right a').livequery(function(){        
        width = $('div.scroller-image ul').width();
        $(this).mousehold(20, function(){                                          
            if(i <= width){
                i = i + 5;
                $('div.scroller-image').scrollLeft(i);
                i = $('div.scroller-image').scrollLeft();
                $('.info').html(i+", "+width);
            }
        });
    });
    $('.arrow-left a').livequery(function(){
        $(this).mousehold(20, function(){
            if(i > 0){
                i = i - 5;
                $('div.scroller-image').scrollLeft(i);
                i = $('div.scroller-image').scrollLeft();
                $('.info').html(i+", "+width);
            }
        });
    });       
});