var ImageViewer = new Class ( {
	initialize: function ( image ) {
		this . image = { };
		this . image . element = image;
		this . image . width = null;
		this . image . height = null;
		this . asset = null;
		this . link = this . image . element . getParent ( 'a' );
		this . text = null;
		
		if ( this . image . element . getParent ( 'div.thumb' ) . getFirst ( 'span' ) ) {
			this . text = this . image . element . getParent ( 'div.thumb' ) . getFirst ( 'span' ) . get ( 'text' );
		}
		
		if ( !this . link ) {
			return;
		}
		
		this . url = this . link . href;
		this . wrapper = null;
		this . backdrop = null;
		this . close = null;
		this . failed = null;
		
		this . link . addEvent ( 'click', function ( event ) {
			event . stop ( );
			if ( !this . wrapper ) {
				this . create ( );
			}
		} . bindWithEvent ( this ) );
		
	},
	
	create: function ( ) {
		
		if ( !this . asset ) {
			this . asset = new Asset.image ( this . url, {
				'title': this . image . element . get ( 'title' ),
				'alt': this . image . element . get ( 'alt' ),
				onload: function ( event ) {
					this . failed = false;
					this . create ( );
				} . bindWithEvent ( this ),
				onerror: function ( event ) {
					this . failed = true;
				} . bindWithEvent ( this ),
				onabort: function ( event ) {
					this . failed = true;
				}
			} );
		} else {
			if ( this . failed === false ) {
				var position = this . image . element . getCoordinates ( 'body' );

				this . wrapper = new Element ( 'div', {
					'id': 'viewer',
					'styles': {
						'position': 'absolute',
						'top': position . top,
						'left': position . left,
						'width': position . width,
						'height': position . height,
						'padding': '3px'
					}
				} ) . inject ( document . getElement ( 'body' ) );

				this . wrapper . set ( { 'morph': { 'duration': 'normal' }, 'tween': { 'duration': 'normal' } } );

				this . close = new Element ( 'a', {
					'href': '#',
					'class': 'close',
					'html': '<span>Schließen</span>'
				} ) . inject ( this . wrapper ) . addEvent ( 'click', function ( event ) {
					event . stop ( );
					this . hide ( );
				} . bindWithEvent ( this ) );
				
				this . image . width = this . asset . width;
				this . image . height = this . asset . height;

				this . asset . inject ( this . wrapper ) . set ( { 'styles': { 'width': '100%', 'height': '100%' } } );

				if ( this . text ) {
					new Element ( 'span', {
						'text': this . text
					} ) . inject ( this . wrapper );
				}
				
				this . setPosition ( );

				// window . addEvent ( 'scroll', this . setPosition . bindWithEvent ( this ) );
				window . addEvent ( 'resize', this . setPosition . bindWithEvent ( this ) );
			}
		}
		
	},
	
	setPosition: function ( ) {
		if ( this . wrapper ) {
			var windowHeight = $ ( window ) . getSize ( ) . y,
				contentHeight = $ ( 'content' ) . getSize ( ) . y,
				offset = ( ( ( ( windowHeight < contentHeight ) ? windowHeight : contentHeight ) / 2 ) + $ ( window ) . getScroll ( ) . y ) - ( this . image . height / 2 ),
				header = $ ( 'header' ) . getSize ( ) . y + 45,
				footer = $ ( 'header' ) . getSize ( ) . y + contentHeight - this . image . height;
			
			this . wrapper . morph ( {
					'top': ( offset < header ) ? header : ( ( offset > footer ) ? footer : offset ),
					'left': ( document . getElement ( 'body' ) . getSize ( ) . x / 2 ) - ( this . image . width / 2 ),
					'width': this . image . width,
					'height': this . image . height,
					'padding': '8px'
			} );
		}
	},
	
	hide: function ( ) {
		this . wrapper . set ( 'tween', {
			'duration': 'short',
			onComplete: function ( event ) {
					this . destroy ( );
			} . bindWithEvent ( this )
		} ) . fade ( 'out' );
	},
	
	destroy: function ( ) {
		window . removeEvent ( 'scroll', this . setPosition . bindWithEvent ( this ) );
		window . removeEvent ( 'resize', this . setPosition . bindWithEvent ( this ) );

		this . wrapper . dispose ( );
		
		this . wrapper = null;
		this . close = null;
		
		if ( Browser . Engine . trident ) {
			this . asset = null;
		}
	}
} );

var SortingTable = new Class ( {

} );

SortingTable . removeAltClassRe = new RegExp ( '(^|\\s)alt(?:\\s|$)' );
SortingTable . implement ( { removeAltClassRe: SortingTable . removeAltClassRe } );

SortingTable . stripeTable = function ( elements  ) {
	var counter = 0;
	
	elements . each ( function ( tr ) {
		if ( tr . hasClass ( 'ignore' ) ) {
			counter = 0;
		} else {
			if ( !tr . hasClass ( 'collapsed' ) ) {
				counter ++;
			}
			
			tr . className = tr . className . replace( this . removeAltClassRe, '$1' ) . clean ( );
			
			if ( !( counter & 1 ) ) {
				tr . addClass ( 'alt' );
			}
		}
	});
}

