// javascript for marlenemaccallum

// these functions are called when each page loads.
function onloads() {
 if (document.getElementById('loading')) { hideloading(); }
 if ((document.getElementById('thumbs')) /*&& (!(document.getElementById('emptygallerywarning')))*/) { loadpanels(); }
 if (document.getElementById('news-menu')) { loaddropboxes(); }
 if (document.getElementById('s')) { loadsearch(); }
}



// hides the 'loading' animation.
function hideloading() {
 document.getElementById('loading').style.display = 'none';
}



function loadpanels() {
 // initialize panels, which are used to display different groups of content on the same page.
 var panels = []; // declare array.
 var paneltags = document.getElementsByTagName('div'); // check all divs...
 for (var i=0; i<paneltags.length; i++) {
  var paneltag = paneltags[i];
  var classes = paneltag.className.split(" "); // ...check for multiple classes...
  for (var j=0; j<classes.length; j++) {
   thisclass = classes[j];
   if (thisclass == "panel") { // ...and put any with a class "panel" in the 'panels' array.
    panels.push(paneltag);
   }
  }
 }
 // 'numberofpanels' is a global variable and is used in other functions.
 numberofpanels = panels.length;

 // assign panel ids.
 for(var i=0; i<numberofpanels; i++) {
  panels[i].id = 'panel'+(i+1); // i+1 so that numbering starts with 1 instead of 0
 }

 // display the first panel.
 displaypanel(1);

 // initialize thumbnails. thumbnails are used to switch between panels.
 var thumbs = []; // declare array.
 var thumbtags = document.getElementsByTagName('li'); // check all lis...
 for (var i=0; i<thumbtags.length; i++) {
  var thumbtag = thumbtags[i];
  var classes = thumbtag.className.split(" "); // ...check for multiple classes...
  for (var j=0; j<classes.length; j++) {
   thisclass = classes[j];
   if (thisclass == "thumb") { // ...and put any with a class "thumb" in the 'thumbs' array.
    thumbs.push(thumbtag);
   }
  }
 }
 // 'numberofthumbs' is a global variable and is used in other functions.
 numberofthumbs = thumbs.length;

 // assign thumb ids and mouse events.
 for(var i=0; i<numberofthumbs; i++) {
  thumbs[i].id = 'thumb'+(i+1); // i+1 so that numbering starts with 1 instead of 0
  thumbs[i].onmouseover = function() {
   displaypanel(this.id.substring(5)); // "this.id.substring(5)" returns just the number "1" from the id "thumb1".
   rememberthumb(this.id.substring(5));
  };
  // if there is only one thumb, no need to display it.
  if(numberofthumbs == 1) {
   thumbs[i].style.display = 'none';
  }
 }

 // light up the first thumbnail.
 rememberthumb(1);
}



// displays panel and hides other panels
function displaypanel(thisid) {
 for (var i=1; i<(numberofpanels+1); i++) {
  document.getElementById('panel'+i).style.display = 'none';
 }
 document.getElementById('panel'+thisid).style.display = 'block';
 //document.getElementById('portfolio-postsubtitle').innerHTML = document.getElementById('panel'+thisid).title;
}



// keeps the last thumbnail moused over "lit", until another is moused over.
function rememberthumb(thisid) {
 for (var i=1; i<(numberofthumbs+1); i++) {
  document.getElementById('thumb'+i).className = 'thumb';
 }
 document.getElementById('thumb'+thisid).className = 'thumb-lit';
}



// initalize drop-down navigation boxes.
function loaddropboxes() {
 var dropboxes = []; // declare array.
 var dropboxestags = document.getElementsByTagName('select'); // check all selects...
 for (var i=0; i<dropboxestags.length; i++) {
  var dropboxestag = dropboxestags[i];
  var classes = dropboxestag.className.split(" "); // ...check for multiple classes...
  for (var j=0; j<classes.length; j++) {
   thisclass = classes[j];
   if (thisclass == "dropbox") { // ...and put any with a class "dropbox" in the array.
    dropboxes.push(dropboxestag);
   }
  }
 }
 // 'numberofdropboxes' is a global variable and is used in other functions.
 numberofdropboxes = dropboxes.length;

 // assign thumb ids and mouse events.
 for(var i=0; i<numberofdropboxes; i++) {
  dropboxes[i].onchange = function() {
   if (this.options[this.selectedIndex].value != '') {
    document.location.href=this.options[this.selectedIndex].value;
   }
  };
 }
}



// initialize search box
function loadsearch() {
 var searchbox = document.getElementById('s');
 searchbox.onclick = function() {
  searchbox.value = '';
  searchbox.style.color = '#222';
 };

 searchbox.onblur = function() {
  searchbox.value = 'search';
  searchbox.style.color = '#bbb';
 };
}