// JavaScript Document




bildslider = Class.create({
    initialize: function(containerid){
		this.containerid = containerid;
		this.container 	= $(this.containerid);
		
/*		<div style="" id="bildmovebox" onmousedown="return false;" oncontextmenu="return false;"><div id="bildmoveboxinner" style="width: 1024px; height: 1178px; display: block; background-image: url(&quot;http://web746.webbox442.server-home.org/wpcms284/wp-content/uploads/G-LAB_Field_front.png&quot;);" onmousedown="return false;" oncontextmenu="return false;">&nbsp;</div></div>*/

		
		//this.updatecontent('http://web746.webbox442.server-home.org/wpcms284/wp-content/uploads/G-LAB_Field_front.png', 1024, 1178);
		
		this.breite 	= this.container.getWidth();
		this.hoehe		= this.container.getHeight();
		this.mx = ((Winwidth-this.breite) / 2);
		this.my = ((Winheight-this.hoehe) / 2);
		//alert(Winheight);
		this.x_axis = 0 ;
		this.y_axis = 0 ;
		this.x_axis_up ;
		this.y_axis_up ;
		this.x_axis_down ;
		this.y_axis_down ;
		this.c=0;
		this.t;
		this.timer_is_on=0;
		this.first_x;
		this.versatz_x ;
		this.first_y;
		this.versatz_y ;
		this.alertTimerId = 0;
		this.last_x;
		this.mouse_is_down = false;
		this.curr_x_axis;
		this.curr_y_axis;
		
		this.animation;
		
		
		this.test = 'hi';
	
		
		this.container.setStyle({
 
		  left: this.mx+'px',
		  top: this.my+'px'
		});
		
		
		var self = this;
		
	
		//Event.observe($('zoombutton'), 'click', this.updatecontent.bind(this));
		
		//$('zoombutton').observe ('click', this.updatecontent.bindAsEventListener(this, yourCustomObject));
		
		Event.observe(this.container, 'mousedown', this.initDrag.bind(this));
			
		
		var instantz = this;
		
		this.mytimer = setInterval(function() { instantz.timedCount(); }, 40);
		
	},
	
	/*updatecontent: function(url, w, h) {
		var bildoutput = '<div id="bildmoveboxinner" style="width:' + w +'px; height:' + h + 'px; display:block; background-image:url(' + url + ');" onmousedown="return false;" oncontextmenu="return false;">&nbsp;</div>';
	
		this.container.update(bildoutput);	
		
		this.initialize(this.containerid);
		
	},*/
    updateDrag: function(event) {
		//alert(1);
		this.c++;
		
        /*
		var x = Event.pointerX(event)-10;
        var y = Event.pointerY(event)-10;*/
        
		
		var this_x_axis = Event.pointerX(event)	- this.versatz_x;
		var this_y_axis = Event.pointerY(event)	- this.versatz_y;
	
		var this_x = Position.page(this.container)[0];
		var this_y = Position.page(this.container)[1];
		
		this.x_axis = this_x_axis - this_x ;
		this.y_axis = this_y_axis - this_y ;
		
		
		this.curr_x_axis = Event.pointerX(event)	- this.versatz_x;
		this.curr_y_axis = Event.pointerY(event)	- this.versatz_y;
		
	
		
	
        
		
		
    },
	re_pos: function() {
		//alert(1);
		
		
		var this_x = Position.page(this.container)[0]; //300
		var this_y = Position.page(this.container)[1];
		
		var old_x_axis = this.curr_x_axis;
		var old_y_axis = this.curr_y_axis;
			
			//300-250
		var diff_x =  this_x - old_x_axis;	
		
		
		
		var new_x = this_x + Math.round(this.x_axis);
		
		this.x_axis = (this.x_axis/1.15);
		
		this.container.style.left = new_x+'px';
		
		
		
		
	},
	re_pos_ani: function() {
		
		var this_x = Position.page(this.container)[0]; //300
		var this_y = Position.page(this.container)[1];
		
		var old_x_axis = this.curr_x_axis;
		var old_y_axis = this.curr_y_axis;
			
			//300-250
		var diff_x = old_x_axis - this_x;	
		diff_x = (diff_x/1.2);
			
		
		
		
		
		
		var x = this_x + Math.round(this.x_axis);
		//$('output').update('dragging '+diff_x );
		this.x_axis = (this.x_axis/1.2);
		
		this.container.style.left = x+'px';
	},
    stopDrag: function(event) {
		//$('output2').update('stopping dragging '+this.c  );
		//new Effect.Move(this.container, { x: this.x_axis, y: this.y_axis, mode: 'relative' ,duration:0.5});
        // console.log("stopping drag");
    	Event.stopObserving(document, 'mousemove');
    	Event.stopObserving(document, 'mouseup');
		//alert(2);
    },
	
	
    initDrag: function(event ) {
		
		//$('output2').update('dwn' );
		this.c=0;
		
		
		this.x_axis_down = Event.pointerX(event);
		this.y_axis_down = Event.pointerY(event);
			
		this.first_x = Position.page(this.container)[0];
		//this.first_x = Position.cumulativeOffset(this.container)[0];
		this.first_y = Position.page(this.container)[1];
		
		this.versatz_x = this.x_axis_down - this.first_x;
		this.versatz_y = this.y_axis_down - this.first_y;
		
		
		
		//alert(this.versatz_x);
		this.mouse_is_down = true;
		//$('output2').update(this.mouse_is_down );
		Event.observe(document, 'mousemove', this.updateDrag.bind(this));
		Event.observe(document, 'mouseup', this.stopDrag.bind(this));
		Event.observe(this.container, 'mouseup', this.stopDrag.bind(this));
		
        
    }, 

	stopCount: function( ){
		clearTimeout(this.t);
		this.timer_is_on=0;
	},
	doTimer: function(){
	
		if (!this.timer_is_on)  {
		  this.timer_is_on=1;
		  this.timedCount();
		}
	  
	
	},
	timedCount: function (){
	
		this.c = this.c+1;
		
		
			
		var aktuell_x = Position.page(this.container)[0];
		var aktuell_y = Position.page(this.container)[1];	
			
		
		
		
		var	mintop 	= (this.hoehe-900) * -1;
		var	maxtop 	= Winheight-600;
		
		var	minleft	= (this.breite-1000) * -1;
		var	maxleft	= Winwidth-1000;
	
	
			
			this.x_axis = (this.x_axis/1.2);
			
			
			this.y_axis = (this.y_axis/1.2);
		
		
			
			
	//alert(aktuell_x);
		
		if (isNaN(this.x_axis)) this.x_axis = 0;
		if (isNaN(this.y_axis)) this.y_axis = 0;
		
		var x = aktuell_x + Math.round(this.x_axis);
		var y = aktuell_y + Math.round(this.y_axis);
		
		//$('output').update(this.c + ' '+this.y_axis);	
			
		//alert(x);
		
		
			
			if ( y < mintop) {
				y = mintop;
			} else if ( y > maxtop) {
				y = maxtop;
			} 
			
			
			if ( x < minleft) {
				x = minleft;
			} else if ( x > maxleft) {
				x = maxleft;
			} 
			
			//alert(x);
			//x = aktuell_x+ x_axis;
			
			this.container.setStyle({
	 
			  left: x+'px',
			  top: y+'px'
			});
		
		
		
	
		if (this.x_axis < 1 && this.x_axis > -1 && this.y_axis < 1 && this.y_axis > -1 ) {
			this.x_axis = 0;
			this.y_axis = 0;
			this.c = 0;
			
		}
		

	
	}
});





