GaleriaZoomClass = function(){
    var thumbs = $("#thumbs").find("img");
    var image_container = $("#zoom_img");
    var content = image_container.parent();
    var left_container = $("#left_img");
    var tell_me_where = $("#tell_me_where");
    var download_left_order = 0;
    var download_right_order = 0;
    var last_selected = 0;
    var total_width = 0;
    var offset = 0;
    var scroll_width = 0;
    var animating = false;
    
    $("#go_left").click(function(){
        GaleriaZoom.go("left");
    });
    $("#go_right").click(function(){
        GaleriaZoom.go("right");
    });
    var refresh_scroll = function(){
        var ratio = 975 / total_width;
        scroll_width = (975 * ratio);
        //tell_me_where.html(ratio+": "+scroll_width);
        $("#scroll_bar").width(scroll_width);
    };
    var thumb_refresh = function (){
        total_width += this.width + 2;
        var css_width = total_width;
        if(total_width < 979){
            css_width = 979;
        }
        $("#thumbs").css("width", css_width);
        offset = total_width - 980;
        if(offset > 0){
            refresh_scroll();
			
        }
    };
    var place_arrow = function(id){
        var img = thumbs.eq(id);
        var width = img.width();
        var left = img.parent().parent().position().left;
        var position = width / 2 + left - 6;
        
        if(offset > 0){
            position = position + parseInt($("#thumbs").css("left"));
        }
        $("#thumbs_pointer").css("display", "block").stop(true, true).animate({
            left:position
        });
    }
    place_arrow(0);
    var check_thumb_limits = function(event){
        var thumbs = $("#thumbs");
        var left = -parseInt(thumbs.css("left"));
        if(left >= 0 && left <= offset){
        // do nothing
        } else {
            if(left < 0 || offset < 0){
                thumbs.css("left", 0);
            } else {
                
                thumbs.css("left", -offset);
            }
        }
    }
    var check_bar_position = function (left){
        //alert(scroll_width);
        if(scroll_width != 0){
            var prop = left / offset;
            var baroffset = 975 - scroll_width;
        
            if(prop < 0){
                prop = 0;
            }
            if(prop > 1){
                prop = 1;
            }
            $("#scroll_bar").css("left", baroffset * prop);
        }
        
    }
    $("#thumbs").bind('mousewheel', function(event, delta) {
        //var dir = delta > 0?1:-1;
        var offset = 24 * delta;
        var left = parseInt($("#thumbs").css("left"))+offset;
        $("#thumbs").css("left", left);

        check_bar_position(-left);
        
        check_thumb_limits();
        

        place_arrow(last_selected);
        return false;
    });
    
    thumbs.each(function(i, thumb){
        if(thumb.complete) {
            thumb_refresh.apply(thumb);
        } else {
            $(thumb).load(function(){
                thumb_refresh.apply(thumb);
            });
        }
		
        $(thumb).click(function(){
            var index = thumbs.index(this);
            GaleriaZoom.goto(index);
            
        });
        $(thumb).mouseover(function(e){
            if(thumbs.index(this) != last_selected){
                last_overed = $(thumb).parent();
                last_overed.css("opacity", 1);				
            }
        });
        $(thumb).mouseout(function(e){
            if(thumbs.index(this) != last_selected){
                
                $(thumb).parent().css("opacity", 0.85);
            }
        });
		
        if(i)$(thumb).parent().css("opacity", 0.85);
    });
	

    $("#thumbs").draggable({
        axis: "x",
        scrollSpeed: 40,
        drag: function(event, ui) {
            var thumbs = $(event.target);
            var left = -parseInt(thumbs.css("left"));
            if(left >= 0 && left <= offset){
                check_bar_position(left);
            }
            tell_me_where.html(left+" "+thumbs.css("left"));
        },
        stop: function(event, ui){
            
            check_thumb_limits();
        }
			
    //containment: 'parent'
    });
    $("#scroll_bar").draggable({
        axis: "x",
        drag: function(event, ui) {
            var total = 975 - scroll_width;
            var prop = ui.position.left / total;
            $("#thumbs").css("left", - prop * offset);
        //tell_me_where.html(total);
        },
        stop: function(event, ui){

            place_arrow(last_selected);
        },
        containment: 'parent'
    });
 	
	
	
    return {
        goto: function(index){
			
            if(index != last_selected && !animating){
                place_arrow(index);
                if(index <= 0){
                    $("#go_left").hide();
                } else {
                    $("#go_left").show();
                }
                if(index >= (thumbs.size() - 1)){
                    $("#go_right").hide();
                } else {
                    $("#go_right").show();
                }
                var thumb = thumbs.get(index);
				
                GaleriaZoom.doLoad(thumb);
                GaleriaZoom.doLeftLoad(thumb);
                GaleriaZoom.doTextLoad(index)
                var counter_text = $("#counter").html();
                $("#counter").html(counter_text.replace(/^\d+/, index + 1));
                $(thumb).parent().css("opacity", 1);
                $(thumbs.get(last_selected)).parent().removeClass("selected");
                $(thumb).parent().addClass("selected");

				
                thumbs.eq(last_selected).parent().css("opacity", 0.85);
                thumbs.eq(index).parent().css("opacity", 1);
                last_selected = index;
				
            }
        },
        Loaded: function(image, container){
            $(container).append(image);
        },
        doLeftLoad: function(thumb){
            download_left_order++;
            var download_order = download_left_order;
            if(thumb){
                var image_left = new Image();
                image_left.src = thumb.src.replace(/thumb/, "left");
            } else {
                var image_left = left_container.find("img").get(0);
            }
            image_left.refresh = function(){
                if(download_order == download_left_order){
                    if(thumb){
                        var last = left_container.find("img");
                        last.hide("highlight",{},500, function (){
                            last.remove();
                            $(image_left).hide().fadeIn();
                        });
						
                        GaleriaZoom.Loaded(image_left, left_container);
                    }
                    $(image_left).css("margin-left", -parseInt((image_left.width - 401) / 2));
                    $(image_left).css("margin-top", -parseInt((image_left.height - 400) / 2));
                }
            }
            if(image_left.complete){
                image_left.refresh();
            } else {
                $(image_left).load(function(){
                    image_left.refresh()
                });
            }
        },
        doTextLoad: function(index) {
            //alert(last_selected+":"+safe_remove_text);
            animating = true;
            $("#text_"+last_selected).fadeOut(200, function(){
                $("#text_"+index).hide().fadeIn(500, function(){
                    animating = false;
                });
            });
        },
        doLoad: function(thumb, back){
            if(!back){
                back = false;
            }
            download_right_order++;
            var download_order = download_right_order;
			
            if(thumb){
                var back_url = $(thumb).parent().attr("back");
                var image_right = new Image();
                if(back){
					
                    image_right.src = back_url;
                } else {
                    image_right.src = $(thumb).parent().attr("href");
                }
            } else {
                var back_url = thumbs.eq(0).parent().attr("back");
                var image_right = image_container.find("img").get(0);
            }
			
            image_right.refresh = function (){
                if(download_order == download_right_order){
                    var image = this;
                    var jimage = $(this);
                    var image_width = this.width;
                    var image_height = this.height;
                    var zi_pos = image_container.position();
                    var cn_pos = content.position();
					
                    var marginx = image_width - 577;
                    var marginy = image_height - 400;
					
					
                    if(back_url){
                        $(image_right).css("cursor", "pointer");
                        $(image_right).click(function(e){
                            //alert(!back);
                            if(thumb){
                                var ttt = thumb;
                            } else  {
                                var ttt = thumbs.get(0);
                            }
                            GaleriaZoom.doLoad(ttt, !back);
                        });
                    } 
                    image_container.mousemove(function(e){
                        var img_left = parseInt(zi_pos.left + cn_pos.left);
                        var img_top = parseInt(zi_pos.top + cn_pos.top);
						
                        var x = e.pageX - img_left;
                        var y = e.pageY - img_top;
						
                        var offsetx = parseInt((x/577)*marginx);
                        var offsety = parseInt((y/400)*marginy);
                        jimage.stop(false, true);
                        jimage.css("margin-top", -offsety);
                        jimage.css("margin-left", -offsetx);
                        if(back_url){
                            var hint = $("#hint");
                            
                            if(hint.size() == 0){
                                $("body").append("<div id='hint'>+</div>");
                                hint = $("#hint");
                            }
                            hint.css("display", "block");
                            hint.css("top", e.pageY+25);
                            hint.css("left", e.pageX-4);
                        }
						
                    });
                    image_container.mouseout(function(e){
                        jimage.stop(false, true);
                        jimage.animate({
                            marginTop: -parseInt(marginy / 4.5),
                            marginLeft: -parseInt(marginx / 2)
                        }, 500);
                        if(back_url){
                            var hint = $("#hint");


                            hint.css("display", "none");
                        }
                    });
					
                    if(thumb){
                        var last = image_container.find("img");
                        last.hide("highlight",{},500, function (){
                            last.remove();
                            jimage.css("margin-top", last.css("margin-top"));
                            jimage.css("margin-left", last.css("margin-left"));
                            jimage.hide().fadeIn();
                        });
                        GaleriaZoom.Loaded(image_right, image_container);
                    } else {
                        jimage.css("margin-top", -parseInt(marginy / 4.5));
                        jimage.css("margin-left", -parseInt(marginx / 2));
                    }
                }
            }
            if(image_right.complete){
                image_right.refresh();
            } else {
                $(image_right).load(function(e){
                    image_right.refresh()
                //alert(download_order + " " + download_right_order);
				
					
                });
            }
        },
        go: function(direction){
            if(direction == "right"){
                var next = last_selected + 1;
                this.goto(next);
            }
            if(direction == "left"){
                var next = last_selected - 1;
                this.goto(next);
            }
			
			
        }
    }
}
var GaleriaZoom;
$(function(){
    GaleriaZoom = new GaleriaZoomClass();
    GaleriaZoom.doLoad(false);
    GaleriaZoom.doLeftLoad(false);
});