var _imgs = new Array();
var _collsCount = 1;
var _dispAreaW;
var _dispAreaH;
var _minThumOpcty = 0.5;
var _matHandlrSuffix = "";
var _pausedDiv = "_paused";
var _pageLoaded = false;

$(document).ready(function() {

    /// FOR SOME REASON THE READY EVENT MAY BE TRIGGERED MORE THAN ONCE.
    /// MY BET IT'S RELATED TO SOME JAVASCRIPT ERRORS ON THE PAGE.
    if (_pageLoaded) return;
    _pageLoaded = true;

    var $chldsA = $('#Contents').children();

    $('#Pictures').hide();
    $('#Display').css({ position: 'absolute', overflow: 'hidden' });
    $('#Loading').css({ zIndex: 2, position: 'absolute', display: 'block', visibility: 'visible' });
    $('#Loading').hide();
    $('#Thumbs').css({ position: 'absolute' });
    $('#GoPrev').css({ position: 'absolute' });
    $('#GoNext').css({ position: 'absolute' });


    EvalWindowSize();


    /// ADDING THE "PAUSE" DIV
    $('body').append('<div id="' + _pausedDiv + '" ></div>');
    $('#' + _pausedDiv).css({ visibility: 'hidden', position: 'absolute' });
    $('#' + _pausedDiv).bind('mouseover', HoveringOn);
    $('#' + _pausedDiv).append('<img src="' + _pausedIconPath + '" id="' + _pausedDiv + '_img" alt="" />');



    /// HIDDING THE GRAY FRAMINGS COMING FROM UPPER TEMPLATES.
    $(".photoholdertl").removeClass();
    $(".photoholdertr").removeClass();
    $(".photoholderbl").removeClass();
    $(".photoholderbr").removeClass();


    ManageLoader(true);


    _matHandlrSuffix = "&seed=" + Math.random();
    if (!_isLocalHost) _matHandlrSuffix = "";


    for (var n = 0; n < $chldsA.length; n++) {
        var imgPath = $($chldsA[n]).attr('rel');

        var img = new MyImage();
        img.Path = imgPath;
        img.Image = _mattHandlerPath + "?f=" + imgPath + "&w=" + _dispAreaW +
		    "&h=" + _dispAreaH + "&m=" + _imageMode + _matHandlrSuffix;
        img.Thumb = _mattHandlerPath + "?f=" + imgPath + "&w=" + _thumbSize + "&h=" +
		    _thumbSize + "&m=2&t=1" + _matHandlrSuffix;
        img.Index = n;

        _imgs[n] = img;
    }

    if (_shuffling) DoLightShuffling();

    $('#Contents').empty();

    _collsCount = Math.ceil(_imgs.length / _slidesPerColl);

});



$(window).load(function() {
    
    $(window).bind('resize', HandleWindowRezize);

    CreateThumbs();

});



function EvalWindowSize(){
    /// SETTING THE DISPLAY AREA SIZE.
    ///
    if (_displayW <= 1){
        _dispAreaW = $(window).width() * _displayW;
    } else {
        _dispAreaW = _displayW;
    }

    if (_displayH <= 1){
        _dispAreaH = $(window).height() * _displayH;
    } else {
        _dispAreaH = _displayH;
    }
    
    _dispAreaW = Math.ceil(_dispAreaW);
    _dispAreaH = Math.ceil(_dispAreaH);
    
    $('#Display').css( { width: _dispAreaW+'px', height: _dispAreaH+'px' } );
    
}










/*
 * THUMB RELATED METHODS
 * 
 * 
*/

function ThumbHoverOn(e){
    var index = e.data;
    $('#tmbImg_' + index ).animate( { opacity: 1 } );
}

function ThumbHoverOut(e){
    var index = e.data;
    $('#tmbImg_'+ index ).animate( { opacity: _minThumOpcty } );
}


