// (c) Copyright Microsoft Corporation.
// This source is subject to the Microsoft Permissive License.
// See http://www.microsoft.com/resources/sharedsource/licensingbasics/sharedsourcelicenses.mspx.
// All other rights reserved.


// README
//
// There are three steps to adding a property:
//
// 1. Create a member variable to store your property
// 2. Add the property to the type descriptor for this class
// 3. Add the get_ and set_ accessors for your property.
//
// Remember that all three are case sensitive!
//

//alert();
Type.registerNamespace('PanelFader');

PanelFader.PanelFaderBehavior = function(element) {
    //alert(element)
    //stop;
    this._myPropertyValue= "";
    this._delayValue= "";
    this.fcontent=new Array();
    this.thisObject = this;
    this.index = 0;
    this.ef= null;
    PanelFader.PanelFaderBehavior.initializeBase(this,[element]);
   
}
PanelFader.PanelFaderBehavior.prototype = {
    initialize : function() {
        PanelFader.PanelFaderBehavior.callBaseMethod(this, 'initialize');
        //if(!confirm("initialized")){return;}

        thisObject = this;
        var values = this.MyProperty.split(";"); ;//_myPropertyValue.split(";");
        begintag='<div style="background:#EEEEEE;">'; //  style="font: normal 14px  Arial; padding: 5px;"font-weight:normal;font-style:normal;set opening tag, such as font declarations
        closetag='</div>';
        var delay = 12000; //set delay between message change (in miliseconds)
        var maxsteps=30; // number of steps to take to change from start color to endcolor
        var stepdelay=40; // time in miliseconds of a single step
        //**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
        var startcolor= new Array(255,255,255); // start color (red, green, blue)
        var endcolor=new Array(0,0,0); // end color (red, green, blue)
        for (var i = 0; i < values.length; i ++){
            this.fcontent[this.fcontent.length] = values[i];
        }
       //thisObject.control.element.style.color= "rgb(0,0,0)";// "rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
       //thisObject.control.element.innerHTML= begintag+fcontent[index]+closetag;
        this._element.innerHTML = begintag+this.fcontent[this.index]+closetag;
       //alert(this._element.innerHTML)
       //this._element.innerHTML = "test";
       //return;
       //ef = new fx.Opacity(this._element.id,{duration:1000,onComplete:this.onHidden})
        thisObject.ef = new fx.Opacity(this._element.id,{duration:1000,
            extender:thisObject,
            onComplete:function(){
               //alert(this.options.extender._element.innerHTML)
                 begintag='<div style="background:#EEEEEE;">'; //  style="font: normal 14px Arial; padding: 5px;"font-weight:normal;font-style:normal;set opening tag, such as font declarations
                closetag='</div>';
                //this.index = this.options.extender.index;
                //status = this.options.extender.index
                this.options.extender.index++;
                
                if(this.options.extender.ef.el.style.opacity == 0){
                    if (this.options.extender.index>=this.options.extender.fcontent.length)this.options.extender.index=0;
                    
                    this.options.extender._element.innerHTML=begintag+this.options.extender.fcontent[this.options.extender.index]+closetag;
                    //thisObject.control.element.style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
                    //$(thisObject.control.element.id).innerHTML=begintag+fcontent[index]+closetag;
                    
                    this.options.extender.ef.toggle()
                }
            }
       })
       
       //ef.toggle()
       //this.setInterval(thisObject.ef.toggle,delay + 1000);
       //setInterval(function(){ef.toggle();},delay + 1000);
       //setInterval(thisObject.ef.toggle,delay + 1000);
       var cbk = Function.createCallback(function(e){e.ef.toggle()}, thisObject); 
       window.setInterval(cbk, delay + 1000); 
       return;
       /*
       new Effect.Fade(this.control.element.id)
       */
       //fcontent[fcontent.length] = _myPropertyValue
        // TODO: add your initalization code here         
        if (ie4||DOM2)
  //document.write('<div id="fscroller" style="border:1px solid black;width:'+fwidth+';height:'+fheight+'"></div>');

        if (window.addEventListener){
            //window.addEventListener("load", this.changecontent, false);
        }else if (window.attachEvent){
            //window.attachEvent("onload", this.changecontent);
        }else if (document.getElementById){
            //this.changecontent();
        }
        
    },
onHidden : function(e){
        //status = ef.el.style.opacity;
        //alert("hidden");
        begintag='<div style="background:#EEEEEE;">'; //  style="font: normal 14px Arial; padding: 5px;"font-weight:normal;font-style:normal;set opening tag, such as font declarations
        closetag='</div>';
        this.index++;
        if(ef.el.style.opacity == 0){
            if (this.index>=this.fcontent.length)this.index=0;
            
            this._element.innerHTML=begintag+fcontent[index]+closetag;
            //thisObject.control.element.style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
            //$(thisObject.control.element.id).innerHTML=begintag+fcontent[index]+closetag;
            
            ef.toggle()
        }
    },
MyProperty : function(value) {
            _myPropertyValue = value;
           
           
        }
}
function a() {

    // TODO : (Step 1) Add your property variables here    
    //
    var _myPropertyValue;
    var _delayValue;
    //alert(this.MyProperty);
    
    var delay = 12000; //set delay between message change (in miliseconds)
    var maxsteps=30; // number of steps to take to change from start color to endcolor
    var stepdelay=40; // time in miliseconds of a single step
    //**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
    var startcolor= new Array(255,255,255); // start color (red, green, blue)
    var endcolor=new Array(0,0,0); // end color (red, green, blue)
    // style="font: normal 14px Arial; padding: 5px;"
    var fcontent=new Array();
    begintag='<div style="background:#EEEEEE;">'; //  style="font: normal 14px Arial; padding: 5px;"font-weight:normal;font-style:normal;set opening tag, such as font declarations
    //fcontent[0]="<b>What\'s new?</b><br>New scripts added to the Scroller category!<br><br>The MoreZone has been updated. <a href='../morezone/index.htm'>Click here to visit</a>";
    //fcontent[1]="Dynamic Drive has been featured on Jars as a top 5% resource, and About.com as a recommended DHTML destination.";
    //fcontent[2]="Ok, enough with these pointless messages. You get the idea behind this script.</a>";
    closetag='</div>';


    var fwidth='150px'; //set scroller width
    var fheight='150px'; //set scroller height

    var fadelinks=1;  //should links inside scroller content also fade like text? 0 for no, 1 for yes.

    ///No need to edit below this line/////////////////


    var ie4=document.all&&!document.getElementById;
    var DOM2=document.getElementById;
    var faderdelay=0;
    var index=0;
    var thisObject;
    var ef ;
    this.onHidden = function(e){
        //status = ef.el.style.opacity;
        alert("hidden");
        index++;
        if(ef.el.style.opacity == 0){
            if (index>=fcontent.length)index=0;
            
            thisObject.control.element.innerHTML=begintag+fcontent[index]+closetag;
            //thisObject.control.element.style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
            //$(thisObject.control.element.id).innerHTML=begintag+fcontent[index]+closetag;
            
            ef.toggle()
        }
    }
    this.initializea = function() {
        PanelFader.PanelFaderBehavior.callBaseMethod(this, 'initialize');
        alert();
       alert("initialized")
       /*
       //alert("initialized")
       
       if(_delayValue != ""){
        delay = _delayValue;
       }
       */
       thisObject = this;
       var values = _myPropertyValue.split(";");
       for (var i = 0; i < values.length; i ++){
            fcontent[fcontent.length] = values[i];
       }
       //thisObject.control.element.style.color= "rgb(0,0,0)";// "rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
       thisObject.control.element.innerHTML= begintag+fcontent[index]+closetag;
      
       
       
       ef = new fx.Opacity(thisObject.control.element.id,{duration:1000,onComplete:this.onHidden})
       setInterval(function(){ef.toggle();},delay + 1000);
       /*
       new Effect.Fade(this.control.element.id)
       */
       //fcontent[fcontent.length] = _myPropertyValue
        // TODO: add your initalization code here         
        if (ie4||DOM2)
  //document.write('<div id="fscroller" style="border:1px solid black;width:'+fwidth+';height:'+fheight+'"></div>');

        if (window.addEventListener){
            //window.addEventListener("load", this.changecontent, false);
        }else if (window.attachEvent){
            //window.attachEvent("onload", this.changecontent);
        }else if (document.getElementById){
            //this.changecontent();
        }
        
        //this.changecontent();
        //window.onload=changecontent
        
    }
    
    this.dispose = function() {
       
        // TODO: add your cleanup code here
        
        PanelFader.PanelFaderBehavior.callBaseMethod(this, 'dispose');
    }
    
    this.getDescriptor = function() {
        var td = PanelFader.PanelFaderBehavior.callBaseMethod(this, 'getDescriptor');
        
        // TODO: (Step 2) Add your property declarations here.        
        //
        td.addProperty('MyProperty', String);        
        td.addProperty('Delay', String);        
        
        return td;
    }
    
    // TODO: (Step 3) Add your property accessors here.
    //
        this.get_MyProperty = function() {
            return _myPropertyValue;
        }
        
        this.set_MyProperty = function(value) {
            _myPropertyValue = value;
        }
        
        this.get_Delay = function(){
            return _delayValue;
        }
        this.set_Delay = function(value){
            _delayValue = value;
        }
        
    // These are helper functions for communicating state back to the extender on the
    // server side.  They take or return a custom string that is available in your initialize method
    // and later.
    //
    this.getClientState = function() {
        var value = PanelFader.PanelFaderBehavior.callBaseMethod(this, 'get_ClientState');                
        if (value == '') value = null;
        return value;
    }
     
    this.setClientState = function(value) {
        return PanelFader.PanelFaderBehavior.callBaseMethod(this, 'set_ClientState',[value]);                
    }

}

PanelFader.PanelFaderBehavior.registerClass('PanelFader.PanelFaderBehavior', AjaxControlToolkit.BehaviorBase);