//==================================================================================================
// CodeKing Slideshow
//==================================================================================================
// Author:                Frank Herrmann
// www:                   www.codeking.eu
//==================================================================================================
// Desciription:
////////////////
// Slides several images with or without a link
//
// Usage:
/////////
// View index.html for example.
//==================================================================================================
var ck_images = new Array();
var ck_url    = new Array();
var ck_target = new Array();
//////////////////////////////////////////////////////////////
// CONFIG
//////////////////////////////////////////////////////////////
var ck_timer     = 8;                // Sekunden bis zum nächsten Bild
var ck_folder    = '/images/slideshow/';   // Ordner in dem sich die Bilder befinden
//////////////////////////////////////////////////////////////
// IMAGES / URLs
//////////////////////////////////////////////////////////////
  ck_images[0] = 'teamspeak_3.jpg';
  ck_url[0]    = '/teamspeak/uebersicht.html';
  ck_target[0] = '';

  ck_images[1] = 'webspace.jpg';
  ck_url[1]    = '/webspace/Webspace_Supersize.html';
  ck_target[1] = '';

  ck_images[2] = 'gameserver.jpg';
  ck_url[2]    = '/gameserver/Classic_Clan_16_Slot_Gameserver.html';
  ck_target[2] = '';

  ck_images[3] = 'voiceserver.jpg';
  ck_url[3]    = '/teamspeak/Teamspeak_10_Slot.html';
  ck_target[3] = '';

  ck_images[4] = 'paket.jpg';
  ck_url[4]    = '/pakete/Gamer_S-Box.html';
  ck_target[4] = '';

  ck_images[5] = 'spezial.jpg';
  ck_url[5]    = '/faq.html';
  ck_target[5] = '';

//////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////
var ck_intervall, ck_nr, ck_old_nr, ck_action, ck_hover;
//////////////////////////////////////////////////////////////
function ck_setOpacity(objID, opacity)
{
  var obj = document.getElementById(objID);
      obj.style.filter       = "alpha(opacity:"+opacity+")";
      obj.style.KHTMLOpacity = opacity/100;
      obj.style.MozOpacity   = opacity/100;
      obj.style.opacity      = opacity/100;
}

function ck_getOpacity(objID)
{
  var obj = document.getElementById(objID);
  if(obj.filters)                 return !obj.filters.alpha.opacity ? 0 : obj.filters.alpha.opacity/100;
  else if(obj.style.KHTMLOpacity) return !obj.style.KHTMLOpacity ? 0 : obj.style.KHTMLOpacity;
  else if(obj.style.MozOpacity)   return !obj.style.MozOpacity ? 0 : obj.style.MozOpacity;
  else                            return !obj.style.opacity ? 0 : obj.style.opacity;
}

function ck_fade(objID1, objID2)
{
  if(!this.proc)
  {
    ck_action = true;
    ck_setOpacity(objID1, 100);
    ck_setOpacity(objID2, 0);
    this.proc = window.setInterval ('ck_fade(\'' + objID1 + '\', \'' + objID2 + '\')', 30);
  } else {
    var opacity1 = ck_getOpacity(objID1);
    var opacity2 = ck_getOpacity(objID2);

    if(opacity1 != 0)
    {
      opacity1 -= 0.10;
      opacity2 += 0.10;

      ck_setOpacity(objID1, parseInt(opacity1*100));
      ck_setOpacity(objID2, parseInt(opacity2*100));
    } else {
      ck_setOpacity(objID2, parseInt(100));
      if(document.getElementById(objID1)) document.getElementById('ck_slideshow').removeChild(document.getElementById(objID1));
      window.clearInterval(this.proc);
      this.proc = null;
      ck_action = false;
    }
  }
}

function ck_empty(str)
{
  if(str == undefined) return false;
  else                 return (str.length == 0) ? true : false;
}

