function PopinClass() {	
	this.config = function () {
		
		// Custom config
		
		// NO EDIT ABOVE THIS LINE
		
		this.mypopin = new Array();
		mypopin = this.mypopin;
		mypopin['drag'] = 'title';
		mypopin['titlebar_text'] = ' ';
		mypopin['width'] = 450;
		mypopin['height'] = 510;
		
		// NO EDIT BELOW THIS LINE
		
	};
	this.buildAll = function () {
		obj = new this.config;
		c = 0;
		// build a Popin type object for each popin and return an array
		popins = new Array();
		for (x in obj) {
			params = eval(x);
			eval(x + " = new Popin");
			for (y in eval(params)) {
				eval(x + ".config['" + y + "'] = obj." + x + "['" + y + "']");
			}
			eval(x + ".config['id'] = '" + x + "'");
			eval(x + ".config['z_index'] = '" + (c + 10) + "'");
			popins[c] = x;
			c += 10;
		}
		return popins;
	};
};
function PopinBuild(id, config, zIndex, divClass, divContents, open) {
	// build a Popin on the fly
	// 'config' must be an array
	defined = true;
	try  {
		eval(id);
	}
	catch (e) {
		defined = false;
	}
	if (defined) {
		if (open === true) {
			eval(id).open();
			return false;
		} else {
			return false;
		}
	}
	eval(id + " = new Popin");
	if (config !== '') {
		for (y in config) {
			eval(id + ".config['" + y + "'] = '" + config[y] + "'");
		}
	}
	eval(id + ".config['id'] = '" + id + "'");
	eval(id + ".config['z_index'] = '" + zIndex + "'");
	div = document.createElement('DIV');
	div.setAttribute('id', id);
	div.className = divClass;
	div.innerHTML = divContents;
	div.style.display = 'none';
	body = document.getElementsByTagName('body');
	body[0].appendChild(div);
	if (open === true) {
		eval(id + '.open()');
	}
	document.popinObjects[document.popinObjects.length] = eval(id);
	return id;
};
function Popin() {
	
	// popin status flags
	this.status_open = false;
	this.status_first = true;
	
	// default config paramenters
	this.config = new Array();
	this.config['id'] = 'popin_id'; // div id, also object name
	this.config['width'] = 400; // width in pixels
	this.config['height'] = 300; // height in pixels
	this.config['drag'] = 'no'; // dragable popin, when set to 'yes', the popin will be dragable clicking anywhere on it, if set to 'title' it will be dragable clicking on the title bar (possible values: yes|no|title)
	this.config['autocenter'] = 'yes'; // center the popin when opening (possible values: yes|no)
	this.config['offset_top'] = 0; // vertical offset relative to the left-top corner of view port, autocenter position of opening id
	this.config['offset_left'] = 0; // horizontal offset, similar to the above
	this.config['keep_position'] = 'no'; // remember popin position if reopen (possible values: yes|no)
	this.config['x_button'] = 'yes'; // X button for closing the popin (possible values: yes|no)
	this.config['x_side'] = 'right'; // position of the X button if active (possible values: left|right)
	this.config['click_close'] = 'no'; // close the popin when clicked on it (possible values: yes|no)
	this.config['transparency'] = 0; // popin transparency in %; 0 is opaque (possible values: 0-100); 100 would mean the popin is not visible (shadow is visible if not deactivated)
	this.config['shadow'] = 'no'; // popin shadow
	this.config['shadow_transparency'] = 70; // shadow transparency in % (possible values: 0-100); 100 would mean no shadow
	this.config['shadow_distance'] = 7; // shadow offset in pixels relative from any corner
	this.config['shadow_position'] = 'se'; // shadow direction, the value 'se' (south-east) would mean toward right-bottom from the popin (possible values: nw|ne|se|sw)
	this.config['resizable'] = 'no'; // resizable popin, a small icon will appear in the bottom-right corner for resize (possible values: yes|no)
	this.config['fadein'] = 'no'; // fadein when opening (possible values: yes|no)
	this.config['fadein_speed'] = 10; // fadein speed in milliseconds (1 millisecond = 1 second) as interval between 5 percents of transparency
	this.config['fadeout'] = 'no'; // fadeout when closing (possible values: yes|no)
	this.config['fadeout_speed'] = 10; // fadeout speed in milliseconds
	this.config['scrollbars'] = 'no'; // 'yes' to show scrollbars when content is exceeding the popin dimension,
										// 'no' will make the popin the clip the contents
										// 'auto' will expand the popin, but autocentering vertically will not be exact and you will have to adjust with offset_top to position the popup
										// (possible values: yes|no|auto)
	this.config['overlay'] = 'no'; // overlay behind popin (possible values: yes|no)
	this.config['overlay_transparency'] = 20; // overlay transparency in % (possible values: 0-100); 100 would mean completely transparent, but will still block everything behind
	this.config['overlay_color'] = '#000000'; // overlay color in hex (#RRGGBB)
	this.config['titlebar'] = 'yes'; // title bar (possible values: yes|no)
	this.config['titlebar_text'] = 'My Popin'; // popin title (for apostrophes use \' )
	this.config['titlebar_position'] = 'center'; // title position(possible values: left|center|right)
	
	this.open = function () { // PUBLIC: open the popin
		this.popinObj = document.getElementById(this.config['id']);
		if (!this.popinObj || this.status_open) { // no div with popin's id found? already open?
			return false;
		}
		//if (this.status_first) { // draw the popin
			this._draw(this.popinObj);
		//}
		if (this.config['fadein'] == 'yes') { // fadein or suddenly show the popin
			this._fadeIn();
		} else {
			this._setTransparency(this.config['transparency']);
		}
		if (this.config['drag'] == 'yes') { // attach drag events
			DragHandler.attach(this.popinObj);
		} else if (this.config['drag'] == 'title') {
			DragTitle.attach(this.titlebar);
		}
		if (this.overlay) { // show the overlay if set
			this.overlay.style.display = 'block';
		}
		this.status_first = false;
		this.status_open = true;
		this.zIndex();
		return false;
	};
	this._draw = function (obj) { //PRIVATE: redraw the contents and css of the popin
		// scrollbars
		if (this.config['scrollbars'] == 'yes') {
			obj.style.overflow = 'auto';
		} else if (this.config['scrollbars'] == 'no') {
			obj.style.overflow = 'hidden';
		} else {
			this.config['height'] = '';
		}
		
		// set proper z-index in stack
		obj.style.zIndex = this.config['z_index'];
		
		if (this.config['overlay'] == 'yes') { // show overlay if set
			win = this._findSize();
			this.overlay = document.createElement('DIV');
			this.overlay.setAttribute('id', this.config['id'] + '_overlay');
			this.overlay.innerHTML = ' ';
			this.overlay.style.position = 'absolute';
			this.overlay.style.top = '0';
			this.overlay.style.left = '0';
			this.overlay.style.width = win[0] + 'px';
			this.overlay.style.height = win[1] + 'px';
			this.overlay.style.zIndex = Number(this.config['z_index']) - 2;
			this.overlay.style.backgroundColor = this.config['overlay_color'];
			this.overlay.style.opacity = (100 - this.config['overlay_transparency']) / 100;
			this.overlay.style.filter = 'alpha(opacity=' + (100 - this.config['overlay_transparency']) + ')';
			body = document.getElementsByTagName('body');
			body[0].appendChild(this.overlay);
		}
		
		// set popin position
		obj.style.position = 'absolute'; // fly high...
		if (!this.status_open && (this.config['keep_position'] == 'no' || this.status_first)) { // calculate position only when not already open and position should not be kept
			this._position(obj);
		}
		if (this.config['shadow'] == 'yes' && this.status_first) { // create the shadow if set and if not already built when the popin was open for the 1st time
			this.shadowObj = this._makeShadow(this.popinObj);
		}
		// resize button
		if (this.config['resizable'] == 'yes') {
			if (typeof this.resize_button == 'undefined') {
				this.resize_button = this._makeResizeButton(obj);
				ResizeHandler.attach(this.resize_button);
			} else {
				this.resize_button.style.left = (parseInt(obj.style.width) - parseInt(this.resize_button.style.width)) + 'px';
				this.resize_button.style.top = (parseInt(obj.style.height) - parseInt(this.resize_button.style.height)) + 'px';
			}
		}
		// close options
		f = this.config['id'] + ".close();";
		z = this.config['id'] + ".zIndex();";
		if (this.config['click_close'] == 'yes') {
			this._attachEvent(obj, 'click', new Function(f));
		} else {
			this._attachEvent(obj, 'click', new Function(z));
		}
		if (this.config['x_button'] == 'yes') {
			if (typeof this.x_button == 'undefined') {
				this.x_button = this._makeXButton(obj);
				this._attachEvent(this.x_button, 'click', new Function(f));
			} else {
				this.x_button.style.left = (parseInt(obj.style.width) - parseInt(this.x_button.style.width)) + 'px';
			}
		}
		// titlebar
		if (typeof this.titlebar == 'undefined' && this.config['titlebar'] == 'yes') {
			this._makeTitlebar();
		}
	};
	this.close = function () { // PUBLIC: close the popin
		this.popinObj = document.getElementById(this.config['id']);
		if (this.status_open == false) { // if it's not really open, then don't do anything
			return false;
		}
		this.status_open = false;
		if (this.config['fadeout'] == 'yes') { // fadeout
			this._fadeOut();
		}
		if (this.overlay) { // hide overlay
			this.overlay.style.display = 'none';
		}
		if (this.config['fadeout'] == 'no' || this.popinObj.style.opacity === 0) {
			this.popinObj.style.display = 'none';
		}
		if (this.shadowObj && (this.config['fadeout'] == 'no' || this.shadowObj.style.opacity === 0)) {
			this.shadowObj.style.display = 'none';
		}
		return false;
	};
	this._position = function (obj) { // PRIVATE: calculate position of the popin
		obj.style.width = this.config['width'].toString() + 'px';
		if (this.config['height'] != 0) {
			obj.style.height = this.config['height'].toString() + 'px';
		} else {
			obj.style.height = '';
		}
		if (this.config['autocenter'] == 'yes') { // position in center of window if set to 'yes'
			win = this._findSize();
			popin_left = Math.round((win[0] - this.config['width']) / 2);
			popin_top = Math.round((win[1] - this.config['height']) / 2) + this._findScrollTop();
			popin_left += this.config['offset_left'];
			popin_top += this.config['offset_top'];
		} else {
			popin_left = this.config['offset_left'];
			popin_top = this.config['offset_top'];
		}
		obj.style.left = popin_left.toString() + 'px';
		obj.style.top = popin_top.toString() + 'px';
	};
	this._findScrollTop = function () {
		scroll_top = document.body.scrollTop;
		if (scroll_top === 0) {
			if (window.pageYOffset) {
				scroll_top = window.pageYOffset;
			} else {
				scroll_top = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
			}
		}
		return scroll_top;
	};
	this._fadeIn = function () { // PRIVATE: fadein
		time = this.config['fadein_speed'];
		// gradually fade the popin
		for (i = 100; i >= this.config['transparency']; i = i - 5) {
			setTimeout(this.config['id'] + "._setTransparency(" + i + ")", time);
			time += this.config['fadein_speed'];
		}
		if (this.shadowObj) { // gradually fade the shadow
			for (i = 100; i >= this.config['shadow_transparency']; i = i - 5) {
				setTimeout(this.config['id'] + "._setShadowTransparency(" + i + ")", time);
				time += this.config['fadein_speed'];
			}
		}
	};
	this._fadeOut = function () { // PRIVATE: fadeout
		time = this.config['fadeout_speed'];
		if (this.shadowObj) { // gradually fade the shadow
			for (i = this.config['shadow_transparency']; i <= 100; i = i + 5) {
				setTimeout(this.config['id'] + "._setShadowTransparency(" + i + ")", time);
				time += this.config['fadeout_speed'];
			}
		}
		// gradually fade the popin
		for (i = this.config['transparency']; i <= 100; i = i + 5) {
			setTimeout(this.config['id'] + "._setTransparency(" + i + ")", time);
			time += this.config['fadeout_speed'];
		}
		setTimeout(this.config['id'] + "._displayNone(document.getElementById('" + this.config['id'] + "'))", time);
	};
	this._displayNone = function (obj) { // PRIVATE: set display none to html object
		obj.style.display = 'none';
	}
	this._attachEvent = function (elem, eventName, handler) { // PRIVATE: cross-browser event attach
		if (elem.attachEvent) {
			elem.attachEvent('on' + eventName, handler);
			return true;
		} else if (elem.addEventListener) {
			elem.addEventListener(eventName, handler, false);
			return true;
		}
		return false;
	};
	this._setTransparency = function (transparency) { // PRIVATE: set popin transparency
		this.popinObj.style.opacity = (100 - transparency) / 100;
		this.popinObj.style.filter = 'alpha(opacity=' + (100 - transparency) + ')';
		this.popinObj.style.display = 'block';
	};
	this._setShadowTransparency = function (transparency) { // PRIVATE: set shadow transparency
		this.shadowObj.style.opacity = (100 - transparency) / 100;
		this.shadowObj.style.filter = 'alpha(opacity=' + (100 - transparency) + ')';
		this.shadowObj.style.display = 'block';
	};
	this._makeShadow = function (obj) { // PRIVATE: generate shadow in new div behind popin according to config
		shadow = document.createElement('div');
		shadow.innerHTML = '&nbsp;';
		shadow.style.backgroundColor = '#000000';
		shadow.style.width = obj.style.width;
		shadow.style.height = obj.style.height;
		shadow.style.position = 'absolute';
		horizontal_pos = this.config['shadow_position'].substr(1,1);
		vertical_pos = this.config['shadow_position'].substr(0,1);
		if (horizontal_pos == 'w') {
			shadow_left = parseInt(obj.style.left) - this.config['shadow_distance'];
		} else {
			shadow_left = parseInt(obj.style.left) + this.config['shadow_distance'];
		}
		if (vertical_pos == 'n') {
			shadow_top = parseInt(obj.style.top) - this.config['shadow_distance'];
		} else {
			shadow_top = parseInt(obj.style.top) + this.config['shadow_distance'];
		}
		shadow.style.left = shadow_left.toString() + 'px';
		shadow.style.top = shadow_top.toString() + 'px';
		shadow.style.zIndex = Number(this.config['z_index']) - 1;
		shadow.style.opacity = (100 - this.config['shadow_transparency']) / 100;
		shadow.style.filter = 'alpha(opacity=' + (100 - this.config['shadow_transparency']) + ')';
		shadow.setAttribute('id', this.config['id'] + '_shadow');
		if (this.config['fadein'] == 'yes') { // if fadein is requires, set opacity to 0 until the fade begins
			shadow.style.opacity = 0;
			shadow.style.filter = 'alpha(opacity=0)';
		}
		body = document.getElementsByTagName('body');
		body[0].appendChild(shadow);
		return shadow;
	};
	this._makeXButton = function (obj) { // PRIVATE: generate shadow in new div behind popin according to config
		button = document.createElement('div');
		button.setAttribute('id', this.config['id'] + '_xbutton');
		button.innerHTML = 'x';
		button.style.fontSize = '10px';
		button.style.textAlign = 'center';
		//button.style.backgroundColor = '#f0f0f0';
		button.style.width = '10px';
		button.style.height = '10px';
		button.style.position = 'absolute';
		button.style.cursor = 'pointer';
		if (this.config['x_side'] == 'right') {
			button.style.left = (parseInt(obj.style.width) - parseInt(button.style.width)) + 'px';
		} else {
			button.style.left = '0';
		}
		button.style.top = '0';
		button.style.zIndex = Number(this.config['z_index']) + 2;
		obj.appendChild(button);
		return button;
	};
	this._makeResizeButton = function (obj) { // PRIVATE: generate shadow in new div behind popin according to config
		button = document.createElement('div');
		button.setAttribute('id', this.config['id'] + '_resize');
		button.innerHTML = '&gt;';
		button.style.fontSize = '10px';
		button.style.textAlign = 'center';
		button.style.backgroundColor = '#f0f0f0';
		button.style.width = '10px';
		button.style.height = '10px';
		button.style.position = 'absolute';
		button.style.cursor = 'pointer';
		button.style.left = (parseInt(obj.style.width) - parseInt(button.style.width)) + 'px';
		button.style.top = (parseInt(obj.style.height) - parseInt(button.style.height)) + 'px';
		button.style.zIndex = Number(this.config['z_index']) + 3;
		obj.appendChild(button);
		return button;
	};
	this._makeTitlebar = function () { // PRIVATE: build title bar
		this.titlebar = document.createElement('DIV');
		this.titlebar.setAttribute('id', this.config['id'] + '_titlebar');
		this.titlebar.innerHTML = this.config['titlebar_text'];
		this.popinObj.insertBefore(this.titlebar, this.popinObj.firstChild);
		this.titlebar = document.getElementById(this.config['id'] + '_titlebar');
		this.titlebar.style.textAlign = this.config['titlebar_position'];
		if (this.config['x_button'] == 'yes') { // pad the title from behind the X button
			if (this.config['titlebar_position'] == 'right' && this.config['x_side'] == 'right') {
				this.titlebar.style.paddingRight = (parseInt(this.x_button.style.width) + 3) + 'px';
			} else if (this.config['titlebar_position'] == 'left' && this.config['x_side'] == 'left') {
				this.titlebar.style.paddingLeft = (parseInt(this.x_button.style.width) + 3) + 'px';
			}
		}
	};
	this._findSize = function () { // PRIVATE: find inner window sizes
		myWidth = 0;
		myHeight = 0;
		if (typeof(window.innerWidth) == 'number') { // Non-IE
			myWidth = window.innerWidth;
			myHeight = window.innerHeight;
		} else if (document.documentElement &&
				  (document.documentElement.clientWidth || document.documentElement.clientHeight)) { // IE 6+ in 'standards compliant mode'
			myWidth = document.documentElement.clientWidth;
			myHeight = document.documentElement.clientHeight;
		} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) { // IE 4 compatible
			myWidth = document.body.clientWidth;
			myHeight = document.body.clientHeight;
		}
		ret = new Array(myWidth, myHeight);
		return ret;
	};
	this.zIndex = function () { // PUBLIC: push popin above all others
		popins = document.popinObjects;
		higher_index = Number(this.config['z_index']);
		for (i in popins) {
			if (typeof popins[i] !== 'string') {
				continue;
			}
			thePopin = eval(popins[i]);
			crt_index = Number(thePopin.config['z_index']);
			if (thePopin.config['id'] != this.config['id']) {
				if (crt_index >= higher_index) {
					higher_index = crt_index;
				}
			}
		}
		if (higher_index > Number(this.config['z_index'])) {
			this.config['z_index'] = higher_index + 10;
			document.getElementById(this.config['id']).style.zIndex = this.config['z_index'];
			shadow = document.getElementById(this.config['id'] + '_shadow');
			if (shadow) {
				shadow.style.zIndex = this.config['z_index'] - 1;
			}
			overlay = document.getElementById(this.config['id'] + '_overlay');
			if (overlay) {
				overlay.style.zIndex = this.config['z_index'] - 2;
			}
			xbutton = document.getElementById(this.config['id'] + '_xbutton');
			if (xbutton) {
				xbutton.style.zIndex = this.config['z_index'] + 2;
			}
			resize = document.getElementById(this.config['id'] + '_resize');
			if (resize) {
				resize.style.zIndex = this.config['z_index'] + 3;
			}
		}
	};
};
// Crossbrowser Drag Handler by  http://www.webtoolkit.info/ (adapted)
DragHandler = {
	// private properties.
	_oElem : null,
	// public method. Attach drag handler to an element.
	attach : function(oElem) {
		oElem.onmousedown = DragHandler._dragBegin;
		// callbacks
		oElem.dragBegin = new Function();
		oElem.drag = new Function();
		oElem.dragEnd = new Function();
		return oElem;
	},
	// private method. Begin drag process.
	_dragBegin : function(e) {
		var oElem = DragHandler._oElem = this;
		if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
		if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; }
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		e = e ? e : window.event;
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		resizeObj = document.getElementById(oElem.getAttribute('id') + '_resize');
		if (resizeObj &&
			oElem.mouseX >= parseInt(resizeObj.style.left) + x &&
			oElem.mouseX <= parseInt(resizeObj.style.left) + x +parseInt(resizeObj.style.width) &&
			oElem.mouseY >= parseInt(resizeObj.style.top) + y &&
			oElem.mouseY <= parseInt(resizeObj.style.top) + y + parseInt(resizeObj.style.height)) {
		} else {
			oElem.dragBegin(oElem, x, y);
			document.onmousemove = DragHandler._drag;
			document.onmouseup = DragHandler._dragEnd;
			return false;
		}
	},
	// private method. Drag (move) element.
	_drag : function(e) {
		var oElem = DragHandler._oElem;
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		id = oElem.getAttribute('id');
		shadow = document.getElementById(id + '_shadow');
		if (shadow) {
			shadow_x = x - parseInt(shadow.style.left);
			shadow_y = y - parseInt(shadow.style.top);
		}
		e = e ? e : window.event;
		oElem.style.left = x + (e.clientX - oElem.mouseX) + 'px';
		oElem.style.top = y + (e.clientY - oElem.mouseY) + 'px';
		if (shadow) {
			shadow.style.left = (parseInt(oElem.style.left) - shadow_x) + 'px';
			shadow.style.top = (parseInt(oElem.style.top) - shadow_y) + 'px';
		}
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		oElem.drag(oElem, x, y);
		return false;
	},
	// private method. Stop drag process.
	_dragEnd : function() {
		var oElem = DragHandler._oElem;
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		oElem.dragEnd(oElem, x, y);
		document.onmousemove = null;
		document.onmouseup = null;
		DragHandler._oElem = null;
	}
};
// Drag with Titlebar
DragTitle = {
	// private properties.
	_oElem : null,
	// public method. Attach drag handler to an element.
	attach : function(oElem) {
		oElem.onmousedown = DragTitle._dragBegin;
		// callbacks
		oElem.dragBegin = new Function();
		oElem.drag = new Function();
		oElem.dragEnd = new Function();
		return oElem;
	},
	// private method. Begin drag process.
	_dragBegin : function(e) {
		var oElem = DragTitle._oElem = this;
		if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
		if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; }
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		e = e ? e : window.event;
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		oElem.dragBegin(oElem, x, y);
		document.onmousemove = DragTitle._drag;
		document.onmouseup = DragTitle._dragEnd;
		return false;
	},
	// private method. Drag (move) element.
	_drag : function(e) {
		var oElem = DragTitle._oElem;
		id = oElem.getAttribute('id');
		id = id.substr(0, id.length - 9);
		popin = document.getElementById(id);
		var x = parseInt(popin.style.left);
		var y = parseInt(popin.style.top);
		shadow = document.getElementById(id + '_shadow');
		if (shadow) {
			shadow_x = x - parseInt(shadow.style.left);
			shadow_y = y - parseInt(shadow.style.top);
		}
		e = e ? e : window.event;
		popin.style.left = x + (e.clientX - oElem.mouseX) + 'px';
		popin.style.top = y + (e.clientY - oElem.mouseY) + 'px';
		if (shadow) {
			shadow.style.left = (parseInt(oElem.style.left) - shadow_x) + 'px';
			shadow.style.top = (parseInt(oElem.style.top) - shadow_y) + 'px';
		}
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		oElem.drag(oElem, x, y);
		return false;
	},
	// private method. Stop drag process.
	_dragEnd : function() {
		var oElem = DragTitle._oElem;
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		oElem.dragEnd(oElem, x, y);
		document.onmousemove = null;
		document.onmouseup = null;
		DragTitle._oElem = null;
	}
};

