	var MSIE = navigator.userAgent.indexOf('MSIE') >= 0 ? true : false;
	var navigatorVersion = navigator.appVersion.replace(/.*?MSIE (\d\.\d).*/g,'$1') / 1;
	
	var namedColors = new Array('AliceBlue','AntiqueWhite','Aqua','Aquamarine','Azure','Beige','Bisque','Black','BlanchedAlmond','Blue','BlueViolet','Brown',
		'BurlyWood','CadetBlue','Chartreuse','Chocolate','Coral','CornflowerBlue','Cornsilk','Crimson','Cyan','DarkBlue','DarkCyan','DarkGoldenRod','DarkGray',
		'DarkGreen','DarkKhaki','DarkMagenta','DarkOliveGreen','Darkorange','DarkOrchid','DarkRed','DarkSalmon','DarkSeaGreen','DarkSlateBlue','DarkSlateGray',
		'DarkTurquoise','DarkViolet','DeepPink','DeepSkyBlue','DimGray','DodgerBlue','Feldspar','FireBrick','FloralWhite','ForestGreen','Fuchsia','Gainsboro',
		'GhostWhite','Gold','GoldenRod','Gray','Green','GreenYellow','HoneyDew','HotPink','IndianRed','Indigo','Ivory','Khaki','Lavender','LavenderBlush',
		'LawnGreen','LemonChiffon','LightBlue','LightCoral','LightCyan','LightGoldenRodYellow','LightGrey','LightGreen','LightPink','LightSalmon','LightSeaGreen',
		'LightSkyBlue','LightSlateBlue','LightSlateGray','LightSteelBlue','LightYellow','Lime','LimeGreen','Linen','Magenta','Maroon','MediumAquaMarine',
		'MediumBlue','MediumOrchid','MediumPurple','MediumSeaGreen','MediumSlateBlue','MediumSpringGreen','MediumTurquoise','MediumVioletRed','MidnightBlue',
		'MintCream','MistyRose','Moccasin','NavajoWhite','Navy','OldLace','Olive','OliveDrab','Orange','OrangeRed','Orchid','PaleGoldenRod','PaleGreen',
		'PaleTurquoise','PaleVioletRed','PapayaWhip','PeachPuff','Peru','Pink','Plum','PowderBlue','Purple','Red','RosyBrown','RoyalBlue','SaddleBrown',
		'Salmon','SandyBrown','SeaGreen','SeaShell','Sienna','Silver','SkyBlue','SlateBlue','SlateGray','Snow','SpringGreen','SteelBlue','Tan','Teal','Thistle',
		'Tomato','Turquoise','Violet','VioletRed','Wheat','White','WhiteSmoke','Yellow','YellowGreen');
	
	 var namedColorRGB = new Array('#F0F8FF','#FAEBD7','#00FFFF','#7FFFD4','#F0FFFF','#F5F5DC','#FFE4C4','#000000','#FFEBCD','#0000FF','#8A2BE2','#A52A2A','#DEB887',
		'#5F9EA0','#7FFF00','#D2691E','#FF7F50','#6495ED','#FFF8DC','#DC143C','#00FFFF','#00008B','#008B8B','#B8860B','#A9A9A9','#006400','#BDB76B','#8B008B',
		'#556B2F','#FF8C00','#9932CC','#8B0000','#E9967A','#8FBC8F','#483D8B','#2F4F4F','#00CED1','#9400D3','#FF1493','#00BFFF','#696969','#1E90FF','#D19275',
		'#B22222','#FFFAF0','#228B22','#FF00FF','#DCDCDC','#F8F8FF','#FFD700','#DAA520','#808080','#008000','#ADFF2F','#F0FFF0','#FF69B4','#CD5C5C','#4B0082',
		'#FFFFF0','#F0E68C','#E6E6FA','#FFF0F5','#7CFC00','#FFFACD','#ADD8E6','#F08080','#E0FFFF','#FAFAD2','#D3D3D3','#90EE90','#FFB6C1','#FFA07A','#20B2AA',
		'#87CEFA','#8470FF','#778899','#B0C4DE','#FFFFE0','#00FF00','#32CD32','#FAF0E6','#FF00FF','#800000','#66CDAA','#0000CD','#BA55D3','#9370D8','#3CB371',
		'#7B68EE','#00FA9A','#48D1CC','#C71585','#191970','#F5FFFA','#FFE4E1','#FFE4B5','#FFDEAD','#000080','#FDF5E6','#808000','#6B8E23','#FFA500','#FF4500',
		'#DA70D6','#EEE8AA','#98FB98','#AFEEEE','#D87093','#FFEFD5','#FFDAB9','#CD853F','#FFC0CB','#DDA0DD','#B0E0E6','#800080','#FF0000','#BC8F8F','#4169E1',
		'#8B4513','#FA8072','#F4A460','#2E8B57','#FFF5EE','#A0522D','#C0C0C0','#87CEEB','#6A5ACD','#708090','#FFFAFA','#00FF7F','#4682B4','#D2B48C','#008080',
		'#D8BFD8','#FF6347','#40E0D0','#EE82EE','#D02090','#F5DEB3','#FFFFFF','#F5F5F5','#FFFF00','#9ACD32');
	
	var form_widget_amount_slider_handle = 'components/com_html5flippingbook/assets/images/colorpicker/slider_handle.gif';
	var slider_handle_image_obj = false;
	var sliderObjectArray = new Array();
	var slider_counter = 0;
	var slideInProgress = false;
	var handle_start_x;
	var event_start_x;
	var currentSliderIndex;
	
	var color_picker_div = false;
	var color_picker_active_tab = false;
	
	var color_picker_active_input = false;
	var color_picker_form_field = false;
	var color_picker_form_field_preview = false;
	
	function form_widget_cancel_event()
	{
		return false;
	}
	
	function getImageSliderHeight()
	{
		if (!slider_handle_image_obj)
		{
			slider_handle_image_obj = new Image();
			slider_handle_image_obj.src = form_widget_amount_slider_handle;
		}
		
		if (slider_handle_image_obj.width > 0)
		{
			return;
		}
		else
		{
			setTimeout('getImageSliderHeight()', 50);
		}
	}
	
	function positionSliderImage(e,theIndex,inputObj)
	{
		if (this) inputObj = this;
		
		if (!theIndex) theIndex = inputObj.getAttribute('sliderIndex');
		
		var handleImg = document.getElementById('slider_handle' + theIndex);
		var ratio = sliderObjectArray[theIndex]['width'] / (sliderObjectArray[theIndex]['max']-sliderObjectArray[theIndex]['min']);
		var currentValue = sliderObjectArray[theIndex]['formTarget'].value-sliderObjectArray[theIndex]['min'];
		
		handleImg.style.left = currentValue * ratio + 'px';
		
		setColorByRGB();
	}
	
	function adjustFormValue(theIndex)
	{
		var handleImg = document.getElementById('slider_handle' + theIndex);
		var ratio = sliderObjectArray[theIndex]['width'] / (sliderObjectArray[theIndex]['max']-sliderObjectArray[theIndex]['min']);
		var currentPos = handleImg.style.left.replace('px','');
		
		sliderObjectArray[theIndex]['formTarget'].value = Math.round(currentPos / ratio) + sliderObjectArray[theIndex]['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 > sliderObjectArray[currentSliderIndex]['width']) leftPos = sliderObjectArray[currentSliderIndex]['width'];
		
		document.getElementById('slider_handle' + currentSliderIndex).style.left = leftPos + 'px';
		adjustFormValue(currentSliderIndex);
		
		if (sliderObjectArray[currentSliderIndex]['onchangeAction'])
		{
			eval(sliderObjectArray[currentSliderIndex]['onchangeAction']);
		}
	}
	
	function stopMoveSlider()
	{
		slideInProgress = false;
	}
	
	function form_widget_amount_slider(targetElId,formTarget,width,min,max,onchangeAction)
	{
		if (!slider_handle_image_obj)
		{
			getImageSliderHeight();
		}
		
		slider_counter = slider_counter + 1;
		sliderObjectArray[slider_counter] = new Array();
		sliderObjectArray[slider_counter] = {"width":width - 9,"min":min,"max":max,"formTarget":formTarget,"onchangeAction":onchangeAction};
		
		formTarget.setAttribute('sliderIndex',slider_counter);
		formTarget.onchange = positionSliderImage;
		var parentObj = document.createElement('DIV');
		parentObj.style.width = width + 'px';
		parentObj.style.height = '12px';	// The height of the image
		parentObj.style.position = 'relative';
		parentObj.id = 'slider_container' + slider_counter;
		document.getElementById(targetElId).appendChild(parentObj);
		
		var obj = document.createElement('DIV');
		obj.className = 'form_widget_amount_slider';
		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 = slider_handle_image_obj.src;
		handleImg.id = 'slider_handle' + slider_counter;
		handleImg.onmousedown = initMoveSlider;
		
		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 = form_widget_cancel_event;
		parentObj.appendChild(handleImg);
		positionSliderImage(false,slider_counter);
	}
	
	function baseConverter(number, ob, nb)
	{
		number = number + "";
		number = number.toUpperCase();
		
		var list = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ";
		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;
	}
	
	function colorPickerGetTopPos(inputObj)
	{
		var returnValue = inputObj.offsetTop;
		
		while((inputObj = inputObj.offsetParent) != null)
		{
			returnValue += inputObj.offsetTop;
		}
		
		return returnValue;
	}
	
	function colorPickerGetLeftPos(inputObj)
	{
		var returnValue = inputObj.offsetLeft;
		
		while ((inputObj = inputObj.offsetParent) != null)
		{
			returnValue += inputObj.offsetLeft;
		}
		
		return returnValue;
	}
	
	function cancelColorPickerEvent()
	{
		return false;
	}
	
	function showHideColorOptions(e, inputObj)
	{
		var thisObj = this;
		
		if (inputObj)
		{
			var parentNode = inputObj.parentNode;
			
			thisObj = inputObj;
		}
		else
		{
			var parentNode = this.parentNode;
		}
		
		var activeColorDiv = false;
		var subDiv = parentNode.getElementsByTagName('DIV')[0];
		counter = 0;
		var initZIndex = 10;
		var contentDiv = document.getElementById('color_picker_content').getElementsByTagName('DIV')[0];
		
		do
		{
			if (subDiv.tagName=='DIV' && subDiv.className!='colorPickerCloseButton')
			{
				if (subDiv == thisObj)
				{
					thisObj.className = 'colorPickerTab_active';
					thisObj.style.zIndex = 50;
					var img = thisObj.getElementsByTagName('IMG')[0];
					img.src = "components/com_html5flippingbook/assets/images/colorpicker/tab_right_active.gif";
					img.src = img.src.replace(/inactive/,'active');
					contentDiv.style.display = 'block';
					activeColorDiv = contentDiv;
				}
				else
				{
					subDiv.className = 'colorPickerTab_inactive';
					var img = subDiv.getElementsByTagName('IMG')[0];
					img.src = "components/com_html5flippingbook/assets/images/colorpicker/tab_right_inactive.gif";
					
					if (activeColorDiv)
					{
						subDiv.style.zIndex = initZIndex - counter;
					}
					else
					{
						subDiv.style.zIndex = counter;
					}
					
					contentDiv.style.display = 'none';
				}
				
				counter++;
			}
			
			subDiv = subDiv.nextSibling;
			
			if (contentDiv.nextSibling) contentDiv = contentDiv.nextSibling;
		}
		while(subDiv);
		
		document.getElementById('colorPicker_statusBarTxt').innerHTML = '&nbsp;';
	}
	
	function createColorPickerTopRow(inputObj)
	{
		var tabs = ['RGB','Named colors','Color slider'];
		var tabWidths = [37,90,70];
		var div = document.createElement('DIV');
		div.className='colorPicker_topRow';

		inputObj.appendChild(div);
		var currentWidth = 0;
		
		for (var no = 0; no < tabs.length; no++)
		{
			var tabDiv = document.createElement('DIV');
			tabDiv.onselectstart = cancelColorPickerEvent;
			tabDiv.ondragstart = cancelColorPickerEvent;
			
			if (no == 0)
			{
				suffix = 'active';
				color_picker_active_tab = this;
			}
			else
			{
				suffix = 'inactive';
			}

			tabDiv.id = 'colorPickerTab' + no;
			tabDiv.onclick = showHideColorOptions;
			
			if (no == 0)
			{
				tabDiv.style.zIndex = 50;
			}
			else
			{
				tabDiv.style.zIndex = 1 + (tabs.length-no);
			}
			
			tabDiv.style.left = currentWidth + 'px';
			tabDiv.style.position = 'absolute';
			tabDiv.className='colorPickerTab_' + suffix;
			var tabSpan = document.createElement('SPAN');
			tabSpan.innerHTML = tabs[no];
			tabDiv.appendChild(tabSpan);
			var tabImg = document.createElement('IMG');
			tabImg.src = "components/com_html5flippingbook/assets/images/colorpicker/tab_right_" + suffix + ".gif";
			tabDiv.appendChild(tabImg);
			div.appendChild(tabDiv);
			
			// Lower IE version fix.
			
			if (navigatorVersion < 6 && MSIE)
			{	
				tabSpan.style.position = 'relative';
				tabImg.style.position = 'relative';
				tabImg.style.left = '-3px';
				tabDiv.style.cursor = 'hand';
			}
			
			currentWidth = currentWidth + tabWidths[no];
		}
		
		var closeButton = document.createElement('DIV');
		closeButton.className = 'colorPickerCloseButton';
		closeButton.innerHTML = 'x';
		closeButton.onclick = closeColorPicker;
		closeButton.onmouseover = toggleCloseButton;
		closeButton.onmouseout = toggleOffCloseButton;
		div.appendChild(closeButton);
	}
	
	function toggleCloseButton()
	{
		this.style.color = '#FFF';
		this.style.backgroundColor = '#317082';
	}
	
	function toggleOffCloseButton()
	{
		this.style.color = '';
		this.style.backgroundColor = '';
	}
	
	function closeColorPicker()
	{
		color_picker_div.style.display = 'none';
	}
	
	function createWebColors(inputObj)
	{
		var webColorDiv = document.createElement('DIV');
		webColorDiv.style.paddingTop = '1px';
		inputObj.appendChild(webColorDiv);
		
		for (var r = 15; r >= 0; r -= 3)
		{
			for(var g = 0; g <= 15; g += 3)
			{
				for (var b = 0; b <= 15; b += 3)
				{
					var red = baseConverter(r,10,16) + '';
					var green = baseConverter(g,10,16) + '';
					var blue = baseConverter(b,10,16) + '';
					
					var color = '#' + red + red + green + green + blue + blue;
					
					var div = document.createElement('DIV');
					div.style.backgroundColor = color;
					div.innerHTML = '<span></span>';
					div.className = 'colorSquare';
					div.title = color;
					div.onclick = chooseColor;
					div.setAttribute('rgbColor',color);
					div.onmouseover = colorPickerShowStatusBarText;
					div.onmouseout = colorPickerHideStatusBarText;
					webColorDiv.appendChild(div);
				}
			}
		}
	}
	
	function createNamedColors(inputObj)
	{
		var namedColorDiv = document.createElement('DIV');
		namedColorDiv.style.paddingTop = '1px';
		namedColorDiv.style.display='none';
		inputObj.appendChild(namedColorDiv);
		
		for (var no = 0; no < namedColors.length; no++)
		{
			var color = namedColorRGB[no];
			
			var div = document.createElement('DIV');
			div.style.backgroundColor = color;
			div.innerHTML = '<span></span>';
			div.className = 'colorSquare';
			div.title = namedColors[no];
			div.onclick = chooseColor;
			div.onmouseover = colorPickerShowStatusBarText;
			div.onmouseout = colorPickerHideStatusBarText;
			div.setAttribute('rgbColor', color);
			namedColorDiv.appendChild(div);
		}

	}
	
	function colorPickerHideStatusBarText()
	{
		document.getElementById('colorPicker_statusBarTxt').innerHTML = '&nbsp;';
	}
	
	function colorPickerShowStatusBarText()
	{
		var txt = this.getAttribute('rgbColor');
		if (this.title.indexOf('#') < 0) txt = txt + " (" + this.title + ")";
		document.getElementById('colorPicker_statusBarTxt').innerHTML = txt;
	}
	
	function createAllColorDiv(inputObj)
	{
		var allColorDiv = document.createElement('DIV');
		allColorDiv.style.display = 'none';
		allColorDiv.className = 'js_color_picker_allColorDiv';
		allColorDiv.style.paddingLeft = '3px';
		allColorDiv.style.paddingTop = '5px';
		allColorDiv.style.paddingBottom = '5px';
		inputObj.appendChild(allColorDiv);
		
		var labelDiv = document.createElement('DIV');
		labelDiv.className = 'colorSliderLabel';
		labelDiv.innerHTML = 'R';
		allColorDiv.appendChild(labelDiv);
		
		var innerDiv = document.createElement('DIV');
		innerDiv.className = 'colorSlider';
		innerDiv.id = 'sliderRedColor';
		allColorDiv.appendChild(innerDiv);
		
		var innerDivInput = document.createElement('DIV');
		innerDivInput.className='colorInput';
		
		var input = document.createElement('INPUT');
		input.id = 'js_color_picker_red_color';
		input.maxlength = 3;
		input.style.width = '48px';
		input.style.fontSize = '11px';
		input.name = 'redColor';
		input.value = 0;
		
		innerDivInput.appendChild(input);
		allColorDiv.appendChild(innerDivInput);
		
		var labelDiv = document.createElement('DIV');
		labelDiv.className = 'colorSliderLabel';
		labelDiv.innerHTML = 'G';
		allColorDiv.appendChild(labelDiv);
		
		var innerDiv = document.createElement('DIV');
		innerDiv.className = 'colorSlider';
		innerDiv.id = 'sliderGreenColor';
		allColorDiv.appendChild(innerDiv);
		
		var innerDivInput = document.createElement('DIV');
		innerDivInput.className = 'colorInput';
		
		var input = document.createElement('INPUT');
		input.id = 'js_color_picker_green_color';
		input.maxlength = 3;
		input.style.width = '48px';
		input.style.fontSize = '11px';
		input.name = 'GreenColor';
		input.value = 0;
		
		innerDivInput.appendChild(input);
		allColorDiv.appendChild(innerDivInput);
		
		var labelDiv = document.createElement('DIV');
		labelDiv.className = 'colorSliderLabel';
		labelDiv.innerHTML = 'B';
		allColorDiv.appendChild(labelDiv);
		var innerDiv = document.createElement('DIV');
		innerDiv.className = 'colorSlider';
		innerDiv.id = 'sliderBlueColor';
		allColorDiv.appendChild(innerDiv);
		
		var innerDivInput = document.createElement('DIV');
		innerDivInput.className = 'colorInput';
		
		var input = document.createElement('INPUT');
		input.id = 'js_color_picker_blue_color';
		input.maxlength = 3;
		input.style.width = '48px';
		input.style.fontSize = '11px';
		input.name = 'BlueColor';
		input.value = 0;
		
		innerDivInput.appendChild(input);
		allColorDiv.appendChild(innerDivInput);
		
		var colorPreview = document.createElement('DIV');
		colorPreview.className = 'colorPreviewDiv';
		colorPreview.id = 'colorPreview';
		colorPreview.style.backgroundColor = '#000000';
		colorPreview.innerHTML = '<span></span>';
		colorPreview.title = 'Click on me to assign color';
		allColorDiv.appendChild(colorPreview);
		colorPreview.onclick = chooseColorSlider;
		
		var colorCodeDiv = document.createElement('DIV');
		colorCodeDiv.className = 'colorCodeDiv';
		var input = document.createElement('INPUT');
		input.id = 'js_color_picker_color_code';
		
		colorCodeDiv.appendChild(input);
		input.maxLength = 7;
		input.style.fontSize = '11px';
		input.style.width = '48px';
		input.value = '#000000';
		input.onchange = setPreviewColorFromTxt;
		input.onblur = setPreviewColorFromTxt;
		allColorDiv.appendChild(colorCodeDiv);
		
		var clearingDiv = document.createElement('DIV');
		clearingDiv.style.clear = 'both';
		allColorDiv.appendChild(clearingDiv);
		
		form_widget_amount_slider('sliderRedColor', document.getElementById('js_color_picker_red_color'), 170, 0, 255, "setColorByRGB()");
		form_widget_amount_slider('sliderGreenColor', document.getElementById('js_color_picker_green_color'), 170, 0, 255, "setColorByRGB()");
		form_widget_amount_slider('sliderBlueColor', document.getElementById('js_color_picker_blue_color'), 170, 0, 255, "setColorByRGB()");
	}
	
	function setPreviewColorFromTxt()
	{
		if (this.value.match(/\#[0-9A-F]{6}/g))
		{
			document.getElementById('colorPreview').style.backgroundColor = this.value;
			
			var r = this.value.substr(1,2);
			var g = this.value.substr(3,2);
			var b = this.value.substr(5,2);
			
			document.getElementById('js_color_picker_red_color').value = baseConverter(r, 16, 10);
			document.getElementById('js_color_picker_green_color').value = baseConverter(g, 16, 10);
			document.getElementById('js_color_picker_blue_color').value = baseConverter(b, 16, 10);
			
			positionSliderImage(false, 1, document.getElementById('js_color_picker_red_color'));
			positionSliderImage(false, 2, document.getElementById('js_color_picker_green_color'));
			positionSliderImage(false, 3, document.getElementById('js_color_picker_blue_color'));
		}
	}
	
	function chooseColor()
	{
		color_picker_form_field.value = this.getAttribute('rgbColor');
		color_picker_form_field_preview.style.backgroundColor = color_picker_form_field.value;
		
		color_picker_div.style.display = 'none';

        if ( updateTemplatePreview )
            updateTemplatePreview();
	}
	
	function createStatusBar(inputObj)
	{
		var div = document.createElement('DIV');
		div.className = 'colorPicker_statusBar';
		var innerSpan = document.createElement('SPAN');
		innerSpan.id = 'colorPicker_statusBarTxt';
		div.appendChild(innerSpan);
		inputObj.appendChild(div);
	}
	
	function chooseColorSlider()
	{
		color_picker_form_field.value = document.getElementById('js_color_picker_color_code').value;
		color_picker_form_field_preview.style.backgroundColor = color_picker_form_field.value;
		
		color_picker_div.style.display = 'none';
	}
	
	function showColorPicker(inputObj, formFieldId, formFieldPreviewId)
	{
		if (!color_picker_div)
		{
			color_picker_div = document.createElement('DIV');
			color_picker_div.id = 'dhtmlgoodies_colorPicker';
			color_picker_div.style.display='none';
			document.body.appendChild(color_picker_div);
			createColorPickerTopRow(color_picker_div);
			
			var contentDiv = document.createElement('DIV');
			contentDiv.id = 'color_picker_content';
			color_picker_div.appendChild(contentDiv);
			createWebColors(contentDiv);
			createNamedColors(contentDiv);
			createAllColorDiv(contentDiv);
			createStatusBar(color_picker_div);
		}
		
		if (color_picker_div.style.display == 'none' || color_picker_active_input != inputObj) color_picker_div.style.display = 'block';
		else color_picker_div.style.display = 'none';
		
		color_picker_div.style.left = colorPickerGetLeftPos(inputObj) + 'px';
		color_picker_div.style.top = colorPickerGetTopPos(inputObj) + inputObj.offsetHeight + 2 + 'px';
		
		color_picker_active_input = inputObj;
		color_picker_form_field = document.getElementById(formFieldId);
		color_picker_form_field_preview = document.getElementById(formFieldPreviewId);;
	}
	
	function setColorByRGB()
	{
		var formObj = document.forms[0];
		
		var r = document.getElementById('js_color_picker_red_color').value.replace(/[^\d]/, '');
		var g = document.getElementById('js_color_picker_green_color').value.replace(/[^\d]/, '');
		var b = document.getElementById('js_color_picker_blue_color').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;
		
		document.getElementById('colorPreview').style.backgroundColor = '#' + r + g + b;
		document.getElementById('js_color_picker_color_code').value = '#' + r + g + b;
	}