// JavaScript Document

/*
 * Overlay Toggler
 */

var TogglerOverlay = new Class({
	Implements: [Chain, Options],

	options: {
		buttons: {
			close:					"btn_close",				// close-Link im Overlay (.btn_close)
			showkontakt:		"btn_kontakt",			// Kontakt-Overlay Show-Link (#btn_kontakt)
			showimpressum:	"btn_impressum",		// Impressum-Overlay Show-Link (#btn_impressum)
			showwallpapers:	"btn_wallpapers"
		},
		boxes: {
			olkontakt:			"kontakt",					// Container, der ein- und ausgeschalten wird (#kontakt)
			olimpressum:		"impressum",				// Container, der ein- und ausgeschalten wird (#impressum)
			olwallpapers:		"wallpapers"
		}
	},
	
	elements: {
		buttons: {
			close:					null,
			showkontakt:		null,
			showimpressum:	null,
			showwallpapers:	null
		},
		boxes: {
			olkontakt:			null,
			olimpressum:		null,
			olwallpapers:		null
		}
	},

	target: null,


	initialize: function(options) {
		this.setOptions(options);
		
		this.elements.buttons.close						= $$("." + this.options.buttons.close);
		this.elements.buttons.showkontakt			= $(this.options.buttons.showkontakt);
		this.elements.buttons.showimpressum		= $(this.options.buttons.showimpressum);
		this.elements.buttons.showwallpapers	= $(this.options.buttons.showwallpapers);
		
		this.elements.boxes.olkontakt					= $(this.options.boxes.olkontakt);
		this.elements.boxes.olimpressum				= $(this.options.boxes.olimpressum);
		this.elements.boxes.olwallpapers			= $(this.options.boxes.olwallpapers);
		
	
		// Links austauschen
		for( i in this.elements.buttons )
		{	
			if( i != 'close' )
			{
				this.elements.buttons[i].href = "#head"; // javascript:void(0);
			}
			else
			{
				var countBtns = this.elements.buttons[i].length;
				for( j = 0; j < countBtns; j++ )
				{
					this.elements.buttons[i][j].href = "#head"; // javascript:void(0);
					// an close-btns die close-function binden
					this.elements.buttons[i][j].addEvent("click", this.hideall.bind(this));
				};
			}
		};

		
		this.elements.buttons.showkontakt.addEvent("click", this.toggle.bind(this));
		this.elements.buttons.showimpressum.addEvent("click", this.toggle.bind(this));
		this.elements.buttons.showwallpapers.addEvent("click", this.toggle.bind(this));
	
	},

	toggle: function(event) {
   	
		this.target = event.target;
		
		this.hideall();
		
		// show the right layer
		var theTarget = this.target.id;
		
		switch (theTarget) {
			case this.options.buttons.showkontakt:
				this.elements.boxes.olkontakt.setStyle('display', 'block');
				break;
			case this.options.buttons.showimpressum:
				this.elements.boxes.olimpressum.setStyle('display', 'block');
				break;
			case this.options.buttons.showwallpapers:
				this.elements.boxes.olwallpapers.setStyle('display', 'block');
				break;
		}
  },
  
	hideall: function() {
  
		// hide all layers
		for( e in this.elements.boxes )
		{
			this.elements.boxes[e].setStyle('display', 'none');
		};
  
	}
});



/*
 * Do this when DOM is ready
 */

window.addEvent('domready', function() {

	if( $$(".toggle-links") )
  	{
		//console.log( $$(".toggle-links a") );
		var toggler = new TogglerOverlay({});
  	}
});