/*######################################################################
#                         Image Slideshow                              #
########################################################################
#       Autor:        Frank Herrmann                                   #
#       Homepage:     www.codeking.eu                                  #
########################################################################
# This program is free software; you can redistribute it and/or modify #
# it under the terms of the GNU General Public License as published by #
# the Free Software Foundation; either version 3 of the License, or    #
# (at your option) any later version.                                  #
#                                                                      #
# This program is distributed in the hope that it will be useful,      #
# but WITHOUT ANY WARRANTY; without even the implied warranty of       #
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the        #
# GNU General Public License for more details.                         #
#                                                                      #
# You should have received a copy of the GNU General Public License    #
# along with this program; if not, see <http://www.gnu.org/licenses/>  #
# or write to the                                                      #
# Free Software Foundation, Inc.,                                      #
# 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.            #
#######################################################################*/
var ck_images = new Array();
var ck_url    = new Array();
//////////////////////////////////////////////////////////////
// CONFIG
//////////////////////////////////////////////////////////////
var ck_timer     = 5;                // Sekunden bis zum nächsten Bild
var ck_folder    = '../../../img/content/home/eur/banner/';   // Ordner in dem sich die Bilder befinden
//////////////////////////////////////////////////////////////
// IMAGES / URLs
//////////////////////////////////////////////////////////////
  ck_images[0] = 'banner_alupluspatina.jpg';
  ck_url[0]    = '../products/roof_materials-finishes_alupluspatina.html';
  
  ck_images[1] = 'banner_gold-bronze.jpg';
  ck_url[1]    = '../products/roof_materials-finishes_alupluspatina.html';
  
  ck_images[2] = 'banner_Spirit-of-Spice.jpg';
  ck_url[2]    = '../products/facades_FC_system.html';
  
    ck_images[3] = 'banner_fc-download.jpg';
  ck_url[3]    = '../literature/literature_brochure-download.html';
  


//////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////
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 + '\')', 90);
  } 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 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          = '0';
          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] + '">' : '')
                              + '    <img src="' + ck_folder + ck_images[ck_nr] + '" alt="" />'
                              + (!ck_empty(ck_url[ck_nr]) ? '  </a>' : '');
                                                     
      ck_fade('ck_item_' + ck_old_nr, 'ck_item_' + ck_nr);
    }
    
    var tags = document.getElementById('ck_pages').getElementsByTagName('a');
    for(var i=0;i<tags.length;i++)
    {
      tags[i].style.color = (tags[i].rel == ck_nr) ? ck_hover : '';
      tags[i].className   = (tags[i].rel == ck_nr) ? 'ck_aktiv' : '';
    }
  }
}

function ck_control(action)
{
  if(ck_action != true || typeof(ck_action) == 'undefined')
  {
    switch(action)
    {
      case 'last':
        ck_slide('last');
      break;
      case 'play':
        if(ck_intervall === false)
        {
          ck_setControlImage('play');
          ck_slide();
          ck_intervall = window.setInterval('ck_slide()', ck_timer * 1000);
        }
      break;
      case 'pause':
        if(ck_intervall !== false)
        {
          ck_setControlImage('pause');
          window.clearInterval(ck_intervall);
          ck_intervall = false;
        }
      break;
      case 'stop':
        if(ck_intervall !== false)
        {
          window.clearInterval(ck_intervall);
          ck_intervall = false;
        }
  
        ck_setControlImage('stop');
        ck_old_nr = typeof(ck_nr) == 'undefined' ? 0 : ck_nr;
        ck_nr = 'undefined';
        ck_slide();
      break;
      case 'next':
        ck_slide();
      break;
    }
  }
}

function ck_setControlImage(action, r)
{
  var play     = document.getElementById('ck_play');
  var pause    = document.getElementById('ck_pause');
  var playImg  = ck_getStyle(play, 'background-image');
  var pauseImg = ck_getStyle(pause, 'background-image');
 
  switch(action)
  {
    default:
      var x = document.getElementById(action);
      var bgImg = ck_getStyle(x, 'background-image');

      if(r == 1) x.style.backgroundImage = (bgImg.match(/\_active\.gif/g)) ? x.style.backgroundImage : bgImg.replace(/\.gif/g, '_active.gif');
      else x.style.backgroundImage = (bgImg.match(/\_active\.gif/g)) ? bgImg.replace(/\_active\.gif/g, '.gif') : bgImg.replace(/\.gif/g, '_active.gif');

      if(!(r == 1 && bgImg.match(/\_active\.gif/g))) x.onmouseout = function() { ck_setControlImage(this.id); };
    break;
    case 'play':
      play.onmouseout = function() {}; pause.onmouseout = function() {};
      pause.style.backgroundImage  = pauseImg.replace(/\_active\.gif/g, '.gif');
    break;
    case 'pause':
      play.onmouseout = function() {}; pause.onmouseout = function() {};
      play.style.backgroundImage  = playImg.replace(/\_active\.gif/g, '.gif');
    break;
    case 'stop':
      play.style.backgroundImage  = playImg.replace(/\_active\.gif/g, '.gif');
      pause.style.backgroundImage = pauseImg.replace(/\_active\.gif/g, '.gif');
    break;
  }
}

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()
{  
  document.writeln('<div id="ck_slideshow"><div id="ck_pages"></div><div id="ck_controls"></div></div>');
  ck_setOpacity('ck_pages', 80); ck_setOpacity('ck_controls', 80);
  
  document.getElementById('ck_controls').innerHTML += '<div id="ck_last" onclick="ck_control(\'last\')" onmouseover="ck_setControlImage(this.id)"></div>'
                                                   +  '<div id="ck_stop" onclick="ck_control(\'stop\')" onmouseover="ck_setControlImage(this.id)"></div>'
                                                   +  '<div id="ck_play" onclick="ck_control(\'play\')" onmouseover="ck_setControlImage(this.id, 1)"></div>'
                                                   +  '<div id="ck_pause" onclick="ck_control(\'pause\')" onmouseover="ck_setControlImage(this.id, 1)"></div>'
                                                   +  '<div id="ck_next" onclick="ck_control(\'next\')" onmouseover="ck_setControlImage(this.id)"></div>';

  document.getElementById('ck_slideshow').innerHTML += '<div id="ck_item_0" class="ck_items">'
                                                    +  (!ck_empty(ck_url[0]) ? '  <a href="' + ck_url[0] + '">' : '')
                                                    +  '    <img src="' + ck_folder + ck_images[0] + '" alt="" />'
                                                    +  (!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];
 
    document.getElementById('ck_pages').innerHTML += '<a id="ck_page' + i + '" rel="' + i + '" ' + (i == 0 ? 'class="ck_aktiv" ' : '') + 'onfocus="this.blur()"'
                                                  +  ' href="javascript:ck_slide(' + i + ')">' + parseInt(i + 1) + '</a>';
  }
  
  var x = document.getElementById('ck_page0');
  ck_hover = ck_getStyle(x, 'color');

  ck_intervall = window.setInterval('ck_slide()', ck_timer * 1000);
}

ck_init_slideshow();
