var x = {
	archive : {},
	
	set : function(id) {
		if (typeof this.archive[id] == "undefined") {
			this.archive[id] = new this.fc(id);
		}
		return this.archive[id];
	},
	
	z : 100,
	
	zChange : function(id) {
		x.z = x.z + 3;
		
		o1 = x.gebi('overlay_' + id);
		o2 = x.gebi('hideselect_' + id);
		o3 = x.gebi(id);
		
		if (o1 && o2) {
			o1.style.zIndex = x.z - 1;
			o2.style.zIndex = x.z - 2;
		}
		o3.style.zIndex = x.z;
	},
	
	debug : function(e) {
		alert(e);
	},
	
	gebi : function(n) {
		if(!n) return false;
		if(!document.getElementById(n)) return false;
		return document.getElementById(n)
	},
	
	bubbling : function (e) {
		e = this.bubbling_ie(e); 
		if (!e.cancelBubble) e.cancelBubble = true;
		if (e.stopPropagation) e.stopPropagation();
		return false;
	},
	
	bubbling_ie : function (e) {
		if (!e) var e = window.event;
		return e;
	},
	
	pagesize : function(){
		var de = document.documentElement;
		var w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
		var h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
		
		result = new Array(w,h) 
		return result;
	},
	
	bounds : function (el) {
		var left = el.offsetLeft;
		var top = el.offsetTop;

		for (var parent = el.offsetParent; parent; parent = parent.offsetParent) {
			left += parent.offsetLeft;
			top += parent.offsetTop;
		}
		return { left:left, top:top, width:el.offsetWidth, height:el.offsetHeight };
	},
	
	changePosition : function(id) {
		var o = this.gebi(id);
		var page = this.pagesize();
		var pw = x.archive[id].parent == 'body' ? page[0] : x.gebi(x.archive[id].parent).offsetWidth;
		var ph = x.archive[id].parent == 'body' ? page[1] : x.gebi(x.archive[id].parent).offsetHeight;
		var left = x.archive[id].parent == 'body' ? this.bounds(x.archive[id].opener).left : x.archive[id].opener.offsetLeft;
		var top = x.archive[id].parent == 'body' ? this.bounds(x.archive[id].opener).top : x.archive[id].opener.offsetTop;
		
		switch(x.archive[id].position) {
			case 'center':
				o.style.top = '50%';
				o.style.left = '50%';
				o.style.marginTop = (this.bounds(o).height / -2) + 'px';
				o.style.marginLeft = (this.bounds(o).width / -2) + 'px';
				break;
			case 'right-bottom':
				top = top + this.bounds(x.archive[id].opener).height;
				if (pw < (left + this.bounds(x.archive[id].opener).width + this.bounds(o).width)) {
					left = left + 15 - this.bounds(o).width;
				} else {
					left = (left + this.bounds(x.archive[id].opener).width - 15);
				}
				o.style.top = top + 'px';
				o.style.left = left + 'px'
				break;
			case 'fix-bottom':
				top = top + this.bounds(x.archive[id].opener).height;
				o.style.left = left + 'px';
				if (pw < (o.offsetLeft + this.bounds(o).width)) {
					o.style.left = o.offsetLeft + this.bounds(x.archive[id].opener).width - this.bounds(o).width + 'px';
				}
				o.style.top = top + 'px';
				break;
			default :
				o.style.top = top + 'px';
				o.style.left = left + 'px'
		}
	},
	
	hide : function(_this, eff) {
		switch (eff) {
			case 'slide':
				$('#'+this.id).slideUp('fast');
				break; 

			case 'fade':
				$('#'+this.id).fadeOut('fast');
				break; 

			default:
				$('#'+this.id).css({ display:'none'});
		}
	
		$(this.opener).removeClass('click-active');
		$('#x-overlay,#x-hideselect').remove();
	},
	
	loadingBounds : function(id, tag) {
			var w = x.gebi(id).offsetWidth + 'px';
			var h = x.gebi(id).offsetHeight + 'px';

			if (tag == 'tr') {
				$('#' + id + '_tmp div.loading').css({ width:w, height:h });
			} else {
				$('#' + id + ' div.loading').css({ width:w, height:h });
			}
	},

	loading : function(id, parentag) {
		if (parentag == 'tr') {
			$('#' + id).before('<tr id="' + id + '_tmp" style="loading-tmp"><td><div class="loading"></div></td></tr>');
		} else {
			$('#' + id).prepend('<div class="loading"></div>');
		}
		this.loadingBounds(id, parentag);

		$(window).resize(function() {
			x.loadingBounds(id, parentag);
		});
	},
		
	placehtml : function(id, html, place) {
		switch (place) {
			case 'replace':
				$('#' + id).replaceWith(html);
				break;
			case 'before':
				$('#' + id).before(html);
				break;
			case 'after':
				$('#' + id).after(html);
				break;
			default:
				$('#'+id).html(html);
		}
	},
	
	load : function(id, url, wid, data) {
		$.ajax({
			type: 'post',
			url: url,
			data: data ? data : false,
			beforeSend: function(){
				x.loading(id);
			},
			success: function(html) {
				$('#'+id).html(html);
				if (wid) x.changePosition(wid);
			}
		});
	},

	reload : function (id, url, _this, data, place) {
		var parentag = x.gebi(id).tagName.toLowerCase();
		if (_this) {
			var options = {
				type: 'post',
				url: url,
				data: data ? data : false,
				beforeSend: function() {
					x.loading(id, parentag);
					//alert(1);
				},
				success: function(html) {
					x.placehtml(id, html, place);
					if (parentag == 'tr') $('#' + id + '_tmp').remove();
                }
			}
			$(_this).ajaxSubmit(options);
		} else {
			$.ajax({
				type: 'post',
				url: url,
				data: data ? data : false,
				beforeSend: function() {
					x.loading(id, parentag);
				},
				success: function(html) {
					x.placehtml(id, html, place);
					if (parentag == 'tr') $('#' + id + '_tmp').remove();
				}
			});
		}
	},

	update_checkbox : function (id, url, data) {
		$.ajax({
			type: 'post',
			url: url,
			data: data,
			beforeSend: function() {
				$('#' + id).addClass('preloading');
			},
			success: function(html) {
				$('#' + id).removeClass('preloading');
				x.gebi(id).blur();
			}
		});	
	},

	loadSettings : function(url, data, redirect) {
		$.ajax({
			type: 'post',
			url: url,
			data: data,
			success: function() {
				if (redirect && redirect != '')
					window.parent.location.href = redirect;
			}
		});
	}
};

