﻿// JScript-Datei

function zoomToolbar()
{
    this.miniWindowHeight = 100;
    this.miniWindowWidth  = 100;
    this.parentNode = null;
    this.clippingBorder = document.createElement("div");
    this.miniDiv = document.createElement("div");
    this.miniShow = true;
    this.infoShow = true;
    this.thumbnailHandler = "../handler/thumbnail.ashx";
    
	this.slider_TPL = {
			'b_watch': false,
            'n_minValue' : 0,
            'n_maxValue' : 9,
            'n_value' : 0,
            'n_step' : 1
		};
	
	this.slider_INIT = {
			'b_vertical' : true,
            's_name': 'zoomSlider',
			'n_controlHeight': 133,
			'n_controlWidth': 15,
			'n_pathTop' : 19,
			'n_pathLeft' : 0,
			'n_sliderWidth': 14,
			'n_sliderHeight': 6,
			'n_pathLength' : 90,
			's_imgControl': '../media/images/slider/background_zoom_verti.gif',
			's_imgSlider': '../media/images/slider/selector_zoom_verti.gif'
		};
}

zoomToolbar.prototype.setMiniWindow = function()
{		
	this.miniDiv.style.height = this.miniWindowHeight + "px";
	this.miniDiv.style.width = this.miniWindowWidth + "px";
	this.miniDiv.style.position = "absolute";
	this.miniDiv.id="miniWindow";
	this.miniDiv.style.zIndex = "15";
    this.miniDiv.style.backgroundImage = "url('"+this.thumbnailHandler+"?image="+zoom.file[zoom.light]+"')";
	this.miniDiv.style.border = "1px solid #FFFFFF";
	this.miniDiv.style.left = (zoom.containerWidth - this.miniWindowWidth)  +"px";
	this.miniDiv.style.top = (zoom.containerHeight - this.miniWindowHeight)  +"px";


	var headliner = document.createElement("div");
	headliner.style.height = "10px";
	headliner.style.position = "relative";
	headliner.style.width = this.miniWindowWidth + 2+ "px";	
	headliner.style.top = "-10px";
	headliner.style.left = "-1px";
	headliner.style.background = "#FFFFFF";
	
	this.showHideIcon = new Element('img', {'id':'showHideIcon','style':'margin-top:2px; margin-left:3px;', 'src': '../media/images/zoom/hide.gif'});
	Event.observe(headliner,"click",zoomTB.showHide);
	Event.observe(headliner,"mouseover",function(event){zoomTB.showHideIcon.parentNode.style.cursor = "pointer";});
	
	headliner.appendChild(this.showHideIcon);
	this.miniDiv.appendChild(headliner);
	
	this.clippingBorder.style.position = "absolute";
	this.clippingBorder.style.border = "1px solid #bb0404"; 
	this.miniDiv.appendChild(this.clippingBorder);
	
	Event.observe(headliner,"mouseover",function(event){zoomTB.miniDiv.style.cursor = "pointer";});
	Event.observe(this.miniDiv, "click", zoomTB.moveToCoord);
	
	this.parentNode.appendChild(this.miniDiv);
	
	this.setClippingBorder();
}

zoomToolbar.prototype.setInfoWindow = function()
{
    $("manuscriptVerseInfo").style.position = "absolute";
    $("manuscriptVerseInfo").style.zIndex = "15";
    $("manuscriptVerseInfo").style.top = (zoom.containerHeight - $("manuscriptVerseInfo").getHeight()) + "px" ;

	var headliner = document.createElement("div");
	headliner.style.height = "10px";
	headliner.style.position = "relative";
	headliner.style.background = "#FFFFFF";
	headliner.style.margin = "0px 0px 3px 0px";
	headliner.style.paddingBottom = "2px";
	headliner.style.borderBottom = "1px solid black";
	
	
	this.showHideIcon2 = new Element('img', {'id':'showHideIcon2','style':'position:absolute; right:0px; top:2px;', 'src': '../media/images/zoom/hide.gif'});
	Event.observe(headliner,"click",zoomTB.showHideInfo);
	Event.observe(headliner,"mouseover",function(event){zoomTB.showHideIcon2.parentNode.style.cursor = "pointer";});
	
	headliner.appendChild(this.showHideIcon2);
	$("manuscriptVerseInfo").insertBefore(headliner,$("manuscriptVerseInfo").firstChild);

   
    
    
}