function CreateThumbs(){

    for (var n=0; n<_collsCount;n++){
        $('#Thumbs').append('<div id="Coll_'+ n +'" class="CollCont" style="position:absolute;"></div>');
        
        /// HIDDING ANY COLLECTION OTHER THAN THE FIRST ONE.
        if (n>0) $('#Coll_' + n).hide();
        
        for(var m=0;m<_slidesPerColl;m++){
            var currIndex = ((n*_slidesPerColl)+(m+1))-1;
            if (currIndex>=_imgs.length) continue;
            var currImg = _imgs[currIndex];
            
            $('#Coll_' + n).append('<span class="ThumbCont" id="tmb_' + 
                currIndex + '"><img src="" alt="" style="display:none;" id="tmbImg_' + currIndex + '" /></span>');
            $('#tmbImg_' + currIndex).bind('load', currIndex, ThumbLoaded );
            $('#tmbImg_' + currIndex).bind('mouseover', currIndex, ThumbHoverOn );
            $('#tmbImg_' + currIndex).bind('mouseout', currIndex, ThumbHoverOut );
            $('#tmbImg_' + currIndex).hide();
            //$('#tmbImg_' + currIndex).attr( { src: currImg.Thumb } );
            $('#tmbImg_' + currIndex).css( { opacity: _minThumOpcty } );
            
            $('#tmb_' + currIndex).css( {width: _thumbSize + 'px', height: _thumbSize + 'px' } );
            
            currImg.Collection = n;
        }
        $('#Coll_' + n).append('<div class="Clearer"></div>');
    }
    

    if (_thumbnails){
        /// WE ARE USING THUMBNAILS
        LoadThumbs();
        
        CenterCollections();
        
        ChasingDivLogic();
    
    } else {
        /// WE ARE HIDING THUMBS FROM CALCULATIONS
        $('#Thumbs').hide();
        $('#Thumbs').css( { height: '5px' } );
        CenterCollections();
    }

    
    LoadImagesLoop();
    
}


var _currThumbBuff = 0;
var _thumbLoadIndex = 0;
var _thumbLoadInterval;
function LoadThumbs(){

    _thumbLoadInterval=  setInterval(function(){
        
        if (_currThumbBuff < _thumbLoadBuffer){
            
            _currThumbBuff ++;
            LoadThumbByIndex(_thumbLoadIndex);
            _thumbLoadIndex ++;
            
            if (_thumbLoadIndex == _imgs.length){
                clearInterval(_thumbLoadInterval);
            }
        }
    }, 200);
}

function LoadThumbByIndex(index){
    var currImg = _imgs[index];
    if (currImg) $('#tmbImg_' + index).attr({ src: currImg.Thumb });
}



function ThumbLoaded(e){

    _currThumbBuff--;

    var currImg = _imgs[e.data];
    
    var daThumb = '#tmb_' + currImg.Index;
    $(daThumb).css({ cursor: "pointer", display: "" });
    
    
    /// FADING IN ONLY THOSE THUMBS IN THE FIRST COLLECTION.
    /// THE OTHER THUMBS WE DON'T SEE THEM, SO THEY SIMPLY SHOW UP.
    ///
    if (currImg.Collection == _currColl){
        $('#tmbImg_' + currImg.Index).fadeIn();
    } else {
        $('#tmbImg_' + currImg.Index).show();
    }
    
    
    $(daThumb).bind('click', currImg.Index, EnlargeThumbBound);
}



function EnlargeThumbBound(e){
    var currImg = _imgs[e.data];
    EnlargeThumb(currImg);
}

