/*

sh format:

var decButtonOver = 
{
	background:'button_over.png', //background image
	foreground:'button_o.png', // foreground png. Use carefuly
	size:{w:100,h:60}, //background/forreground images size (both must be the same)
	container:{left:5,right:5,top:5,bottom:5}, // the margins the contained div will have 
	shadow:{left:10,right:10,top:10,bottom:10}, // the shadow margins in the image
	crop:{left:20,right:20,top:20,bottom:20}, // crop definitions for background/foreground scaling
	blank:{left:7,right:7,top:7,bottom:7} // subtract from images while drawing
};

var decButton = 
{
	background:'button.png',
	foreground:'button_o.png',
	over:decButtonOver, // reference to another decoration descriptor case mouse over
	size:{w:100,h:60},
	container:{left:5,right:5,top:5,bottom:5},
	shadow:{left:10,right:10,top:10,bottom:10},
	crop:{left:20,right:20,top:20,bottom:20},
	blank:{left:7,right:7,top:7,bottom:7}
};
*/

function preloadDecoration( sh )
{
	if( isdefined( sh.background ) ) preloadimg( sh.background );
	if( isdefined( sh.foreground ) ) preloadimg( sh.foreground );
}

var usingDecoration = false; 

function decorate( sh, div, isinline )
{
	usingDecoration = true;
	function forwardMouseEvent( ev )
	{
		if( ie ) ev = event;
		var target = ie ? ev.srcElement : ev.target;
		target = target.parentNode.parentNode;
		target.style.display = 'none';
		var o = document.elementFromPoint(ev.clientX, ev.clientY);
		var tag = o.tagName;
		if( o.tagName == 'A' || o.tagName == 'BUTTON' )
			target.style.cursor = 'pointer';
		else 
			target.style.cursor = getCSSValue( o, 'cursor' );

		function fireEvent( o, evtype )
		{
			if( evtype == 'mousemove' ) return;
			if( ie )
			{
				o.fireEvent( 'on' + evtype );
				if( isdefined( o[evtype] )) o[evtype]();
			}
			else
			{
				var evt = document.createEvent("MouseEvents");
				evt.initMouseEvent(evtype, true, true, window, ev.detail, ev.screenX, ev.screenY, ev.clientX, ev.clientY, false, false, false, false, 0, null);
				o.dispatchEvent( evt );
				if( evtype == 'click' && tag == 'A' && firefox )
				{
					var f = ce( 'FORM' );
					f.method = 'GET';
					f.action = o.href;
					f.target = o.target;
					document.body.appendChild(f);
					f.submit();
				}
			}
		}
		if( o != target.lastObj && isdefined( target.lastObj ) )
		{
			fireEvent( target.lastObj, 'mouseout' );
			fireEvent( o, 'mouseover' );
		}
		fireEvent( o, ev.type );
		target.lastObj = o;
		target.style.display = 'block';
	}

	function forwardClick( ev )
	{
		if( ie ) this.div.click();
		else
		{
			var evt = document.createEvent("MouseEvents");
			evt.initMouseEvent( 'click', true, true, window, null, null, null, null, null, false, false, false, false, 0, null);
			this.div.dispatchEvent( evt );
		}
		
	}
	var isdiv = div.tagName == 'DIV' || div.tagName == 'SPAN';
	var isbutton = false;
	var isfield = false;
	if( div.tagName == 'INPUT' || div.tagName == 'TEXTAREA' )
	{
		if( div.type == 'button' || div.type == 'submit' || div.type == 'reset' ) isbutton = true;
		if( div.type == 'text' || div.type == 'password' || div.tagName == 'TEXTAREA' ) isfield = true;
	}
	var wrapper, container;

	div.cktid = null;
	div.style.border = '0px';
	div.style.outline = '0px';
	div.style.margin = '0px';
	var mleft = getCSSValueNum( div, 'marginLeft' );
	var mright = getCSSValueNum( div, 'marginRight' );
	var mtop = getCSSValueNum( div, 'marginTop' );
	var mbottom = getCSSValueNum( div, 'marginBottom' );
	var top = getCSSValue( div, 'top' );
	var left = getCSSValue( div, 'left' );
	var bottom = getCSSValue( div, 'bottom' );
	var right = getCSSValue( div, 'right' );
	var width = isdiv ? getWidth(div) : div.clientWidth;
	var height = isdiv ? getHeight(div) : div.clientHeight;
	var styleFloat = getCSSValue( div, 'cssFloat' );
	var parent = div.parentNode;
	var bg = null, fg = null;
	if( !isdefined( div.wrapper ) )
	{
		wrapper = ce( 'DIV' );
		parent.insertBefore( wrapper, div );
		parent.removeChild( div );
		container = ce( 'DIV' );
		div.w = width;
		div.h = height;
	}
	else
	{
		wrapper = div.wrapper;
		container = wrapper.container;
		bg = wrapper.bg;
		fg = wrapper.fg;
		if( isfield )
		{
			width = div.w;
			height = div.h;
		}
	}
	container.style.position = 'absolute';
	container.style.top = sh.container.top+sh.shadow.top - sh.blank.top;
	container.style.left = sh.container.left+sh.shadow.left - sh.blank.left;
	container.style.width = width;
	container.style.height = height;
	container.style.overflow = 'hidden';

	
	div.style.backgroundColor = 'transparent';
	div.style.backgroundImage = '';
	
	wrapper.margin = 0;
	wrapper.style.height = 'auto';
	wrapper.style.padding = '0px';

	width += sh.container.left + sh.container.right + sh.shadow.left + sh.shadow.right - sh.blank.left - sh.blank.right;
	height += sh.container.top + sh.container.bottom + sh.shadow.top + sh.shadow.bottom - sh.blank.top - sh.blank.bottom;

	wrapper.style.position = 'relative';
	wrapper.style.width = width;
	wrapper.style.height = height;
	wrapper.style.overflow = 'hidden';

	bg = imgDraw( bg, sh.background, sh.size.w, sh.size.h, sh.crop.left, sh.crop.top, sh.crop.right, sh.crop.bottom, width + sh.blank.left + sh.blank.right, height + sh.blank.top + sh.blank.bottom );
	bg.style.position = 'absolute';
	bg.style.top = -sh.blank.top;
	bg.style.left = -sh.blank.left;
//	alert( bg.innerHTML );

	if( isdefined( sh.foreground ) )
	{
		fg = imgDraw( fg, sh.foreground, sh.size.w, sh.size.h, sh.crop.left, sh.crop.top, sh.crop.right, sh.crop.bottom, width + sh.blank.left + sh.blank.right, height + sh.blank.top + sh.blank.bottom );
		fg.style.position = 'absolute';
		fg.style.top = -sh.blank.top;
		fg.style.left = -sh.blank.left;
		if( isdiv )
		{
			fg.onmousedown = forwardMouseEvent;
			fg.onclick = forwardMouseEvent;
			fg.onmousemove = forwardMouseEvent;
		}
		if( isfield )
		{
			fg.onclick = function() { div.focus() };
		}
		if( isbutton )
		{
			fg.forwardClick = forwardClick;
			fg.onclick = fg.forwardClick;
			fg.style.cursor = 'pointer';
		}
	}

	function divResizeCheck( div )
	{ 
		if( ie ) e = event;
		if( div.ignore ) return;
		if( ie ) detachOnResize( div );
		div.ignore = true;
		var h = getHeight(div);
		if( div.savedHeight != h )
		{
			div.style.offsetTop = 0;
//debug( 'divcheck', getCSSValue( div, 'offsetTop' ) );
			div.savedHeight = h;
			decorate( div.sh, div );
			var o = div;
		}
		divImgWatch( div );
		div.ignore = false;
		if( ie ) attachOnResize( div );
		div.cktid = null;
	}

	function divCheck()
	{
		if( this.cktid != null || this.ignore )
			return;
		var o = this;
		this.cktid = setTimeout( function() { divResizeCheck( o ); }, 100 );
	}

	function divImgWatch( o )
	{
		if( ie ) return;
		var ilist = o.getElementsByTagName('IMG');
		var div = o;
		for( var i = 0 ; i < ilist.length ; i++ )
			if( ilist[i].skip != true )
			{
				if( ilist[i].onload != null )
				{
					ilist[i].ckdiv = o;
					ilist[i]._onload = ilist[i].onload;
					ilist[i].onload = function(ev) { this._onload(); this.ckdiv.divCheck(); }
				}
				ilist[i].skip = true;
			}
	}

	function attachOnResize( o )
	{
		o.divCheck = divCheck;
		if( ie ) var f = function() { o.onresize = divCheck; }
		else var f = function() { o.addEventListener ('DOMSubtreeModified', divCheck, false) };
		setTimeout( f, 100 );
	}
	function detachOnResize( o )
	{
		if( ie ) o.onresize = null;
		else o.removeEventListener ('DOMSubtreeModified', divCheck, false);
	}

	div.sh = sh;
	wrapper.style.margin = 0;
	if( !isdefined( div.wrapper ) )
	{
		wrapper.appendChild( bg );
		wrapper.appendChild( container );
		if( fg != null ) wrapper.appendChild( fg );
		container.appendChild( div );
		wrapper.bg = bg;
		wrapper.fg = fg;
		wrapper.container = container;
		wrapper.div = div;
		if( fg != null )fg.div = div;
		div.wrapper = wrapper;
		div.container = container;
		if( isdiv && ie ) divResizeCheck( div );
		divImgWatch( div );
		if( isfield )
		{
			bg.onclick = function() { div.focus() };
		}
		if( isbutton )
		{
			bg.div = div;
			bg.forwardClick = forwardClick;
			bg.onclick = bg.forwardClick;
			bg.style.cursor = 'pointer';
		}

	}
	if( isdiv ) attachOnResize( div );
	if( isinline )
	{
		wrapper.style.display = ie ? 'inline' : 'inline-block';
		wrapper.style.verticalAlign = 'middle';

	}
	if( isdefined( sh.over ) && wrapper.onmouseover == null )
	{
		wrapper.onmouseover = function() { decorate( sh.over, div ) };
		wrapper.onmouseout = function() { decorate( sh, div ) };
		preloadDecoration( sh.over );
	}
	if( isdefined( sh.click ) && wrapper.onmousedown == null )
	{
		wrapper.onmousedown = function() { decorate( sh.click, div ) };
		wrapper.onmouseup = function() { decorate( sh.over, div ) };
		preloadDecoration( sh.click );
	}
	return wrapper;
}


