(function(){
	if (window.Z) { return;}
	// set crossBrowser event
	var addEvent = function(t, e, l){
		if (t.addEventListener)
		{
			t.addEventListener(e, l ,false);
		}
		else if (t.attachEvent)
		{
			t.attachEvent('on' + e, l);
		}
		else
		{
			t['on' + e] = l;
		}
	}

	// delete crossBrowser event
	var delEvent = function(t,e,l){
		if (t.removeEventListener)
		{
			t.removeEventListener(e, l ,false);
		}
		else if (t.detachEvent)
		{
			t.detachEvent('on' + e, l);
		}
		else
		{
			t['on' + e] = null;

		}
	};
	// init paremteres
	var layer = null, imgBox = null, wrapper = null, initPadding = 10;

	// layer create
	var setOverLay = function(){
		if (layer != null)return layer;
		var l = document.createElement('div');
		l.id = 'image-overlay';
		l.style.display = 'none';
		if (window.attachEvent) {
			l.style.height = document.body.clientHeight + 'px';
		}
		document.body.appendChild(l);
		layer = l;
	};

	// zoom image create
	var setImageBox = function() {
		var i = document.createElement('img');
		i.id = 'image-zoombox';
		var w = document.createElement('p');
		w.id = 'image-zoombox-wrapper';
		document.body.appendChild(w);
		w.appendChild(i);
		w.style.display = 'none';
		imgBox =i;
		wrapper = w;
		wrapper.style.top = '50%';
		wrapper.style.left = '50%';
	};

	// get native imagesize
	var getNativeSize = function(img)
	{
		if (img.naturalWidth)
		{
			return {
				width : img.naturalWidth,
				height : img.naturalHeight
			};
		}
		else
		{
			var old = {
					width : img.runtimeStyle.width,
					height : img.runtimeStyle.height
			};
			// tmp set
			img.runtimeStyle.width = 'auto';
			img.runtimeStyle.height = 'auto';
			var def ={
					width : img.width,
					height : img.height
			};
			// return
			img.runtimeStyle.width = old.width;
			img.runtimeStyle.height = old.height;
			return def;
		}
	};

	// get windowsize
	var getWindowSize = function(){
		return {
			width : document.body.offsetWidtrh || document.documentElement.offsetWidth || 0,
			height : document.body.offsetheight || document.documentElement.offsetHeight || 0
		};
	}
	// get scrollPosition
	var getSC = function(){
		return {
			y : document.body.scrollTop || document.documentElement.scrollTop || 0,
			x : document.body.scrollLeft || document.documentElement.scrollLeft || 0
		};
	}

	// zoom class
	var Zoom = function(img){
		this.img = img;
	}
	Zoom.prototype = {
		// zoombox show
		show : function() {
			var that = this;
			layer.style.display = 'block';
			imgBox.onload = function(){
				var n = getNativeSize(that.img);
				var ws = getWindowSize();
				var sc = getSC();
				wrapper.style.marginTop = -(n.height / 2) + sc.y - initPadding + 'px';
				wrapper.style.marginLeft = -(n.width / 2) + sc.x - initPadding + 'px';
			};
			imgBox.src = this.img.src;
			document.body.style.overflow = 'hidden';
			wrapper.style.display = 'block';
			addEvent(layer, 'click', this.hide);
			addEvent(wrapper, 'click', this.hide);
		},
		// zoombox hide
		hide : function() {
			layer.style.display = 'none';
			wrapper.style.display = 'none';
			delEvent(layer, 'click', arguments.callee);
			delEvent(wrapper, 'click', arguments.callee);
			document.body.style.overflow = 'auto';
		},
		// initialize setup
		init : function() {
			setOverLay();
			setImageBox();
			var that = this;
			addEvent(this.img, 'click', function(ev) {
				var evt = ev || window.event;
				try {
					ev.preventDefault();
				} catch(e) {
					ev.cancelbubble = true;
				}
				that.show.call(that);});
		}
	};

	addEvent(window, 'load', function(){
		$('img.zoom-image').each(function() {
			var t = new Zoom(this);
			t.init();
		});
	});

	window.Z = 'created';
})();