function EnlargeThumb(currImg)
{
    /// STOPPING THE CYCLE THRU. RE ENABLES AUTOMATICALLY 
    /// WHEN A NEW IMAGE IS DISPLAYED.
    /// 
    StopCycling();
    
    /// ACT BASED ON THE IMAGE LOAD STATUS
    ///
    switch(currImg.ImageLoadStatus){
        case 2:
            /// THE IMAGE IS LOADED, THIS IS THE EASY PART.
            //DoLog('requested loaded picture: ' + currImg.Image);
            //ShowDaNicePicture(currImg);
            WaitFor(currImg);
            break;
            
        case 1:
            /// THE IMAGE IS LOADING, LET'S WAIT A LITTLE BIT.
            //DoLog('requested loading... picture: ' + currImg.Image);
            ManageLoader(true);
            WaitFor(currImg);
            break;
            
        case 0:
            /// THE IMAGE IS NOT LOADED, THIS IS THE TRICKIEST PART.
            //DoLog('requested not yet loaded picture: ' + currImg.Image);
            ManageLoader(true);
            DeBuffer(currImg);
            break;
            
    }
    
    
}

/*
 ******************************************
 ******************************************
 ******************************************
*/










/*
 * CHASING FRAME LOGIC
 * 
 * 
*/


var _lastChasedIndex;
var _chasingInterval;
function ChasingDivLogic(){
    clearInterval(_chasingInterval);
    _lastChasedIndex = null;
    $('#ChasingDiv').remove();
    $('<div id="ChasingDiv" class="FrameContainer" style="position:absolute;"></div>').appendTo('body');
	$('#ChasingDiv').hide();

	_chasingInterval = setInterval(function() {

	    var ix = _imgs[_currSlide].Index;

	    var offst = $('#tmbImg_' + ix).offset();

	    if (!offst) return;

	    if (offst.left <= 0) return;

	    if (ix == _lastChasedIndex) return;


	    if (_lastChasedIndex == null) {
	        $('#ChasingDiv').css({ width: _thumbSize + 'px', height: _thumbSize + 'px',
	            left: (offst.left - _chasingFrameXOffst) + 'px',
	            top: (offst.top - _chasingFrameXOffst) + 'px'
	        });
	        $('#ChasingDiv').fadeIn(2000);
	    } else {
	        $('#ChasingDiv').animate({ left: (offst.left - _chasingFrameXOffst) + 'px',
	            top: (offst.top - _chasingFrameXOffst) + 'px'
	        }, _chasingFrameSpeed, "swing");
	    }

	    _lastChasedIndex = ix;


	}, 200);

}

/*
 ******************************************
 ******************************************
 ******************************************
*/









/*
 * SLIDE SHOW LOGIC
 * 
 * 
*/
var _currSlide = 0;
var _slideInterval;

function StartPlaying(){
    /// CALLED WHEN THE CURRENT (OR FIRST) IMAGE IS LOADED.
    var currImg = _imgs[_currSlide];
    
    //DoLog("START PLAYING MAN");
    ShowDaNicePicture(currImg);
    
    $('#GoNext').bind('click', GoForward);
    $('#GoPrev').bind('click', GoBackwards);
    
    $('#Display').bind('mouseover', HoveringOn );
    $('#Display').bind('mouseout', HoveringOut );

}

function CycleThru(){
    
    clearTimeout(_slideInterval);
    _slideInterval = setTimeout(function(){
        
        _currSlide++;
        
        EstimateShuffling( _currSlide );
        
        if (_currSlide==_imgs.length)_currSlide=0;

        var currImg = _imgs[_currSlide];
        //DoLog('trying to display ' + currImg.Image);
        EnlargeThumb(currImg);
        
        
    }, _slideDelay);
    
}

function StopCycling(){
    clearTimeout(_slideInterval);
}


function HoveringOn(){
    //DoLog("DISABLING CYCLE THRU");
    AlignPauseDiv();
    if (_alignedDivReady) $('#' + _pausedDiv ).show();
    StopCycling();
}

function HoveringOut(){
    var currImage = _imgs[_currSlide];
    if (currImage.ImageLoadStatus == 2){
        //DoLog("ENABLING CYCLE THRU");
        $('#' + _pausedDiv ).hide();
        CycleThru();
    }
}


function GoForward(){
    SlideOffset(1);
}

function GoBackwards(){
    SlideOffset(-1);
}

