/**
 * dRS zebra
 * Fotogalerie
 * 
 * @author derRabe
 * @version 5.1.0
 */

(function( $ ){

	var activeDot = 0;
	var maxDot = 0;
	var play = false;
	var playerTimeout = false;
	var playerTimeoutMs = 7000;
	
	var methods = {
			/**
			 * Init
			 */
			init : function( options ) {

				/**
				 * Eigenschaften
				 */
				var defaults = {
					ulClass				: '',
					liClass				: ''
				};
				var options = $.extend(defaults, options);
				
				return this.each(function(){
//					console.log('dRSGallery==================');
//					console.log(options); 
					
					var gallery = $( this );
					
					// Zeitinterval setzten
					playerTimeoutMs = $( '.bigImage' ).attr('playertimeoutms');
					
					// Hšhe anpassen
					var maxWidth = parseInt( $( gallery ).css('max-width') );
					var maxHeight = parseInt( $(gallery).css('max-height') );
					var fact = maxWidth / maxHeight;
					
					var width = parseInt( $( gallery ).css('width') );
					var newHeight = Math.round(width / fact);
//					console.log('newHeight: '+newHeight);
					$( gallery ).css('height', newHeight+'px');
					$( gallery ).find('ul.'+options.ulClass).css('height', newHeight+'px');
					$( gallery ).find('ul.'+options.ulClass+' li').css('height', newHeight+'px');
					
					$( gallery ).parent().css('margin-top', newHeight+'px');
					
					// .hide gengen .transparent austauschen
					$( gallery ).find('ul.'+options.ulClass+' li.'+options.liClass+'.hide')
						.removeClass('hide')
						.addClass('transparent');
					
					// ID des Gro§en Bild
					var bigImageId = $( '.bigImage' ).attr('id');
					bigImageId = bigImageId.split('__')[1];
//					console.log('bigImageId: '+bigImageId);
					
					// Klick auf den vorheriges Bild Button
					$( '.prevImage' ).click(function(e) {
						e.preventDefault();
						// Dotnummer setzen
						var nextDot = activeDot - 1;
						if(nextDot < 1) {
							nextDot = 1;
						}
						$( gallery ).find('ul.dots li#dot_'+nextDot+' a').click();
					});
					
					
					// Klick auf den nŠchstes Bild Button
					$( '.nextImage' ).click(function(e) {
						e.preventDefault();
						// Dotnummer setzen
						var nextDot = activeDot + 1;
						if(nextDot > maxDot) {
							nextDot = maxDot;
						}
						$( gallery ).find('ul.dots li#dot_'+nextDot+' a').click();
					});
					
					// Dot Liste erstellen
					var dotList = $( '<ul>')
						.addClass('dots')
						.css('top', newHeight+'px');
					var count = 1;
					$( gallery ).find('ul.'+options.ulClass+' li').each(function(e) {
						maxDot++;
						var imageLi = $( this );
						$( imageLi ).attr('dot', maxDot);
						
						// Klick auf einen Thumb
						$( imageLi ).find('a.imageLink.linkToBigImage').click(function(e) {
							e.preventDefault();
							
							// Dotnummer setzen
							var nextDot = $( this ).parent().attr('dot');
							
							$( gallery ).find('ul.dots li#dot_'+nextDot+' a').click();
							
						});
						
						// Bild ID
						var imageId = $( imageLi ).attr('id');
						imageId = imageId.split('__')[1];
//						console.log('imageId: '+imageId);
						
						// aktiver Dot
						var dotClass = '';
						if(bigImageId == imageId) {
							dotClass = 'active';
							activeDot = maxDot;
						}
						
						$( dotList ).append(
							$( '<li id="dot_'+maxDot+'">')
								.addClass( dotClass )
								.append(
								$( '<a href="#">')
									.click(function(e) {
//										console.log('click: '+nextDot);
										e.preventDefault();
										
										// Abspielen anhalten
										clearInterval(play);
										clearTimeout(playerTimeout);
										
										// Dotnummer setzen
										if(maxDot > 1) {
											activeDot = parseInt( $( this ).parent().attr('id').split('_')[1]);
//											console.log('activeDot: '+activeDot);
											
											// und wieder abspielen
											playerTimeout = window.setTimeout(function() {
												$( gallery ).dRSGallery('player');
											}, 0);
										}
										
										// Alle Ausblenden
										$( gallery ).find('ul.'+options.ulClass+' li.active').each(function(e) {
											$( this ).removeClass('active').addClass('transparent');
										});
										// diesen einblenden
										$( this ).parent().removeClass('transparent').addClass('active');
										
										// Link Šndern
										var bigImageHref = $( imageLi ).find(".imageLink").attr('href');
										if(bigImageHref.indexOf('bigImageId') == -1) {
											$( '.bigImageLink' ).attr('href', bigImageHref);
											$( '.bigImageTitleLink' ).attr('href', bigImageHref);
										}
										
										// Gro§es Bild wenn angezeigt
										var bigImageSrc = $( imageLi ).find("img").attr('src');
										bigImageSrc = bigImageSrc.split('thumb').join('big');
										$( '#bigImage' ).attr('src', bigImageSrc);
										
										// Bildtitel
										var bigImageTitle = $.trim($( imageLi ).find(".imageTitle").html());
										$( '.bigImageTitle' ).html(bigImageTitle);
										if(bigImageTitle == '') {
											$( '.bigImageTitle' ).addClass('hide');
											$( '.bigImageTitleLink' ).addClass('hide');
										} else {
											$( '.bigImageTitle' ).removeClass('hide');
											$( '.bigImageTitleLink' ).removeClass('hide');
										}
										
										// Bildtext
										var bigImageShortText = $.trim($( imageLi ).find(".imageShortText").html());
										$( '.bigImageShortText' ).html(bigImageShortText);
										if(bigImageShortText == '') {
											$( '.bigImageShortText' ).addClass('hide');
										} else {
											$( '.bigImageShortText' ).removeClass('hide');
										}
										
										// Weitere Infos Button
										if(bigImageHref == '') {
											$( '.bigImageReadMoreLink' ).addClass('hide');
											$( '.bigImageReadMoreLink' ).attr('href', bigImageHref);
										} else {
											$( '.bigImageReadMoreLink' ).removeClass('hide');
											$( '.bigImageReadMoreLink' ).attr('href', '');
										}
										
										// Dot aktivieren
										$( gallery ).find('ul.dots li.active').removeClass('active');
										$( this ).parent().addClass('active');
										
										// Wenn das erste Bild angezeigt wird
										if(activeDot == 1) {
											$( '.prevImage' ).addClass('noLink');
										} else {
											$( '.prevImage' ).removeClass('noLink');
										}
										// Wenn das letzte Bild angezeigt wird
										if(activeDot == maxDot) {
											$( '.nextImage' ).addClass('noLink');
										} else {
											$( '.nextImage' ).removeClass('noLink');
										}
										
//										// Like Buttons laden
//										var url = 'upsa';
//										var title = 'haha';
//										var id = 'likeButtonsBigImage';
//										$( '#likeButtonsBigImage').load('/ajax/html-like-buttons?url='+url+'&title='+title+'&id='+id, function() {
//										});
									})
									.append(
										$( '<span>').html('&bull;')
								)
							)
						);
					});
					if(maxDot > 1) {
						$( gallery ).append( dotList );
						
						// Abspielen
						$( gallery ).dRSGallery('player');
					}
					
				});
			},
			/**
			 * Player
			 */
			player : function( ) {
				var gallery = $(this);
				return this.each(function(){
//					console.log('player: ');
					play = window.setInterval(function() {
						var nextDot = activeDot + 1;
						if(nextDot > maxDot) {
							nextDot = 1;
						}
						$( gallery ).find('ul.dots li#dot_'+nextDot+' a').click();
					}, playerTimeoutMs);
				});
			},
			/**
			 * Destroy
			 */
			destroy : function( ) {

				return this.each(function(){
					
				});
			}
	};

	$.fn.dRSGallery = function( method ) {

		if ( methods[method] ) {
			return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			return methods.init.apply( this, arguments );
		} else {
			$.error( 'Method ' +  method + ' does not exist on dRSGallery' );
		}    

	};

})( jQuery );
