qx.Class.define("gallery",
{
  extend : qx.ui.container.Composite,

  include :
  [
    qx.ui.core.MResizable,
    qx.ui.core.MMovable
  ],
  construct : function(galtype,div,dir_image,duration,interval)
     {
      this.base(arguments);
      var layout = new qx.ui.layout.Canvas();
      this.DIR_IMAGE = dir_image;
      this.INTERVAL = interval;
      this.DURATION = duration;
      this.setLayout(layout);
      this.end = false;
      this.GALTYPE = galtype || 1;
      this.CADRE_WIDTH = 200;
      this.CADRE_HEIGHT = 200;
      this.IMG_WIDTH = 150;
      this.IMG_HEIGHT = 150;   
      this.DIVNAME = div || null;
      this.PLAYBUTTON = null;
      this.BOTTOMBUTTONS = 10;
      this.BUTTONSVISIBILITY = "hidden";
      this.IMG_POS = "center";
      this.RESIZE = true;
      if (this.DIVNAME)//ajout seul dans le div
         {
          this.div = new bunchdiv(this,this.DIVNAME);
          this.div.setBackgroundColor(null); 
          this.setResizable(false);
         }

      this.Play = true;
      this.i = 0;   
      //this.setBackgroundColor('#FFFFFF');       
      this.ContainerImage = new qx.ui.container.Composite();
      this.ContainerImage.setLayout(new qx.ui.layout.Canvas());
      this.add(this.ContainerImage,{ top : 0, left : 0 ,right : 0, bottom : 0});
      this.ContainerImage.addListener("resize", function(e)
          {		  
          if (this.BUTTONSVISIBILITY == "visible")
             {
     	       this.PREVBUTTON.setLayoutProperties({left  : Math.round(this.CADRE_WIDTH *(2/6)), bottom : this.BOTTOMBUTTONS});
             this.PLAYBUTTON.setLayoutProperties({left  : Math.round(this.CADRE_WIDTH *(3/6)), bottom : this.BOTTOMBUTTONS});
             this.NEXTBUTTON.setLayoutProperties({left  : Math.round(this.CADRE_WIDTH *(4/6)), bottom : this.BOTTOMBUTTONS});
             }
          },this)
      //this.ContainerImage.setBackgroundColor('#EAEAEA');
      
      this.ImageDown = new qx.ui.basic.Image("");  
      this.ImageDown.setScale(true);
      //this.ImageDown.setBackgroundColor('#EAEAEA'); 
       
      this.ImageUp = new qx.ui.basic.Image("");  
      this.ImageUp.setScale(true);
 
     // this.ImageUp.setBackgroundColor('#EAEAEA'); 	   
	   
      this.ContainerImage.add(this.ImageDown ,{left : 0,top : 0});	   
	    this.ContainerImage.add(this.ImageUp ,{left : 0,top : 0});

      this.Address = "phpscript/scandirimg.php";
          
      //---Init HttpRequest
      // this.Address = phpscript;
      this.XHR_OBJECT = null;
        
      if(window.XMLHttpRequest) // Firefox
        {
        this.XHR_OBJECT = new XMLHttpRequest();
        }
      else if(window.ActiveXObject) // Internet Explorer
           {
           this.XHR_OBJECT = new ActiveXObject("Microsoft.XMLHTTP");
           }
      else
           {
           alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
           return;
           }
    this.XHR_OBJECT.onreadystatechange = qx.lang.Function.bind(this.OnReceiveChange, this); 
    
    //window.onunload=qx.lang.Function.bind(this.stopEffects, this); 
       

      
      this.addListener("appear", function(e)
          {	
          if (!this.DIVNAME)
             {
             this.BunchPage = document.page; 
             this.Menu = this.getContextMenu(); 
             this.setContextMenu(this.Menu);	 
             this._activateMoveHandle(this);
             this.createPropertiesWindow();
             } 
		      // Border Color
		      /*
          this.setSize(this.CADRE_WIDTH,this.CADRE_HEIGHT,this.IMG_WIDTH,this.IMG_HEIGHT);  */
		      /*
          var borderColor = "#FF0000";
		      var border = new qx.ui.decoration.Single(1, "solid", borderColor);
		      var borderdiv = new qx.ui.decoration.Single(1, "solid", "#00FFFF");
	        this.ContainerImage.set({decorator: border});
		      this.ImageUp.set({decorator: borderdiv});
		      this.ImageDown.set({decorator: borderdiv});
		      var borderdiv = new qx.ui.decoration.Single(0, "solid", "#FFFFFF");
	        this.div.set({decorator: borderdiv});
          */
          
          
          if (this.GALTYPE == 1)
             this.fadeup = new qx.fx.effect.core.Fade(this.ImageUp.getContainerElement().getDomElement());
          else if (this.GALTYPE == 2)
               this.fadeup = new qx.fx.effect.core.Fade(this.ImageDown.getContainerElement().getDomElement());
          this.fade = new qx.fx.effect.core.Fade(this.ImageDown.getContainerElement().getDomElement());           
	        var ch = "DIR=../" +this.DIR_IMAGE;
          this.sendData(ch);
		      //this.ContainerImage.add(this.Text ,{left : 0 ,top : 300});  
		      //this.ContainerImage.add(this.Description ,{left : 0 ,bottom : 0});      	
          },this) 
     

      /*
      this.Text = new qx.ui.basic.Label("");
      this.Text.setBackgroundColor('#EAEAEA');
      this.Text.setTextColor("#000000");
      this.Text.setWidth(800);
      this.Text.setHeight(20);
      this.Text.setTextAlign("center");
      this.Text.setFont(qx.bom.Font.fromString("10px sans-serif"));     

      this.Description = new qx.ui.basic.Label("");
      this.Description.setBackgroundColor('#EAEAEA');
      this.Description.setTextColor("#FFFFFF");
      this.Description.setWidth(800);
      this.Description.setHeight(60);
      this.Description.setTextAlign("center");
      this.Description.setFont(qx.bom.Font.fromString("32px sans-serif"));  
	  
	    this.lnkretour =  new qx.ui.embed.Html();
      this.lnkretour.setHtml("<a href=\"voir-photos-album-acontrecourant.php\" class=\"Texte-lien-bas\">Retour</a>");
      this.add(this.lnkretour, { left : 400 , bottom : -20 } );   
	    this.setDesc(title);
	    */
     },
  properties  :
     {
     },



  members  :
     { 
     stopEffects : function()
      {
      this.fade.cancel();
      this.fadeup.cancel();       
      },
     addButtons :  function()
        {
        this.PREVBUTTON = new qx.ui.toolbar.Button("","pix/gallerie/bouton-preced.png");
        this.PREVBUTTON.setAppearance("widget");
        this.add(this.PREVBUTTON);    
        this.PREVBUTTON.setWidth(30);
        this.PREVBUTTON.addListener("execute", function(e)
          {             
          this.i--;           
          if (this.i < 0)      
             {
             this.i = this.Tab.length-1;
             }
          this.image = this.Tab[this.i];
          if (this.Play == true)
              {
              this.Play = false;
              this.pause();  
              }
          qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
             {
             this.resizeimage(this.ImageDown,data.width,data.height);
             this.ImageDown.setSource(this.DIR_IMAGE+this.image);
             }, this);
          },this);
        
        this.PLAYBUTTON = new qx.ui.toolbar.Button("","pix/gallerie/bouton-pause.png");
        this.PLAYBUTTON.setFont(qx.bom.Font.fromString("18px sans-serif"));
        this.PLAYBUTTON.setAppearance("widget");
        this.add(this.PLAYBUTTON); 
        this.PLAYBUTTON.addListener("execute", function(e)
          {          
          this.Play =  !this.Play;
          if (this.Play)
             {
             if (this.GALTYPE == 1)
                {
                this.nextImage();
                this.fadeup.start();
                }
             if (this.GALTYPE == 2)
                this.fade.start();
             this.PLAYBUTTON.setIcon("pix/gallerie/bouton-pause.png");
             }
          else
              this.pause();                                                                                                                
          },this); 
   
        this.NEXTBUTTON = new qx.ui.toolbar.Button("","pix/gallerie/bouton-suiv.png");
        this.NEXTBUTTON.setAppearance("widget");
        this.add(this.NEXTBUTTON);  
        this.NEXTBUTTON.addListener("execute", function(e)
          {      
          this.nextImage();       
          if (this.Play == true)
             {
             this.Play = false;
             this.pause();  
             }
          qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
            {
            this.resizeimage(this.ImageDown,data.width,data.height);
            this.ImageDown.setSource(this.DIR_IMAGE+this.image);          
            }, this);
          },this);
        }, 
     getPublish :  function(index)
        {
        var ref_this = "document.bedget" + index;
        var Script  = ref_this + "=new gallery("+this.GALTYPE + ",\"bunchdiv"+ index +"\",\""+ this.DIR_IMAGE +"\","+ this.DURATION + ","+this.INTERVAL/1000+");\n";        
        Script += ref_this + ".setSize("+this.CADRE_WIDTH+","+this.CADRE_HEIGHT+","+ this.IMG_WIDTH+","+this.IMG_HEIGHT+");\n";
        Script += ref_this + ".set({width : " + this.getWidth() + ", height :" + this.getHeight() +"});\n"; 
        Script += ref_this + ".setZIndex("+this.getZIndex()+");\n";
        Script += ref_this + ".setButtonsVisibility(\""+this.BUTTONSVISIBILITY+"\");\n";
        return Script;   
        },
     getSave :  function(div)
        {
        var ref_this = "document.bedget" + index;
        var Script  = "new gallery("+this.GALTYPE + ",null,\""+ this.DIR_IMAGE +"\","+ this.DURATION + ","+this.INTERVAL/1000+");\n";        
        Script += ref_this + ".setSize("+this.CADRE_WIDTH+","+this.CADRE_HEIGHT+","+ this.IMG_WIDTH+","+this.IMG_HEIGHT+");\n";
        Script += ref_this + ".set({width : " + this.getWidth() + ", height :" + this.getHeight() +"});\n"; 
        Script += ref_this + ".setZIndex("+this.getZIndex()+");\n";
        Script += ref_this + ".setButtonsVisibility(\""+this.BUTTONSVISIBILITY+"\");\n";
        return Script;   
        },             
     setfadeup : function ()      
        {                                                                  
       this.fadeup.setDuration(this.DURATION);
       this.fadeup.addListener("setup",function(e)
                {  
                if (this.GALTYPE == 1)
                   {
                   this.ImageUp.show();
                   this.fadingdown = false;
                   if (this.Play == true)
                      { 
                      qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
                        {
                        this.resizeimage(this.ImageUp,data.width,data.height);
                        this.ImageUp.setSource(this.DIR_IMAGE+this.image);
                        }, this);
                       }
                   }
                else if (this.GALTYPE == 2)
                     {
                     this.ImageUp.hide();                                                                                
                     this.ImageDown.setSource(this.DIR_IMAGE+this.image);    
                     }   
                },this); 
       this.fadeup.addListener("finish",function(e)
                {
               if (this.GALTYPE == 1)
                   {
                   this.fadingdown = true;
                   qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
                        {
                        this.resizeimage(this.ImageDown,data.width,data.height);
                        this.ImageDown.setSource(this.DIR_IMAGE+this.image);
                        }, this);
                   }   
                if(this.Play == true)
                  {
                  //this.Timer = new qx.event.Timer.once(function()
                  //             {
                               if (this.GALTYPE == 1)
                                  {
                                  this.nextImage(); 
                                  this.fadeup.start()
                                  }
                               else if (this.GALTYPE == 2)
                                    {
                                    this.fade.start();
                                    }
                  //            }, this, this.INTERVAL);        
                  //this.fadeup.start();
                  }                                           
                },this );             
        this.fadeup.setFrom(0);    
        this.fadeup.setTo(1);
        },
      setfadedown : function ()      
        {
        if (this.GALTYPE == 2)
           {       
           this.fade.setDelay(this.INTERVAL);       
           this.fade.addListener("setup",function(e)
                {  
                this.fadingdown = true;
                },this);
           this.fade.addListener("finish",function(e)
                {     
                
                this.fadingdown = false;
                if(this.Play == true)
                  {      
                  this.nextImage();      
                  qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
                    {
                    this.resizeimage(this.ImageDown,data.width,data.height);
                    this.fadeup.start();
                    }, this);
                  }
                else
                  {
                  this.fadeup.start();
                  this.fadeup.end(); 
                  }
                },this );  
           }                             
        this.fade.setDuration(this.DURATION);     
        this.fade.setFrom(1);    
        this.fade.setTo(0);                                   
        },
     
    sendData : function ( ch)
        {           
        var addr = this.Address;
        this.XHR_OBJECT.open("POST", addr, true);
        this.XHR_OBJECT.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //application/json
        var chaine = ch;
        this.XHR_OBJECT.send(chaine);  
        },

     OnReceiveChange : function ()
        {
         if (this.XHR_OBJECT.readyState == 4)
            {
            var chaine =  this.XHR_OBJECT.responseText;
            eval(chaine);
            if (this.Tab[0])
              {
              this.image = this.Tab[0];
              // A REMETTRE
              this.setfadeup();
              this.setfadedown();    
              qx.io.ImageLoader.load(this.DIR_IMAGE+this.image,function (source,data)
                {
                this.resizeimage(this.ImageUp,data.width,data.height);
                this.fadeup.start();
                if (this.GALTYPE == 1)
                   this.fadeup.setDelay(this.INTERVAL); 
                }, this);     
                                      
              }
            }
        },  
    pause : function()
        {
        //if (this.Timer)
        //   this.Timer.stop();
        if (this.GALTYPE == 1)
           {
           this.ImageUp.hide();
           }
        else if (this.GALTYPE == 2)
             {
             if (this.fadingdown == true)
                {
                this.fade.end();
                this.fadeup.start();
                }              
             }
        this.PLAYBUTTON.setIcon("pix/gallerie/bouton-play.png");
        this.fade.cancel();
        this.fadeup.cancel();
        },
    resizeimage : function (image,width,height)
        {
        if (this.RESIZE == true)
          {
          var ratio;
          ratio = height / width;
          if (ratio < 1)
            {     
            var width = parseInt(this.IMG_HEIGHT / ratio);    
            var ratiow = 1;                     
            if (width> this.IMG_WIDTH)
                {
                var ratiow = width/ this.IMG_WIDTH;
                width = parseInt(width/ ratiow);
                var height = parseInt(this.IMG_HEIGHT / ratiow);  
                }                                              
            }
          else
           {
           var height = parseInt(this.IMG_WIDTH * ratio);
           var ratioh = 1;                    
           if (height > this.IMG_HEIGHT)
             {
             var ratioh = height / this.IMG_HEIGHT;
             height = parseInt(height / ratioh);  
             var width = parseInt(this.IMG_WIDTH / ratioh);
             }             
           }    
         if((this.IMG_HEIGHT == this.CADRE_HEIGHT) && (this.IMG_WIDTH == this.CADRE_WIDTH))
          {
          this.ContainerImage.setHeight(height);
          this.ContainerImage.setWidth(width);
          }
         image.setHeight(height);
         image.setWidth(width);     

        if(this.IMG_POS == "center")
          {                   
          var ptop = parseInt((this.CADRE_HEIGHT / 2) - (height /2));    
          var pleft = parseInt((this.CADRE_WIDTH / 2) - (width /2));    
          image.setLayoutProperties({ top : ptop ,left  : pleft });   
          }                      
         }
        } 
     ,
    nextImage : function()
        {
        this.i++; 
        if (this.i >= this.Tab.length)      
           this.i = 0;
        this.image = this.Tab[this.i];
        },
    getContextMenu : function()
        {       
        var menu = new qx.ui.menu.Menu();
        var DeleteButton = new qx.ui.menu.Button("Delete", "");// this.__newCommand);
        DeleteButton.addListener("execute", function(e)
                {
                this.destroy();
                if (this.BunchPage.SelectedBedget = this)
                   this.BunchPage.SelectedBedget = null;
                },this);
        menu.add(DeleteButton);
        
        var PropertiesButton = new qx.ui.menu.Button("Properties", "");// this.__newCommand);
        PropertiesButton.addListener("execute", function(e)
                {
                this.setPropertiesFields();
                this.win_Properties.open();
                },this);
        menu.add(PropertiesButton);
        
        var InFront = new qx.ui.menu.Button("Mettre devant", "", null);
        InFront.addListener("execute",function(e) 
                              { 
                              this.BunchPage.SetOnTop(this);
                              },this);  
        menu.add(InFront);
        return menu;   
        }, 
    setSize : function(cadre_width,cadre_height,image_width,image_height)
        {
        this.CADRE_WIDTH = cadre_width;
        this.CADRE_HEIGHT = cadre_height;
        this.IMG_WIDTH = image_width;
        this.IMG_HEIGHT = image_height;
        
        this.setWidth(this.CADRE_WIDTH);   
        this.setHeight(this.CADRE_HEIGHT);
        this.ImageDown.setHeight(this.IMG_HEIGHT);
        this.ImageDown.setWidth(this.IMG_WIDTH);
        this.ImageUp.setHeight(this.IMG_HEIGHT);
        this.ImageUp.setWidth(this.IMG_WIDTH);
        
        if(this.IMG_POS != "top")
          {
          var ptop = parseInt((this.CADRE_HEIGHT / 2) - (this.IMG_HEIGHT /2));    
          var pleft = parseInt((this.CADRE_WIDTH / 2) - (this.IMG_WIDTH /2));   
          this.ImageDown.setLayoutProperties({ top : ptop ,left  : pleft });  
          this.ImageUp.setLayoutProperties({ top : ptop ,left  : pleft }); 
          } 
        },
    setButtonsVisibility : function(visiblity)
        {
        if (this.PLAYBUTTON == null && visiblity =="visible")
           this.addButtons();
        if (this.PLAYBUTTON != null)
           {
           this.BUTTONSVISIBILITY = visiblity; 
           this.PREVBUTTON.setVisibility(visiblity);
           this.PLAYBUTTON.setVisibility(visiblity);
           this.NEXTBUTTON.setVisibility(visiblity);
           }
        },  
     setPropertiesFields :  function()
        {
        this.win_Properties.ElemHeight.setValue(this.getHeight().toString());
        this.win_Properties.ElemWidth.setValue(this.getWidth().toString()); 
        this.win_Properties.ElemTop.setValue(this.getBounds()["top"].toString());
        this.win_Properties.ElemLeft.setValue(this.getBounds()["left"].toString());   
        this.win_Properties.Cadre_width.setValue(this.CADRE_WIDTH.toString());
        this.win_Properties.Cadre_height.setValue(this.CADRE_HEIGHT.toString());
        this.win_Properties.Image_width.setValue(this.IMG_WIDTH.toString());
        this.win_Properties.Image_height.setValue(this.IMG_HEIGHT.toString());
        },     
    createPropertiesWindow :  function()
        {  
        var elements = new Array();
        elements[0] = new Array();
        elements[0]["type"] = "TextField";
        elements[0]["caption"] = "Cadre Width";
        elements[0]["name"] = "Cadre_width";
        elements[0]["where"] = "after";
        
        elements[1] = new Array();
        elements[1]["type"] = "TextField";
        elements[1]["caption"] = "Cadre Height";
        elements[1]["name"] = "Cadre_height";
        elements[1]["where"] = "after";

        elements[2] = new Array();
        elements[2]["type"] = "TextField";
        elements[2]["caption"] = "Image Width";
        elements[2]["name"] = "Image_width";
        elements[2]["where"] = "after";
        
        elements[3] = new Array();
        elements[3]["type"] = "TextField";
        elements[3]["caption"] = "Image Height";
        elements[3]["name"] = "Image_height";
        elements[3]["where"] = "after";
                   
        this.win_Properties = new dial_properties("Gallery Properties",elements);   
            
        this.win_Properties.addListener("close", function(e)
            {                  
            if(this.win_Properties.Validate == true) 
              {
              var ptop = parseInt(this.win_Properties.ElemTop.getValue());    
              var pleft = parseInt(this.win_Properties.ElemLeft.getValue());   
              this.setLayoutProperties({ top : ptop ,left  : pleft })
              this.set("width",parseInt(this.win_Properties.ElemWidth.getValue()));  
              this.set("height",parseInt(this.win_Properties.ElemHeight.getValue()));  
              this.setSize( parseInt(this.win_Properties.Cadre_width.getValue()), parseInt(this.win_Properties.Cadre_height.getValue()), parseInt(this.win_Properties.Image_width.getValue()), parseInt(this.win_Properties.Image_height.getValue()));
              }
            else
              this.setPropertiesFields(this.win_Properties.ElemHeight.getValue());
            },this);
        }
    /*    , 
    setDesc : function(caption)
        {
        this.Description.setValue(caption);
        },
    setText : function(caption,link)
        {
        this.Text.setValue(caption);
		    this.Text.setCursor("pointer"); 
        this.Text.addListener("click",function(e)
                {
				        window.location=link;
                },this );  		
        }
      */
     }
});