/* Declare some globals */
var indexshow = -1;
var arSlideShowIds;
var nrpics;
var arrshowsrc;
var showtitle;
var showtitlepic;
var newidx;
var showtime;
var timeout;
var startdelay;

/* Here begins the desaster */
function loadGallery() {

  var elemshow1;
  
  nrpics = 9;
  arSlideShowIds = new Array("show_1", "show_2", "show_3", "show_4", "show_5", "show_6", "show_7", "show_9");
  indexshow = 0;
  togglePicStyle(indexshow);        

  newidx = -1;
  showtime = 2500;
  startdelay = 2500;
  
  /* select first slide show */
  elemshow1 = document.getElementById("show_1");
  if (elemshow1) {
    selectSlideShow(elemshow1, false);    
  }
  return;
}

/***************/
/* Slide Show  */
/***************/

/* select the next picture show */
function selectSlideShow(elem, dostart) {

  var indexsel;
  var idsel;
  var panel;

  /* Clear all timed events first */
  if (timeout) {
    clearTimeout(timeout);
  }

  if (elem) {  
    /* Element id? */
    idsel = elem.id;
    
    /* change stlye classes of new and last active picture */
    indexsel = id2Index(idsel);
    if (indexsel != indexshow) {
      setPicDeselected(indexshow);        
      setPicSelected(indexsel);
    }
    
    /* Remember this show index */
    indexshow = indexsel;

    /* display selected slide show title */
    displayShowTitle();

    /* Run the selected slide show */
    if (dostart) {
      timeout = setTimeout("runSlideShow();", startdelay);
    }
  }
}

/* Run the slide show */
function runSlideShow() {

  var showid;
  var i;
  var t;

  /* Clear all timed events first */
  if (timeout) {
    clearTimeout(timeout);
  }
  
  /* Check selected show and load */
  if (!isValidIndex(indexshow)) {
    return;
  }
  
  /* Adjust slide show panel */
  tablemain = document.getElementById("table_main");
  if (tablemain) {
    row1 = tablemain.rows[0];
    buildShowPanel(false);
  }
  
  /* load slide show sources */
  if (arrshowsrc && (arrshowsrc.length > 0)) {    
    newidx = 0;
    updateMainPicture();
  }
  return;
}

/* First picture of each show */
function displayShowTitle() {

  var tablemain;
  var row1;
  var picmain;

  /* Clear all timed events first */
  if (timeout) {
    clearTimeout(timeout);
  }
  
  /* Check selected show and load */
  if (!isValidIndex(indexshow)) {
    return;
  }

  /* load slide show sources */
  arrshowsrc = loadSlideShow();
    
  /* Adjust slide show panel */
  tablemain = document.getElementById("table_main");
  if (tablemain) {
    row1 = tablemain.rows[1];
    buildShowPanel(true);
    row1.cells[0].innerHTML = showtitle;
    
    /* the slide show title picture */
    picmain = document.getElementById("pic_main");
    if (picmain) {
      picmain.src = showtitlepic;
    }
    
    /* clear slide counter */
    updateSlideCount(0,0);
  }

  return;
}

/* loads the slide show */
function loadSlideShow() {

  var showid;
  var arrload;
  var length;

  showid = index2Id(indexshow);
  if (!showid) {
    return;
  }
  arrload = loadShow(showid);
  return arrload;
}

/* Slide show: the displayer */
function updateMainPicture() {

  var elemmain;
  var newsrc;      

  /* Clear timeout first */
  if (timeout) {
    clearTimeout(timeout);
  }
  
  if (arrshowsrc && (newidx >= 0) && (newidx < arrshowsrc.length)) {
    newsrc = arrshowsrc[newidx];
  } else {
    displayShowTitle();
    return;
  }

  if (newsrc) {
    /* Update main picture source */
    elemmain =  document.getElementById("pic_main");
    if (elemmain) {
      elemmain.src = newsrc;
      elemmain.style.visibility = 'visible';
    }
  }

  return; 
}

/* Will be fired when current     */
/* picture finished loading.      */
/* Triggers next picture load and */
/* updates counter.               */
function pictureLoaded() {

  /* Update slide counter first */
  updateSlideCount(newidx+1, arrshowsrc.length);

  /* Now trigger next picture */
  newidx++;
  timeout = setTimeout("updateMainPicture()", showtime);

  return;
}

/* Updates slide counter element.   */
/* If count or total are '0', the   */
/* text will be cleared.            */
function updateSlideCount(count, total) {
  var elemcounter;
  var counttxt;

  elemcounter = document.getElementById("slidecount");
  if (elemcounter) {
    if ((count == 0) || (total == 0)) {
      counttxt = '';
    } else {
      counttxt = '&nbsp;&nbsp;(' + String(newidx + 1) + ' von ' + String(arrshowsrc.length) + ')';
    }
    elemcounter.innerHTML = counttxt;
  }
  return;
}

