﻿// JScript File

// Presets
var w = 315;
var h = 315;
var minWidth = 315;
var minHeight = 315;
var maxWidth = 550;
var maxHeight = 550;
var framew = 315;
var frameh = 315;
var slideW = 274;

// Variables
var slideObject = null;
var dragObject  = null;
var morePictureObject = null;
var mouseOffset = null;
var dragable = false;
var smallimg = null;
var bigimg = null;

// Event handlers
document.onmousemove = mouseMove;
document.onmouseup   = mouseUp;

// Get mouse offset from a target element
function getMouseOffset(target, ev)
{
    ev = ev || window.event;

    var docPos    = getPosition(target);
    var mousePos  = mouseCoords(ev);
    
    return { x: (mousePos.x - docPos.x), y: (mousePos.y - docPos.y) };
}

// Get element position as object with x and y
function getPosition(e)
{
    var left = 0;
    var top  = 0;

    while (e.offsetParent)
    {
        left += e.offsetLeft;
        top  += e.offsetTop;
        e     = e.offsetParent;
    }

    left += e.offsetLeft;
    top  += e.offsetTop;

    return { x: left, y: top };
}

// Get absolute mouse x and y
function mouseCoords(ev)
{
    if (ev.pageX || ev.pageY)
    {
        return { x: ev.pageX, y: ev.pageY };
    }
    
    return {
        x: ev.clientX + document.body.scrollLeft - document.body.clientLeft,
        y: ev.clientY + document.body.scrollTop  - document.body.clientTop
    };
}

function JustifyPictureCoord()
{
    var picObj = document.getElementById("pic");
    
    if (parseInt(picObj.style.top.replace("px", "")) > 0)
    {
        document.getElementById("pic").style.top = 0 + "px";
    }
        
    if (parseInt(picObj.style.left.replace("px", "")) > 0)
    {
        document.getElementById("pic").style.left = 0 + "px";
    }
        
    if ((parseInt(picObj.style.top.replace("px", "")) + parseInt(picObj.style.height.replace("px", ""))) < frameh)
    {
        picObj.style.top= parseInt(picObj.style.top) + frameh-parseInt(picObj.style.top.replace("px", "")) - parseInt(picObj.style.height.replace("px", "")) + "px";
    }
    
    if ((parseInt(picObj.style.left.replace("px", "")) + parseInt(picObj.style.width.replace("px", ""))) < frameh)
    {
		picObj.style.left = parseInt(picObj.style.left) + frameh-parseInt(picObj.style.left.replace("px", "")) - parseInt(picObj.style.width.replace("px", ""))+ "px";
    }
}

// Get X position of object
function findleft(obj)
{
    var curleft = 0;
    
    if (obj.offsetParent)
    {
        do
        {
			curleft += obj.offsetLeft;
        } while(obj = obj.offsetParent);
    }
    
    return curleft;
}

// Get Y position of object
function findtop(obj)
{
    var curtop = 0;
    
    if (obj.offsetParent)
    {
        do
        {
            curtop += obj.offsetTop;
        } while(obj = obj.offsetParent);
    }
    
    return curtop;
}

function mouseMove(ev)
{
    ev = ev || window.event;
    
    var mousePos = mouseCoords(ev);
    var picObj =   document.getElementById("pic");
    var slideFrame = document.getElementById("SlideFrame");
    var extraLeft = findleft(slideFrame);
    var extraTop = findtop(document.getElementById("PictureScrollControl"));
    
    if (slideObject)
    {
        dragable = true;
        
        if (((mousePos.x - mouseOffset.x - extraLeft) >= 0)&&((mousePos.x - mouseOffset.x- extraLeft) <= (slideW - 8)))
        {
            var velocity = ((maxWidth - minWidth) / (slideW - 8));
            var value = slideObject.style.left.replace("px", "");
            slideObject.style.left = (mousePos.x - mouseOffset.x- extraLeft) + "px";  
            if((mousePos.x - mouseOffset.x- extraLeft)<10) 
            {
                value=0;
                slideObject.style.left =  "0px";  
            }     
            if((mousePos.x - mouseOffset.x- extraLeft)>255) 
            {
                value=265;
                slideObject.style.left =  "265px";  
            }                   
            picObj.style.width = (minWidth + (value * velocity)) + "px";
            picObj.style.height = (minHeight + (value * velocity)) + "px";                                 
            if(smallimg)
            {
                if((slideW-8)/2 > value && picObj.src != smallimg.src) 
                {
                    picObj.src = smallimg.src;
                }
            }
            else {
                smallimg = new Image();
                smallimg.src = picObj.src;
            }
            if(bigimg)
            {
                if((slideW-8)/2 < value && picObj.src != bigimg.src) 
                {
                    picObj.src = bigimg.src;
                }          
            }
            else
            {
                bigimg = new Image();
                bigimg.src = picObj.src.replace("m.jpg","l.jpg");    
            }            
        }
        else
        {
            if ((mousePos.x - mouseOffset.x - extraLeft) < 0)
            {
                var value = 0;        
                dragable = false;
            }           
        }
        JustifyPictureCoord();
        return false;
    }
    
    if (dragObject)
    {    
        if (dragable == true)
        {   
            dragObject.style.position = 'relative';
            
            if (((mousePos.y - mouseOffset.y-extraTop) < 0)&&((mousePos.y - mouseOffset.y - extraTop + parseInt(picObj.style.height.replace("px", ""))) > frameh))
            {
                dragObject.style.top = (mousePos.y - mouseOffset.y - extraTop) + "px";
            }
            if (((mousePos.x - mouseOffset.x- extraLeft) < 0)&&((mousePos.x - mouseOffset.x - extraLeft + parseInt(picObj.style.width.replace("px", ""))) > framew))
            {		            
                dragObject.style.left = (mousePos.x - mouseOffset.x - extraLeft) + "px";
            }
        }
        
        return false;
    }
}