var Main = {
	initialize: function ( ) {
		
	},
	
	initializeLoginBar: function ( ) {
		
	}
}

window . addEvent ( 'domready', function ( ) {
	var oldFirefox = navigator . userAgent . substr ( navigator . userAgent . lastIndexOf ( 'Firefox' ) + 8 );
	oldFirefox = oldFirefox . split ( '.' ) [ 0 ] == 1 && oldFirefox . split ( '.' ) [ 1 ] == 0;
	
	if ( oldFirefox ) {
		Element.Properties.html = {
			set: function ( ) {
				return ( function ( ) {
					return this.innerHTML = Array.flatten(arguments).join('');
				} ) . delay ( 100, this );
				
			}
		};
	}
	
	if ( $ ( 'flash' ) ) {
		if ( Cookie . read ( 'flash' ) != '1' ) {
			$ ( 'flash' ) . setStyle ( 'margin-top', '-43px' ) . set ( 'tween', { duration: 400 } ) . tween ( 'margin-top', '-8px' );
			Cookie . write ( 'flash', '1', { 'path': '/' } );
		}
		
		new Element ( 'a', {
			'href': '#',
			'html': '<span>verstecken</span>',
			'class': 'close'
		} ) . inject ( $ ( 'flash' ) ) . addEvent ( 'mousedown', function ( event ) {
			event . target . addClass ( 'press' );
		} ) . addEvent ( 'click', function ( event ) {
			event . stop ( );
			
			$ ( 'flash' ) . tween ( 'margin-top', '-43px' );
			Cookie . dispose ( 'flash', { 'path': '/' } );
		} );
	} else {
		Cookie . dispose ( 'flash', { 'path': '/' } );
	}
	
	[ 'table.striped', '.content-body table' ] . each ( function ( selector ) {
		$$ ( selector ) . each ( function ( table ) {
			SortingTable . stripeTable ( table . getElements ( 'tr' ) );
		} );
	} );
	
	[ 'login-user', 'user-register-code', 'user-password-email' ] . each ( function ( id ) {
		if ( $ ( id ) ) {
			$ ( id ) . focus ( );
		}
	} );
	
	$$ ( 'img.viewer' ) . each ( function ( image ) {
		new ImageViewer ( image );
	} );
	
	$$ ( 'form.auto-submit' ) . each ( function ( form ) {
		form . getElement ( 'select' ) . addEvent ( 'change', function ( event ) {
			form . submit ( );
		} );
	} );
	
	if ( $ ( 'login-link' ) ) {
		var blue = $ ( 'main' ) . hasClass ( 'blue' );
		
		if ( $ ( 'login-user' ) ) {
			
			
			$ ( 'login-link' ) . addEvent ( 'click', function ( event ) {
				event . stop ( );
				$ ( 'login-user' ) . focus ( );
			} );
		} else if ( !(Browser . Engine . trident && Browser . Engine . version < 5) ) {
			$ ( 'login-link' ) . addEvent ( 'click', function ( event ) {
				event . stop ( );
				
				if ( $ ( 'bar' ) ) {
					$ ( 'bar' ) . fade ( 'out' );
				} else {
					if ( !event . meta && !event . control ) {
						var box = new Element ( 'div', {
							'id': 'bar'
						} ) . fade ( 'hide' ) . inject ( $ ( 'content' ), 'top' ) . set ( 'tween', {
							'duration': 0,
							onComplete: function ( event ) {
								if ( box . get ( 'opacity' ) == 0 ) {
									if ( blue ) {
										$ ( 'main' ) . removeClass ( 'both' );
									} else {
										$ ( 'main' ) . removeClass ( 'bar' );
									}
									
									box . dispose ( );
								}

								if ( box . get ( 'opacity' ) == 1 ) {
									if ( blue ) {
										$ ( 'main' ) . addClass ( 'both' );
									} else {
										$ ( 'main' ) . addClass ( 'bar' );
									}
									
									input . focus ( );
								}
							}
						} );
						
						var form = new Element ( 'form', { 'method': 'post', 'action': 'login' } ) . inject ( box );
						new Element ( 'label', { 'for': 'login-user', 'text': 'Benutzer:' } ) . inject ( form );
						
						var input = new Element ( 'input', { 'id': 'login-user', 'name': 'user', 'class': 'text', 'type': 'text' } ) . inject ( form ) . addEvent ( 'keypress', function ( event ) {
							if ( event . key == 'esc' ) {
								box . fade ( 'out' );
							}
						} );
						
						new Element ( 'label', { 'for': 'login-password', 'text': 'Passwort:' } ) . inject ( form );
						new Element ( 'input', { 'id': 'login-password', 'name': 'password', 'class': 'text password', 'type': 'password' } ) . inject ( form );
						new Element ( 'input', { 'type': 'submit', 'name': 'login', 'class': 'submit', 'value': $ ( 'login-link' ) . get ( 'title' ) } ) . inject ( form ) . addEvent ( 'mousedown', function ( event ) {
							event . target . addClass ( 'press' );
						} ) . addEvent ( 'mouseup', function ( event ) {
							event . target . removeClass ( 'press' );
						} );
						
						box . fade ( 'in' );
					}
				}
			} );
		}
	}
} );