/***************/
/* Event stuff */
/***************/
function hoverPicture(elem) {
  var elid;
  var elindex; 
  elid = elem.id;
  elindex = id2Index(elid);
  if (elindex != indexshow) {
    setElementClass(elem, "glryhover");
  }
}

function unhoverPicture(elem) {
  var elid;
  var elindex; 
  elid = elem.id;
  elindex = id2Index(elid);
  if (elindex != indexshow) {
    setElementClass(elem, "glryselect");
  }
}

/*********/
/* Style */
/*********/
function getElementClass(elem) {
  var classname;

  if (elem) {
    classname = elem.className;  
    return classname;
    }
  return null;  
}

function setElementClass(elem, classname) {
  if (elem && classname) {
    elem.className = classname;  
  }
  return;
}

/*************/
/* Utilities */
/*************/
function id2Index(elid) {
  var i;

  /* Elements are the pciture Ids, "pic_x" */
  if (elid && arSlideShowIds) {
    for (i = 0; i < arSlideShowIds.length; i++) {
      if (elid == arSlideShowIds[i]) {
        return i;
      }
    }
  }
  return -1;
}

function index2Id(index) {
  var elid;

  /* Convert index to Id "pic_x" */
  if (arSlideShowIds && (index >= 0) && (index < arSlideShowIds.length)) {
    elid = arSlideShowIds[index];
    return elid;
  }
  return "";
}

function isValidIndex(index) {
  return ((index >= 0) && (index < arSlideShowIds.length)) ?  true : false;
}

/* Set picture styles */
function setPicSelected(index) {
  var elid;
  var elem;
  var classname;
  var nextname;

  /* set style class for "pic_index" */
  elid = index2Id(index);
  elem = document.getElementById(elid);
  classname = getElementClass(elem);
  if (classname) {
    if (classname != "glryselected") {
      nextname = "glryselected";
    }
    setElementClass(elem,nextname);
  }
}

function setPicDeselected(index) {
  var elid;
  var elem;
  var classname;
  var nextname;

  /* set style class for "pic_index" */
  elid = index2Id(index);
  elem = document.getElementById(elid);
  classname = getElementClass(elem);
  if (classname) {
    if (classname != "glryselect") {
      nextname = "glryselect";
    }
    setElementClass(elem,nextname);
  }
}

function togglePicStyle(index) {
  var elid;
  var elem;
  var classname;
  var nextname;

  /* Convert index to Id "pic_x" */
  elid = index2Id(index);
  elem = document.getElementById(elid);
  classname = getElementClass(elem);
  if (classname) {
    if (classname == "glryselect") {
      nextname = "glryselected";
    } else {
      nextname = "glryselected";
    }
    setElementClass(elem,nextname);
  }
}

/*************************/
/*  Slide show Utilities */
/* Creates innerHTML for */
/* slide show panel      */
/*************************/
function buildShowPanel(istitle) {

  var tablemain;
  var row1;
  var cell;

  tablemain = document.getElementById("table_main");
  if (!tablemain) {
    return;
  }
  row1 = tablemain.rows[0];
  if (!row1) {
    return;
  } 

  if (istitle) {

    /* This is to show the slide Show title     */
    /* Change this panel to hold Title picture  */
    /* and title text                           */  
    cell = row1.cells[0];
    if (cell) {
      cell.innerHTML = "<img id='pic_main' src='' class='glrymain' >";
    }  
  } else {

    /* This is to show the slide Show itself    */
    /* Change this panel to hold the slide show */
    /* panel only                               */  

    /* delete title cells and extend show panel */
    cell = row1.cells[0];
    if (cell) {
      cell.innerHTML = "<img id='pic_main' src='' class='glryshow' style='{visibility:hidden;}' onload='pictureLoaded();' >";
    }
  }

  return;
}

