/***************************************
    ASYNCHRONOUS IMAGE LOADING CODE
****************************************/

// For all object with class "asyncImaLoad" (loader), function read
// image path from title attribute, create new Image object,
// next assign image from path to Image object and 
// append it to loader 
function setupLoadingAsynchronousImages()
{
    // for each object with class "asyncImgLoad"
    $j('.asyncImgLoad').each(
        function()
        {   
            // save handle to loader - caintainer which we gona insert loaded image    
            var loader = $j(this);
            // get image path from loader title attribute
            var imagePath = loader.attr('title');
            // create new image object
            var img = new Image();
            // set opacity for image to maximum
            // value 0.0 means completly transparent
            $j(img).css("opacity", "0.0")
            // next we set function wich gona be caled then
            // image load is finished  
                .load(
                    function() 
                    {
                        // insert loaded image to loader object 
                        // and remove unnecessary title attribute
                        loader.append(this).removeAttr('title');
                        // for inserted image we set margin to zero
                        // opacity to max and fire up 500ms opacity animation 
                        $j(this)
                            .css("margin", "0px")
                            .css("opacity", "0.0")
                            .css("border", "0px")
                            .animate({opacity: 1.0}, 500,
                                function()
                                {
                                    // after animation we remove loader background image 
                                    loader.css("background-image", "none");
                                }
                            );
                    }
                // set new value for attribute src - this means: load image from imagePath    
                ).attr('src', imagePath);                        
        }
    );
} // end of function setupLoadingAsynchronousImages


/**************************************
   SIDE BAR MINI SLIDER CONFIGURATION
***************************************/
// SBMS - side bar mini slider
// width and height of side bar mini slider
var SBMS_WIDTH = 540;
var SBMS_HEIGHT = 250;
var SBMS_EASING_METHOD = "easeOutCirc";
var SBMS_TOP_ZINDEX = 2;     
var SBMS_BOTTOM_ZINDEX = 1;
var SBMS_SLIDE_TIME = 600;