var _sliding = false;
function SlideOffset(offst){

    if (_sliding) return;
    _sliding = true;
    
    /// MAINTAIN THINGS BUSY FOR A WHILE
    ///
    setTimeout(function(){ _sliding = false; }, _slideFadeSpeed * 1.1);

    var _next = _currSlide + offst;
    
    EstimateShuffling( _next );
    
    if (_next==_imgs.length)_next = 0;
    if (_next<0)_next = _imgs.length - 1;
    var currImg = _imgs[_next];
    EnlargeThumb(currImg);
}


var _alignDivTimeout;
var _alignedDivReady = false;
function AlignPauseDiv(){
    clearTimeout(_alignDivTimeout);
    var w = $('#' + _pausedDiv + '_img').width();
    
    if (w==0){
        _alignDivTimeout = setTimeout(AlignPauseDiv, 1000);
        return;
    }
    
    var o = $('#Container_' + _imgCount ).offset();
    
    var h = $('#' + _pausedDiv + '_img').height();
    var x = Math.ceil( ( _dispAreaW - w ) / 2 );
    var y = Math.ceil( ( _dispAreaH - h ) / 2 );
    
    if ($('#' + _pausedDiv ).css('visibility')=='hidden') {
        $('#' + _pausedDiv ).hide();
        $('#' + _pausedDiv ).css( { visibility: 'visible' } );
    }
    $('#' + _pausedDiv ).css( { opacity: '0.3', padding: '10px', zIndex: '2000', top: o.top + 'px', left: o.left + 'px' } );
    
    _alignedDivReady = true;
}


/*
 ******************************************
 ******************************************
 ******************************************
*/







/*
 * DISPLAYING IMAGES BASED ON THEIR LOAD STATUS
 * 
 * 
*/

var _waitForTimeout;

function DeBuffer(currImg){

    clearTimeout(_waitForTimeout);
    clearInterval(_waitForTimeout);

    //DoLog('DEBUFFERING FOR ' + currImg.Index);
    _currBufferIndex = currImg.Index

    _waitForTimeout = setInterval(function(){ 
        if (currImg.ImageLoadStatus == 2){
            clearInterval(_waitForTimeout);
            ShowDaNicePicture(currImg);
            //DoLog("De Buffered Image Loaded! " + currImg.Image);
        }
    }, 200);

}


function WaitFor(currImg){
    clearTimeout(_waitForTimeout);
    clearInterval(_waitForTimeout);
    if (currImg.ImageLoadStatus == 2){  
        /// LOADED !
        //DoLog("Image Loaded! " + currImg.Image);
        ShowDaNicePicture(currImg);
    } else {
        /// KEEP WAITING
        _waitForTimeout = setTimeout(function(){ WaitFor(currImg); }, 200);
    }
}


var _imgCount = 0;
function ShowDaNicePicture(currImg){

    ManageLoader(false);

    _imgCount ++;


    /// CREATING THE CONTAINER FOR THE REQUESTED IMAGE.
    /// 
    $('#Display').append('<img src="" alt="" id="Container_' + _imgCount + 
        '" style="position:absolute; z-index:' + _imgCount + '"></img>');

    /// DEALING WITH THE NEXT/PREV COLLECTION 
    /// BASED ON THE CURRENT IMAGE COLLECTION INDEX.
    HandleCollection(currImg);

    
    _currSlide = currImg.Index;

    
    $('#Container_' + _imgCount ).hide();
    $('#Container_' + _imgCount ).bind('load', function(){ ShowMustGoOn() });
    $('#Container_' + _imgCount ).attr( { src: currImg.Image } );

        
}