// Reset variables on mouse up
function mouseUp()
{
    dragObject = null;
    slideObject = null;
}


function Slide(item)
{
    if (!item) return;
    
	item.onmousedown = function(ev)
	{
		slideObject  = item;
		mouseOffset = getMouseOffset(this, ev);

		return false;
	}
}

function Drag(item)
{
    if (!item) return;
    
	item.onmousedown = function(ev)
	{
		dragObject  = this;
		mouseOffset = getMouseOffset(this, ev);

		return false;
	}
}

function setsize()
{
    document.getElementById("pic").style.width = minWidth + "px";
    document.getElementById("pic").style.height = minHeight + "px"; 
}

function INCSize()
{
    var picObj = document.getElementById("pic");
    var slideObj = document.getElementById("SlideHandle");
    var velocity;
    var value;
    if ((parseInt(slideObj.style.left) + 20) < (slideW - 8))
    {
        slideObj.style.left = (parseInt(slideObj.style.left) + 20) + "px";  
         
        velocity = ((maxWidth - minWidth) / (slideW - 8));
        value = slideObj.style.left.replace("px", "");
        
        picObj.style.width = minWidth + (value * velocity) + "px";
        picObj.style.height = minHeight + (value * velocity) + "px";                                 
    }
    else
    {
        slideObj.style.left = (slideW - 8) + "px";   
        
        velocity = ((maxWidth - minWidth) / (slideW - 8));
        value = slideObj.style.left.replace("px", "");
        
        picObj.style.width = minWidth + (value * velocity) + "px";
        picObj.style.height = minHeight + (value * velocity) + "px";                                 
    }

    if(smallimg)
    {
        if((slideW-8)/2 > value && picObj.src != smallimg.src) 
        {
            picObj.src = smallimg.src;
        }
    }
    else {
        smallimg = new Image();
        smallimg.src = picObj.src;
    }
    if(bigimg)
    {
        if((slideW-8)/2 < value && picObj.src != bigimg.src) 
        {
            picObj.src = bigimg.src;
        }          
    }
    else
    {
        bigimg = new Image();
        bigimg.src = picObj.src.replace("m.jpg","l.jpg");    
    }            

    
    JustifyPictureCoord();
    dragable = true;   
}
var resizeInterval = null;
function INC_click()
{
    INCSize();
    if(resizeInterval==null)resizeInterval = setInterval(INC_click, 200);
}

function INC_onmouseup()
{

    clearInterval(resizeInterval);
    resizeInterval=null;
}

function DECSize()
{
    var picObj =   document.getElementById("pic");
    var slideObj = document.getElementById("SlideHandle");
    var velocity;
    var value;
    if (parseInt(slideObj.style.left) - 20 > 0)
    {
        slideObj.style.left = parseInt(slideObj.style.left) - 20 + "px";  
         
        velocity = ((maxWidth - minWidth) / (slideW - 8));
        value = slideObj.style.left.replace("px", "");
        
        picObj.style.width = minWidth + (value * velocity) + "px";
        picObj.style.height = minHeight + (value * velocity) + "px";                                 
    }
    else
    {
        slideObj.style.left = "0px"; 
          
        velocity = ((maxWidth - minWidth) / (slideW - 8));
        value = slideObj.style.left.replace("px", "");
        
        picObj.style.width = minWidth + (value * velocity) + "px";
        picObj.style.height = minHeight + (value * velocity) + "px";                                 
    }
    
    if(smallimg)
    {
        if((slideW-8)/2 > value && picObj.src != smallimg.src) 
        {
            picObj.src = smallimg.src;
        }
    }
    else {
        smallimg = new Image();
        smallimg.src = picObj.src;
    }
    if(bigimg)
    {
        if((slideW-8)/2 < value && picObj.src != bigimg.src) 
        {
            picObj.src = bigimg.src;
        }          
    }
    else
    {
        bigimg = new Image();
        bigimg.src = picObj.src.replace("m.jpg","l.jpg");    
    }            
    
    JustifyPictureCoord();
}

function DEC_click() 
{   
    DECSize();
    if(resizeInterval==null)resizeInterval = setInterval(DEC_click, 200);
}

function LoadNewPicture(newPic, newPic2)
{
    var picObj =   document.getElementById("pic");
    picObj.src = "/PictureScroll/spacer.gif";
    picObj.style.visibility = "hidden";
    smallimg = new Image();
    smallimg.src = newPic;
    bigimg = new Image();
    bigimg.src = newPic2;    
    // After 1 second, replace with new image
    setTimeout("document.getElementById(\"pic\").src = '" + newPic + "'; document.getElementById(\"pic\").style.visibility = \"visible\";", 1000);
}