/*
 * Jcarousel initialisieren
 */
$(document).ready(function() {	
	
	var curr_id = activePicId;
	var curr_page = Math.floor((curr_id) / (picPerScroll))+1;

	// Startbild ermitteln (wenn der Einstieg in die Fotostrecke nicht mit dem 1. Bild beginnt)
	if (curr_id < picPerScroll)
	{
		start_id = 1;
	}
	else
	{
		start_id = ((curr_page-1) * picPerScroll)+1;
	}
	
	// Anzahl der Carousel-Seiten berechnen und auf 12 pro Seite aufrunden
	count_pages = Math.ceil (carousel_size / picPerScroll);
	carousel_new_size = count_pages * picPerScroll;

	// Carousel initialisieren
	$('#showroom').jcarousel({
    	scroll: 			picPerScroll,
    	size: 				carousel_new_size,
    	itemLoadCallback: 	{onBeforeAnimation: mycarousel_itemLoadCallback},
    	initCallback: 		mycarousel_initCallback,
    	start: 				start_id
    });
	
	
	// Beim Laden einmal aufrufen
	set_image_info ();
	
	// Bei jedem Klick
	$('.pager_item, .gallery_pager_item, .picArrow, .img_thumb_holder').click (function (){
    	
    	// Liefert die aktuelle Bild-ID bei jedem Klick
		curr_id = get_current_id ();
    	
		// Bildinformationen aktualisieren
    	set_image_info ();
    	
    	// IVW / Etracker / Plista / Google Analytics zählen
		ReloadPixelImages(IVW);
		reloadEtrackerImage (ETRACKER_ID, et_areas);
		reloadPlista ();

    	// Teaserbox unsichtbar machen
    	$('.thumbview, .thumbarrow').css('display', 'none');
	})

    
	// Pager initialisieren
	initPager(curr_id + 1, false);
	
	// Startseite
	page = start_id;

	// und bei jedem Klick
	// Welche Page wurde geklickt?
	$('.pager_item, .gallery_pager_item').click (function (){
		page = $(this).attr('id').replace('pic_', '');
		initPager (page, true)
	});
	
	// Klick auf den Kaufen Button
	$('#toggleButton').click(
		function () {
			
			if ($('#fotoDescrLink').css('display') == 'none')
			{
				$('#fotoDescrLink').css('display', 'block');
				$('#fotoDescrBox').css('display', 'none');
				$('#fotoKaufenLink').css('display', 'none');
				$('#fotoKaufenBox').css('display', 'block');
			}
			else
			{
				$('#fotoDescrLink').css('display', 'none');
				$('#fotoDescrBox').css('display', 'block');
				$('#fotoKaufenLink').css('display', 'block');
				$('#fotoKaufenBox').css('display', 'none');
			}
			
			init_hover();
		}
	);
	
	// Versenden Funktion:
	$('#picSend').click(function(){
		pic_id = get_current_id ()
		sendUrl = mycarousel_itemList[pic_id].sendmail;
		openWindow(sendUrl, 670, 570, 'resizable=1,scrollbars=1,menubar=1,location=0,toolbar=0');
	});
});


/**
 * Initialisiert den Pager mit der übergebenen Seite
 * 
 * @param page
 * @return void
 */
function initPager (page, buyval) {

	switch (page) {
		case 'first_pic':
			page = 1;
		break;

		case 'last_pic':
			page = carousel_size;
		break;
		
		default:
		
		break;
	}
	setPagerPage(page);
	click_on_image (page-1, buyval);
}


/**
 * Setzt die übergebene Page im Pager
 * 
 * @param page
 * @return void
 */
