// JavaScript Document

(function(){
	/**
	 * å·¥åŽ‚æ–¹æ³•, åˆ›å»º$å¯¹è±¡.
	 * @param {HTMLElement/String} selector åŽŸç"ŸDOMå¯¹è±¡æˆ–TAGé€‰æ‹©å™¨
	 * @return {$} $ç±»åž‹å¯¹è±¡
	 */
	function $(selector) {
		if (this instanceof $) {
			if (selector.nodeType) {
				this[0] = selector;
				this.length = 1;
				return this;
			}
			var elems = document.getElementsByTagName(selector);
			this.setArray($.makeArray(elems));
		}
		else return new $(selector);
	}
	/**
	 * å°†ç±»æ•°ç»"å¯¹è±¡è½¬æ¢æˆæ•°ç»".
	 * @private
	 * @param {Mixed} åŸºæœ¬å¯¹è±¡
	 * @return {Array} æ•°ç»"
	 */
	$.makeArray = function (array) {
		var ret = [];
		if (array) {
			var i = array.length;
			if (array.split || array.setInterval || array.call) ret[0] = array;
			else while (i) ret[--i] = array[i];
		}
		return ret;
	}
	/**
	 * äº‹ä»¶æ¨¡å—
	 * @module
	 */
	$.event = {
		/**
		 * ä¿®æ­£äº‹ä»¶å¯¹è±¡ä½¿ä¹‹æ ‡å‡†åŒ–.
		 * @param {Event}
		 * @return {Event}
		 */
		fix: function (event) {
			var legacy = event;
			var event = {
				legacy: legacy
			};
			for (var prop in legacy)
				event[prop] = legacy[prop];
			if (event.pageX == null && event.clientX != null) {
				var doc = document.documentElement,
					body = document.body;
				event.pageX = event.clientX + Math.max(doc && doc.scrollLeft || 0, body && body.scrollLeft || 0) - (doc && doc.clientLeft || 0);
				event.pageY = event.clientY + Math.max(doc && doc.scrollTop || 0, body && body.scrollTop || 0) - (doc && doc.clientTop || 0);

			}
			return event;
		}
	}
	$.prototype = {
		/**
		 * éåŽ†åŒ¹é…çš"DOMå…ƒç´ æ‰§è¡ŒæŸä¸ªå‡½æ•°. 
		 * @param {Function} å›žè°ƒå‡½æ•°. ä½œç"¨åŸŸä¸ºDOMå…ƒç´ , è¿"å›žfalseä¸­æ–­è¿­ä»£
		 * @param {Mixed} é™"åŠ å‚æ•°
		 * @return {$}
		 */
		each: function (fn, args) {
			for (var i = 0, length = this.length; i < length; i++)
				if (fn.call(this[i], i, this, args) === false) break;
			return this;
		},
		/**
		 * èŽ·å–æˆ–è®¾ç½®åŒ¹é…å…ƒç´ ç›¸å¯¹å½"å‰æ–‡æ¡£çš"åæ ‡. 
		 * @param {Object} åŒ…å«leftå'Œtopç´¢å¼•çš"åæ ‡. å‚æ•°éžç©ºè®¾ç½®åæ ‡, å¦åˆ™èŽ·å–åæ ‡
		 * @return {Mixed} å‚æ•°éžç©ºè¿"å›ž$å¯¹è±¡è‡ªèº«, å¦åˆ™è¿"å›žåæ ‡{left: left, top: top}
		 */
		offset: function (coords) {
			if (coords) {
				return this.each(function (elem) {
					this.style.left = coords.left + "px";
					this.style.top = coords.top + "px";
				});
			}
			var left = 0,
				top = 0;
			var elem = this[0];
			if (elem) {
				while (elem.offsetParent) {
					left += elem.offsetLeft;
					top += elem.offsetTop;
					elem = elem.offsetParent;
				}
			}
			return {
				left: left,
				top: top
			};
		},
		
		setArray: function (elems) {
			this.length = 0;
			Array.prototype.push.apply(this, elems);
			return this;
		},
		/**
		 * ä¸ºåŒ¹é…å…ƒç´ æ³¨å†Œäº‹ä»¶å"åº" 
		 * @param {String} äº‹ä»¶ç±»åž‹
		 * @param {Function} äº‹ä»¶å¤"ç†å‡½æ•°
		 * @return {$}
		 */
		on: function (type, fn) {
			return this.each(function (elem) {
				var handler = function (event) {
					event = arguments[0] = $.event.fix(event);
					return fn.apply(this, arguments);
				};
				if (this.addEventListener) {
					this.addEventListener(type, handler, false);
				} else if (this.attachEvent) {
					this.attachEvent("on" + type, handler);
				}
			});
		}
	};


	var MAX_DIST = 50;		// çœ¼ç å…è®¸ç§»åŠ¨çš"æœ€å¤§è·ç¦»
	var EYE_RADIUS = 59;	// çœ¼ç›å®½åº¦/2
	var PUPIL_RADIUS = 10;	// çœ¼ç å®½åº¦/2

	$(document).on('mousemove', function (e) {
		$('img').each(function () {
			var coords = $(this.parentNode).offset();

			var centralX = coords.left + EYE_RADIUS;
			var centralY = coords.top + EYE_RADIUS;

			var distX = e.pageX - centralX;
			var distY = e.pageY - centralY;
			var dist = Math.sqrt(Math.pow(distX, 2) + Math.pow(distY, 2));
			if (dist > MAX_DIST) {
				var scale = MAX_DIST / dist;
				distX *= scale;
				distY *= scale;
			}

			$(this).offset({
				left: (distX + EYE_RADIUS - PUPIL_RADIUS),
				top: (distY + EYE_RADIUS - PUPIL_RADIUS)
			});

		});

	});
})();

