// Image and Text rotator.
// tp (c) 2010 Konstantin Kirillov. Landkey.net

// depends on effector.js

// Description:
// There are two "weels" which diplayed one after other. This creates "rotation".
// These weels are usually div elements. Each weel can contain any number of subelements.
// To add a weel, rotator's code must be modified.

tj$         = window.tj$ || {};
tj$.rotator = new ( function ( banner_base_name ) {

    var that = this;
    var data; //array of "bunners"
    var interval;
    var interleave_swapping;
    var bbn = banner_base_name;

    var ixShown=-1;
    var ixToCome;
    var ixFront = 0;
    var flgMoving = false;

    //Initiate weels:
    var weels = [ {}, {} ];
    for( var i=0; i<2; i++){
         var w = weels[i];
         w.hel = document.getElementById( bbn + "_" + i ); 
         w.img = document.getElementById( bbn + "_" + i + '_image');
         w.eff_hel = tj$.effector.create(  w.hel  );
         w.eff_img = tj$.effector.create(  w.img  );
    } 

    this.initMoving = 
         function () {
            if( flgMoving ){ //|| flgSupplyingData ) {
                //let job finish:
                setTimeout( that['initMoving'], 1000 );
                return;
            }
            flgMoving = true;
            ixToCome = ( ixShown + 1 ) % data.length;
            //reset back weel, front weel, add call back
            //fire move      
            var ixBack = ixFront == 1 ? 0 : 1;

            //-------------------------------------------------------------
            //We loop via banner's elements hel, img, title, and message.
            //- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
            //Not everyone of them has information to display.
            //We will choose "master which has ... and use it to pass finishMoving:
            var gweel = weels[ ixBack ];
            var vweel = weels[ ixFront ];
            gweel.data = data[ ixToCome ];
            if( gweel.data.image ){
                gweel.effects = weels[ ixBack ].eff_img.init( gweel.data.effect  );
                gweel.img.style.visibility = 'visible'; //TODO no synch with "unhide".
                gweel.img.src = gweel.data.image;
            }else{
                gweel.effects = weels[ ixBack ].eff_hel.init( gweel.data.effect  );
                gweel.img.style.visibility = 'hidden';  
                gweel.hel.innerHTML = gweel.data.text.message;
            }
            //TODO rename to "manage visibiility" and  synch rotator with effector: if( gweel.data.effect.
            gweel.hel.style.visibility = 'hidden'; //'visible';
  
      
            gweel.effects.setFinalFunction( finishMoving );
            if( ixShown >= 0 ) {
                //Do this only once, when rotator loaded.
                var e = weels[ ixFront ].effects;
                if( !interleave_swapping ) e.setFinalFunction( gweel.effects.repeat );
                e.revert();
            }else{
                if( !interleave_swapping ) gweel.effects.repeat();
            }
            if( interleave_swapping ) gweel.effects.repeat();

            //-------------------------------------------------------------



    };

    var finishMoving = 
          function () {
            // swap ix
            weels[ixFront].hel.style.visibility = 'hidden';
            weels[ixFront].img.style.visibility = 'hidden'; //TODO simpler.
            if( weels[ixFront].effects ) weels[ixFront].effects.back();
            ixFront = ixFront == 0 ? 1 : 0;
            ixShown = ixToCome;
            flgMoving = false;
            setTimeout( that['initMoving'], interval );
        };
    this.supplyData = function (d){
        interval = d.interval;
        interleave_swapping = d.interleave_swapping;
        data = d.data;
        return that;
    };

})('banner'); //rotator constructor end
  