function setPagerPage (page)
{
	if (page > 0)
	{
		// Aktion ausführen
		ctr = 0;
		for (i = 0; i < carousel_size + 1; i++)
		{	
			if ((i > (page - 1) - 4 || i > carousel_size - 8) && (i < (page - 1) + 4 || i < 7))
			{
				// sichtbar
				$('#pic_' + (i + 1)).css('display', 'inline');
				if ( ctr < 6)
				{
					$('#trenner_' + (i + 1)).css('display', 'inline');
				}
				else
				{
					$('#trenner_' + (i + 1)).css('display', 'none');
				}
				ctr ++;
			}
			else
			{
				// nicht sichtbar
				$('#pic_' + (i + 1)).css('display', 'none');
				$('#trenner_' + (i + 1)).css('display', 'none');
			}
			if ( i == (page - 1))
			{
				// active
				$('#pic_' + (i + 1)).attr('class', 'pager_item gallery_center_item_active');
				$('#pic_' + (i + 1) + ' div').attr('class', 'gallery_pager_center_item_active');
				
			}
			else if (carousel_size > page-1)
			{
				// inactive
				$('#pic_' + (i + 1)).attr('class', 'pager_item gallery_center_item');
				$('#pic_' + (i + 1) + ' div').attr('class', 'gallery_pager_center_item');
			}
		}
		
		// Pager Buttons active / inactive
		// First Page & Prev Page
		if (page > 1)
		{
			// Aktiv
			$('#first_pic').attr('class', 'pager_button gallery_pager_item first_pic gallery_pager_button_active left');
			$('#prev_pic').attr('class', 'pager_button gallery_pager_item prev_pic gallery_pager_button_active left');
			$('#inPicNavPrev').css('display', 'block');
		}
		else
		{
			// Inaktiv
			$('#first_pic').attr('class', 'pager_button gallery_pager_item first_pic gallery_pager_button left');
			$('#prev_pic').attr('class', 'pager_button gallery_pager_item prev_pic gallery_pager_button left');
			$('#inPicNavPrev').css('display', 'none');
		}
		
		// Last Page & Next Page
		if (page < carousel_size)
		{
			// Aktiv
			$('#last_pic').attr('class', 'pager_button gallery_pager_item last_pic gallery_pager_button_active right');
			$('#next_pic').attr('class', 'pager_button gallery_pager_item next_pic gallery_pager_button_active right');
			$('#inPicNavNext').css('display', 'block');
		}
		else
		{
			// Inaktiv
			$('#last_pic').attr('class', 'pager_button gallery_pager_item last_pic gallery_pager_button right');
			$('#next_pic').attr('class', 'pager_button gallery_pager_item next_pic gallery_pager_button right');
			
			// In Picture Navigation deaktivieren
			$('#inPicNavNext').css('display', 'none');
			
		}
	}
}
	

/**
 * Liefert die aktuelle Bild-ID und setzt die aktuelle Seite
 * @return int curr_id current Pic ID
 */
function get_current_id ()
{
	// Liefert die aktuelle Bild-ID bei jedem Klick
	var curr_id = parseInt($('#activePic').attr('curr_img_id'));
	
	// Aktuelle Seite
	curr_page = Math.floor((curr_id) / (picPerScroll))+1;
	
	return curr_id;
}

/**
 * schreibt die Infos in einen Bereich (Bild x von y, Seite usw.)
 * @return void
 */
function set_image_info ()
{
	curr_id = get_current_id ();
	
	// curr_img + 1 = Bildnummer
	var img_nr = parseInt(curr_id) + 1;
	// Ausgabe:
	$('#fotoDescrBox').html(mycarousel_itemList[curr_id].title + '<br/>' + mycarousel_itemList[curr_id].photographer);
	$('#curr').html('Foto <b>' + img_nr + '</b> von insgesamt ' + carousel_size + ' Fotos');
	
	$('#screenPic').attr('alt', mycarousel_itemList[curr_id].title);
	$('#screenPic').attr('title', mycarousel_itemList[curr_id].title);
	$('.picArrow').attr('alt', mycarousel_itemList[curr_id].title);
	$('.picArrow').attr('title', mycarousel_itemList[curr_id].title);
	
}

