var isO7 = ( window.opera && document.createElement ) != null,
isMozilla = ( !document.all || window.sidebar ) !=null,
isMSIE = ( window.clipboardData != null );

var isBigMoving = isMoving = isLoaded = false,

    oMoveBox,
    oPreviewBox,
    oOriginalImg,
    oOriginalImgBox,
    oPreviewImg,
    oDebugBox,
    previewBoxWidth , previewBoxHeight,
    previewImgWidth , previewImgHeight,
		orgImgWidth, orgImgHeight,
    viewBoxWidth, viewBoxHeight,
    DX , DY, DXY = 25 ,
    moveBoxWidth , moveBoxHeight,
		startBigPosX, startBigPosY, 
    oldBigTop, oldBigLeft,
    scaleBigX, scaleBigY;

	
function getObj( o )
{
 return document.getElementById( o );
}

function setWidth( o , v)
{
return o.style.width =  v + "px";
};

function setHeight( o , v)
{
return o.style.height =  v + "px";
};

function getWidth( o )
{
return parseInt( o.style.width );
};

function getHeight( o )
{
return parseInt( o.style.height );
};

function getLeft( o )
{
return parseInt( o.style.left );
};

function getTop( o )
{
return parseInt( o.style.top );
};

function setTopLeft( o , t , l )
{
    var theStyle = o.style;
    theStyle.top = t + "px";
    theStyle.left = l + "px";
}

function getEventObject( e )
{
var myObject = ( e.target ) ? e.target : e.srcElement;

if (myObject.nodeType == 3 ) 
   myObject = myObject.parentNode;
   
return myObject;
}

function setPageTopLeft( o )
{
        var top = 0,
        left = 0,
        obj = o;

        while ( o.offsetParent )
         {
             left += o.offsetLeft ;
             top += o.offsetTop ;
             o = o.offsetParent ;
        };

        obj.pageTop = top;
        obj.pageLeft = left;
}

function getEventOffsetX( e )
{
    var obj = getEventObject( e );

    if ( !obj.pageLeft )
    	setPageTopLeft( obj );

    return e.clientX - obj.pageLeft + document.body.parentNode.scrollLeft;
}

function getEventOffsetY( e )
{
    var obj = getEventObject( e );

    if ( !obj.pageLeft )
     setPageTopLeft( obj );

    return e.clientY - obj.pageTop + document.body.parentNode.scrollTop;
}

function clearEvent( e )
{
    if ( !e )
       e = window.event;

    if ( !e )
       return false;

    if ( e.cancelBubble != null )
    {
        e.cancelBubble = true;
        e.returnValue = false;
    };

    if ( e.stopPropagation )
       e.stopPropagation();

    if ( e.preventDefault )
       e.preventDefault();

    return false;
}


function initPage(showinpagex,showinpagey)
{

    oMoveBox = getObj( "moveBox" );
    oViewBox = getObj( "viewBox" );
    oPreviewBox = getObj( "previewBox" );
    oOriginalImg = getObj( "originalImg" );
    oPreviewImg = getObj( "previewImg" );
    oOriginalImgBox = getObj( "originalImgBox" );
    
    previewImgWidth = getWidth( oPreviewImg );
    previewImgHeight = getHeight( oPreviewImg );
    
    orgImgWidth = oOriginalImg.width;
    orgImgHeight = oOriginalImg.height;
    
    viewBoxWidth = getWidth ( oViewBox );
    viewBoxHeight = getHeight ( oViewBox );
    
    scaleBigX = orgImgWidth / viewBoxWidth;
    scaleBigY = orgImgHeight / viewBoxHeight;
    
    DX = ( orgImgWidth / previewImgWidth );
    DY = ( orgImgHeight / previewImgHeight );
    
    previewBoxWidth = ( previewImgWidth + DXY ) ;
    previewBoxHeight = ( previewImgHeight + DXY  );
    
    moveBoxWidth = ( previewImgWidth / ( orgImgWidth / viewBoxWidth ) ); 
    moveBoxHeight = ( previewImgHeight / ( orgImgHeight / viewBoxHeight ) );

    if (isMozilla)
    {
        previewBoxWidth -= 4;
        previewBoxHeight -= 4;
    };

    setWidth( oPreviewBox , previewBoxWidth );
    setHeight( oPreviewBox , previewBoxHeight );

    setWidth( oMoveBox, moveBoxWidth );
    setHeight( oMoveBox, moveBoxHeight );

    if (isMSIE)
    	document.body.ondrag = document.body.onselectstart = clearEvent;

    oPreviewBox.onmousedown = initMove;
    oPreviewBox.onmousemove = doMove;
    oPreviewBox.onmouseup = stopMove;
 
    oViewBox.onmousedown = initBigMove;
    oViewBox.onmousemove = doBigMove;
    oViewBox.onmouseup = stopBigMove;
    oViewBox.onmouseout = stopBigMove;
    
    document.body.onmouseup = stopMoves;
    
    isLoaded = true;
 
	if(showinpagex>0) {
		setPosition(showinpagex,showinpagey);
	}
}

