// DaD. last-update: 2007.11.22.
	// (c) snow-materia "http://snow-materia.com/"
	// This script makes the element-layer D&D (Drag and Drop).


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	Setting
// write the elements by the pair if you want to make D&D from the beginning.
// .. 'target-element-id' : 'control-layer-id', ..
DaD.DEF = {
	'layeres' : 'layerbar'
};


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	class DaD
// new Object
function DaD (box_id, bar_id) {
	// correct ?
	if (DaD.DEF == null) return null;

	// bar and box element
	var box = (typeof(box_id) == 'string') ? document.getElementById(box_id) : box_id;
	var bar = (typeof(bar_id) == 'string') ? document.getElementById(bar_id) : bar_id;
	if (!box || !box.style) return null;
	if (!bar) bar = box;

	// initialize
	DaD.inited || DaD.init();
	this.release();

	// target
	this.target  = box;
	this.control = bar;

	// switch
	this.def_display = getStyleValue(box, 'display');
	this.display = (this.def_display != 'none') ? true : false;

	// set bar-event
	this.set_bar_event();

	// add className
	box.className += ' D_D ';

	// set box-style
	var bxs = box.style;

	// if display:none
	if (!this.def_display || this.def_display == 'none') bxs['display'] = 'block';

	// box coordinates
	var lx = parseInt(box.offsetLeft) || 0;
	var ly = parseInt(box.offsetTop)  || 0;

	// position:absolute
	bxs['position'] = 'absolute';
	bxs['top']     = ly + 'px';
	bxs['left']    = lx + 'px';
	bxs['bottom']  = 'auto';
	bxs['right']   = 'auto';
	bxs['margin']   = '0';
	bxs['zIndex'] = ++DaD.zIndex;

	// put back value if display:none
	if (!this.def_display || this.def_display == 'none') {
		bxs['display'] = this.def_display;
		this.def_display = 'block';
	}

	// add this-event to "DaD.list"-list
	if (!DaD.list) DaD.list = new Array();
	DaD.list[ DaD.list.length ] = this;

	return this;
}
// DaD-object-list
DaD.list = new Array();

// DaD-z-index
DaD.zIndex = 0;

// set bar-event
DaD.prototype.set_bar_event = function () {
	addEvent('mousedown',         function (self) {
		return function (e) { self.visible(e); }  }(this), false, this.target);
	addEvent('mousedown|keydown', function (self) {
		return function (e) { self.drag(e); }     }(this), false, this.control);
	addEvent('mouseup|keyup',     function (self) {
		return function (e) { self.drop(e); }     }(this), false, this.control);
	addEvent('mousemove',         function (self) {
		return function (e) { self.move(e); }     }(this), false, this.control);
	addEvent('dblclick',          function (self) {
		return function (e) { self.hide(e); }     }(this), false, this.control);
};

// layer-drag
DaD.prototype.drag = function (e) {
	var box = this.target;

	// (x, y) coordinates of event-cursor.
	var xy = getEventPosition(e);
	var x = xy['page_x'];
	var y = xy['page_y'];
	if (x == null || y == null) return;

	// position-absolute
	var lx = box.style['left'] || box.offsetLeft;
	var ly = box.style['top']  || box.offsetTop;
	if (lx == null || ly == null) return;

	// to global
	this.margin_x = parseInt(lx) - x;
	this.margin_y = parseInt(ly) - y;
	this.moving = 1;
};
// D&D-drop
DaD.prototype.drop = function (e) {
	if (!this.moving) return;
	this.set(e);
	this.release();
};
// D&D-move
DaD.prototype.move = function (e) {
	if (!this.moving) return;
	this.set(e);
};


// D&D-release
DaD.prototype.release = function () {
	this.x = null;
	this.y = null;
	this.margin_x = null;
	this.margin_y = null;
	this.moving = 0;
};


