var LiveView = Class.create();
 	LiveView.prototype = {
  		initialize: function(watch_element,out_element,search_link,title_off,pos_element,pos_offset_x,pos_offset_y,effect) {
	   this.watch_element  	= watch_element;
	   this.out_element    	= out_element;
	   this.search_link    	= search_link;
	   this.title_off    	= title_off;
	   this.pos_element  	= pos_element ||'';
	   this.pos_offset_x 	= pos_offset_x;
	   this.pos_offset_y 	= pos_offset_y;
	   this.effect 			= effect || 'none';
	   this.delay        	= 5000;
	   this.isIE       		= false;
	   this.timeoutID    	= '';
   	this.display_off();

   	this.watch_element.insert(this.out_element);
   	if(this.title_off){
    			this.title_off.title='';
    			if(this.title_off){ this.title_off.tip=''; }
   	}
		if (navigator.userAgent.indexOf('Safari') > 0) {
		}  else if (navigator.product == 'Gecko') {
		}  else { this.isIE = true; }
		Event.observe(this.watch_element, 'mouseover' , this.show.bind(this));
		Event.observe(this.watch_element, 'mouseout'  , this.show.bind(this));
		Event.observe(this.watch_element, 'click'     , this.show.bind(this));
//		Event.observe(this.out_element,   'mouseout'  , this.show.bind(this));
 	},

 	show: function(event) {
   	var obj_id = event.element().id;
    	//if(obj_id != this.out_element.id)
    	{
    		switch(event.type) {
     		case 'mouseover':
     			if( ! this.out_element.visible()){
      			this.display_on(event);
     			}
     		break;

     		case 'mouseout':
//      if( this.out_element.visible()){
   		   this.display_off(event);
	//	     	}
   	  	break;
     		case 'click':
   		   this.display_off(event);
   	  	break;
    	}
   }
//   console.warn (obj_id + ' - ' + this.watch_element.id  + ' - ' +event.type);
//   window.status = obj_id + '-' +event.type;
   },

  	display_off: function() {
    	if(this.timeoutID){
     		clearTimeout(this.timeoutID);
     		this.timeoutID = 0;
    	}
    	this.out_element.hide();
//    	console.warn ('off');
   },

   display_on: function(event) {
    	if(this.timeoutID){
     		clearTimeout(this.timeoutID);
     		this.timeoutID = 0;
    	}else{
     		if( ! this.out_element.visible()){
     			this.setxy(event);
     			switch(this.effect){
  					case 'fade':    this.out_element.show(); this.fade(5);  break;
  					case 'move_in': this.out_element.show(); this.move_in(); break;
  					default: this.out_element.show(); break;
     			}
    		} else { this.out_element.show(); }
    	}
   },

  	setxy: function(event){
  		if(this.pos_element){
	   	this.out_element.setStyle({
	      	left: (this.pos_element.positionedOffset().left + this.pos_offset_x)+'px',
	          top: (this.pos_element.positionedOffset().top  + this.pos_offset_y)+'px'
	      });
   	}
// 		console.warn ($('img_wkorb').offsetLeft +' - '+$('img_wkorb').offsetTop+' - '+$('img_wkorb').getWidth()+' - '+$('img_wkorb').getHeight());
	   if(! this.out_element.innerHTML)
	   {
    		new Ajax.Updater(
	      	this.out_element,
	      	this.search_link,{
	        		asynchronous:true,
	        		method: 'get'
     			}
      	)
    	}
  	},

   fade: function(opac) {
   	var passed  = parseInt(opac);
   	var newOpac = parseInt(passed+5);
   	if ( newOpac < 95 ) {
			this.out_element.style.opacity = '.'+newOpac;
			this.out_element.style.filter = "alpha(opacity:"+newOpac+")";
			opacityID = setTimeout(this.fade.bind(this,newOpac),20);
   	} else {
    		this.out_element.style.opacity = '.95';
    		this.out_element.style.filter = "alpha(opacity:90)";
   	}
	  // this.out_element.show();
  	},

   move_in: function() {
   	console.warn (this.out_element);
   	if ( this.out_element.getWidth() < 450 ) {
    		this.out_element.setStyle({
             width: (this.out_element.getWidth()+20)+'px'
             });
//    this.out_element.makeClipping().setStyle({width: this.out_element.getWidth()+'px', height: this.out_element.getWidth()+'px'});
    		opacityID = setTimeout(this.blend.bind(this),20);
   	}
	   this.out_element.show();
  	}
};

