var OwnWindoo = new Class({

	Implements: [Events, Options],

	options: {
		    fxDuration: 700,
			maxOpacity: 1,
			timeIn: 1000,
			timeOut: 5000,
			width:'300px',
			height:'400px',
			ownPosition:false,
			fixed:true,
			offsets: {'x': 16, 'y': 16},
			modal:false,
			draggMe:false,
			resizeMe:false,
			resizeLimit:{y: [300, 600],x:[300,500]},
			effecting:false,
			stayalive:true,
			transitionEffect: Fx.Transitions.Elastic.easeOut,
			startFrom: {'x': 0, 'y': 0},
			moveTo: {'x': 100, 'y': 100},
			title:'',
			text:'',
			desktopUse:false,
			lilWindowShow:'FooterWindows',
			StyleInaktiv:{'background-color':'#ff0000'},
			StyleAktiv:{'background-color':'#fff'},
			imageClose:'images/windoo/close.gif',
			imageResize:'images/windoo/resize.gif',
			ajaxfile:'tooltext.php',
			ajaxoption:'',
			limitContainer:false,
			className: 'myHtmlAreaWin',
			onAjaxComplete: Class.empty


    },

	initialize: function(element, options){
	    this.setOptions(options);

		this.element = $(element);

		this.document = (element.length) ? element[0].ownerDocument : document;

		this.WindooMain = new Element('div').setProperties({'id':this.element.id+'_main','class':this.options.className+'-WinMain'}).setStyles({'position': 'absolute','top': '0px','left': '0px','width': this.options.width +'px','height': this.options.height+'px','visibility':'hidden'});

        if(Browser.Engine.trident) {
				try {
				   this.document.execCommand("BackgroundImageCache",false, true);
				}
				catch (e) { }
		}



  	    var WindooCloseImg='';
  	    if(this.options.stayalive){
		//   WindooCloseImg='<img id="'+this.element.id+'_close'+'" style="cursor: pointer;" src="'+this.options.imageClose+'" border="0" align="absbottom" />';
		   WindooCloseImg='<a href="javascript:;" id="'+this.element.id+'_close'+'" style="cursor: pointer; color:#fff;background-color: #C02834; border: 1px solid #000000; padding:1px 3px;">X</a>';

		}

		if(this.options.resizeMe){
		 var WindooResizeImg='<div id="'+this.element.id+'_resize" class="'+this.options.className+'-WinResize"></div>';
		  //this.WindooResizeImg=new Element('div').setProperties({'id':this.element.id+'_resize','class':this.options.className+'-WinResize'})
		}else{
		WindooResizeImg='';
		}

		var WindooLilWindow='';

		if(this.options.desktopUse){
		   WindooLilWindow='<div class="'+this.options.className+'-WinMakeLil'+'" id="'+this.element.id+'_lilknob'+'"></div>';
		   this.lilWindowShow = $(this.options.lilWindowShow);
		}


       // var WindooHead ='<div id="'+this.element.id+'_dragToolArea'+'" class="'+this.options.className+'-WinDragToolArea'+'"><div class="'+this.options.className+'-WinheadLeft"></div><div id="'+this.element.id+'_dragTool" class="'+this.options.className+'-WinDragTool">'+this.options.title+'</div><div class="'+this.options.className+'-WinheadRight">'+WindooCloseImg+'</div></div>';
  	    var WindooHead ='<div id="'+this.element.id+'_dragToolArea'+'" class="'+this.options.className+'-WinDragToolArea'+'"><div class="'+this.options.className+'-WinheadLeft'+'"></div><div id="'+this.element.id+'_dragTool'+'" class="'+this.options.className+'-WinDragTool'+'">'+this.options.title+'</div>'+WindooLilWindow+'<div class="'+this.options.className+'-WinClose'+'">'+WindooCloseImg+'</div><div class="'+this.options.className+'-WinheadRight'+'"></div></div>';
  	    var WindooBody='<div id="'+this.element.id+'_toolBody" class="'+this.options.className+'-WinBody'+'"><div id="'+this.element.id+'_ajaxcontent'+'" class="'+this.options.className+'-WinContent'+'"></div></div>';
  		var WindooFooter ='<div class="'+this.options.className+'-WinBotLeft"></div><div id="'+this.element.id+'_bot" class="'+this.options.className+'-WinImgBotLeft"></div><div class="'+this.options.className+'-WinImgBotRight"></div>'+WindooResizeImg+'<div class="'+this.options.className+'-WinBotRight"></div>';

  		this.WindooMain.set('html',WindooHead+WindooBody+WindooFooter);

  		this.WindooMain.inject(document.body);

  		if(this.options.modal==true){
			if(Browser.Engine.trident) {
				this.iframeBG= new Element("iframe").setProperties({'id':this.element.id+'_iframeBg','class':this.options.className+'-DivBg'}).setStyles({'height':Window.getScrollHeight()+'px','opacity':0.1}).inject(this.WindooMain,'before');
			}
			this.divBG= new Element('div').setProperties({'id':this.element.id+'_divBg','class':this.options.className+'-DivBg'}).setStyles({'height':Window.getScrollHeight()+'px','opacity':0.7}).inject(this.WindooMain,'before');
		}


      //DEFINE Aktuelles Objekt
      this.BodyInstance=$(this.element.id+'_toolBody');
      this.AjaxInstance=$(this.element.id+'_ajaxcontent');
      this.FooterInstance=$(this.element.id+'_bot');
      this.DragerInstance=$(this.element.id+'_dragToolArea');

      if(this.options.desktopUse){

   	     this.LilHandlerInstance=$(this.element.id+'_lilknob');

			this.LilHandlerInstance.addEvent('click',function(){
		             this.WindooMain.setStyle('opacity','0');
		             this.LilWindow.setStyles(this.options.StyleInaktiv);
		    }.bind(this));

	  }

	    if(this.options.resizeMe){
           this.ResizerInstance=$(this.element.id+'_resize');

		   this.ResizerInstance.addEvent('click',function(){

			   this.cloneInstance=new Element('div').setProperties({'id':this.element.id+'_CloneResize','class':this.options.className+'-resizeDiv'}).setStyles($(this.element.id+'_main').getCoordinates())
                     			            .setStyles({'opacity':'0.5'})
                                            .inject(document.body);
               this.cloneInstance.set('html','<br />Resize Me');
               this.WindooMain.setStyles({'opacity':'0.8'});

                this.cloneInstance.makeResizable({
		        	  limit: this.options.resizeLimit,
		         	  snap: 2,
		          	  onStart:function(){
                      }.bind(this),
		          	  onComplete:function(){
                       		saveHeight=this.cloneInstance.getCoordinates().height.toInt();
				            saveWidth=this.cloneInstance.getCoordinates().width.toInt();
				            saveBotHeight=this.FooterInstance.getCoordinates().height.toInt();
				            saveTopHeight=this.DragerInstance.getCoordinates().height.toInt();

				            this.WindooMain.setStyles({'width':saveWidth,'height':saveHeight}).setStyles({'position':'absolute','opacity':'1'});

				            this.BodyInstance.setStyles({
				               	   'height':(saveHeight-saveTopHeight)+'px'
				            });
				            this.AjaxInstance.setStyles({
				                  'height':(saveHeight-(saveBotHeight+saveTopHeight+10))+'px',
				                  'width':(saveWidth-16)+'px'
				            });

		          	      this.cloneInstance.destroy();

		          	  }.bind(this)
		         });

            }.bind(this));

		}



		if(this.options.draggMe){

	   this.DraggerHandlerInstance=$(this.element.id+'_dragTool');


	     this.WindooMain.makeDraggable({
		       handle: this.DraggerHandlerInstance,
		       container:this.options.limitContainer,
		       onBeforeStart:function(){
                   this.lilWindowInit();
		      }.bind(this),
		      onComplete:function(){
		        // this.WindooMain.setStyle('zIndex',100);
		      }
	      });
		}

        if(this.options.stayalive){

	     this.CloserHandlerInstance=$(this.element.id+'_close');

			this.CloserHandlerInstance.addEvent('click',function(){
				this.end();
				if(this.options.desktopUse){
				     this.LilWindow.destroy();
				}

			}.bind(this));
		}
		if(!this.options.stayalive && this.options.effecting==false){
            var end = this.endAlive.bind(this);
		    this.element.addEvent('mouseleave', end);
		}

         this.myEffect = new Fx.Morph(this.WindooMain, {duration: 1000, transition: this.options.transitionEffect});

        this.BodyInstance.setStyles({'height':(this.options.height-(this.FooterInstance.getCoordinates().height*2))+'px','width':'auto'});



	 if (this.options.initialize) this.options.initialize.call(this);
	},

    end: function(event){

	    this.WindooMain.set('html','');
		$clear(this.timer);

		this.timer = this.disappear.delay(500, this);
	},
	endAlive: function(event){

		$clear(this.timer);
		this.timer = this.disappear.delay(500, this);


	},
	lilWindowInit:function(){

	  // myZindex=this.WindooMain.getStyle('zIndex');
	 if($$('div.'+this.options.className+'-WinMain').length>1){
        		$$('div.'+this.options.className+'-WinMain').each(function(el){
            			 el.setStyles({'zIndex':'100'});
            	});
		   }
        if(this.options.desktopUse){
		  if($$('div.'+this.options.className+'-WinLil').length>1){
			   $$('div.'+this.options.className+'-WinLil').each(function(el){
					  el.setStyles(this.options.StyleInaktiv);
			   }.bind(this));
		   }
         this.LilWindow.setStyles(this.options.StyleAktiv);
		 }
 	     this.WindooMain.setStyles({'zIndex':'101','opacity':'1'});

	},
	createLilWindow:function(){

      this.LilWindow=new Element('div').setProperties({'id':this.element.id+'_lil','class':this.options.className+'-WinLil'}).set('html',this.options.title);
      this.LilWindow.inject(this.lilWindowShow);

       this.lilWindowInit();

      this.LilWindow.addEvent('click',function(){

          this.lilWindowInit();

        }.bind(this));
    },
    position: function(element){


		 var newleft='';
		 var pos = element.getPosition();
	     if((this.options.width.toInt()+pos.x.toInt()) > Window.getWidth()){
	     	newleft=(Window.getWidth()-this.options.width-20);
	     }else{
	     	newleft=pos.x;
	     }

		 this.WindooMain.setStyles({
				'left': newleft + this.options.offsets.x+'px',
				'top': pos.y + this.options.offsets.y+'px'
		 });
	},
	ownposition: function(){
	     var newleft='';

	     if((this.options.width.toInt()+this.options.offsets.x.toInt()) > Window.getWidth()){
	     	newleft=(Window.getWidth()-this.options.width-20);
	     }else{
	     	newleft=this.options.offsets.x;
	     }

		 this.WindooMain.setStyles({
				'position':'absolute',
				'left':newleft+'px',
				'top':this.options.offsets.y+'px'
		 });
	},
    getEffect: function(){

		 var newleft='';
	     if((this.options.width.toInt()+this.options.moveTo.x.toInt()) > Window.getWidth()){
	     	newleft=(Window.getWidth()-this.options.width-20);
	     }else{
	     	newleft=this.options.moveTo.x;
	     }

		//mitte 200px   breite 400px=  200=(400/2)+2
		var tempLeft=newleft+(this.options.width/2);
	    var tempTop=this.options.moveTo.y+(this.options.height/2);

		this.myEffect.start({
	   'height':[0,this.options.height],
	   'width':[0,this.options.width],
	   'top':[tempTop,this.options.moveTo.y],
	   'left':[tempLeft,newleft],
	   'opacity':1
	   }).chain(function(){
	    saveBotHeight=this.FooterInstance.getCoordinates().height.toInt();
        saveTopHeight=this.DragerInstance.getCoordinates().height.toInt();


        this.BodyInstance.setStyles({
           	   'height':(this.options.height-saveTopHeight)+'px'
        });
        this.AjaxInstance.setStyles({
              'height':(this.options.height-(saveBotHeight+saveTopHeight+10))+'px',
              'width':(this.options.width-16)+'px'
        });



  // this.Schatten = new Element('div').setProperties({'id':this.element.id+'_schatten','class':this.options.className+'-Schatten'}).setStyles({'position': 'absolute','top': (this.options.moveTo.y+10)+'px','left': (newleft+5)+'px','width':this.options.width.toInt() +'px','height': this.options.height.toInt()+'px',}).inject(this.WindooMain,'after');

         this.show();


	   }.bind(this));


   	 if(!this.options.stayalive){
   	  		  this.endAlive(this);
	 }

    },

	show: function(){

		if(this.options.takeajax){
			this.ajaxload();
		}else{
			this.AjaxInstance.set('html', this.options.text);
		}

        if(!this.options.effecting){
			this.appear();
		}else{
		  if(this.options.desktopUse){this.createLilWindow();}
		  }
	},

	appear: function(){

	  this.WindooMain.setStyle('visibility','visible');


	        saveHeight=this.WindooMain.getCoordinates().height.toInt();
            saveWidth=this.WindooMain.getCoordinates().width.toInt();
            saveBotHeight=this.FooterInstance.getCoordinates().height.toInt();
            saveTopHeight=this.DragerInstance.getCoordinates().height.toInt();

            this.BodyInstance.setStyles({
               	   'height':(saveHeight-saveTopHeight-10)+'px'
            });


			    this.AjaxInstance.setStyles({
				   'height':(saveHeight-(saveBotHeight+saveTopHeight+10))+'px',
				   'width':(saveWidth-16)+'px'
				});


	  if(this.options.desktopUse){this.createLilWindow();}
	},



    ajaxload: function(){

	 	new Request.HTML({url:this.options.ajaxfile, method:'post',data:this.options.ajaxoption,update:this.AjaxInstance,evalScripts:true,
			onRequest:function(){
				this.AjaxInstance.set('html','<br /><table align="center" style="table-layout:fixed;background-color:#fff; margin-left: auto; margin-right: auto; border:1px solid #333; height:100px; width:100px;"><tr><td align="center"><img src="images/loading.gif" border="0" title="loading" /></td></tr></table>');
			}.bind(this),
			onFailure:function(){
				this.AjaxInstance.set('html','Content konnte nicht geladen werden');
			}.bind(this),
			onComplete:function(){

			this.fireEvent('onAjaxComplete',this.options.onAjaxComplete);

			}.bind(this)}).send();
		return this;
		 },


    showMe:function(){


        if(!this.options.effecting){


   			if (!this.options.fixed && !this.options.ownPosition) {
			    this.position(this.element);
   			}
	   		if(!this.options.fixed && this.options.ownPosition){
	   		 	this.ownposition();
	   		}
	    	if(this.options.fixed && !this.options.ownPosition){
	    	   this.position(this.element);
	    	}

           this.show();
     }

        if(this.options.effecting){
        this.timer = $clear(this.timer);
        this.timer = this.getEffect.delay(this.options.timeIn, this);
        }
    },
	disappear: function(){

       if(this.options.modal==true){
                this.divBG.destroy();
					if(Browser.Engine.trident) {
						this.iframeBG.destroy();
					}
           }
       this.WindooMain.destroy();

	}

});