function imgCrop( hang, img, iw, ih, x, y, w, h, cw, ch, s )
{
	var sw, sh;

	if( cw == 0 ) { cw = '100%'; sw = 10 }
	else { sw = cw/w; cw += 'px'; }
	if( ch == 0 ) { ch = '100%'; sh = 10 }
	else { sh = ch/h; ch += 'px'; }
	var ml = Math.floor(-x*sw);
	var mt = Math.floor(-y*sh);
	var d, i;

	if( hang == null )
	{
		d = ce( 'DIV' );
		i = ce( 'IMG' );
	}
	else
	{
		d = hang;
		i = hang.childNodes[0];
	}
	d.style.overflow = 'hidden';
	d.style.position = 'relative';
	d.style.width = cw;
	d.style.height = ch;
	d.style.margin = 0;
	d.style.padding = 0;
	d.style.border = '0';
	i.src = img;
	i.style.width = iw*sw;
	i.style.height = ih*sh;
	i.style.position = 'absolute';
	i.style.left = ml;
	i.style.top = mt;
	if( hang == null ) d.appendChild( i );
	return d;
}

function imgDraw( hang, img, iw, ih, mx1, my1, mx2, my2, w, h )
{
	var out = [];
	var cont, d;
	var hd, i;

	if( hang != null )
	{
		cont = hang;
		cont.style.width = w;
		cont.style.height = h;
		i = 0;
		imgCrop( cont.childNodes[i++], img, iw, ih, 0,      0, mx1, my1, mx1, my1 ); 
		imgCrop( cont.childNodes[i++], img, iw, ih, mx1,    0, iw-mx1-mx2, my1, w - mx1 - mx2, my1 );
		imgCrop( cont.childNodes[i++], img, iw, ih, iw-mx2, 0, mx2, my1, mx2, my1 );
		i++;
		imgCrop( cont.childNodes[i++], img, iw, ih, 0,      my1, mx1,        ih-my1-my2, mx1,           h-my1-my2 );
		imgCrop( cont.childNodes[i++], img, iw, ih, mx1,    my1, iw-mx1-mx2, ih-my1-my2, w - mx1 - mx2, h-my1-my2 );
		imgCrop( cont.childNodes[i++], img, iw, ih, iw-mx2, my1, mx2,        ih-my1-my2, mx2,           h-my1-my2 );
		i++;
		imgCrop( cont.childNodes[i++], img, iw, ih, 0,      ih-my2, mx1,        my2, mx1,           my2 );
		imgCrop( cont.childNodes[i++], img, iw, ih, mx1,    ih-my2, iw-mx1-mx2, my2, w - mx1 - mx2, my2 );
		imgCrop( cont.childNodes[i++], img, iw, ih, iw-mx2, ih-my2, mx2,        my2, mx2,           my2 );
	}
	else
	{
		var inline = ie ? 'inline' : 'inline-block';
		cont = ce( 'DIV' );
		cont.style.width = w;
		cont.style.height = h;
		cont.appendChild( d = imgCrop( null, img, iw, ih, 0,      0, mx1, my1, mx1, my1 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, mx1,    0, iw-mx1-mx2, my1, w - mx1 - mx2, my1 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, iw-mx2, 0, mx2, my1, mx2, my1 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = ce( 'DIV' ) ); 
		cont.appendChild( d = imgCrop( null, img, iw, ih, 0,      my1, mx1,        ih-my1-my2, mx1,           h-my1-my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, mx1,    my1, iw-mx1-mx2, ih-my1-my2, w - mx1 - mx2, h-my1-my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, iw-mx2, my1, mx2,        ih-my1-my2, mx2,           h-my1-my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = ce( 'DIV' ) ); 
		cont.appendChild( d = imgCrop( null, img, iw, ih, 0,      ih-my2, mx1,        my2, mx1,           my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, mx1,    ih-my2, iw-mx1-mx2, my2, w - mx1 - mx2, my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
		cont.appendChild( d = imgCrop( null, img, iw, ih, iw-mx2, ih-my2, mx2,        my2, mx2,           my2 ) ); d.style.cssFloat = 'left'; d.style.styleFloat = 'left'; 
	}
	
	return cont;
}

function decorateCheck( obj )
{
	var o = obj;
	var deco = null;
	while( o != null )
	{
		if( isdefined( o.wrapper ) )
		{
			deco = o;
			break;
		}
		o = o.offsetParent;
	}
	if( deco != null )
	{
		deco.savedHeight = 0;
		deco.divCheck();
	}
}