document.observe('dom:loaded', function () {
	
	/*if ($('bildmovebox') !== null) 		$('bildmovebox').hide();
	if ($('hidezoombutton') !== null) 	$('hidezoombutton').hide();
	if ($('zoombutton') !== null) 		$('zoombutton').show();*/
	//Event.observe('zoombutton', 'click', show_zoomimage.curry(url, h, w));
										 
	//if ($('bildmovebox') !== null) var mabildslider = new bildslider('bildmovebox');										 
	
	if ($('bildmovebox') !== null) 	var mabildslider = new bildslider('bildmovebox');
	

});
  


function show_zoomimage(url, w, h) {
	
	/*$('contentinner').hide();
	$('bildmovebox').show();
	$('hidezoombutton').show();
	$('zoombutton').hide();*/
	//var mabildslide = bildslider('bildmovebox');
	
	//mabildslider.updatecontent(url, w, h);
	
	
	//$('bildmovebox').update(url + ' ' + w + ' ' + h);
	
	
		
		//alert(mabildslide);
		/*if ($('bildmovebox') !== null) {
			if(mabildslide != "undefined") {
				delete mabildslider;
			}
		}
		*/
		//mabildslider.remove();
		//alert(mabildslide);
		
		//mabildslide.initialize('bildmovebox', url, w, h);
	
	//mabildslider.initialize('bildmovebox');
	// mabildslider = new bildslider('bildmovebox');	

}


function hide_zoomimage() {
	
	/*$('bildmovebox').update('&nbsp;');
	$('hidezoombutton').hide();
	$('zoombutton').show();
	$('bildmovebox').hide();
	$('contentinner').show();*/

}









