// DaD. last-update: 2005.06.22.
	// (c) snow-materia "http://sm.useyan.com/"
	// This script makes the element-layer Drag and Drop (D&D).


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	Setting
// write the elements by the pair if you want to make D&D from the beginning.
// .. 'target-element-id' : 'control-layer-id', ..
var D_D = {
	'layer-box' : 'layer-bar'
};


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	package DaD
// DaD set
function DaD (box_id, bar_id) {
	// correct ?
	if (D_D == 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
	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
	var that = this;	// this closure
	d_d_addEvents('mousedown', function (e) { that.visible(e); }, false, box);
	d_d_addEvents('mousedown', function (e) { that.drag(e); }, false, bar);
	d_d_addEvents('keydown',   function (e) { that.drag(e); }, false, bar);
	d_d_addEvents('mouseup',   function (e) { that.drop(e); }, false, bar);
	d_d_addEvents('keyup',     function (e) { that.drop(e); }, false, bar);
	d_d_addEvents('mousemove', function (e) { that.move(e); }, false, bar);
	d_d_addEvents('dblclick',  function (e) { that.hide(e); }, false, bar);

	// 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;


// 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 != null) ? box.offsetLeft : null;
	var ly = box.style['top']  || (box.offsetTop != null)  ? box.offsetTop  : null;
	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 = (document.all && !window.opera) ? 25 : 0;

	// margin-x
	if (mx == null) {
		// (x, y) coordinates of event-cursor.
		var xy = getEventPosition(e);

		mx = (xy['document_x'] != null && xy['page_x'] != null) ?
				xy['document_x'] - xy['page_x'] - width - scrbar_width : 0;
		if (mx > 0) mx = 0;
	}
	// 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




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	package Remora
// 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;
	d_d_addEvents('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




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	for d&d layers
// no layer is moving ?
function _lay_no_moving () {
	var d_d_events = DaD.list;
	for (var i = d_d_events.length; i--;) {
		if (d_d_events[i].moving) return false;
	}
	return true;
}
// no text-selection (ie)
function _lay_no_selectstart () {
	return _lay_no_moving();
}
// no text-selection (Gecko)
function _lay_no_selection () {
	if ( _lay_no_moving() ) return true;
	window.getSelection().removeAllRanges();
	return false;
}
// no text-selection (Opera and etc.)
function _lay_no_selectfocus (e) {
	if ( _lay_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.)
function _lay_no_select_etc (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 ?
function _lay_all_out (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']) lay_all_drop();
}
// drop all layers
function lay_all_drop (e) {
	var d_d_events = DaD.list;
	for (var i = d_d_events.length; i--;) {
		if (d_d_events[i].moving) {
			d_d_events[i].drop(e);
		}
	}
}


// display all layers
function lay_all_display (e) {
	var before = D_D.wc_time;
	D_D.wc_time = ( new Date() ).getTime();

	// out of time
	if (!before || before < D_D.wc_time - 2000) return;

	// all hide ?
	var hide = false;
	var d_d_events = DaD.list;
	for (var i = d_d_events.length; i--;) {
		if (d_d_events[i].display) {
			d_d_events[i].hide();
			hide = true;
		}
	}

	// all visible if no visible
	if (!hide) {
		for (var i = d_d_events.length; i--;) {
			d_d_events[i].visible();
		}
	}
}


//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	initialize
function lay_init (e) {
	// top-element
	var top_element = getTopElement();

	// old UA ?
	if (!top_element || !document.getElementById) {
		D_D = null;  return;
	}

	// new DaD
	for (var k in D_D) {
		new DaD(k, D_D[k]);
	}
	D_D = new Object();
	D_D.wc_time = 0;	// double-click-time

	// top-element-events
	d_d_addEvents('mouseup',  lay_all_drop, false, top_element);
	d_d_addEvents('keyup',    lay_all_drop, false, top_element);
	d_d_addEvents('mouseout', _lay_all_out, false, top_element);
	d_d_addEvents('dblclick',  lay_all_display, false, top_element);

	// no selection
	if (window.getSelection && getSelection() && getSelection().removeAllRanges) {
		d_d_addEvents('mousemove', _lay_no_selection, false, top_element);	// Gecko
	} else if (typeof(top_element.onselectstart) == 'object') {
		d_d_addEvents('selectstart', _lay_no_selectstart, false, top_element);	// IE
	} else if (document.createElement && document.appendChild) {
		if ( _lay_no_select_etc(e) ) {	// opera and etc.
			d_d_addEvents('mousedown', _lay_no_selectfocus, false, top_element);
			d_d_addEvents('mousemove', _lay_no_selectfocus, false, top_element);
		}
	}
}




//	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	usaful-tips
// addEvent ?
function d_d_addEvents (type, func, capt, obj) {
	if (obj.addEventListener) obj.addEventListener(type, func, false);	// 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
function getTopElement () {
	var d = document;
	return (d.compatMode && d.compatMode != 'BackCompat' && d.documentElement) ?
				d.documentElement : d.body || d.documentElement || null;
}
// get element style value
function getStyleValue (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;
}
// check this-object
function getEventElement (obj, e) {
	if (!obj.nodeType) {	// ie
		if (!e || typeof(e) != 'object') e = window.event || null;
		if (e && e.srcElement) obj = e.target || e.srcElement;
	}
	return (typeof(obj) == 'object') ? obj : null;
}
// get text in element
function getInnerText (obj) {
	if (!obj || obj.nodeType != 1) return null;
	var text = '';
	// children
	var child_leng = obj.childNodes.length;
	for (var i = 0; i < child_leng; i++) {
		var child = obj.childNodes[i];
		text +=
			(child.nodeType == 1) ? getInnerText(child) :
			(child.nodeType == 3) ? child.nodeValue : '';
	}
	// return text
	return text;
}
// (x, y) coordinates of event-cursor. (inner, scroll, absolute, window, element)
function getEventPosition (e) {
	var pos = {
		window_x   : null, window_y   : null,  page_x   : null, page_y   : null,
		document_x : null, document_y : null,  client_x : null, client_y : null,
		scroll_x   : null, scroll_y   : null,  offset_x : null, offset_y : null
	};

	// top-element
	var top_element = getTopElement();

	// 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;
	}
	// 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;
}




// onload
d_d_addEvents('load', lay_init, false, window);
