/* #### circular functionality #### */

var mycarousel_itemList = [
{link: 'referenzen_korbach.html', linkclass: 'ref1', img_title: 'EWF Korbach Geschäftsbericht', url: '../images/referenzen/korbach_thumb.jpg', ref_title: 'EWF Korbach', ref_headline: 'EWF Korbach Geschäftsbericht', ref_description: 'Die Bilderserie zeigt die Botschaft der EWF: Wir tun mehr für die Region.'},
{link: 'referenzen_eby.html', linkclass: 'ref2', img_title: 'Das Magazin zum Kulturpreis Bayern', url: '../images/referenzen/bayerns_beste_thumb.jpg', ref_title: 'E.ON Bayern', ref_headline: 'Bayerns Beste Magazin', ref_description: 'Herausragende Köpfe aus Kunst und Wissenschaft im Fokus.'},		
{link: 'referenzen_thuega.html', linkclass: 'ref3', img_title: 'Thüga AG im Internet', url: '../images/referenzen/thuega_thumb.jpg', ref_title: 'Thüga', ref_headline: 'Thüga AG<br /> im Internet', ref_description: '450 Städte und Stadtwerke auf einer Seite.'},
{link: 'referenzen_vrnz.html', linkclass: 'ref4', img_title: 'VRNZ Kunstkalender', url: '../images/referenzen/vrnz_thumb.jpg', ref_title: 'VRNZ Kunstkalender', ref_headline: 'VRNZ Kunstkalender', ref_description: 'Kunst meets Wissenschaft: ein spektakul&auml;res Ergebnis!'},
{link: 'referenzen_entega.html', linkclass: 'ref5', img_title: 'Querdenker Entega', url: '../images/referenzen/querdenker_thumb.jpg', ref_title: 'Entega', ref_headline: 'Überraschend quer', ref_description: 'Das Magazin QUERDENKER kommt auch formal quer daher.'},
{link: 'referenzen_kk_special.html', linkclass: 'ref6', img_title: 'E.ON Kernkraft Special', url: '../images/referenzen/kk_special_thumb.jpg', ref_title: 'E.ON Kernkraft Special', ref_headline: 'Online-Special E.ON Kernkraft', ref_description: 'Interaktives Energie-Special auf neuer technologischer Basis.'},
{link: 'referenzen_gazette.html', linkclass: 'ref7', img_title: 'EPA München: Mitarbeiterzeitschrift', url: '../images/referenzen/gazette_thumb.jpg', ref_title: 'EPA München', ref_headline: 'Europäisches Patentamt', ref_description: 'Managementtool und Bindeglied für mehr als 7.000 Mitarbeiter.'},
{link: 'referenzen_schueco.html', linkclass: 'ref8', img_title: 'Schüco Partner Magazin', url: '../images/referenzen/schueco_thumb.jpg', ref_title: 'Schüco', ref_headline: 'Schüco Partner Magazin', ref_description: 'Magazin in modernem Layout. Hochwertig und nutzenorientiert.'},
{link: 'referenzen_opengrid.html', linkclass: 'ref9', img_title: 'E.ON Gastransport Imagefilm', url: '../images/referenzen/oge_thumb.jpg', ref_title: 'Open Grid Europe', ref_headline: 'Ein Film fürs Image', ref_description: 'Open Grid Europe wirbt sympathisch und kompetent für sich.'}
];

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
    // The index() method calculates the index from a
    // given index who is out of the actual item range.
    var idx = carousel.index(i, mycarousel_itemList.length);
    carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));
    $('.ref_description').not(':eq(1)').hide();
      if(state != 'init'){
      $('.ref_description').eq(1).fadeOut();
    }
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
    carousel.remove(i);
    $('.ref_description').eq(1).fadeIn();
};

// Item html creation helper.

