function documentReady(psInitObject){
    if(location.href != top.location.href)
    {
        //alert($('iframe[name=PreviewFrame]', parent.document).attr("name"));
        $('iframe[name=PreviewFrame]', parent.document).load(function(){
            setTimeout(function(){initScroller(psInitObject);}, 1000);
        });
    }
    else
    {
        $(window).load(function(){
        setTimeout(function(){initScroller(psInitObject);}, 1000);
        });
    }
}

function initScroller(psInitObject) {

        // initializing images and their container
        var imageContainerWidth = 30;
        var selectedImage = "";
        var selectedObject = null;
        
        // iterate through every image in the container div
        $(psInitObject.psImageSearchPattern).each(function () {
        
            // initializing images
            $(this).css("left", imageContainerWidth);
            $(this).css("position", "absolute");
            $(this).css('z-index', '10');
            imageContainerWidth += $(this).width() + psInitObject.psImageSpacing;
            $(this).attr("imgID", "img" + imageContainerWidth);
            
            if ($(this).attr("status") == "selected")
            {
                selectedImage = "img" + imageContainerWidth;
                selectedObject = this;
                img_onMouseOver(this, psInitObject, false);
                
                //$(this).css("border-bottom", "solid 1px red");
            }
            
            // initializing labels
            if ($(this).attr("label") != null)
            {
                var clickHandler = $('<div style="text-align:center">' + $(this).attr("label") + '</div>').appendTo(psInitObject.psImageContainer);
                clickHandler.css("position", "absolute");
                clickHandler.css("font-size", "10px");
                clickHandler.css("font-weight", "bold");
                clickHandler.css("z-index", "1200");
                
                clickHandler.attr("imgID", "img" + imageContainerWidth);
                
                var labelWidth = clickHandler.width();
                var labelLeft = $(this).position().left - ((labelWidth - $(this).width()) / 2);
                
                if (psInitObject.psImageScaling > 0)
                    labelLeft += psInitObject.psImageScaling / 3;
                    
                clickHandler.css("left", labelLeft);
                clickHandler.css("top", $(psInitObject.psImageContainer).height() - 28);
                
                if (!psInitObject.psAlwaysShowLabel)
                {
                    //if ($(this).attr("status") != "selected")
                    clickHandler.css("display", "none");
                }
                    
                //alert($(this).attr("label") + " is done and its top is " + clickHandler.css("top"));
            }
            
            var selected = this;
            var oldWidth = $(this).width();
            
            // mouse over and mouse out handlers
            $(this).hover(function () {
            
                   if ($(this).attr("imgID") == selectedImage)
                       return;
                  
                   img_onMouseOver(this, psInitObject, true);
                },
                function() {           
                    // mouse out
                    if ($(this).attr("imgID") == selectedImage)
                       return;
                    
                   img_onMouseOut(this, psInitObject);
            })
        });
        
        // initializing image container
        imageContainerWidth += 30 - psInitObject.psImageSpacing;
        $(psInitObject.psImageContainer).width(imageContainerWidth);
        $(psInitObject.psOpacityMask).width(imageContainerWidth);
        $(psInitObject.psOpacityMask).stop().animate({ opacity: 0 }, 0);
        $(psInitObject.psImageContainer).css("position", "absolute");
        
        // initializing image mask
        $(psInitObject.psImageMask).css("position", "relative");
        $(psInitObject.psImageMask).css("overflow", "hidden");
        var maskWidth = $(psInitObject.psImageMask).width();
        
        // aligning images vertically 
        $(psInitObject.psImageSearchPattern).each(function () {           
            $(this).css("top", (($(psInitObject.psImageContainer).height() -5) - $(this).height()) / 2);
        });
        
        // initializing scroll bar if the image list is longer than the mask
        if ($(psInitObject.psImageContainer).width() > maskWidth)
        {
            $(psInitObject.psScrollBar).show();
            
            var scrollWidth = $(psInitObject.psScrollBar).width();
            var maskWidth = $(psInitObject.psImageMask).width();
            var ratio = maskWidth / imageContainerWidth;
            $(psInitObject.psScroller).width(scrollWidth * ratio);

            var imageContainerX = $(psInitObject.psImageContainer).position().left;
            //alert(imageContainerX);
            // initialize scroller handler
            $(psInitObject.psScroller).draggable({
                containment: 'parent',
                drag: function(event, ui) {

                    var imageContainerWidth = $(psInitObject.psImageContainer).width();
                    var scrollWidth = $(psInitObject.psScrollBar).width();
                    var ratio = imageContainerWidth / scrollWidth;


                    //if (language == 'ar' || language == 'he')
                    //alert((imageContainerX + ui.position.left) * ratio);
                    $(psInitObject.psImageContainer).css("left", ((-ui.position.left) * ratio)+imageContainerX);
                }
            });  
        }
        else
        {
            // hide the scrollbar if the content is smaller than the mask
            $(psInitObject.psScrollBar).hide();
        }
}

function img_onMouseOver(obj, psInitObject, hideOthers)
{
    $(obj).css('z-index', '1000');
    if ($(obj).attr("oldWidth") == null)
        $(obj).attr("oldWidth", $(obj).width());
    
    var oldWidth = parseInt($(obj).attr("oldWidth"));
    oldWidth += psInitObject.psImageScaling;
    $(obj).stop().animate({ width: oldWidth }, 300, function () {
        if (!psInitObject.psAlwaysShowLabel)
        {
            //alert($(this).attr("imgID"));
            $("div[imgID='" + $(obj).attr("imgID") + "']").fadeIn();
        }
    });
    
    if (hideOthers)
    $(psInitObject.psOpacityMask).css('z-index', '700');
    $(psInitObject.psOpacityMask).stop().animate({ opacity: psInitObject.psOpacityLevel }, 300)
}

function img_onMouseOut(obj, psInitObject)
{
    if (!psInitObject.psAlwaysShowLabel)
    {
        //alert($("div[imgID='" + $(this).attr("id") + "']").attr("imgID"));
        $("div[imgID='" + $(obj).attr("imgID") + "']").fadeOut();
    }
        
    $(obj).stop().animate({ width: $(obj).attr("oldWidth") }, 300, function () {
        $(obj).css('z-index', '10');
    });
    $(psInitObject.psOpacityMask).stop().animate({ opacity: 0 }, 100, function () {
        
        $(psInitObject.psOpacityMask).css('z-index', '0');
        
    });
}