/* constructor */
x.fc = function(id) {
	this.opener = null;
	this.id = id;
	this.eff = null;
/*
	this.style1 = '';
	this.style2 = '';
*/
	this.position = 'fix-bottom'; // right-bottom, center
	this.prev = false;
	this.view = 1;
	this.overlay = false;
	this.modal = false;
	this.parent = 'body';
}

/* methods */
x.fc.prototype = {
	init : function(hash) {
		try {
			for (var i in hash) this[i] = hash[i];
		} catch(e) {
			alert(e);
		}
	},
	
	overlayAppend : function(id) {
		if (!x.gebi('hideselect_' + id)) {
			$('body').append('<iframe id="hideselect_' + id + '" class="x-hideselect"></iframe><div id="overlay_' + id + '" class="x-overlay"></div>');
			if (x.archive[id].modal != true) {
				$('#overlay_' + id).click(function(e){
					x.bubbling(e);
					x.archive[id].winRemove();
				});
			}
		}
	},
	
	winAppend : function() {
		var parent = this.parent == 'body' ? this.parent : '#' + this.parent;

		switch(this.view) {
			case 1:
				$(parent).append('<div id="' + this.id + '" class="x"><table class="x1"><tr><td class="x1-11 png"><div></div></td><td class="x1-12 pngscale"><div></div></td><td class="x1-13 png"><div></div></td></tr><tr><td class="x1-21 pngscale"><div></div></td><td class="x1-22"><div id="_' + this.id + '"><div class="x1-empty"><div class="loading"></div></div></div></td><td class="x1-23 pngscale"><div></div></td></tr><tr><td class="x1-31 png"><div></div></td><td class="x1-32 pngscale"><div></div></td><td class="x1-33 png"><div></div></td></tr></table></div>');
				break;
			case 2:
				$(parent).append('<div id="' + this.id + '" class="x"><table class="x2"><tr><td class="x2-11 png"><div></div></td><td class="x2-12"><div></div></td><td class="x2-13 png"><div></div></td></tr><tr><td class="x2-21"><div></div></td><td class="x2-22"><div id="_' + this.id + '"><div class="x2-empty"><div class="loading"></div></div></div></td><td class="x2-23"><div></div></td></tr><tr><td class="x2-31 png"><div></div></td><td class="x2-32"><div></div></td><td class="x2-33 png"><div></div></td></tr></table></div>');
		}
		
		if (o = x.gebi(this.id)) o.onclick = function(e){
			x.zChange(this.id);
		};
	},
	
	winPosition: function() {
		if (!x.gebi(this.id)) return;
		
		x.changePosition(this.id);

		$(window).resize(function() {
			try { 
				for (var i in x.archive) {
					if (i != "undefined") {
						x.changePosition(x.archive[i].id);
					}
				}
			} catch(e) {
				//return alert(e); 
			}
		});
	},
	
	win : function(e, _this, url, data) {
		x.bubbling(e);
		
		var id = this.id;
		
		//if (this.opener == _this) {
			//if (url && x.gebi('_'+this.id)) x.load('_'+this.id, url, this.id);
		if (x.gebi('_' + id)) {
			this.winRemove();
		} else {
			this.opener = _this;
			$(_this).addClass('click-active');

			if (!this.prev) {
				try {
					for (var i in x.archive) {
						if (i != "undefined") {
							if (x.archive[i].id != this.id) x.archive[i].winRemove();
						}
					}
				} catch(e) {
					x.debug(e);
				}
			}
			
			try {
				if (this.overlay) this.overlayAppend(this.id);
				this.winAppend();
				this.winPosition();
				
				$('#' + this.id).click(function(e) {
					x.bubbling(e);
					select.hide(); // hide custom select
				});
				if (this.overlay == false) {
					$(document).click(function() { if (typeof x.archive[id] != "undefined") x.archive[id].winRemove(); });
				}
				/*
				if (!this.prev) {
					$(document).unbind('click');
					$(document).click(function() { if (typeof x.archive[id] != "undefined") x.archive[id].winRemove(); });
				}
				*/

				x.zChange(this.id);

				if (url && x.gebi('_'+this.id)) x.load('_'+this.id, url, this.id, data);
			} catch(e) {
				x.debug(e);
			}
		}
		
		_this.blur();
	},
	
	winRemove : function() {
		$(this.opener).removeClass('click-active');
		$('#' + this.id).css({ display:'none' });
		//$('#' + this.id).fadeOut("fast", function(){});
		$('#' + this.id + ',#overlay_' + this.id + ',#hideselect_' + this.id).remove();
		delete x.archive[this.id];
	}
}

