function showBG ( bg_id )
{
	var backgroundHolder = document.getElementById( 'bg_preview' );
	var BGS = backgroundHolder.getElementsByTagName( 'img' );

	for ( var i = 0; i < BGS.length; i++ )
	{
		if ( BGS[i].id == 'bg_' + bg_id )
		{
			BGS[i].style.display = '';
		}
		else
		{
			BGS[i].style.display = 'none';
		}
	}
}

function setScale ( theScale )
{
	var backgroundHolder = document.getElementById( 'bg_preview' );
	var BGS = backgroundHolder.getElementsByTagName( 'img' );

	for ( var i = 0; i < BGS.length; i++ )
	{
		BGS[i].style.width = theScale + '%';
	}
}


var handle_src = 'images/slider_handle.gif';
var sliderHandle = false;
var SLIDERS = new Array();
var slider_counter = 0;
var slideInProgress = false;
var handle_start_x;
var event_start_x;
var currentSliderIndex;
var sliderHandleWidth = 9;

function sliderCancelEvent ( )
{
	return false;
}

function getImageSliderHeight ( )
{
	if ( !sliderHandle )
	{
		sliderHandle = new Image();
		sliderHandle.src = handle_src;
	}

	if ( sliderHandle.width > 0 )
	{
		return;
	}
	else
	{
		setTimeout( 'getImageSliderHeight()', 50 );
	}
}


function positionSliderImage( e, slider_index )
{
	if ( !slider_index )
	{
		slider_index = this.getAttribute( 'sliderIndex' );
	}

	var theValue = SLIDERS[slider_index]['formTarget'].value;

	if ( !theValue.match( /^[0-9]*$/g ) )
	{
		theValue = SLIDERS[slider_index]['min'] + '';
	}
	
	if ( theValue / 1 > SLIDERS[slider_index]['max'] )
	{
		theValue = SLIDERS[slider_index]['max'];
	}

	if ( theValue / 1 < SLIDERS[slider_index]['min'] )
	{
		theValue = SLIDERS[slider_index]['min'];
	}

	SLIDERS[slider_index]['formTarget'].value = theValue;

	var handleImg = document.getElementById( 'slider_handle' + slider_index );
	var ratio = SLIDERS[slider_index]['width'] / ( SLIDERS[slider_index]['max'] - SLIDERS[slider_index]['min'] );
	var currentValue = SLIDERS[slider_index]['formTarget'].value - SLIDERS[slider_index]['min'];

	handleImg.style.left = Math.round( currentValue * ratio ) + 'px';
}

function adjustFormValue ( slider_index )
{
	var handleImg = document.getElementById( 'slider_handle' + slider_index );
	var ratio = SLIDERS[slider_index]['width'] / ( SLIDERS[slider_index]['max'] - SLIDERS[slider_index]['min'] );
	var currentPos = handleImg.style.left.replace('px','');
	SLIDERS[slider_index]['formTarget'].value = Math.round( currentPos / ratio ) + SLIDERS[slider_index]['min'];
}

function initMoveSlider ( e )
{
	if ( document.all )
	{
		e = event;
	}

	slideInProgress = true;
	event_start_x = e.clientX;
	handle_start_x = this.style.left.replace( 'px', '' );
	currentSliderIndex = this.id.replace( /[^\d]/g, '' );
	return false;
}

function startMoveSlider ( e )
{
	if ( document.all )
	{
		e = event;
	}
	
	if ( !slideInProgress )
	{
		return;
	}
	
	var leftPos = handle_start_x / 1 + e.clientX / 1 - event_start_x;
	if ( leftPos < 0 )
	{
		leftPos = 0;
	}
	
	if ( leftPos / 1 > SLIDERS[currentSliderIndex]['width'] )
	{
		leftPos = SLIDERS[currentSliderIndex]['width'];
	}
	
	document.getElementById( 'slider_handle' + currentSliderIndex ).style.left = leftPos + 'px';
	adjustFormValue( currentSliderIndex );
	if ( SLIDERS[currentSliderIndex]['onchangeAction'] )
	{
		eval( SLIDERS[currentSliderIndex]['onchangeAction'] );
	}
}

function stopMoveSlider ( )
{
	slideInProgress = false;
}