zoomToolbar.prototype.showHide = function(event)
{
    if(zoomTB.miniShow)
    {
        new Effect.Move(zoomTB.miniDiv, { x: 0, y: 100, mode: 'relative', duration: 1 });
        zoomTB.showHideIcon.src = "../media/images/zoom/show.gif";
        zoomTB.miniShow = false;
    }
    else
    {
        new Effect.Move(zoomTB.miniDiv, { x: 0, y: -100, mode: 'relative', duration: 1 });
        zoomTB.showHideIcon.src = "../media/images/zoom/hide.gif";
        zoomTB.miniShow = true;
    }
    
}

zoomToolbar.prototype.showHideInfo = function(event)
{
    if(zoomTB.infoShow)
    {
        new Effect.Move($("manuscriptVerseInfo"), { x: 0, y: $("manuscriptVerseInfo").getHeight()-10, mode: 'relative', duration: 0.8 });
        zoomTB.showHideIcon2.src = "../media/images/zoom/show.gif";
        zoomTB.infoShow = false;
    }
    else
    {
        new Effect.Move($("manuscriptVerseInfo"), { x: 0, y: -$("manuscriptVerseInfo").getHeight()+10, mode: 'relative', duration: 0.8 });
        zoomTB.showHideIcon2.src = "../media/images/zoom/hide.gif";
        zoomTB.infoShow = true;
    }
    
}

zoomToolbar.prototype.moveToCoord = function(event)
{
    
    if(!zoom.move && !zoom.loadNewImgMap && Event.element(event).id != "showHideIcon" && Event.element(event) != zoomTB.showHideIcon.parentNode)
    {
	    xClick = Event.pointerX(event) - zoom.imgContainer.offsetLeft-10 - zoomTB.miniDiv.offsetLeft;		
	    yClick = Event.pointerY(event) - zoom.imgContainer.offsetTop-10 - zoomTB.miniDiv.offsetTop;
    		
	    xposRel = (xClick / zoomTB.miniWindowWidth) - Math.pow(zoom.zoomFaktor, zoom.zoom)/2;
	    yposRel = (yClick / zoomTB.miniWindowHeight) - Math.pow(zoom.zoomFaktor, zoom.zoom)/2;
    	
	    YposPixel_1 = Math.round((yposRel - zoom.oldYPosAbs) * (Math.pow((1/zoom.zoomFaktor), zoom.zoom)) * zoom.manuscriptHeight);
	    XposPixel_1 = Math.round((xposRel - zoom.oldXPosAbs) *(Math.pow((1/zoom.zoomFaktor), zoom.zoom)) * zoom.manuscriptWidth);

	    moveX = Math.abs(XposPixel_1);
	    moveX = Math.ceil(moveX/20)*20;

	    moveY = Math.abs(YposPixel_1);
	    moveY = Math.ceil(moveY/20)*20;

	    if(xposRel < zoom.oldXPosAbs )
	    {
		    zoom.moveHelper("left",moveX);
	    }	
	    else if (xposRel > zoom.oldXPosAbs)
	    {
		    zoom.moveHelper("right",moveX);	
	    }
    	
	    if(yposRel < zoom.oldYPosAbs )
	    {
		    zoom.moveHelper("top",moveY);
	    }
	    else if(yposRel > zoom.oldYPosAbs)
	    {
		    zoom.moveHelper("bottom",moveY);	
	    }
    	
	    zoomTB.setClippingBorder();
	}
}

zoomToolbar.prototype.resetMiniWindow = function()
{
    var deltaY = 0;
    if(!zoomTB.miniShow)
        deltaY = 100; 
	this.miniDiv.style.left = (zoom.containerWidth - this.miniWindowWidth)  +"px";
	this.miniDiv.style.top = (zoom.containerHeight - this.miniWindowHeight + deltaY)  +"px";
	
	if(zoomTB.infoShow)
	    $("manuscriptVerseInfo").style.top = (zoom.containerHeight - $("manuscriptVerseInfo").getHeight()) + "px" ;
	else
	    $("manuscriptVerseInfo").style.top = (zoom.containerHeight - 10) + "px" ; 
	
	this.setClippingBorder();
}