function ck_slide(i)
{
  if(ck_action != true)
  {
    if(typeof(ck_nr) == 'undefined' )
    {
      ck_old_nr = 0; ck_nr = 1;
    } else if(ck_nr == 'undefined') {
      ck_nr = 0;
    } else {
      ck_old_nr = ck_nr; ck_nr++;
    }

    if(i == 'last')
    {
      ck_nr     = ck_nr == 1 ? ck_images.length-1 : ck_nr-2;
      ck_old_nr = ck_old_nr == 0 ? 0 : ck_old_nr--;
    }

    if(ck_nr == (ck_images.length)) ck_nr = 0;
    if(typeof(i) == 'number')       ck_nr = i;
    if(ck_nr != ck_old_nr)
    {
      if(typeof(i) == 'number') {
        window.clearInterval(ck_intervall);
        ck_intervall = window.setInterval('ck_slide()', ck_timer * 1000);
      }
      
      var t = document.getElementById('ck_buttons').getElementsByTagName('img');
      for(var i=0;i<t.length;i++)
      {
        t[i].src = t[i].src.replace(/\_hover\.jpg/g, '.jpg');
      }
      document.getElementById('ck_img' + ck_nr).src = document.getElementById('ck_img' + ck_nr).src.replace(/\.jpg/g, '_hover.jpg');
  
      var ck_sliderDiv = document.createElement('div');
          ck_sliderDiv.setAttribute('id', 'ck_item_' + ck_nr);
          ck_sliderDiv.setAttribute('class', 'ck_items');
          ck_sliderDiv.style.position     = 'absolute';
          ck_sliderDiv.style.top          = '25px';
          ck_sliderDiv.style.left         = '0';
          ck_sliderDiv.style.zIndex       = '9';
          ck_sliderDiv.style.filter       = "alpha(opacity:0)";
          ck_sliderDiv.style.KHTMLOpacity = 0;
          ck_sliderDiv.style.MozOpacity   = 0;
          ck_sliderDiv.style.opacity      = 0;
      document.getElementById('ck_slideshow').appendChild(ck_sliderDiv);

      ck_sliderDiv.innerHTML += (!ck_empty(ck_url[ck_nr]) ? '  <a href="' + ck_url[ck_nr] + '"' + (ck_target[ck_nr].length == 0 ? '' : ' target="' + ck_target[ck_nr] + '"') + '>' : '')
                              + '    <img src="' + ck_folder + ck_images[ck_nr] + '" alt="klick" />'
                              + (!ck_empty(ck_url[ck_nr]) ? '  </a>' : '');
                              
      ck_sliderDiv.onmouseover = function() { clearTimeout(ck_intervall); }
      ck_sliderDiv.onmouseout = function() { ck_intervall = window.setInterval('ck_slide()', ck_timer * 1000); }
                           
      ck_fade('ck_item_' + ck_old_nr, 'ck_item_' + ck_nr);
    }
  }
}

function ck_getStyle(obj, prop)
{
   if(obj.currentStyle )
   {  
      var ar = prop.match(/\w[^-]*/g);
      var s = ar[0];
      
      for(var i = 1; i < ar.length; ++i)		   
       s += ar[i].replace(/\w/, ar[i].charAt(0).toUpperCase());
           
      return obj.currentStyle[s]
   } else if(document.defaultView.getComputedStyle) return document.defaultView.getComputedStyle(obj, null).getPropertyValue(prop);
}
  
function ck_init_slideshow()
{
  var hover = new Array();
  var t = document.getElementById('ck_buttons').getElementsByTagName('img');
  for(var i=0;i<t.length;i++)
  {
    hover[i] = new Image();
    hover[i].src = t[i].src.replace(/\.jpg/g, '_hover.jpg');
    t[i].style.cursor = 'pointer';
    t[i].id = 'ck_img' + i;
    t[i].setAttribute('rel', i);
    if(i==0) t[i].src = t[i].src.replace(/\.jpg/g, '_hover.jpg');
    
    t[i].onclick = function() {
      ck_slide(parseInt(this.getAttribute('rel')));
    }
  }

  document.getElementById('ck_slideshow').innerHTML += '<div id="ck_item_0" class="ck_items">'
                                                    +  (!ck_empty(ck_url[0]) ? '  <a href="' + ck_url[0] + '"' + (ck_target[0].length == 0 ? '' : ' target="' + ck_target[0] + '"') + '>' : '')
                                                    +  '    <img src="' + ck_folder + ck_images[0] + '" alt=" klick" />'
                                                    +  (!ck_empty(ck_url[0]) ? '  </a>' : '')
                                                    +  '</div>';

  var preLoad = new Array();
  for(var i=0;i<ck_images.length;i++)
  {
    preLoad[i] = new Image();
    preLoad[i].src = ck_folder + ck_images[i];
  }

  ck_intervall = window.setInterval('ck_slide()', ck_timer * 1000);
}