/**
 * Lädt die Carousel-Items und initialisiert verschiedene Funktionen
 * 
 * @param carousel
 * @param state
 * @return
 */
function mycarousel_itemLoadCallback(carousel, state)
{
    for (var i = carousel.first; i <= carousel.last; i++) {
        if (carousel.has(i)) {
            continue;
        }

        if (i > carousel_size) {
            break;
        }

        carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[i-1]));
    }
    
    // Damit das Image Overlay funktioniert muss es für die neuen Bilder initialisiert werden.
    init_hover();
    
    // Beim Mouseover der Thumbnails
	$('img.imageOverviewCarousel').hover(
		function() { 
			teaser_id = $(this).attr('id');
			$(".thumbview").css('display','block');
			$(".thumbarrow").css('display','block');
			$("#teaser_img").attr('src', mycarousel_itemList[teaser_id].teaser);
		},
		function() {
			$(".thumbview").css('display','none');
			$(".thumbarrow").css('display','none');
		}
	);
	
	// Bei Mousebewegung über die Thumbnails
	$('img.imageOverviewCarousel').mousemove(function(e){
		
		var pageX = e.pageX - offsetX;
		
		// Ist die Mouse innerhalb dieser Position, muss die Teaserbox fixiert werden
		if (pageX > 585 && pageX < 762)
		{
			$(".thumbview").css('left', '586px');
		}
		else if (pageX < 586)
		{
			$(".thumbview").css('left', pageX + 'px');
		}
		
		// Der Pfeil bewegt sich immer
		$(".thumbarrow").css('left', pageX + 'px');
	});
}

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    if ( !item)
	{
		return '';
	}
    
	if (item.src)
	{
		var itemSrc = item.src;
		// Das aktive Bild finden und markieren
		if (item.id == curr_id)
		{
			var active = 'active';
		}
		else
		{
			var active = '';
		}
		
		var imgTag = "<img id=\"" + item.id + "\" class= \"imageOverviewCarousel\" style=\"width: 50px;\" src=\"" + item.src + "\" alt=\"" + item.alt + "\" title=\"" + item.title + "\" />";
		
		if (item.commercial == 1)
		{
			//$('.jcarousel-item-' + (parseInt(item.id) + 1)).css('display', 'none');
		}

		return '<div class="img_thumb_holder ' + active + '" id="img_' + item.id + '">' + imgTag + '</div>';
	}
}

/**
 * Steuert die manuellen Trigger für Next und Prev für das Carousel)
 * Initialisierung über den Parameter initCallback
 */
function mycarousel_initCallback(carousel) 
{
	curr_id = get_current_id ();
	
	// Wann soll zur vorigen Page gescrollt werden?
	$('.activePicPrev, #prev_pic').bind('click', function() {
		
		if ((curr_id) % picPerScroll == 0)
		{
			carousel.prev();
		}
		
		if (curr_id >= 0)
    	{
    		curr_id --;
    		click_on_image (curr_id);
    		setPagerPage (curr_id+1);
    	}
	});
    
    // Wann soll zur nächsten Page gescrollt werden?
	$('.activePicNext, #next_pic').bind('click', function() {
		
		if ((curr_id) % picPerScroll == picPerScroll - 1)
		{
			carousel.next();
		}
		
		if (curr_id + 1 <= carousel_size)
    	{
    		curr_id ++;
    		click_on_image (curr_id);
    		setPagerPage (curr_id+1);
    	}
    });
    
	// Bei Klick auf das erste Bild, springt das Carousel auf Bild 1
    $('#first_pic').bind('click', function() {
    	curr_id = 0;
    	click_on_image (curr_id);
		setPagerPage (curr_id+1);
    	carousel.scroll(0);
    	return false;
    })
    
    // Bei Klick auf das letzte Bild, springt das Carousel auf Bild X (das letzte)
    $('#last_pic').bind('click', function() {
    	curr_id = carousel_size;
    	click_on_image (curr_id);
		setPagerPage (curr_id+1);
    	carousel.scroll(carousel_size);
    	return false;
    })
    
    // Logik, für den Carousel-Scroller bei Klick auf die Paginierung
    $('.gallery_center_item').click (function (){
    	
    	page = parseInt ($(this).attr('id').replace('pic_', '')) - 1;
    	
    	new_page = Math.floor(page / picPerScroll)+1;
    	
    	if (new_page != curr_page)
    	{
    		carousel.scroll((new_page * picPerScroll)-picPerScroll+1);
    	}
    	
    });
    
}

