/**
 * JS-Funktionen fuer keppler-mediengruppe
 *
 * seitenblick interaktive medien gmbh
 * Koenigstrasse 16, 70173 Stuttgart
 * fon: 0711/8599818-0
 * fax: 0711/8599818-40
 * e-Mail : info@seitenblick.de
 *
 * Version: 1.0
 */


/**
 * Name         : -
 * Beschreibung : Scrollen bei den Teasern
 * Parameter    : -
 * Bibliothek   : jQuery
 */
$(document).ready(function(){  
  $(".scrollable").scrollable();
});


/**
 * Name         : -
 * Beschreibung : Keyvisual-Teaser Animation
 * Parameter    : -
 * Bibliothek   : jQuery
 */
$(document).ready( function(){
  
  /* S T A R T S E I T E : Erstes Bühnenbildern in die Mitte schieben ----------------------------- */
  if($("#keyvisual").html()!=null){
    var stage_1st_pos = Math.round(( parseInt( $('#stage_element_1 img').attr('height') ) - 230 ) / 2);
    $('#stage_element_1 img').css({ top: '-'+stage_1st_pos+'px' });
  }

  /* S T A R T S E I T E : Hauptteaser durchwechseln ---------------------------------------------- */
  if ($('#keyvisual') != null ) {
    $('.stage_number a').bind("click", function(event){
      event.preventDefault();
      // Aktive und angeklickte Link-Nummer ermitteln
      var curr = parseInt($(this).text());
      var last = parseInt($(this).parent().parent().children().find(".stage_act").text());
      if (curr != last) {
        // Highlight(CSS) der letzten Nummer wird entfernt
        $(this).parent().parent().children().find(".stage_act").removeAttr('class');
        // Die aktuelle Nummer highlighten (CSS)
        $(this).addClass('stage_act');
        // Letzte grosse Box ausblenden
        $('#stage_element_'+last+' ').fadeOut(1000);
        // Danach Bild und Text zur aktuellen Nummer einblenden 
        $('#stage_element_'+curr+' ').fadeIn(1000);
        // Neues Bild ggf. in die Mitte schieben
        var stage_img_new_pos = Math.round(( parseInt( $('#stage_element_'+curr+' img').attr('height')) - 230 ) / 2);
        $('#stage_element_'+curr+' img').css({ top: '-'+stage_img_new_pos+'px' });
      }
    })
    
    // Automatische Ueberblendung
    IntervalId = setInterval( "animate_keyvisual()", 6000 );
    // Waerend man im Bereich ist wird der Intervall angehalten
    $('#keyvisual').mouseover(function () { 
      IntervalId = clearInterval ( IntervalId );
    })
    // Beim Verlassen geht der Effekt weiter. 
    $('#keyvisual').mouseleave(function () { 
      IntervalId = setInterval( "animate_keyvisual()", 6000 );
    })
  }
});


  /**
 * Name         : animate_keyvisual()
 * Beschreibung : Automatische Überblendung der Galeriebühne auf der Startseite
 * Parameter    : -
 * Bibliothek   : jQuery
 */
function animate_keyvisual() {
  
  // Aktuell angezeigtes Bild ermitteln
  var current = parseInt($("#stage_element_numbers").children().find(".stage_act").text());
  // Nächstes Bild definieren
  if (current < $('#keyvisual').children('.stage_element').length) {
    var next = current + 1;
  } else {
    var next = 1;
  }
  
  // Highlight(CSS) der letzten Nummer wird entfernt
  $("#sn_"+current+"").children().removeAttr("class");
  // Die aktuelle Nummer highlighten (CSS)
  $("#sn_"+next+"").children().addClass("stage_act");
  // Letzte grosse Box ausblenden
  $("#stage_element_"+current+"").fadeOut(1000);
  // Danach Bild und Text zur aktuellen Nummer einblenden 
  $("#stage_element_"+next+"").fadeIn(1000);
  // Neues Bild ggf. in die Mitte schieben
  var stage_img_new_pos = Math.round(( parseInt( $("#stage_element_"+next+" img").attr("height")) - 230 ) / 2);
  $("#stage_element_"+next+" img").css({ top: "-"+stage_img_new_pos+"px" });
}


/**
 * Name         : jQuery Fancybox
 * Beschreibung : (http://fancybox.net/home)
 * Parameter    : -
 * Bibliothek   : jQuery
 */
 $(document).ready(function() {

  /* Apply fancybox to multiple items */

  $('a.lightbox').fancybox({
    'transitionIn'  : 'elastic',
    'transitionOut' : 'elastic',
    'speedIn'   : 600,
    'speedOut'    : 200,
    'overlayShow' : true,
    'hideOnContentClick': true,
    'overlayOpacity': 0.8,
    'overlayColor'  : '#000',
    'titleShow'   :   true,
    'titlePosition' :   'inside',
    'titleFormat'   : function(title, currentArray, currentIndex, currentOpts) {
        return '<div class="caption">' + (title && title.length ? '<span class=\"gallery_caption\">' + title + '</span>' : '' ) + '</div>';

    }
  });

});

/*jqDock*/
/*
jQuery(document).ready(function(){
  jQuery('#slider').jqDock();
});
*/
jQuery(document).ready(function($){
  // NOTE : the z-indexing used in this example's css and script will not have the
  // desired effect in IE below version 8; you'd have to use a jquery $().hover()
  var itemCount = $('#slider').children().length
      // set up the options to be used for jqDock...
    , dockOptions =
      {active: 3
      ,distance: 150      
      ,align: 'bottom' 
      , size: 130 //increase 'at rest' size to 60px
        //I'm using setLabel to append my jigsaw pieces. I could use onReady but
        //the setLabel is slightly more convenient because of the parameters
        //passed to it...
      , setLabel: function(t, i, el){  //NB : el is div.jqDockLabel
          //the last piece has an extra class...
          //the jigsaw image is appended directly onto the anchor...
          $('<img class="jigsaw" src="' + t + '" alt="" />')
            .css({zIndex:itemCount - i})
            .appendTo($(el).parent().css({zIndex:2 * (itemCount - i)}));
          //I'm not using labels here but if was I'd simply return t...
          return false;
        }
      };
  // ...and apply...
  $('#slider').jqDock(dockOptions);
});