/* loads the show. Should replace by XMLHttp */
function loadShow(showid) {

  var length;
  var arrload = new Array();
    
  switch(showid) {
  case "show_1":
    showtitlepic = "../img/show_1/EL_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Doppelhaus<br>&nbsp;M&nbsp;-&nbsp;Bogenhausen</b>";
    
    length = arrload.push("../img/show_1/EL_gesamt_west.jpg");          // 1
    length = arrload.push("../img/show_1/EL_ansicht_sued_nacht_1.jpg"); // 2
    length = arrload.push("../img/show_1/EL_haustuer_2.jpg");           // 3
    length = arrload.push("../img/show_1/EL_essen.jpg");                // 4
    length = arrload.push("../img/show_1/EL_wohnen.jpg");               // 5
    length = arrload.push("../img/show_1/EL_schlafen_2.jpg");           // 6
    break;
  case "show_2":
    showtitlepic = "../img/show_2/BA_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Doppelhaus<br>&nbsp;M&nbsp;-&nbsp;Obermenzing&nbsp;<br></b>";
    
    length = arrload.push("../img/show_2/BA_ansicht_sued_1.jpg");         // 1
    length = arrload.push("../img/show_2/BA_ansicht_nord_1.jpg");         // 2
    length = arrload.push("../img/show_2/BA_zugang_2.jpg");               // 3
    length = arrload.push("../img/show_2/BA_oberer_treppenbereich.jpg");  // 4
    length = arrload.push("../img/show_2/BA_loggia_aussicht.jpg");        // 5
    break;
  case "show_3":
    showtitlepic = "../img/show_3/HB_ansicht_ost_quadrat.jpg";
    showtitle = "<b class='hdr'>&nbsp;Einfamilienhaus<br>&nbsp;M&nbsp;-&nbsp;Hohenbrunn<br></b>";
    
    length = arrload.push("../img/show_3/HB_ansicht_ost.jpg");         // 1
    length = arrload.push("../img/show_3/HB_ansicht_sued.jpg");        // 2
    length = arrload.push("../img/show_3/HB_winteransicht.jpg");       // 3
    length = arrload.push("../img/show_3/HB_siedle_quadrat.jpg");      // 4
    
    break;
  case "show_4":
    showtitlepic = "../img/show_4/BE_ansicht_quadrat.jpg";
    showtitle = "<b class='hdr'>&nbsp;Einfamilienhäuser<br>&nbsp;B&nbsp;-&nbsp;Köpenick<br></b>";

    length = arrload.push("../img/show_4/BE_ansicht_eingang.jpg");      // 1
    length = arrload.push("../img/show_4/BE_ansicht_haus_2.jpg");       // 2
    length = arrload.push("../img/show_4/BE_ansicht_sued_2.jpg");       // 3
    length = arrload.push("../img/show_4/BE_ansichtausschnitt.jpg");    // 4
    length = arrload.push("../img/show_4/BE_kuppelansicht_innen.jpg");  // 5
    
    break;
  case "show_5":
    showtitlepic = "../img/show_5/IN_el_dg_quad.jpg";
    showtitle = "<b class='hdr'>&nbsp;Innenraum<br>&nbsp;Gestaltung<br></b>";

    length = arrload.push("../img/show_5/IN_el_treppe.jpg");      // 1
    length = arrload.push("../img/show_5/IN_wohnen.jpg");         // 2
    length = arrload.push("../img/show_5/IN_einbauregal.jpg");    // 3
    length = arrload.push("../img/show_5/IN_essen.jpg");          // 4
    length = arrload.push("../img/show_5/IN_glasschrank.jpg");    // 5
    length = arrload.push("../img/show_5/IN_el_schlafen.jpg");    // 6
    length = arrload.push("../img/show_5/IN_el_bad_og_1.jpg");    // 7

    break;
  case "show_6":
    showtitlepic = "../img/show_6/BAE_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Bad<br>&nbsp;Planung<br></b>";

    length = arrload.push("../img/show_6/BAE_Wanne.jpg");         // 1
    length = arrload.push("../img/show_6/BAE_el_duschtasse.jpg"); // 2
    length = arrload.push("../img/show_6/BAE_duscharmatur.jpg");  // 3
    length = arrload.push("../img/show_6/BAE_el_waschtisch.jpg"); // 4
    length = arrload.push("../img/show_6/BAE_hb_waschtisch.jpg"); // 5

    break;
  case "show_7":
    showtitlepic = "../img/show_7/KUE_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Küchen<br>&nbsp;Planung<br></b>";

    length = arrload.push("../img/show_7/KUE_el_kuechenblock_gesamt.jpg");  // 1
    length = arrload.push("../img/show_7/KUE_el_kuchenblock_1.jpg");        // 2
    length = arrload.push("../img/show_7/KUE_hb_kueche.jpg");               // 3

    break;
  case "show_8":
    showtitlepic = "../img/show_8/GA_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Garten<br>&nbsp;Gestaltung<br></b>";

    length = arrload.push("../img/show_8/GA_blick_i_d_garten.jpg");   // 1
    length = arrload.push("../img/show_8/GA_hauptterrasse_1.jpg");    // 2
    length = arrload.push("../img/show_8/GA_sonnenterr.jpg");         // 3
    length = arrload.push("../img/show_8/GA_hb_garten.jpg");          // 4
    length = arrload.push("../img/show_8/GA_el_west.jpg");            // 5

    break;
  case "show_9":
    showtitlepic = "../img/show_9/DE_startbild.jpg";
    showtitle = "<b class='hdr'>&nbsp;Details<br></b>";

    length = arrload.push("../img/show_9/DE_el_bodenbelag_eg.jpg");       // 1    
    length = arrload.push("../img/show_9/DE_el_bodenbelag_og.jpg");       // 2    
    length = arrload.push("../img/show_9/DE_seifens.jpg");                // 4
    length = arrload.push("../img/show_9/DE_el_bad_armatur.jpg");         // 5
    length = arrload.push("../img/show_9/DE_el_bad_dg_wandausschn.jpg");  // 5
    length = arrload.push("../img/show_9/DE_elt_saeule.jpg");             // 6    

    break;
  default: 
    showtitle = "";
    showtitlepic = "../img/pic_main.jpg";
  }
  return arrload;
}