function amountSlider( targetElId, formTarget, width, min, max, onchangeAction )
{
	if ( !sliderHandle )
	{
		getImageSliderHeight();
	}

	slider_counter = slider_counter + 1;
	SLIDERS[slider_counter] = new Array();
	SLIDERS[slider_counter] = { 'width' : width - sliderHandleWidth, 'min' : min, 'max' : max, 'formTarget' : formTarget, 'onchangeAction' : onchangeAction };
	
	formTarget.setAttribute( 'sliderIndex', slider_counter );
	formTarget.onchange = positionSliderImage;
	var parentObj = document.createElement( 'DIV' );

	parentObj.style.height = '12px';
	parentObj.style.position = 'relative';
	parentObj.id = 'slider_container' + slider_counter;
	document.getElementById( targetElId ).appendChild( parentObj );

	var obj = document.createElement( 'DIV' );
	obj.className = 'amountSlider';
	obj.innerHTML = '<span></span>';
	obj.style.width = width + 'px';
	obj.id = 'slider_slider' + slider_counter;
	obj.style.position = 'absolute';
	obj.style.bottom = '0px';
	parentObj.appendChild( obj );
	
	var handleImg = document.createElement( 'IMG' );
	handleImg.style.position = 'absolute';
	handleImg.style.left = '0px';
	handleImg.style.zIndex = 5;
	handleImg.src = sliderHandle.src;
	handleImg.id = 'slider_handle' + slider_counter;
	handleImg.onmousedown = initMoveSlider;
	
	parentObj.style.width = obj.offsetWidth + 'px';
	
	if ( document.body.onmouseup )
	{
		if ( document.body.onmouseup.toString().indexOf( 'stopMoveSlider' ) == -1 )
		{
			alert( 'You allready have an onmouseup event assigned to the body tag' );
		}
	}
	else
	{
		document.body.onmouseup = stopMoveSlider;
		document.body.onmousemove = startMoveSlider;
	}
	handleImg.ondragstart = sliderCancelEvent;
	parentObj.appendChild( handleImg );
	positionSliderImage( false, slider_counter );
}

function setColorByRGB ( part_id )
{
	var r = document.getElementById( 'part' + part_id + '_red' ).value.replace( /[^\d]/, '' );
	var g = document.getElementById( 'part' + part_id + '_green' ).value.replace( /[^\d]/, '' );
	var b = document.getElementById( 'part' + part_id + '_blue' ).value.replace( /[^\d]/, '' );

	if ( r / 1 > 255 )
	{
		r = 255;
	}

	if ( g / 1 > 255 )
	{
		g = 255;
	}
	
	if ( b / 1 > 255 )
	{
		b = 255;
	}

	r = baseConverter( r, 10, 16 ) + '';
	g = baseConverter( g, 10, 16 ) + '';
	b = baseConverter( b, 10, 16 ) + '';
	
	if ( r.length == 1 )
	{
		r = '0' + r;
	}
	
	if ( g.length == 1 )
	{
		g = '0' + g;
	}
	
	if ( b.length == 1 )
	{
		b = '0' + b;
	}
	
	self.status = '#' + r + '' + g + '' + b;
	
	document.getElementById( 'col' + part_id ).style.backgroundColor = '#' + r + g + b;
}

function baseConverter ( number, ob, nb )
{
	number = number + '';
	number = number.toUpperCase();
	var list = '0123456789ABCDEF';
	var dec = 0;
	for ( var i = 0; i <=  number.length; i++ )
	{
		dec += ( list.indexOf( number.charAt( i ) ) ) * ( Math.pow( ob, ( number.length - i - 1 ) ) );
	}

	number = '';
	var magnitude = Math.floor( ( Math.log( dec ) ) / ( Math.log( nb ) ) );
	
	for ( var i = magnitude; i >= 0; i-- )
	{
		var amount = Math.floor( dec / Math.pow( nb, i ) );
		number = number + list.charAt( amount ); 
		dec -= amount * ( Math.pow( nb, i ) );
	}
	
	if ( number.length == 0 )
	{
		number = 0;
	}
	
	return number;
}

var ANGLE_IMAGES = new Array();

function setAngle ( part_id )
{
	var theCanvas = document.getElementById( 'angle' + part_id );
	if ( theCanvas.getContext )
	{
		if ( !ANGLE_IMAGES[part_id] )
		{
			ANGLE_IMAGES[part_id] = new Image();
			ANGLE_IMAGES[part_id].src = 'images/rotate.gif';
		}

		var theAngle = document.getElementById( 'part' + part_id + 'angle' ).value;
		var theContext = theCanvas.getContext( '2d' );

		theContext.save();
		theContext.fillStyle = "rgb(255,255,255)";
		theContext.fillRect( 0, 0, 150, 100 );
		theContext.fillStyle = "rgb(0,0,0)";
		theContext.font = "20pt Arial";
		theContext.translate( 75, 50 );
		theContext.rotate( Math.PI * theAngle * 2 / 360 );
		theContext.fillText( 'Sample', -50, 10, 150 );
		theContext.restore();
	}
}