// D&D-hide
DaD.prototype.hide = function (e) {
	// object ?
	var box = this.target;

	// display:none
	box.style['visibility'] = 'hidden';
	box.style['display'] = 'none';
	this.display = false;
	this.release();

	if (e) e.cancelBubble = true;
};
// D&D-visible
DaD.prototype.visible = function (e) {
	// object ?
	var box = this.target;

	// display:block
	box.style['visibility'] = 'visible';
	box.style['display'] = this.def_display;
	this.display = true;

	// event ?
	if (e) {
		e.cancelBubble = true;
		box.style['zIndex'] = ++DaD.zIndex;
	}
	else this.release();
};
// D&D-push-button
DaD.prototype.push = function (e, mx, my) {
	// object ?
	var box = this.target;

	// display:block
	box.style['display'] = this.def_display;
	this.display = true;
	this.release();

	// box-offset-width, scrollbar-width (ie)
	var width = parseInt(box.offsetWidth) || 0;
	var scrbar_width = 27;

	// margin-x
	if (mx == null) mx = 0;
	if (mx >= - width) {
		// (x, y) coordinates of event-cursor.
		var xy = getEventPosition(e);
		var _mx = (xy['window_x'] != null && xy['page_x'] != null) ?
					xy['window_x'] - xy['page_x'] - width - scrbar_width : 0;
		if (_mx < 0) mx = _mx;
	}
	// margin-y
	if (my == null) my = 20;

	// set-position
	this.set(e, mx, my);
};


// D&D-set (set layer-position)
DaD.prototype.set = function (e, mx, my) {
	// object ?
	var box = this.target;

	// (x, y) coordinates of event-cursor.
	var xy = getEventPosition(e);
	var x = xy['page_x'];
	var y = xy['page_y'];
	if (x == null || y == null) return;

	// cursor-position
	if (x < 0 || y < 0 || x > xy['document_x'] || y > xy['document_y']) {
		x = this.x;
		y = this.y;
		this.release();
	} else {
		this.x = x;
		this.y = y;
	}
	if (x == null || y == null) return;

	// margin
	if (mx == null) mx = this.margin_x;
	if (my == null) my = this.margin_y;
	if (mx == null || my == null) return;

	// layer-position
	var lx = x + mx;
	var ly = y + my;
	if (lx < 0) lx = 0;
	if (ly < 0) ly = 0;

	// position-absolute
	var bxs = box.style;
	bxs['visibility'] = 'hidden';
//	bxs['display'] = 'none';
//	bxs['position'] = 'absolute';
	bxs['left'] = lx + 'px';
	bxs['top']  = ly + 'px';
	bxs['display'] = this.def_display;
	bxs['visibility'] = 'visible';

	return true;
};
//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	/package DaD




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	for d&d layers
// no layer is moving ?
DaD._no_moving = function () {
	for (var i = DaD.list.length; i--;) {
		if (DaD.list[i].moving) return false;
	}
	return true;
};
// no text-selection (ie)
DaD._no_selectstart = function () {
	return DaD._no_moving();
};
// no text-selection (Gecko)
DaD._no_selection = function () {
	if ( DaD._no_moving() ) return true;
	window.getSelection().removeAllRanges();
	return false;
};
// no text-selection (Opera and etc.)
DaD._no_selectfocus = function (e) {
	if ( DaD._no_moving() ) return true;
	var input = document.getElementById('lay-no-select-dummy');
	input.focus();
	input.blur();
	return false;
};
// no text-selection prepare (Opera and etc.)
DaD._no_select_etc = function (e) {
	var d = document;
	if (!d.body) return false;

	var div = d.createElement('div');
	d.body.appendChild(div);
	Remora.list[ Remora.list.length ] = new Remora(div, -1, e);

	var input = d.createElement('input');
	input.id = 'lay-no-select-dummy';
	div.appendChild(input);

	// style
	var div_sty = div.style;
	var inp_sty = input.style;
	div_sty['border'] = '0';
	div_sty['width']  = '1px';
	div_sty['height'] = '1px';
	inp_sty['border'] = '0';
	inp_sty['width']  = '1px';
	inp_sty['height'] = '1px';

	return true;
};


// window out ?
DaD._all_out = function (e) {
	// (x, y) coordinates of event-cursor.
	var xy = getEventPosition(e);
	var x = xy['page_x'];
	var y = xy['page_y'];
	if (x == null || y == null) return;

	// drop when window out
	if (x < 0 || y < 0 || x >= xy['document_x'] || y >= xy['document_y']) DaD.all_drop();
};
// drop all layers
DaD.all_drop = function (e) {
	for (var i = DaD.list.length; i--;) {
		if (DaD.list[i].moving) {
			DaD.list[i].drop(e);
		}
	}
};


