JJ.addElement = function(tag, att, o) {
	var i;
	var node = d.createElement(tag);
	if (att) {
		for (i=0;i<att.length;i++) {
			node.setAttribute(att[i][0], att[i][1]);
		}
	}
	if (o) {
		o.appendChild(node);
	}
	else {
		d.body.appendChild(node);
	}
	return node;
}

JJ.removeEvent = function(o, ev, h, uc) {
	var i, j;
	if (typeof(o) == "string") o = [g(o)];
	if (typeof(ev) == "string") {
		ev = [ev];
		h = [h];
	}
	for (i=0;i<o.length;i++) {
		for (j=0;j<ev.length;j++) {
			try {
				o[i].removeEventListener(ev[j], h[j], (uc ? uc : false));
			}
			catch(err) {
				o[i]["on" + ev[j]] = null;
			}
		}
	}
}

JJ.getCoords = function(o) {
	var x = o.offsetLeft;
	var y = o.offsetTop;
	var par = o.offsetParent;
	while (par) {
		x += par.offsetLeft;
		y += par.offsetTop;
		par = par.offsetParent;
	}
	return {"x":x, "y":y};
}

JJ.imgEnlarger = {

	"container" : {},

	"img" : {},

	"statusImg" : {},

	"appendStatus" : function(o) {
		var coords = JJ.getCoords(o);
		with (this.statusImg.style) {
			left = coords.x + "px";
			top = coords.y + "px";
			visibility = "visible";
		}
	},

	"showImg" : function() {
		var x, y;
		var wd = JJ.getWinDim();
		x = Math.floor((wd.width - JJ.imgEnlarger.img.width - 2) / 2);
		y = Math.floor((wd.height - JJ.imgEnlarger.img.height - 2) / 2);
		x = (x < 5 ? 5 : x);
		y = (y < 5 ? 5 : y);
		if (JJ.ua == "ie6") {
			x += JJ.doc.scrollLeft;
			y += JJ.doc.scrollTop;
		}
		with (JJ.imgEnlarger.container.style) {
			left = x + "px";
			top = y + "px";
			width = JJ.imgEnlarger.img.offsetWidth + "px";
			height = JJ.imgEnlarger.img.offsetHeight + "px";
			visibility = "visible";
		}
		JJ.imgEnlarger.statusImg.style.visibility = "hidden";
	},

  "drag" : function(e) {
		var wd = JJ.getWinDim();
		var evt = e || event;
		var x = evt.clientX;
		var y = evt.clientY;
		var o = JJ.imgEnlarger.container;
		if ((e ? evt.button : evt.button - 1) != 0) {
			JJ.imgEnlarger.stopDrag();
			return;
		}
		if (x < 0 || y < 0 || x > wd.width || y > wd.height) return;
		o.style.left = (evt.clientX - o.dx) + "px";
		o.style.top = (evt.clientY - o.dy) + "px";
		try {
			d.selection.empty();
		}
		catch(err) {
			o.focus();
		}
	},

	"stopDrag" : function() {
		JJ.removeEvent([d], "mousemove", JJ.imgEnlarger.drag);
		JJ.removeEvent([d], "mouseup", JJ.imgEnlarger.stopDrag);
		JJ.imgEnlarger.container.style.cursor = "url(/styles/default.cur), default";
	},

	"load" : function(o, url) {
		if (this.img.src.indexOf(url) != -1) {
			this.showImg();
		}
		else {
			this.container.style.visibility = "hidden";
			this.appendStatus((typeof(o) == "string" ? g(o) : o));
			this.img.src = url;
		}
	},

	"init" : function() {
		var i, c, arr;

		this.container = c = JJ.addElement("div");
		c.innerHTML = '<div></div><img src="" alt="" /><div><img src="/images/jj-icon-bg.png" alt="" /></div><img src="/images/jj-close-icon_up.gif" alt="" />';
		with (c.style) {
			visibility = "hidden";
			position = (JJ.ua == "ie6" ? "absolute" : "fixed");
			zIndex = 100;
		}

		with (c.firstChild.style) {
			position = "absolute";
			left = top = "3px";
			width = height = "100%";
			backgroundColor = "#000";
			filter = "alpha(opacity=30)";
			opacity = 0.3;
		}

		this.img = c.childNodes[1];
		with (this.img.style) {
			position = "absolute";
			display = "block";
			borderStyle = "solid";
			borderWidth = "1px 2px 2px 1px";
			borderColor = "#fc6 #960 #960 #fc6";
		}

		JJ.addEvent([this.img], "load", this.showImg);

		with (c.childNodes[2].style) {
			position = "absolute";
			width = "68px";
			height = "30px";
			right = "2px";
			top  = "1px";
		}
		if (JJ.ua == "ie6") {
			c.childNodes[2].style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/jj-icon-bg.png",sizingMethod="scale")';
			c.childNodes[2].firstChild.style.visibility = "hidden";
		}

		with (c.childNodes[3].style) {
			position = "absolute";
			width = height = "20px";
			top = right = "5px";
			cursor = "url(/styles/pointer.cur), pointer";
		}
		JJ.addEvent([c.childNodes[3]], ["mouseover", "mouseout", "click"], [
			function() {
				this.src = "/images/jj-close-icon_hover.gif";
			},
			function() {
				this.src = "/images/jj-close-icon_up.gif";
			},
			function() {
				this.parentNode.style.visibility = "hidden";
			}
		]);

		this.statusImg = JJ.addElement("img", [["src", "/images/jj-loading.gif"], ["alt", ""]]);
		with (this.statusImg.style) {
			visibility = "hidden";
			position = "absolute";
		}

		JJ.addEvent([this.container], "mousedown", function(e) {

			var evt = e || event;
			var p = JJ.getCoords(this);
			if ((e ? e.button : event.button - 1) != 0) return;
			this.dx = evt.clientX - p.x;
			this.dy = evt.clientY - p.y;
			this.style.cursor = "url(/styles/move.cur), move";
			JJ.addEvent([d], "mousemove", JJ.imgEnlarger.drag);
			JJ.addEvent([d], "mouseup", JJ.imgEnlarger.stopDrag);
			return JJ.cancelEvent(e);

		});

		JJ.addEvent([this.container], "drag", JJ.cancelEvent);
	}

};



(function() {
	var i;
	var arr = [
		"suite", "bathroom", "honeymoon_suite", "garden", "swimming_pool", "restaurant", "tonys_bar", "staff", "dinner_party", "garden_2", "garden_3",
		"garden_4", "garden_5", "entrance", "patio", "room", "room_2", "lounge", "safari_vehicle", "rhinoceros", "white_stork", "elephant", "tour_boat",
		"crocodile_centre"
	];
	for (i=0;i<arr.length;i++) {
		this[arr[i] + "_DoFSCommand"] = function(id, url) { JJ.imgEnlarger.load(id, url) }
	}
})();

JJ.addEvent([window], "load", function() {
	init();
	JJ.imgEnlarger.init();
});