TGDialog = Class.create();

TGDialog.prototype = 
{
   initialize : function(title,options)
   { 
       this.element = null;
       this.title = title;
       this.x = 0;
       this.y = 0;
       this.width = null;
       this.height = null;
       
       this.dragging = false;
       this.dragX = 0;
       this.dragY = 0;
       this.posX = 0;
       this.posY = 0;
       this.draggable = true;
       this.moveObserverFunc = null;
       this.upObserverFunc = null;
        
       this.parentElement = null;
       this.content = null;
       this.closeImage = "images/close.gif";
       this.opacity = 0.8;
       this.center = false;
       this.closeFunction = null;
       
       if(options)
       {
           if(options['x'])
           {
               this.x = options['x'];
           }
           if(options['y'])
           {
               this.y = options['y'];
           }
           if(options['width'])
           {
               this.width = options['width'];
           }
           if(options['height'])
           {
               this.height = options['height'];
           }
           if(options['parentElement'])
           {
               this.parparentElement = options['parentElement'];
           }
           if(options['opacity'])
           {
               this.opacity = options['opacity'];
           }
           if(options['image'])
           {
               this.closeImage = options['image'];
           }
           if(options['center'] != null)
           {
               this.center = options['center'];
           }
           if(options['draggable'] != null)
           {
               this.draggable = options['draggable'];
           }
           if(options['closeFunction'])
           {
               this.closeFunction = options['closeFunction'];
           }
       }
       
       if(!this.parentElement)
       {
           this.parentElement = document.body;
       }
       
       this.element = document.createElement("div");
       this.element.style.display = "none";
       this.element.style.position ="absolute";
       this.element.style.border = "1px solid #FF8888";

       if(this.width)
       {
           this.element.style.width = this.width +"px";
       }
       if(this.height)
       {
           this.element.style.height = this.height + "px";
       }
       
       this.element.style.opacity = this.opacity;
	   this.element.style.filter = "alpha(opacity=" + this.opacity * 100 + ")";   
	   this.element.style.backgroundColor = "#ffff88";
	   this.element.style.padding = "4px";
	   
	   this.parentElement.appendChild(this.element);
	   
	   this.titleLineDiv = document.createElement("div");
	   this.titleLineDiv.style.position = "relative";
	   
	   this.titleDiv = document.createElement("div");
	   this.titleDiv.style.position = "relative";
	   this.titleDiv.style.cssFloat = "left";
	   this.titleDiv.style.styleFloat = "left";
	   this.titleDiv.innerHTML = "<span style='font-weight:bold'>" + this.title + "</span>";
	   this.titleLineDiv.appendChild(this.titleDiv);
	   
	   this.closeButtonDiv = document.createElement("div");
	   this.closeButtonDiv.style.position = "relative";
	   this.closeButtonDiv.style.cssFloat = "right";
	   this.closeButtonDiv.style.styleFloat = "right";
	   this.titleLineDiv.appendChild(this.closeButtonDiv);
	   
	   this.image = document.createElement("img");
	   this.image.src = this.closeImage;
	   this.image.border = "0";
	   this.image.title = "schliessen ...";
	   this.image.style.cursor = "pointer";
	   this.closeButtonDiv.appendChild(this.image);
	   
	   if(this.closeFunction)
	   {
	       this.eventFunc = this.closeFunction;
	   }
	   else
	   {
	       this.eventFunc = this.destroy.bind(this);
	   }
	   
	   Event.observe(this.image,"click",this.eventFunc);
	   
	   this.clearDiv = document.createElement("div");
	   this.clearDiv.style.clear = "both";
	   this.titleLineDiv.appendChild(this.clearDiv);
	   
	   this.element.appendChild(this.titleLineDiv);
	   
	   this.content = document.createElement("div");
	   this.content.style.position = "relative";
	   this.content.paddingTop = "5px";
	   this.element.appendChild(this.content);
	   
	   if(this.center)
       {
           this.moveToCenter();
       }
       else
       {
           this.element.style.top = this.y + "px";
           this.element.style.left = this.x + "px";
       }
       
       if(this.draggable)
       {  
           this.titleLineDiv.style.cursor = "move";
            
           this.moveObserverFunc = this.drag.bindAsEventListener(this);
           this.upObserverFunc = this.dragend.bindAsEventListener(this);
           this.dragstartFunc =  this.dragstart.bindAsEventListener(this);
           Event.observe(this.titleLineDiv,"mousedown",this.dragstartFunc);
           Event.observe(document,"mousemove",this.moveObserverFunc);
           Event.observe(document,"mouseup",this.upObserverFunc);
       }
   },
   
   dragstart : function(event)
   {
        if(document.all) Event.stop(event);
        this.dragging = true;
        this.element.style.opacity = "0.8";
	    this.element.style.filter = "alpha(opacity=80)";
        var pos = Position.cumulativeOffset(this.element);
        this.dragX = this.posX - pos[0];
        this.dragY = this.posY - pos[1];
   },
    
   drag: function(event)
   {
        if(document.all) Event.stop(event);
        var tmpX = Event.pointerX(event);
        var tmpY = Event.pointerY(event);
        
        var tmpPosX = tmpX - this.dragX;
        var tmpPosY = tmpY - this.dragY;
        
        var moved = false;
        
        this.posX = tmpX ;
        this.posY = tmpY;        
        
        if(this.dragging)
        {    
            this.move(this.posX - this.dragX,this.posY - this.dragY);            
        }
   },
    
    move: function(x,y)
    {
        this.moveX(x);
        this.moveY(y);
    },
    
    moveX: function(x)
    {
        this.x = x;
        this.element.style.left = this.x + "px";
    },
    
    moveY: function(y)
    {
        this.y = y;
        this.element.style.top = this.y + "px";
    },
    
    dragend: function(event)
    {
        this.dragging = false;
        this.element.style.opacity = "1.0";
	    this.element.style.filter = "alpha(opacity=100)";
    },
   
   show : function()
   {
       if(!this.isDestroyed())
       {
          //this.element.style.display = "";
          Effect.Appear(this.element,{duration:0.5});
       }
   },
   
   moveToCenter : function()
   {
       var dimension = Element.getDimensions(this.parentElement);
           
       var elementDimension = Element.getDimensions(this.element);
       
       this.element.style.top = parseInt((dimension.height/2.0) - (elementDimension.height / 2.0)) + "px";
       
       this.element.style.left = parseInt((dimension.width/2.0) - (elementDimension.width / 2.0)) + "px";
   },
   
   setContent : function(c)
   {
       if(!this.isDestroyed())
       {
          this.content.innerHTML = c;
       }
   },
   
   destroy : function()
   {
       if(!this.isDestroyed())
       {
            this.closeButtonDiv.style.display = "none";
            Effect.Fade(this.element,{duration:0.5,afterFinish : this.finishDestroying.bind(this)});
       }
   },
   
   finishDestroying : function()
   {
       Event.stopObserving(this.image,"click",this.eventFunc);
       
       if(this.dragstartFunc)
       {
           Event.stopObserving(this.titleLineDiv,"mousedown",this.dragstartFunc);
       }
       if(this.moveObserverFunc)
       {
           Event.stopObserving(document,"mousemove",this.moveObserverFunc);    
       }
        
       if(this.upObserverFunc)
       {
           Event.stopObserving(document,"mouseup",this.upObserverFunc);        
       }
       this.parentElement.removeChild(this.element);
       this.element = null;
   },
   
   isDestroyed : function()
   {
       return (this.element == null);
   }
}