﻿// JScript File
var xm = -100;
var ym = 0;
var nx = 0; // 'screen' offsetLeft
var ny = 0; // 'screen' offsetTop
var nw = 0; // 'screen' offsetWidth
var nh = 0; // 'screen' offsetHeight

id = function(o)
{
	return document.getElementById(o);
}

px = function (x)
{
	return ''.concat(Math.round(x), 'px');
}

function resize()
{
	var o = id("screen");
	nx = o.offsetLeft;
	ny = o.offsetTop;
	nw = o.offsetWidth;
	nh = o.offsetHeight;
	ssi.resize();
}
onresize = resize;

document.onmousemove = function(e)
{
	if (window.event) e = window.event;
	xm = (e.x || e.clientX) - nw * .5 - nx;
	ym = (e.y || e.clientY) - nh * .5 - ny;
}

var ssi = {
	dx : 0,
	x0  : 0,
	y0  : 0,
	iz  : false,
	iL  : 0,
	rL  : 0,
	N   : 0,
	b0  : 0,
	b1  : 0,
	ov  : -1,
	NW  : 0,    // Displayable width
	ims : 0,
	nxi : 0,
	nyi : 0,
	nxo : 0,
	nyo : 0,
	nho : 0,
	imgWidth  : 0,
	imgHeight : 0,
	borWidth  : 0,
	loaded    : false,

    display : function (i)
    {
        id("photoImg").src = ssi.ims[i].src;
        // How much space is available for image
        var availImgW = Math.round(nw * 0.6);      // Linked to width of rLinkText
        var availImgH = Math.round(nh * 0.7);       // Linked to height of rLinkText
        if ((ssi.ims[i].width < availImgW) && (ssi.ims[i].height < availImgH))
        {
            // Image will fit
            id("photoImg").width = ssi.ims[i].width;
            id("photoImg").height = ssi.ims[i].height;
        }
        else
        {
            // Image is too big for screen area - reduce size to fit
            // Use all height, and correct width to match image proportion
            var imgH = availImgH;
		    var imgW = Math.round((ssi.ims[i].width / ssi.ims[i].height) * availImgH);
            if (imgW > availImgW)
            {
                // Width now too big
			    imgW = availImgW;
                imgH = Math.round((ssi.ims[i].height / ssi.ims[i].width) * availImgW)
            }
            id("photoImg").width = imgW;
            id("photoImg").height = imgH;
        }
    },
    
	slide : function ()
	{
		if(!ssi.iz && ssi.loaded)
		{
			ssi.dx -= xm * .014;
			if(ssi.dx > 0)
			    ssi.dx -= ssi.NW;
			else if(ssi.dx < -ssi.NW)
			    ssi.dx += ssi.NW;
		}
		ssi.b0.style.left = px(ssi.dx);
		ssi.b1.style.left = px(ssi.dx + ssi.NW);
		setTimeout(ssi.slide, 16);
	},
	
	iScroll : function ()
	{
        ssi.iz = !ssi.iz;
        ssi.scroll();
    },

	scroll : function ()
	{
		if(ssi.iz)
		{
			ssi.xmo = Math.min(ssi.nwo, Math.max(0, ((-ssi.nxo + xm + nw * .5))));
			ssi.ymo = Math.min(ssi.nho, Math.max(0, ((-ssi.nyo + ym + nh * .5))));
			var x   = -ssi.xmo * (ssi.nxi / ssi.nwo) + ssi.xmo;
			var y   = -ssi.ymo * (ssi.nyi / ssi.nho) + ssi.ymo;
			ssi.x0 += ((ssi.x0 > x) ? -1 : 1) * Math.abs(ssi.x0 - x) * .1;
			ssi.y0 += ((ssi.y0 > y) ? -1 : 1) * Math.abs(ssi.y0 - y) * .1;
			setTimeout(ssi.scroll, 16);
		}
	},

	iBorder : function (o, i)
	{
		var o = o.getElementsByTagName("img");
		o[ssi.iL].className = "thumbOut";
		o[i].className  = "thumbOver";
	},

	disp : function (i, title, caption)
	{
		ssi.iBorder(ssi.b0, i);
		ssi.iBorder(ssi.b1, i);
		ssi.iL = i;
		ssi.nxi = ssi.ims[i].width;
		ssi.nyi = ssi.ims[i].height;
        ssi.display(i);
	},

	init : function (obj)
	{
		obj.innerHTML = id("source").innerHTML;
		var img = obj.getElementsByTagName("img");
		for(var i = 0; i < ssi.N; i++)
		{
			var o = img[i];
			o.className = "thumbOut";
			o.onmousedown = function () { return false; }
			o.onclick = function () { ssi.iScroll(); }
			o.i = i;
			o.onmouseover = function()
			{
				ssi.ov = this.i;
				ssi.disp(ssi.ov, ssi.ims[ssi.ov].title, ssi.ims[ssi.ov].alt);
			}
			o.alt   = "";
			o.title = "";
		}
	},

	oResize : function (obj)
	{
		var img = obj.getElementsByTagName("img");
		ssi.NW = 0;
		for(var i = 0; i < ssi.N; i++)
		{
			var o = img[i];
			if(o.complete)
			{
				o = o.style;
				var w = (ssi.ims[i].width / ssi.ims[i].height) * ssi.imgHeight;
				o.left = px(ssi.NW);
				ssi.NW += w +( 2 * ssi.borWidth);
				o.top    = px(0);
				o.width  = px(w);
				o.height = px(ssi.imgHeight);
				o.borderWidth   = px(ssi.borWidth);
			}
		}
	},

	resize : function ()
	{
		ssi.borWidth = Math.round(1.4 * nh / 100);
		ssi.imgHeight = id("banner").offsetHeight - (2 * ssi.borWidth);
		ssi.oResize(ssi.b0);
		ssi.oResize(ssi.b1);
		ssi.NW = Math.round(ssi.NW);
		if(!ssi.loaded) ssi.NW = nw;
		id("rLinkTitle").style.fontSize   = px(3.5 * nh / 100);
	},

	run : function ()
	{
		var o = id("banner").getElementsByTagName("span");
		ssi.b0 = o[0];
		ssi.b1 = o[1];
		ssi.init(ssi.b0);
		ssi.init(ssi.b1);
		resize();
		ssi.slide();
		ssi.images_load();
	},
	load : function ()
	{
		ssi.ims = id("source").getElementsByTagName("img");
		ssi.N   = ssi.ims.length;
		ssi.run();
	},
	images_load : function ()
	{
		var M = 0;
		for (var i = 0; i < ssi.N; i++)
		{
			if (ssi.ims[i].complete)
			{
				M++;
				resize();
				if (i == 0 && ssi.ov == -1)
				    ssi.b0.getElementsByTagName("img")[0].onmouseover();
			}
		}
		if (M < ssi.N)
			setTimeout(ssi.images_load, 64);
		else
		{
			ssi.loaded = true;
			resize();
		}
	}
}