/// WE NEEDED TO SEPARATE THIS PART OF THE 'ShowDaNicePicture' AND BIND IT
/// TO THE 'LOAD' EVENT OF THE CONTAINER IMAGE.
/// THIS WAS DUE TO OLD BROWSERS WHICH ARE NOT "CACHING" THE IMAGES AS WE EXPECTED,
/// SO WE NEED TO WAIT FOR IT TO LOAD.
function ShowMustGoOn(){

    /// CENTERING THE IMAGE IN ITS DISPLAY AREA.
    CenteringLogic('Container_' + _imgCount);

    $('#Container_' + _imgCount ).fadeIn( _slideFadeSpeed );

    CreateFramings( _imgCount );

    //DoLog("showing " + currImg.Path);
    if (_imgCount>1){
        $('#Container_' + (_imgCount - 1) ).fadeOut( _slideFadeSpeed , function(){ $(this).remove() } );
        ExtinguishFramings ( _imgCount - 1 );
    }
    
    CycleThru();

}



function CreateFramings( imgCount ){
    var zi = imgCount * 1000;

    for(var n=0;n<4;n++){
       var i = _framingsImageName.replace('#', n);
       
       var str = '<div id="fmgs_' + imgCount + '_' + n + '" >' + 
        '<img src="' + i + '" alt="" /></div>';
        
        $('body').append(str);
        
        $('#fmgs_' + imgCount + '_' + n).css( { position: 'absolute', zIndex: zi, border: "",
            width: _photoHolderSize + 'px', height: _photoHolderSize + 'px' } );
    }
    $('#fmgs_' + imgCount).fadeIn();
    
    var obj = '#Container_' + imgCount;
    
    
    var tp = $(obj).offset().top - _photoHolderOffset;
    var btm = $(obj).offset().top + $(obj).height() - _photoHolderSize + _photoHolderOffset; // + $('#Thumbs').height();
    var lft = $(obj).offset().left - _photoHolderOffset;
    var rgt = $(obj).offset().left + $(obj).width() - _photoHolderSize + _photoHolderOffset;
    $('#fmgs_' + imgCount + '_0').css( { top:  tp + 'px', left: lft + 'px' } );
    $('#fmgs_' + imgCount + '_1').css( { top:  tp + 'px', left: rgt + 'px' } );
    $('#fmgs_' + imgCount + '_2').css( { top:  btm + 'px', left: lft + 'px' } );
    $('#fmgs_' + imgCount + '_3').css( { top:  btm + 'px', left: rgt + 'px' } );
    
    for(var n=0;n<4;n++){
       $('#fmgs_' + imgCount + '_' + n).fadeIn();
    }
    
}

function ExtinguishFramings( imgCount ){
    for(var n=0;n<4;n++){
        $('#fmgs_' + imgCount + '_' + n).fadeOut(function(){ $(this).remove(); });
    }
}


function CenteringLogic(imgID){
    var w = $('#'+imgID).width();
    var h = $('#'+imgID).height();
    
    var playAreaW = $('#Display').width();
    var playAreaH = $('#Display').height();
 
    var x = (playAreaW - w) / 2;
    var y = (playAreaH - h) / 2;

    $('#'+imgID).css( { left: x, top: y } );
}


/*
 ******************************************
 ******************************************
 ******************************************
*/







/*
 * IMAGE PRELOADING LOGIC WITH BUFFERED CAPABILITIES.
 * 
 * 
*/

var _currBufferIndex = 0;
var _currLoadBuffer = 0;
var _loadCount = 0;
var _loopInterval;

function LoadImagesLoop(){

    _loopInterval = setInterval(function(){
        
        if (_currLoadBuffer < _loadBuffer){
            
            if (_currBufferIndex >= _imgs.length) _currBufferIndex = 0;
            //DoLog("Pre Loading " +_currBufferIndex);
            
            if (LoadImagesByIndex(_currBufferIndex) == false) {
                _loadCount ++;
            } else {
                _loadCount = 0;
            }
            _currBufferIndex ++;
            
            if (_loadCount == _imgs.length){
                clearInterval(_loopInterval);
            }
        }
    }, 200);

}