// Resize Handler adapted after the Drag Handler
ResizeHandler = {
	// private properties.
	_oElem : null,
	// public method. Attach drag handler to an element.
	attach : function(oElem) {
		oElem.onmousedown = ResizeHandler._dragBegin;
		// callbacks
		oElem.dragBegin = new Function();
		oElem.drag = new Function();
		oElem.dragEnd = new Function();
		return oElem;
	},
	// private method. Begin drag process.
	_dragBegin : function(e) {
		var oElem = ResizeHandler._oElem = this;
		if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
		if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; }
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		e = e ? e : window.event;
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		oElem.dragBegin(oElem, x, y);
		document.onmousemove = ResizeHandler._drag;
		document.onmouseup = ResizeHandler._dragEnd;
		return false;
	},
	// private method. Drag (move) element.
	_drag : function(e) {
		var oElem = ResizeHandler._oElem;
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		e = e ? e : window.event;
		oElem.style.left = x + (e.clientX - oElem.mouseX) + 'px';
		oElem.style.top = y + (e.clientY - oElem.mouseY) + 'px';
		id = oElem.getAttribute('id').substr(0,oElem.getAttribute('id').length - 7);
		_obj = document.getElementById(id);
		_obj.style.width = parseInt(oElem.style.width) + x + (e.clientX - oElem.mouseX) + 'px';
		_obj.style.height = parseInt(oElem.style.height) + y + (e.clientY - oElem.mouseY) + 'px';
		xbuttonObj = document.getElementById(id + '_xbutton');
		if (xbuttonObj && parseInt(xbuttonObj.style.left) != 0) {
			xbuttonObj.style.left = parseInt(oElem.style.width) + x + (e.clientX - oElem.mouseX) - parseInt(xbuttonObj.style.width) + 'px';
		}
		shadow = document.getElementById(id + '_shadow');
		if (shadow) {
			shadow.style.width = _obj.style.width;
			shadow.style.height = _obj.style.height;
		}
		oElem.mouseX = e.clientX;
		oElem.mouseY = e.clientY;
		oElem.drag(oElem, x, y);
		return false;
	},
	// private method. Stop drag process.
	_dragEnd : function() {
		var oElem = ResizeHandler._oElem;
		var x = parseInt(oElem.style.left);
		var y = parseInt(oElem.style.top);
		oElem.dragEnd(oElem, x, y);
		document.onmousemove = null;
		document.onmouseup = null;
		ResizeHandler._oElem = null;
	}
};

// build defined popins
function initPopin() {
	popinObjects = new PopinClass;
	document.popinObjects = popinObjects.buildAll();
};
initPopin();