// JScript File

/*
 * .bind() - from prototype.js, which is licensed under an open version of the MIT license
 */
Function.prototype.bind = function(object) {
	var __method = this;
	return function() {
		__method.apply(object, arguments);
	}
}

// the magnification manager
function Loupe() {
	this.target = '';
	this.photos = new Object(); //used as a dictionary
	this.count = 0; //kill siwtch counter

	this.constructor = function() {
		// constructor-ish setup code (this method is called at the end of this class)
		if (document.captureEvents)
			document.captureEvents(Event.MOUSEMOVE);
		document.onmousemove = this.mouseMoved.bind(this);
	}
	this.createMag = function() {
		// add the magnifying div
		this.magHolder = document.createElement('div');
		this.magHolder.className = "MagnifyHolder";
		this.magHolder.style.display = "none";
		document.body.appendChild(this.magHolder);
		this.mag = document.createElement('div');
		this.mag.className = "Magnify";
		this.magHolder.appendChild(this.mag);
	}
	
	// dealing with mouse movement
	this.mouseMoved = function(e) {
		if (!this.target || !this.mag) {
			return;
		}
		
		var x, y = 0;
		if (e) {
			x = e.pageX;
			y = e.pageY;
		} else {
			x = event.clientX + document.body.scrollLeft;
			y = event.clientY + document.body.scrollTop;
		}
		if (!this.target.isOver(x, y)) {
			this.moveOut();
			return;
		}
		
		this.magHolder.style.display="block";
		this.mag.style.backgroundImage = 'url("'+this.target.div.getAttribute('magnifySrc')+'")';
		this.mag.style.backgroundPosition = this.target.percentAcross(x)+'% '+this.target.percentDown(y)+'%';
		this.magHolder.style.left = x - this.mag.offsetWidth/2;
		this.magHolder.style.top = y - this.mag.offsetHeight/2;
	}
	
	// dealing with the current target
	this.moveTo = function(target) {
		var src = target.getAttribute('magnifySrc');
		if (src) {
			// this way we recalc the position on each rollover, which will help with browser resizing
			if (target.offsetWidth < 210 || target.offsetHeight < 160)
				return;
			this.target = new LoupeTarget(target);
		}
	}
	this.moveOut = function() {
		this.magHolder.style.display="none";
		this.target = '';
	}
	
	// managing photos that can be targetted
	this.addPhoto = function(photo) {
		if (photo.id) {
			// we use the objects id to identify it. objects without an id won't work
			this.photos[photo.id] = photo;
		}
	}
	
	this.constructor();
}

function LoupeTarget(target) {
	this.div = target;
	
	// width & height
	this.width = target.offsetWidth;
	this.height = target.offsetHeight;
	
	// now calculate the x/y of the item
	this.x = 0;
	this.y = 0;
	var parent = target.offsetParent;
	var tmpTarget = target;
	while (tmpTarget.offsetParent) {
		this.x += tmpTarget.offsetLeft;
		this.y += tmpTarget.offsetTop;
		tmpTarget = tmpTarget.offsetParent;
	}
	
	this.isOver = function(x, y) {
		if (x < this.x || y < this.y) {
			return false;
		}
		if (x > this.x + this.width || y > this.y + this.height)
			return false;
		return true;
	}
	
	this.percentAcross = function(x) {
		return (x - this.x) / this.width * 100;
	}
	this.percentDown = function(y) {
		return (y - this.y) / this.height * 100;
	}
}

window['loupe'] = new Loupe(); // make the loupe available in the global namespace