function mycarousel_getItemHTML(item)
{
   var tmpHtml = '<a href="#" class="' + item.linkclass + ' thumblink"><img alt="' + item.img_title + '" src="' + item.url + '" width="149" height="144" /></a>';
    tmpHtml += '<div class="ref_description"><h1>' + item.ref_headline + '</h1>' + item.ref_description + '<a href="' + item.link + '">ZUM PROJEKT &gt;</a></div>';
   return tmpHtml;
};


// #### init callback stage ####

function mycarousel_initCallback(carousel) {

    $('.stageControl').mouseover(function(){
      carousel.stopAuto();
    }).mouseout(function(){
      carousel.startAuto();
    });

    jQuery('#mycarousel-next').bind('click', function() {
        carousel.startAuto(0);
        carousel.next();
        return false;
    });

    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.startAuto(0);
        carousel.prev();
        return false;
    });

   // assign functionality to the controls
   jQuery('.jcarousel-control a').bind('click', function() {
        //carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
      var i = 1;
      for (i=1;i<=mycarousel_itemList.length;i++) {
         var tmpclass = 'ref' + i;
         if (jQuery(this).hasClass(tmpclass)) {
            var j = i-1;
            carousel.scroll(jQuery.jcarousel.intval(j));
            return false;
         }
      }
    });

   // assign functionality to the thumbnails
      jQuery('.jcarousel-thumbs li').live('click', function() {
         //alert($.jcarousel.intval($(this).attr("jcarouselindex"))-1);
         carousel.scroll(($.jcarousel.intval($(this).attr("jcarouselindex"))-1));
         //return false;

    });



    jQuery('.jcarousel-scroll select').bind('change', function() {
        carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
        return false;
    });

    jQuery('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });

    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });

};





// #### init callback control ####



function myctrlcarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
    // The index() method calculates the index from a
    // given index who is out of the actual item range.
    var idx = carousel.index(i, mycarousel_itemList.length);
    carousel.add(i, myctrlcarousel_getItemHTML(mycarousel_itemList[idx - 1]));
};

function myctrlcarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
    carousel.remove(i);
};

// Item html creation helper.
function myctrlcarousel_getItemHTML(item)
{
   var tmpHtml = '<a href="' + item.link + '" class="ref1">&gt;&nbsp;' + item.ref_title + '</a></li>';
   return tmpHtml;
};

function myctrlcarousel_initCallback(carousel) {

    $('.ctrlControl').mouseover(function(){
      carousel.stopAuto();
    }).mouseout(function(){
      carousel.startAuto();
    });

};




jQuery(document).ready(function() {
    jQuery('#referenceStageModule').jcarousel({
      scroll: 1,
      wrap: 'circular',
      //auto: 3,
      animation: 500,
      buttonNextHTML: '<a href="#" class="stageControl"></a>',
      buttonPrevHTML: '<a href="#" class="stageControl"></a>',
      itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
      itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback},
      initCallback: mycarousel_initCallback,
      itemFirstInCallback: {
        onBeforeAnimation: mycarousel_itemFirstInCallback_onBeforeAnimation,
        onAfterAnimation: mycarousel_itemFirstInCallback_onAfterAnimation
      }
    });


   jQuery('#jcarousel_ctrl').jcarousel({
      scroll: 1,
      wrap: 'circular',
      //auto: 3,
      animation: 500,
      buttonNextHTML: '<a href="#" class="ctrlControl"></a>',
      buttonPrevHTML: '<a href="#" class="ctrlControl"></a>',
      itemVisibleInCallback: {onBeforeAnimation: myctrlcarousel_itemVisibleInCallback},
      itemVisibleOutCallback: {onAfterAnimation: myctrlcarousel_itemVisibleOutCallback},
      initCallback: myctrlcarousel_initCallback,
      itemFallbackDimension: 100
  });


});

// 1
function mycarousel_itemFirstInCallback_onBeforeAnimation(carousel, item, i, state, evt){
    $('.ref_description').eq(1).show();
};
// 3
function mycarousel_itemFirstInCallback_onAfterAnimation(carousel, item, i, state, evt){
    $('.ref_description').not(':eq(1)').hide();
};