window.addEvent('load', function(){
	makeThumbsShadow();
	Viewer = new Viewer_Class();
});

var BaseDirectory = 'templates/Shadows/';

var Shadow = new Class({
	
});

var Viewer_Class = new Class({
	initialize: function(){
		var _this = this;
		this.VollbildContainer = new Element ('div', {
			'id':'VollbildContainer'
		});
		
		this.VollbildContainer = DropShadowFixed(this.VollbildContainer);
		
		this.VollbildContainer.positioned = false;
		this.VollbildContainer.center = function(){
			var winWidth = window.getWidth();
			var winHeight = window.getHeight();
			var objWidth = _this.ImageSize[0];
			var objHeight = _this.ImageSize[1].toInt() + 80;
			var posLeft = (winWidth - objWidth)/2;
			if(winHeight < objHeight){
				var posTop = 0;
			} else {
				var posTop = (winHeight - objHeight)/2;
			}
			//alert('Width: '+winWidth+' '+objWidth+' '+posLeft+' Height:'+winHeight+' '+objHeight+' '+posTop);
			this.setStyle('left', posLeft+'px');
			this.setStyle('top', posTop+'px');
			this.positioned = true;
		}
		this.VollbildContainer.active = false;
		this.VollbildContainer.makeDraggable();
		//alert('klasse erfolgreich erstellt: '+this.showImage);
	}
});
Viewer_Class.prototype.createNavbar = function(){
	var _navbar = new Element('table', {'id':'navbar'});
	_navbar.adopt(new Element('tbody'));
	_navbar = _navbar.getFirst();	
	_navbar.adopt(new Element('tr'));
	_navbar = _navbar.getFirst();
	var parentObject = this;

	
	if($(this.Thumb.previousSibling).hasClass('EPG2_thumb')){
		var _prev = new Element('td', {
			'id':'prev',
			'events':{
				'click': function(){parentObject.Prev()}
			}
		})
		_prev.appendText('zurück');
		_navbar.adopt(_prev);
	}
	
	var _close = new Element('td', {
			'id':'close',
			'events':{
				'click': function() {parentObject.Close()}
			}
		})
	_close.appendText('schliessen');
	_navbar.adopt(_close);

	if($(this.Thumb.nextSibling)){
		if($(this.Thumb.nextSibling).hasClass('EPG2_thumb')){
			var _next = new Element('td', {
				'id':'next',
				'events':{
					'click': function(){parentObject.Next()}
				}
			})
			_next.appendText('vor');		
			_navbar.adopt(_next);
		}
	}
	return _navbar.getParent().getParent();	
}
Viewer_Class.prototype.showImage = function(Thumb){
    var Container = this.VollbildContainer;
    if(window.opera){
		Container.setStyle('visibility', 'visible'); //Fix für Opera
	}
	this.Thumb = $(Thumb);
	var ThumbImg = this.Thumb.getElement('img');
	var _href = ThumbImg.getAttribute('src');
	var pictext = ThumbImg.getAttribute('alt');
	var Bildunterschrift = new Element ('h3');
	Bildunterschrift.appendText(pictext);
	_href = _href.replace(/thumb/, 'large');
	var _Content = $('content');
	
	if(window.ie){
		Container.injectInside('header');
	} else {
		Container.injectTop(_Content);
	}
	var Bild = new Asset.image(_href);
	if(!this.ImageSize){
		this.ImageSize = $('GalleryInfo').firstChild.data.split(';');
	}
	Container = Container.getLast();
	Container.setStyle('width', this.ImageSize[0]+"px");
	
	if (!Container.active){
		Container.navbar = this.createNavbar();
		Container.navbar.injectInside(Container);
		Bild.injectInside(Container);
		Bildunterschrift.injectInside(Container);
		Container.active = true;
		if (!Container.positioned){
			Container.getParent().center();
		}
	} else {
		var navbar = this.createNavbar();
		Container.firstChild.replaceWith(navbar);
		Container.firstChild.nextSibling.replaceWith(Bild);
		Container.lastChild.replaceWith(Bildunterschrift);
	}
}