/**
 * Image Overlay initialisieren
 */
function init_hover()
{	
	offsetX = 12;
    offsetY = 171;
    
    if (parseInt(curr_id) >= (parseInt(mycarousel_itemList.length) - 1))
    {
    	pos_id = (parseInt(mycarousel_itemList.length) - 1);
    	// Sonderfall IE
    	var agent = navigator.userAgent.toLowerCase();  
        if (agent.indexOf('msie')>-1) {  
        	pos_id = pos_id - 1
        }
    }
    else if (parseInt(curr_id) >= 1)
    {
    	pos_id = parseInt(curr_id) - 1;
    }
    else
    {
    	pos_id = 0;
    }
    
    // Y Position des 1. Image-Overview Elements: (Offset 172px).
	posY = $('#' + String(pos_id)).offset().top - offsetY;
	$(".thumbview").css('top', posY + 'px');
	$(".thumbarrow").css('top', (posY+165) + 'px');
	
	// Position der Thumbbox
	thumbpos = $(".thumbview").css('left');
	thumbpos = parseInt (thumbpos.replace('px', ''));
	
	$(".img_thumb_holder").click(function (){
		set_active_thumb (this, true);
	});
}

/**
 * Setzt das aktive Thumbnail und entfernt den Rahmen bei allen anderen (inaktiven)
 * 
 * @param obj (object)
 */
function set_active_thumb (obj, buyval) 
{
	// ID aus dem Holder holen
	if (newSrc = $(obj).attr('id'))
	{
		// Das img_ davor entfernen
		curr_id = newSrc.replace('img_', '');
		
		// Ist es Werbung?
		if (mycarousel_itemList[curr_id].commercial == 1)
		{
			// Boxen ausblenden
			$('#picSend').css('display', 'none');
			$('#screenPic').css('display', 'none');
			
			// Werbung einblenden
			$('#commercialRectangle').css('display', 'block');
			// Iframe aktualisieren
			$('#rectangleContent').attr('src', rectangleUrl);
			// Das aktive Bild entfernrn
			$('#screenPic').attr('src', '');
			
			// Bildbeschreibung unsichtbar machen
			$('#fotoDescrBox').css('display', 'none');
		}
		else
		{
			// URL des Screen-Img ändern
			$('#screenPic').attr('src', mycarousel_itemList[curr_id].url);
			
			// Iframe URL entfernen
			$('#rectangleContent').attr('src', '');
			// Sichtbarkeit ändern
			$('#commercialRectangle').css('display', 'none');
			$('#picSend').css('display', 'inline');
			$('#screenPic').css('display', 'inline');
			
			if ($('#fotoKaufenBox').css('display') == 'none')
			{
				// Bildbeschreibung sichtbar machen
				$('#fotoDescrBox').css('display', 'block');
			}
			
		}
		
		// Google Analytics Zählung
		if (curr_id != parseInt($('#activePic').attr('curr_img_id')))
		{
			reloadGoogleAnalytics(curr_id);
		}

		// grauen Rahmen bei allen inaktiven ersetzen
		$('.img_thumb_holder').css('background-color', '#595959');
		// grauen Rahmen beim aktiven Thumb setzen
		$(obj).css('background-color', '#787878');
		// Setze die aktive Img-ID im Screen-Img
		$('#activePic').attr('curr_img_id', curr_id);
		$('#activePic').attr('photo_id', mycarousel_itemList[curr_id].photoId);
		
		set_image_info ();
		
		// Pager setzen
		page = parseInt (curr_id)+1;
		setPagerPage (page);
		
		// Werte im Bild-Kaufen Modul aktualisieren
		photo_id = parseInt($('#activePic').attr('photo_id'))
		
		setBuyingValues(photo_id, page);
		
		if (mycarousel_itemList[curr_id].download != 0)
		{
			$('#picDownload').css('display', 'inline');
			$('#picDownload').attr('href', mycarousel_itemList[curr_id].download);
			
		}
		else
		{
			$('#picDownload').css('display', 'none');
			$('#picDownload').attr('href', '');
		}
	}
}

