function createSliderElement(containerNode, label, id, attributes, minValue, maxValue, defaultValue)
{
	var sliderDOM = $C(	
		['li', attributes,
			['div', {classname: 'command'}, label],
			['div', {classname: 'icon'},
				['img', {src: 'images/icon_' + id + '.gif'}]
			],
			['div', {classname: 'widget', id: id + '_container'}]
		]
	);
	containerNode.appendChild(sliderDOM);
	
	Slider.createSlider(id + '_container', id, minValue, maxValue, defaultValue);
}

function createPickerElement(containerNode, label, id, defaultColor)
{
	var elementDOM = $C(
		['li', {},
			['div', {classname: 'command'}, label],
			['div', {classname: 'icon'},
				['img', {src: 'images/icon_' + id + '.gif'}]
			],
			getPickerWidget(id, defaultColor)
		]
	);
	containerNode.appendChild(elementDOM);
	
	attachPickerEvents(id);
}
function attachPickerEvents(id)
{
	$(id).onmousedown = showColorPicker;
	$(id + '_input').onblur = function(){parseColorFromInput(id);};
	$(id + '_input').onfocus = function(){pickerInputFocus(id + '_input');};
}

function getPickerWidget(id, defaultColor)
{
	var a=
	['div', {classname: 'widget', id: id + '_widget'},
		['img', {classname: 'color_picker_thumb', id: id + '', src: 'images/colorFrame.gif', style: "background:#" + defaultColor}],
		['input', {value: defaultColor, classname: 'color_picker_input', maxLength: 6, type: 'text', id: id + '_input'}]
	];
	return a;
}

function createOptions(containerNode, label, id, options, selectedIndex, handler, handlerobject)
{
	var optionsDOM = ['div', {classname: 'icon'}];
	
	for(var i=0; i<options.length; i++)
	{
		optionsDOM.push(
			['img', {id: id + '_' + options[i], src: 'images/icon_' + id + '_' + options[i] + '.gif', checkboxValue: options[i]}]
		);
	}
	
	var elementDOM = $C(
		['li', {},
			['div', {classname: 'command'}, label],
			optionsDOM,
			['div', {classname: 'widget'}],
			['input', {type: 'hidden', id: id, name: id, value: selectedIndex}]
		]
	);
	containerNode.appendChild(elementDOM);
	
	for(var i=0; i<options.length; i++)
	{
		$(id + '_' + options[i]).onmousedown = function(){handler.call(handlerobject, this.getAttribute("checkboxValue"));};
	}
}