Viewer_Class.prototype.Next = function(){
	this.showImage(this.Thumb.nextSibling);
}

Viewer_Class.prototype.Prev = function(){
	this.showImage(this.Thumb.previousSibling);
}

Viewer_Class.prototype.Close = function(){
	if(this.VollbildContainer.getParent().getProperty('class') == 'ShadowWrap'){
		var objToRemove = this.VollbildContainer.getParent();
	} else {
		var objToRemove = this.VollbildContainer;
	}
	if(window.opera){
		objToRemove.setStyle('visibility', 'hidden'); //Fix für Opera 9.5
	}
	objToRemove.remove();
}

function makeThumbsShadow(){
	var Thumbs = $ES('img.EPG2_image_thumb', 'content');
	Thumbs.each(function(Thumb){
		//DropShadow(Thumb);
		//centerImage(Thumb);
	});
}

function DropShadow(_element){
	if(window.ie6){
		return;
	}
	if(!$('ShadowCSS')){
		new Asset.css(BaseDirectory+'Shadows.css', {id:'ShadowCSS'});
	}
	var _ShWrap = new Array(3);
	_ShWrap[0] = new Element('div',{'class':'ShWrap1'});
	_ShWrap[1] = new Element('div',{'class':'ShWrap2'});
	_ShWrap[2] = new Element('div',{'class':'ShWrap3'});
	if(_element.getStyle('position') == 'fixed'){
		_element.setStyle('position', 'static');
		_ShWrap[0].setStyle('position', 'fixed');
		_ShWrap[0].setStyle('z-index', _element.getStyle('z-index'));
	}
	_ShWrap[2].injectInside(_ShWrap[1]);
	_ShWrap[1].injectInside(_ShWrap[0]);
	if(_element.parentNode){
		_ShWrap[0].injectBefore(_element);
	}
	_element.injectInside(_ShWrap[2]);
	return(_ShWrap[0]);	//äussere Schale des Schattierten Elements wird zurückgegeben;
}
function centerImage(element){
	var widthParent = element.getSize().size.x;
	var FChild = element.getFirst();
	var widthFChild = FChild.getSize().size.x;
	var empty = widthParent - widthFChild;
	var margin = empty/2;
	element.getFirst().setStyle('margin-left', margin+'px');
}

function DropShadowFixed(_element){ 
	var divWrap = new Element('div', {'class':'ShadowWrap'});
	divWrap.setStyle('z-index', '32');
	_element.setStyle('position', 'static');
	divWrap.setStyle('position', 'fixed');
	
	//Methode zur Schattengenerierung die nur mit absolut oder fix positionierten Elementen funktioniert
	if(window.webkit420){
		_element.setStyle('-webkit-box-shadow', '10px 10px 6px hsla(0,0%,20%,0.2)');
	} else if(window.ie6){
	} else {
		var BaseDirectory = 'templates/Shadows/';
		var FileNames = new Array('corner_bl', 'bottom', 'corner_br', 'right', 'corner_tr');
		var Classes = new Array('BottomLeft', 'Bottom', 'BottomRight', 'Right', 'TopRight');
		// Die CSS Datei für die Schatten holen und ins Dokument einbinden
		if(!$('ShadowCSS')){
			new Asset.css(BaseDirectory+'Shadows.css', {id:'ShadowCSS'});
		}
		var Images = new Array(5);
		for(var i = 0; i<FileNames.length; i++){
			if(i == 1 || i == 3){ // die in der Ausdehnung flexiblen Bilder müssen divs mit Hintergründen sein
				Images[i] = new Element('div', {'class':'SImg'+Classes[i]});
			} else {		
				Images[i] = new Element('img', {'src':BaseDirectory+FileNames[i]+'.png', 
				'alt':'', 
				'class':'SImg'+Classes[i]});
			}
	
		}
	
		
		Images.each(function(_Image){
			_Image.injectInside(divWrap);
		});
	}
	if(_element.parentNode){
		divWrap.injectBefore(_element);
	}
	_element.injectInside(divWrap);
	return(divWrap);
}