function stopMoves()
{
    stopMove();
    stopBigMove();
}

// **************************************** PreviewMove ***********************************

function initMove( evt )
{
    if ( !evt ) 
    	evt = window.event;
      
    isMoving = true;
    oPreviewBox.style.cursor = "move";

    doMove ( evt );
}

function doMove(evt)
{
    if ( !evt ) 
    	evt = window.event;

    if ( !isMoving )
       return true;

    var startPosY = getEventOffsetY( evt ) - moveBoxHeight / 2,
    startPosX = getEventOffsetX( evt ) - moveBoxWidth / 2;

    if ( startPosX < 0)
       startPosX = 0;

    if ( startPosY < 0)
       startPosY = 0;

    var diff = (previewBoxWidth - DXY) - ( startPosX + moveBoxWidth );
    if ( diff < 0 )
       startPosX += diff;

    diff = ( previewBoxHeight - DXY ) - ( startPosY + moveBoxHeight );
    if ( diff < 0 )
       startPosY += diff;

    setTopLeft( oMoveBox , startPosY , startPosX );
    setTopLeft( oOriginalImgBox , -startPosY * DY , -startPosX * DX );

    clearEvent( evt );
    return true;
}

function stopMove( evt )
{
    isMoving = false;
    oPreviewBox.style.cursor = "default";
}

// **************************************** BigMove ***********************************

function initBigMove( evt )
{
    if ( !evt ) 
    	evt = window.event;
        
    oldBigTop = getTop( oOriginalImgBox );
    oldBigLeft = getLeft( oOriginalImgBox );
    
    startBigPosX = getEventOffsetX ( evt );
    startBigPosY = getEventOffsetY ( evt );
    
    isBigMoving = true;
    
    oOriginalImgBox.style.cursor = "move";
    
    return false;
}

function doBigMove( evt )
{
    if ( !evt ) 
    	evt = window.event;

    if ( !isBigMoving )
       return true;
       
    var newLeft = oldBigLeft - scaleBigX * ( getEventOffsetX( evt ) - startBigPosX ), 
    newTop = oldBigTop - scaleBigY * ( getEventOffsetY( evt ) - startBigPosY );
    
    if ( newLeft > 0 ) 
       newLeft = 0;
    else if ( newLeft < viewBoxWidth - orgImgWidth ) 
       newLeft = ( viewBoxWidth - orgImgWidth );
         
    if ( newTop > 0 ) 
       newTop = 0;
    else if ( newTop < viewBoxHeight - orgImgHeight ) 
       newTop = ( viewBoxHeight - orgImgHeight );
    
    setTopLeft ( oOriginalImgBox , newTop , newLeft );
    setTopLeft( oMoveBox, -newTop / DY, -newLeft / DX );

    clearEvent( evt );
    return true;
}

function stopBigMove( evt )
{
    isBigMoving = false;
    oOriginalImgBox.style.cursor = "default";
}


// **************************************** Position setzen für die Suche *****************
function setPosition(x,y)
{
		var xpunkt= moveBoxWidth/2;
		var ypunkt= moveBoxHeight/2;

		//umrechnen auf Vorschau
		x = ( previewImgWidth  * x / oOriginalImg.width  );
	  y = ( previewImgHeight * y / oOriginalImg.height );
	
		var startPosY = (y - ypunkt);
	  var startPosX = (x - xpunkt);

	  if ( startPosX  < 0)
	  	startPosX = startPosX*-1;
	
	  if ( startPosY < 0)
	  	startPosY = startPosY*-1;
	
	  var diff = (previewBoxWidth -DXY) - ( startPosX + xpunkt*2 );
	  if ( diff < 0 )
	  	startPosX += diff;
	
	  diff = ( previewBoxHeight -DXY ) - ( startPosY + ypunkt*2 );
	  if ( diff < 0 )
	  	startPosY += diff;

	  setTopLeft( oMoveBox , startPosY , startPosX );
	  setTopLeft ( oOriginalImgBox , -startPosY * DY , -startPosX * DX );
}