// display all layers
DaD.all_display = function (e) {
	var before = DaD.wc_time;
	DaD.wc_time = ( new Date() ).getTime();

	// out of time
	if (!before || before < DaD.wc_time - 2000) return;

	// all hide ?
	var hide = false;
	var DaD_list = DaD.list;
	for (var i = DaD_list.length; i--;) {
		if (DaD_list[i].display) {
			DaD_list[i].hide();
			hide = true;
		}
	}

	// all visible if no visible
	if (!hide) {
		for (var i = DaD_list.length; i--;) {
			DaD_list[i].visible();
		}
	}
};


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	auto-run
DaD.auto_run = function () {
	if (DaD.auto_run.set) return;  DaD.auto_run.set = true;
	// new DaD
	addEvent('load', function () {
		for (var k in DaD.DEF) new DaD(k, DaD.DEF[k]);
	}, false, window);
};


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	initialize
DaD.init = function (e) {
	if (DaD.inited) return;

	// top-element
	var top_element = getTopElement();

	// old UA ?
	if (!top_element || !document.getElementById) {
		DaD.DEF = null;  return;
	}

	DaD.inited = true;	// run at once
	DaD.wc_time = 0;	// double-click-time

	// top-element-events
	addEvent('mouseup|keyup', DaD.all_drop,    false, top_element);
	addEvent('mouseout',      DaD._all_out,    false, top_element);
	addEvent('dblclick',      DaD.all_display, false, top_element);

	// no selection
	if (window.getSelection && getSelection() && getSelection().removeAllRanges) {
		addEvent('mousemove', DaD._no_selection, false, top_element);	// Gecko
	}
	else if (typeof(top_element.onselectstart) == 'object') {
		addEvent('selectstart', DaD._no_selectstart, false, top_element);	// IE
	}
	else if (document.createElement && document.appendChild) {
		if ( DaD._no_select_etc(e) ) {	// opera and etc.
			addEvent('mousedown|mousemove', DaD._no_selectfocus, false, top_element);
		}
	}
};
DaD.inited = false;




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	package Remora
	// for a browser except IE and Gecko .. Opera and etc.
// Remora set
function Remora (box_id, timeout, e) {
	// bar and box element
	var box = (typeof(box_id) == 'string') ? document.getElementById(box_id) : box_id;
	if (!box || !box.style) return;

	// initialize
	this.timeout = (timeout != null) ? parseInt(timeout) : 0;

	// target
	this.target = box;

	// top-element
	var top_element = getTopElement();

	// set bar-event
	var that = this;
	addEvent('mousemove', function (e) { that.move(e) }, false, top_element);

	// add className
	box.className += ' Remora ';

	// set box-style
	var bxs = box.style;

	// position:absolute
	bxs['position'] = 'absolute';
	bxs['top']     = '0px';
	bxs['left']    = '0px';
	bxs['bottom']  = 'auto';
	bxs['right']   = 'auto';
	bxs['margin']   = '1px';

	// always hidden ?
	if (this.timeout < 0) this.hide();

	// set layer-position
	if (e) this.set(e);

	return this;
}

// Remora-object-list
Remora.list = new Array();