// Refresh des IVW Pixel
function ReloadPixelImages(IVW)
{
	newSRC = IVW+"?r="+escape(document.referrer)+"&d="+(Math.random()*100000);
	document.szmimages.src = newSRC;
}

// Refresh des Etracker Pixel
function reloadEtrackerImage (ETRACKER_ID, et_areas)
{
	if (ETRACKER_ID && et_areas)
	{	
		var ETRACKER="http://www.etracker.de/cnt.php?et=" + ETRACKER_ID + "&amp;v=3.0&amp;java=n&amp;et_easy=0&amp;et_pagename=&amp;et_areas=" + et_areas + "&amp;et_ilevel=0&amp;et_target=,0,,0&amp;et_lpage=0&amp;et_trig=&amp;et_se=0&amp;et_cust=0&amp;et_basket=&amp;et_url=&amp;et_tag=&amp;et_organisation=&amp;et_demographic=";
		var zeit="&zeit="+new Date().getTime();
		var zaehlpixelETRACKER = new Image();
		zaehlpixelETRACKER.src = ETRACKER + zeit;
	}
}

// Initialisiert die PLISTA PictureAds
function reloadPlista()
{
	// Wenn ein Werbeblocker eingeschaltet ist oder der Subclient diese Art der Werbung nicht gebucht hat
	// Dann wird die Initialisierung unterbunden.
	if (typeof PLISTA != 'undefined')
	{
		// Um beim AJAX Request neue Werbung zu zeigen, muss PLISTA neu initialisiert werden.
		setTimeout(function(){PLISTA.init();}, 200);
	}
}

function reloadGoogleAnalytics( pic_id)
{
	if (mycarousel_itemList[pic_id] && GA_ID)
	{
		url = mycarousel_itemList[pic_id].photoPageUrl;
		_gaq.push(['_trackPageview', url]);
	} 
}

/**
 * Führt alle notwendigen Aktionen beim Klick auf die Navigation des Bildes aus
 *
 * @param (int) id des aktuellen Bildes
 */
function click_on_image (id, buyval)
{
	if ( mycarousel_itemList[id])
	{
		// Objekt des neuen aktivierten Thumbnails besorgen
		thumbHolderObj = $('#img_' + id);
		// Und aktiv setzen
		set_active_thumb (thumbHolderObj, buyval);
	}
}

// AJAX Request für das Warenkob Partial
function setBuyingValues(pic_id, pic)
{
	if (mycarousel_itemList[pic-1].buyable == 1)
	{
		$.ajax({
			url: basketUrl + '?photoId=' + pic_id + '&pic=' + pic,
			success: function(data) {
				$('#fotoKaufenBox').html(data);
				init_hover();
			}
		});
	}
}

// Browsererkennung
function checkBrowserName(name)
{  
	var agent = navigator.userAgent.toLowerCase();  
    if (agent.indexOf(name.toLowerCase())>-1) {  
    	return true;  
    }  
    return false;  
}