function LoadImagesByIndex(index){

    var currImage = _imgs[index];
    if (currImage == null) return;
    if (currImage.ImageLoadStatus != 0) return false;

    //DoLog('loading... ' + index + " ... src= " + currImage.Image);

    _currLoadBuffer ++;

    currImage.ImageLoadStatus = 1;

    $('#Pictures').append('<img src="" alt="" id="img_' + index + '" style="width:30px; height:30px;"></img>');
    $('#img_' + index).bind('load', currImage, DoneLoading );
    $('#img_' + index).attr( { src: _imgs[index].Image } );
    
    
    return true;
}


function DoneLoading(e){
    var currImage = e.data;
    currImage.ImageLoadStatus = 2;
    
    _currLoadBuffer --;
    
    if (currImage.Index == _imgs[_currSlide].Index ) StartPlaying();
}


/*
 ******************************************
 ******************************************
 ******************************************
*/





/*
 * COLLECTION RELATED METHODS:
 * 
 * 
*/
var _currColl = 0;

function HandleCollection(currImg){
    
    var nextColl = currImg.Collection;
    
    if (nextColl  != _currColl){
        //DoLog('move to collection ' + nextColl );
        
        MoveToCollection(nextColl);
        _currColl = nextColl;
    }
}

function MoveToCollection(collIndex){
    HideCollection(_currColl);
    ShowCollection(collIndex);
}

function HideCollection(collIndex){
    //$('#Coll_' + collIndex).css( { display: 'none' } );
    $('#Coll_' + collIndex).fadeOut( _collFadeSpeed );
}

function ShowCollection(collIndex){
    //$('#Coll_' + collIndex).css( { display: 'block' } );
    $('#Coll_' + collIndex).fadeIn( _collFadeSpeed );
}


function CenterCollections(){

    $('#Thumbs').css( { width: _dispAreaW + 'px' } );

    for (var n=0;n<_collsCount;n++){
        var w = _dispAreaW;
        var x = ( _dispAreaW - $('#Coll_'+n).width() ) / 2;
        $('#Coll_'+n).css( { left: x + 'px' } );
        
        if (n==0){
            w = $('#Coll_'+n).width();
            x = ( _dispAreaW - w ) / 2;
            
            /// CENTERING - ALIGNING ALL THE ELEMENTS.
            ///            
            $('#GoPrev').css( { left: x - _prevNextSize - _prevNextOffst , display: 'block', border: '', 
                width:  _prevNextSize + 'px', height: _prevNextSize + 'px' } );
            
            $('#GoNext').css( { left: x + w + _prevNextOffst , display: 'block', border: '', 
                width: _prevNextSize + 'px', height: _prevNextSize + 'px' } );
                
            
            $('#Thumbs').css( { top: ($('#Display').offset().top + _dispAreaH) + 'px' } );
           
            var yy = $('#Thumbs').outerHeight(true) + $('#Display').outerHeight(true);
            
            $('#' + _mattsFooterDiv ).css( { height: yy + 'px' } );
            
        }
        
        
    }
}

var _canShuffle = true;
function EstimateShuffling( currSlide ){
    if (_shuffling && _canShuffle){
        if (currSlide >= _imgs.length ){
            _canShuffle = false;
            _currSlide = 0;
            DoShuffling();
            setTimeout(function(){ _canShuffle = true; } , 1000);
        }
    }
}

function DoLightShuffling(){
    Shuffle( true );
}

function DoShuffling(){
    Shuffle( false );
}

function Shuffle( isLight ){

    var cloneImgs = _imgs;
    cloneImgs = fisherYates(cloneImgs);
    var _coll = 0;
    
    for(var n = 0; n < cloneImgs.length; n++){
        
        if (!isLight) {
            /// MOVE THUMBS AROUND.
            $('#tmbImg_' + cloneImgs[n].Index ).appendTo( '#tmb_' + n );
            $('#tmbImg_' + cloneImgs[n].Index ).attr( { rel: n } );
        }

        _imgs[n].Image = cloneImgs[n].Image;
        _imgs[n].Thumb = cloneImgs[n].Thumb;
        _imgs[n].ImageLoadStatus = cloneImgs[n].ImageLoadStatus;
        _imgs[n].ThumbLoaded = cloneImgs[n].ThumbLoaded;
        _imgs[n].Path = cloneImgs[n].Path;
        _imgs[n].Index = n;
        _imgs[n].Collection = Math.floor(n / _slidesPerColl);
        
    }
    
    for(var n = 0; n < cloneImgs.length; n++){
        $('#tmbImg_' + _imgs[n].Index ).attr( { id: 'tmbImg_' + $('#tmbImg_' + _imgs[n].Index ).attr('rel'), rel: '' } );
    }    

}