// Remora-move
Remora.prototype.move = function (e) {
	this.set(e);

	// timeout ?
	if (this.timeout > 0) {
		var before = this.time;
		this.time = ( new Date() ).getTime();
		if (this.time > before + this.timeout) this.hide();
	}
};
// Remora-move
Remora.prototype.visible = function (e) {
	// set box-style
	this.target.style['visibility'] = 'visible';
};
// Remora-move
Remora.prototype.hide = function (e) {
	// set box-style
	this.target.style['visibility'] = 'hidden';
};
// Remora-set (set layer-position)
Remora.prototype.set = function (e) {
	// (x, y) coordinates of event-cursor.
	var xy = getEventPosition(e);
	if (xy['page_x'] == null || xy['page_y'] == null) return;

	// set box-style
	var bxs = this.target.style;
	bxs['top']     = xy['page_y'] + 'px';
	bxs['left']    = xy['page_x'] + 'px';
};
//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	/package Remora




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	usaful-tips
// get_attributes_by_text
if (!window.addEvent) window.addEvent = function (typez, func, capt, obj) {
	if (!obj || typeof obj != 'object') return;
	if (window.$AddEvent) return $AddEvent(typez, func, capt, obj);	// Materia?

	var types = typez.split('|');
	for (var i = 0, I = types.length; i < I; i++) {
		var type = types[i];
		// add event
		     if (window.addEventList)  addEventList(type, func, capt, obj);	// Trick?
		else if (obj.addEventListener) obj.addEventListener(type, func, capt);	// DOM2?
		else if (obj.attachEvent)      obj.attachEvent('on'+type, func);	// ie ?
		else {	// Other
			var prev = obj['on'+type];
			obj['on'+type] = (prev) ? function (e) { prev(e); func(e); } : func;
		}
	}
};
// get top-element
if (!window.getTopElement) window.getTopElement = function () {
	var d = document;
	return (d.compatMode && d.compatMode != 'BackCompat' && d.documentElement) ?
				d.documentElement : d.body || d.documentElement || null;
};
// get element style value
if (!window.getStyleValue) window.getStyleValue = function (obj, name) {
	var value =
		(obj.nodeType != 1) ?
			null :
		(window.getComputedStyle) ?
			window.getComputedStyle(obj, '').getPropertyValue(name) :
		(document.defaultView && document.defaultView.getComputedStyle) ?
			document.defaultView.getComputedStyle(obj, '').getPropertyValue(name) :
		(obj.currentStyle) ?
			obj.currentStyle[name] :
		(obj.style) ?
			obj.style[name] : null;
	return value;
};
// (x, y) coordinates of event-cursor. (inner, scroll, absolute, window, element)
if (!window.getEventPosition) window.getEventPosition = function (e) {
	var pos = {
		window_x   : null, window_y   : null,
		document_x : null, document_y : null,  body_x     : null, body_y     : null,
		scroll_x   : null, scroll_y   : null,  page_x     : null, page_y     : null,
		client_x   : null, client_y   : null,  offset_x   : null, offset_y   : null
	};

	// top-element
	var top_element  = getTopElement();
	var body_element = document.body || top_element;

	// size
	if (top_element) {
		// window-size (!ie || ie)
		pos['window_x'] = window.innerWidth  || top_element.offsetWidth;
		pos['window_y'] = window.innerHeight || top_element.offsetHeight;

		// document-size
		pos['document_x'] =
			(top_element.scrollWidth > top_element.offsetWidth) ?
				top_element.scrollWidth : top_element.offsetWidth;
		pos['document_y'] =
			(top_element.scrollHeight > top_element.offsetHeight) ?
				top_element.scrollHeight : top_element.offsetHeight;
		// scroll-position
		pos['scroll_x'] = top_element.scrollLeft;
		pos['scroll_y'] = top_element.scrollTop;
	}
	if (body_element) {
		// document-size
		pos['body_x'] = body_element.offsetWidth;
		pos['body_y'] = body_element.offsetHeight;
	}
	// event-cursor
	if (!e && window.event) e = window.event;	// ie
	if (e) {
		// absolute-cursor-position
		pos['page_x'] = e.pageX || e.clientX + pos['scroll_x'] || null;
		pos['page_y'] = e.pageY || e.clientY + pos['scroll_y'] || null;
/*
		// window-cursor-position
		pos['client_x'] = e.clientX || e.pageX - pos['scroll_x'] || null;
		pos['client_y'] = e.clientY || e.pageY - pos['scroll_y'] || null;

		// element-cursor-position
		pos['offset_x'] = e.offsetX || e.layerX || null;
		pos['offset_y'] = e.offsetY || e.layerY || null;
*/
	}
	// parseInt
	for (var xy in pos) {
		if (pos[xy] != null) pos[xy] = parseInt(pos[xy]);
	}
	return pos;
};




// auto-run
DaD.auto_run();