
var DragDropInstance = null;


function doDrag(e)
{
	if (!e) e = window.event;
	
	if (DragDropInstance)
	{
		DragDropInstance.doDrag(e);
	}
}

function stopDrag(e)
{
	if (!e) e = window.event;
	if (DragDropInstance)
	{
		DragDropInstance.stopDrag(e);
	}
}



function sliderframe() {
var slide_container = '';
var myInstanceName = '';

var DragDropObj = null;
var dragX = 0;

var breiteViewframe;
var breiteSliding;
var breiteSlider;
var scontent;
var xcontent
var me;

this.init = function(DivName,InstanceName) {
	slide_container = DivName;
	myInstanceName = InstanceName;
	me = this;
	
	var mcontentdiv = document.getElementById(slide_container);
	var mcontent = mcontentdiv.getElementsByTagName('DIV')[0];
	
	
	if (mcontent.clientWidth > 0)
	{
		breiteViewframe = mcontent.clientWidth;
	}
	else
	{
		breiteViewframe = 584; // Dirty!!!
	}
	
	mcontent.style.overflow = 'hidden';

	var bgleft = document.createElement('DIV');
	mcontentdiv.appendChild(bgleft);
	bgleft.className = 'sliderborderleft';
	
	var bgright = document.createElement('DIV');
	mcontentdiv.appendChild(bgright);
	bgright.className = 'sliderborderright';


	var buttonleft = document.createElement('DIV');
	mcontentdiv.appendChild(buttonleft);
	buttonleft.className = 'sliderbuttonleft';
	buttonleft.onclick = function clickleft(){
		//window.setTimeout(myInstanceName+'.moveclick(360)',0);
		me.moveclick(360);
	};
	
	var buttonright = document.createElement('DIV');
	mcontentdiv.appendChild(buttonright);
	buttonright.className = 'sliderbuttonright';
	buttonright.onclick = function clickright(){
		//window.setTimeout(myInstanceName+'.moveclick(-360)',0);
		me.moveclick(-360);
	};


	var slidecontainer = document.createElement('DIV');
	mcontentdiv.appendChild(slidecontainer);
	slidecontainer.className = 'slidecontainer';
	slidecontainer.id = slide_container+'barcontainer';
	slidecontainer.innerHTML = '<div id="'+slide_container+'bar"></div>';


	breiteSliding = document.getElementById(slide_container+'barcontainer').clientWidth;
	breiteSlider = document.getElementById(slide_container+'bar').clientWidth;


	var liste = mcontent.getElementsByTagName('*');
	for(var i=0; i<liste.length; i++)
	{
		if (liste[i].className == 'slidercontent')
		{
			scontent = liste[i];
		}
	}

	xcontent = document.getElementById(slide_container+'bar');
	xcontent.onselectstart = function() { return false; };
	xcontent.unselectable = "on";
	xcontent.style.MozUserSelect = "none";
	xcontent.style.cursor = "default";

	xcontent.onmousedown = this.startDrag;

	document.onmousemove = doDrag;

	document.onmouseup = stopDrag;

	
//<table id="bartable" cellspacing=0 cellpadding=0 border=0 style="position:relative;display:none;width:950px;margin-top:5px;">
//<tr>
//<td style="text-align:center;width:50px;">
//<img src="/img/setsbuttonleft.png" onclick="moveclick(360)" border="0">
//</td>
//<td style="text-align:left;width:440px;">
//<div id="setsbar" class="setsbar">
//	<div id="setbar1"></div>
//</div>
//</td>
//<td style="text-align:center;width:50px;">
//<img src="/img/setsbuttonright.png" onclick="moveclick(-360)" border="0">
//</td>
//</tr>
//</table>

//document.getElementById('bartable').style.display = 'block';

}




this.startDrag = function(e)
{
	if (!e) e = window.event;
	if ((!DragDropObj) && (!DragDropInstance))
	{
		DragDropInstance = me;
		x = e.clientX;
		DragDropObj = xcontent;
		dragX = x - DragDropObj.offsetLeft;

		breiteSliding = document.getElementById(slide_container+'barcontainer').clientWidth;
		breiteSlider = document.getElementById(slide_container+'bar').clientWidth;
	}
}

this.doDrag = function(e)
{
	if (!e) e = window.event;
	if (DragDropObj)
	{
		x = e.clientX - dragX;
		if (x < 0) x = 0;
		if (x > (breiteSliding - breiteSlider)) x = (breiteSliding - breiteSlider);
		
		/*alert(breiteViewframe+'px'); */
		lf = parseInt(x * (scontent.clientWidth-breiteViewframe) / (breiteSliding - breiteSlider));
		scontent.style.left = '-'+lf+'px';

		DragDropObj.style.left = x+'px';
	}
}

this.stopDrag = function(e)
{
	if (!e) e = window.event;
	if (DragDropObj)
	{
		DragDropObj = null;
		DragDropInstance = null;
	}
}




function movecontent(richtung)
{
	if (scontent.style.left == '')
	{
		scontent.style.left = '0px';
	}

	x = parseInt(scontent.style.left) + richtung;
	if (x < (scontent.clientWidth-breiteViewframe)*-1) x = (scontent.clientWidth-breiteViewframe) * -1;
	if (x > 0) x = 0;
	scontent.style.left = x+'px';


	var DragDropObj = document.getElementById(slide_container+'bar');
	lf = parseInt(x * (breiteSliding - breiteSlider) / (scontent.clientWidth-breiteViewframe)) * -1;
	DragDropObj.style.left = lf+'px';
}


this.moveclick = function(richtung)
{
	var wert = richtung;
	breiteSliding = document.getElementById(slide_container+'barcontainer').clientWidth;
	breiteSlider = document.getElementById(slide_container+'bar').clientWidth;

	
	if (richtung > 0)
	{
			var wert = Math.round(wert / 2);
			if (wert > 80)
			{
				wert = 80;
				movecontent(wert);
				wert = richtung - wert;
			}
			else
			{
				movecontent(wert);
				wert = richtung - wert;
			}
			if (wert > 1) window.setTimeout(myInstanceName+'.moveclick('+wert+')', 200);
	}
	else
	{
			var wert = Math.round(wert / 2);
			if (wert < -80)
			{
				wert = -80;
				movecontent(wert);
				wert = richtung - wert;
			}
			else
			{
				movecontent(wert);
				wert = richtung - wert;
			}
			if (wert < -1) window.setTimeout(myInstanceName+'.moveclick('+wert+')', 200);
	}
}


function dummy2() {
var myBigDiv = document.getElementById('showBigDiv');

var liste = document.getElementsByClassName('passendproduktbild');

for(var i=0; i<liste.length; i++ )
{
	var myObj = liste[i];
		myObj.onmouseover = function over(e){
		if (!e) e = window.event;
		var dx = dy = 0;
		if (e.x)
			{
				dx = e.x;
				dy = e.y;
			kx = 0;
			ky = 0;
			}
		else
			{
				if (e.layerX)
				{
					dx = e.layerX;
					dy = e.layerY;
					kx = scontent.style.left;
					ky = scontent.style.top;
				}
			}		
		if (kx == '') kx = 0;
		if (ky == '') ky = 0;
		
		myBigDiv.innerHTML = '<div style="position:absolute;right:5px;top:5px;"><img src="/bilder/marken/'+this.getAttribute('mylogosrc')+'"></div><img src="/bilder/Sets/'+this.getAttribute('mybildsrc')+'">';

		myBigDiv.style.left = (dx+parseInt(kx)+50)+'px';
		myBigDiv.style.top = (dy+parseInt(ky)-80)+'px';
		myBigDiv.style.display = 'block';
	}

	myObj.onmousemove = function over(e){
		if (!e) e = window.event;
		var dx = dy = 0;
		if (e.x)
			{
				dx = e.x;
				dy = e.y;
			kx = 0;
			ky = 0;
			}
		else
			{
				if (e.layerX)
				{
					dx = e.layerX;
					dy = e.layerY;
			kx = scontent.style.left;
			ky = scontent.style.top;
				}
			}
		if (kx == '') kx = 0;
		if (ky == '') ky = 0;

		myBigDiv.style.left = (dx+parseInt(kx)+50)+'px';
		myBigDiv.style.top = (dy+parseInt(ky)-80)+'px';

	}

	myObj.onmouseout = function over(e){
		if (!e) e = window.event;
		myBigDiv.style.display = 'none';
	}
	
}

}


} // class