function fisherYates ( images ) {
  var i = images.length;
  if ( i == 0 ) return false;
  while ( --i ) {
     var j = Math.floor( Math.random() * ( i + 1 ) );
     var tempi = images[i];
     var tempj = images[j];
     images[i] = tempj;
     images[j] = tempi;
   }
   return images;
}
/*
 ******************************************
 ******************************************
 ******************************************
*/



function ManageLoader(showIt){
    var coords = $('#Display').offset();
    var x = coords.left;
    var y = coords.top;
    var w = $('#Display').width();
    var h = $('#Display').height();
    
    var ww = $('#Loading').width();
    var hh = $('#Loading').height();
    
    var xx = x + ( ( w - ww) / 2 );
    var yy = y + ( ( h - hh ) / 2 );
    
    $('#Loading').css( { left: xx + 'px', top: yy + 'px' } );
    
    if (showIt){
        $('#Loading').fadeIn(300);
    } else {
        $('#Loading').fadeOut(300);
    }
}



var _resizing = false;
var _resizeTimeout;
function HandleWindowRezize(){ 
    if (_resizing)return;

    clearTimeout(_resizeTimeout);    
    _resizeTimeout = setTimeout(DoHandleWindowRezize, 500);

}

function DoHandleWindowRezize(){

    _resizing = true;

    $('#GoNext').unbind();
    $('#GoPrev').unbind();
    $('#Display').unbind();
    
    EvalWindowSize();
    
    ExtinguishFramings( _imgCount );
    
    CenterCollections();
    
     $('#' + _pausedDiv ).hide();
    
    ManageLoader(true);
    
    
    CenteringLogic('Container_' + _imgCount);
    $('#Container_' + _imgCount ).fadeOut( _slideFadeSpeed , function(){ $(this).remove() } );
    
    
    clearInterval(_loopInterval);   
    clearTimeout(_slideInterval);
    
    for(var n=0;n<_imgs.length;n++){
        _imgs[n].Image = _mattHandlerPath + "?f=" + _imgs[n].Path + "&w=" + _dispAreaW + 
	    "&h=" + _dispAreaH + "&m=" + _imageMode + _matHandlrSuffix
	    _imgs[n].ImageLoadStatus = 0;
    }
    
    _currLoadBuffer = 0;
    _currBufferIndex = _imgs[_currSlide].Index;
    _loadCount = 0;
    
    $('#Pictures').empty();
    
    LoadImagesLoop();
    
    ChasingDivLogic();
    
    
    /// PREVENTING THE RESIZING FOR THE NEXT 2 SECONDS.
    setTimeout(function(){ _resizing = false; }, 2000);
    
}





function MyImage(){
    this.Image = "";
    this.Thumb = "";
    this.Index = 0;
    this.Collection = 0;
    this.ImageLoadStatus = 0;     //0=NotLoaded  1=Loading   2=Loaded
    this.ThumbLoaded = false;
    this.Path = "";
}


var _myLogger = false;
function DoLog(msg){
    if (_isLocalHost){
        if (!_myLogger){
            $('body').prepend('<div style="width:99%; position:absolute; ">' +
                '<div style="width:200px; border:2px solid green; float:right;" id="_logConsole"></div></div>');
            _myLogger = true;
        } 
        $('#_logConsole').append('<div class="_logRow">' + msg + '</div>');
    }
}