var Toggler = Class.create({
	initialize: function(element, index) {
		this.root = element;
		this.list = $('selectorList');
		this.id = index;
		
		this.speed = 0.3;

		Event.observe(this.root, 'click', this.toggle.bindAsEventListener(this));
	},

	toggle: function(event) {
		Event.stop(event);

		if(Element.visible(this.list)) {
			Element.hide(this.list);
		} else {
			Element.show(this.list);
			this.list.setStyle({
				borderWidth: '0 1px 1px 1px',
				margin: '35px 0 0 0'
			});
			this.list.clonePosition( this.root, {
				setLeft: false,
				setHeight: false, 
				setWidth: false, 
				offsetTop: 0 
			});
			this.list.clonePosition( this.root, {
				setTop: false,
				setHeight: false, 
				setWidth: false, 
				offsetTop: 0 
			});
		}
		
	}
});

document.observe("dom:loaded" , function(event) {
	$A($$('div.selectorButton')).each(function (element, index) {
		new Toggler(element, index);
	});
});