// NEXT-IMAGE-BUTTON OBJECT DEFINITION
// object keep information and functions to control side bar mini slider
var g_sideBarMiniSlider = new Object();
    // Object members:
    
    // count of slides in slider 
    g_sideBarMiniSlider.slideCount = 0;
    // current slide
    g_sideBarMiniSlider.currentSlide = 0;
    // if false slide flip is blocked
    g_sideBarMiniSlider.canFlip = true;
    // button index
    g_sideBarMiniSlider.btnIndex = 0;
    // autoplay timer handle
    g_sideBarMiniSlider.timerHandle = null;

    // FUNCTION:
    // mini slider auto play function
    g_sideBarMiniSlider.autoPlay = function()
    {
        clearTimeout(g_sideBarMiniSlider.timerHandle);
        g_sideBarMiniSlider.timerHandle = null;
        g_sideBarMiniSlider.flip();
        g_sideBarMiniSlider.timerHandle = setTimeout(g_sideBarMiniSlider.autoPlay, 6000);    
    } // end of function autoPlay
    
    // FUNCTION:
    // initialize slider start settings
    g_sideBarMiniSlider.initialize = function()
    {
        var slideList = $j("#sidebarMiniSliderContainer .slide");
        g_sideBarMiniSlider.slideCount = slideList.length;

        // hide all slide behind right slider edge
        $j(slideList).each(
            function()
            {
                $j(this).css("left", SBMS_WIDTH);
                $j(this).css("z-index", SBMS_WIDTH);
            }
        );
        // but one slide - first, make visible on page load
        $j("#sidebarMiniSliderContainer .slide:first").css("left", 0).css("z-index", SBMS_BOTTOM_ZINDEX);
        // check first button
        $j("#sidebarMiniSliderContainer .btn:first").css("background-color", "#FFF").css("color", "#000");
        
        $j("#sidebarMiniSliderContainer .btn").click(
            function()
            {
                // if slide flip is blocked return from function
                if(false == g_sideBarMiniSlider.canFlip)
                {
                    return;
                }
     
            
                $j("#sidebarMiniSliderContainer .btn").css("background-color", "#222").css("color", "#CCC");
                $j(this).css("background-color", "#FFF").css("color", "#000");
                var index = $j("#sidebarMiniSliderContainer .btn").index(this);
                g_sideBarMiniSlider.btnIndex = index;
                
                if(g_sideBarMiniSlider.currentSlide != index)
                {
                    g_sideBarMiniSlider.flipOnIndex(index);
                }                
            }
        );
        
        $j("#sidebarMiniSliderContainer .btn").hover(
            function()
            {
                var index = $j("#sidebarMiniSliderContainer .btn").index(this);
                if(g_sideBarMiniSlider.btnIndex != index)
                {
                    $j(this).css("background-color", "#444");
                }
            },
            function()
            {
                var index = $j("#sidebarMiniSliderContainer .btn").index(this);
                if(g_sideBarMiniSlider.btnIndex != index)
                {            
                    $j(this).css("background-color", "#222");
                }
            }
        );
        
       
        g_sideBarMiniSlider.timerHandle = setTimeout(g_sideBarMiniSlider.autoPlay, 4000);        

    } // end of function initialize
    
    // FUNCTION:
    // flip slider to next slide    
    g_sideBarMiniSlider.flip = function()
    {
        // if slide flip is blocked return from function
        if(false == g_sideBarMiniSlider.canFlip)
        {
            return;
        }
        // block slide flip
        g_sideBarMiniSlider.canFlip = false;
        // save current slide number
        var prevSlide = g_sideBarMiniSlider.currentSlide;
        // move to next slide
        g_sideBarMiniSlider.currentSlide += 1;
        // check range
        if(g_sideBarMiniSlider.currentSlide >= g_sideBarMiniSlider.slideCount)
        {
           // if overflow, back to first slide
           g_sideBarMiniSlider.currentSlide = 0;
        }

        // get button handle
        var btnHandle = $j("#sidebarMiniSliderContainer .btn:eq("+this.currentSlide+")");
        g_sideBarMiniSlider.btnIndex = this.currentSlide;
        $j("#sidebarMiniSliderContainer .btn").css("background-color", "#222").css("color", "#CCC");
        $j(btnHandle).css("background-color", "#FFF").css("color", "#000");        
        
        // move slide
        $j("#sidebarMiniSliderContainer .slide:eq("+prevSlide+")")
            .animate({left: -SBMS_WIDTH}, SBMS_SLIDE_TIME);        
        
        $j("#sidebarMiniSliderContainer .slide:eq("+g_sideBarMiniSlider.currentSlide+")")
            // before start animation set z-index to top
            .css("z-index", SBMS_TOP_ZINDEX)
            .css("opacity", 1.0)
            .animate({left: 0}, SBMS_SLIDE_TIME,
                function()
                {
                    // take previous slide to right
                    $j("#sidebarMiniSliderContainer .slide:eq("+prevSlide+")").css("left", SBMS_WIDTH);
                    // unblock slide fliping
                    g_sideBarMiniSlider.canFlip = true; 
                    // after animation change current visible slide z-index to bottom
                    $j(this).css("z-index", SBMS_BOTTOM_ZINDEX);
                }             
        );
    } // end of function flip
    
    // FUNCTION:
    // flip slider to selected slide
    g_sideBarMiniSlider.flipOnIndex = function(index)
    {
        // if user click on button for current visible slide return from function
        var btnIndex = index;
        if(btnIndex == g_sideBarMiniSlider.currentSlide)
        {
            return;
        }    
    
        // if slide flip is blocked return from function
        if(false == g_sideBarMiniSlider.canFlip)
        {
            return;
        }
    

        clearTimeout(g_sideBarMiniSlider.timerHandle);
        
        // block slide flip
        g_sideBarMiniSlider.canFlip = false;
        
        // move slide
        $j("#sidebarMiniSliderContainer .slide:eq("+g_sideBarMiniSlider.currentSlide+")")
            .animate({left: -SBMS_WIDTH}, SBMS_SLIDE_TIME);
        
        $j("#sidebarMiniSliderContainer .slide:eq("+index+")")
            // before start animation set z-index to top
            .css("z-index", SBMS_TOP_ZINDEX)
            .css("opacity", 1.0) 
            .animate({left: 0}, SBMS_SLIDE_TIME,
                function()
                {
                    // take previous slide to right
                    $j("#sidebarMiniSliderContainer .slide:eq("+g_sideBarMiniSlider.currentSlide+")").css("left", SBMS_WIDTH);
                    // change current slide
                    g_sideBarMiniSlider.currentSlide = index;                    
                    // unblock slide fliping
                    g_sideBarMiniSlider.canFlip = true; 
                    // after animation change current visible slide z-index to bottom
                    $j(this).css("z-index", SBMS_BOTTOM_ZINDEX);
                    // set autoplay
                    g_sideBarMiniSlider.timerHandle = setTimeout(g_sideBarMiniSlider.autoPlay, 4000);
                }             
        );
        
    }  // end of function flipOnIndex
// END OF OBJECT DEFINITION         

function setupSideBarMiniSlider()
{
    g_sideBarMiniSlider.initialize();
} // end of function setupSideBarMiniSlider