Accordion = Accordion.extend({

			options: {
				id: null,
				useHistory: false
			},

			initialize: function(togglers, elements, options) {
				this.setOptions(options);
				this.id = $pick(this.options.id, 'menu-' + (Accordion.count++));
				if (this.options.useHistory) {
					this.history = HistoryManager.register(
						this.id,
						[this.options.display],
						function(args) { this.display(args[0]); }.bind(this),
						false,
						false);
				}
				return this.parent(togglers, elements, options);
			},

			display: function(index) {
				if (this.history) this.history.setValue(0, index);
				this.parent(index);
			}

		});

		Accordion.count = 1;
		
		window.addEvent('domready', function(){

			/**
			 * If you want to set options, set them here, otherwise initialize is
			 * called automatically when the first module is registered
			 */
			 
			HistoryManager.initialize();

			var accordion1 = new Accordion(
				$$('#rechtermenu h3'),
				$$('#rechtermenu div.rechtermenu-item'), {
				id: 'menu',
				useHistory: true,
				onActive: function(toggler, element){
				toggler.setStyle('color', '#FFFFFF');
				toggler.setStyle('background', '#FE8500');
				toggler.setStyle('border-top', '0px solid #DCDCDC');
				toggler.setStyle('border-bottom', '1px solid #DCDCDC');
				toggler.setStyle('margin-bottom', '10px')
				},
				onBackground: function(toggler, element){
				toggler.setStyle('color', '#666666');
				toggler.setStyle('background', '#FFFFFF');
				toggler.setStyle('border-top', '0px solid #DCDCDC');
				toggler.setStyle('border-bottom', '1px solid #DCDCDC');
				toggler.setStyle('margin-bottom', '0px')}
				}
				);
			
			/**
			 * on start it start checking the hash
			 */
			HistoryManager.start();

		});