zoomToolbar.prototype.resetMiniWindowImage = function()
{
    this.miniDiv.style.backgroundImage = "url('"+this.thumbnailHandler+"?image="+zoom.file[zoom.light]+"')";
}


zoomToolbar.prototype.setClippingBorder = function()
{
    if(!zoom.loadDimension)
    {  
   
        clipWidth = this.miniWindowWidth * (zoom.containerWidth / zoom.manuscriptZoomWidth);
        clipHeight = this.miniWindowHeight * (zoom.containerHeight / zoom.manuscriptZoomHeight);
        
        clipWidth = (clipWidth > this.miniWindowHeight ? this.miniWindowHeight : clipWidth);
        clipHeight = (clipHeight > this.miniWindowWidth ? this.miniWindowWidth : clipHeight);
        
        this.clippingBorder.style.width = clipWidth + "px"
        this.clippingBorder.style.height = clipHeight + "px"
        //this.clippingBorder.style.top = zoom.oldYPosAbs * this.miniWindowHeight +"px";
       // this.clippingBorder.style.left = zoom.oldXPosAbs * this.miniWindowWidth +"px";
        
        myTop = zoom.oldYPosAbs * this.miniWindowHeight;
        myLeft = zoom.oldXPosAbs * this.miniWindowWidth;
        
        deltaHeight = this.miniWindowHeight-parseInt(this.clippingBorder.style.height.replace("px",""));
        deltaWidth = this.miniWindowWidth-parseInt(this.clippingBorder.style.width.replace("px",""));
        
        
        if(myTop >= 0 && myTop <= deltaHeight)
            this.clippingBorder.style.top = myTop +"px";
        else if(myTop >= deltaHeight)
            this.clippingBorder.style.top = deltaHeight + "px";
        else
            this.clippingBorder.style.top = "0px";
           
        if(myLeft >= 0 && myLeft <= deltaWidth) 
            this.clippingBorder.style.left = myLeft +"px";        
        else if(myLeft >= deltaWidth)
            this.clippingBorder.style.left = deltaWidth +"px";
        else
            this.clippingBorder.style.left = "0px";        
                  
    }
    else
        window.setTimeout("zoomTB.setClippingBorder()",1000);
}

zoomToolbar.prototype.setNav = function()
{

    var nav = new Element('div', { id: 'nav_arrows'});
    var topA = new Element('img', { 'id': 'nav_top', 'class': 'nav_arrow', 'src': '../media/images/slider/top.gif'});
    var bottomA = new Element('img', { 'id': 'nav_bottom', 'class': 'nav_arrow', 'src': '../media/images/slider/bottom.gif'});
    var leftA = new Element('img', { 'id': 'nav_left', 'class': 'nav_arrow', 'src': '../media/images/slider/left.gif'});
    var rightA = new Element('img', { 'id': 'nav_right', 'class': 'nav_arrow', 'src': '../media/images/slider/right.gif'});
   
    Event.observe(topA, "click", function(event){zoom.moveHelper("top",70);});
    Event.observe(leftA, "click", function(event){zoom.moveHelper("left",70);});
    Event.observe(rightA, "click", function(event){zoom.moveHelper("right",70);});
    Event.observe(bottomA, "click", function(event){zoom.moveHelper("bottom",70);});
    
    Event.observe(topA, "mouseover", function(event){this.style.cursor='pointer';});
    Event.observe(leftA, "mouseover", function(event){this.style.cursor='pointer';});
    Event.observe(rightA, "mouseover", function(event){this.style.cursor='pointer';});
    Event.observe(bottomA, "mouseover", function(event){this.style.cursor='pointer';});
    
    Event.observe(topA, "dblclick", function(event){zoom.moveHelper("top",70);});
    Event.observe(leftA, "dblclick", function(event){zoom.moveHelper("left",70);});
    Event.observe(rightA, "dblclick", function(event){zoom.moveHelper("right",70);});
    Event.observe(bottomA, "dblclick", function(event){zoom.moveHelper("bottom",70);})
    
    nav.appendChild(topA);
    nav.appendChild(leftA);
    nav.appendChild(rightA);
    nav.appendChild(bottomA);
    
    this.parentNode.appendChild(nav);
}


zoomTB = new zoomToolbar();