var gallery_array = new Array("gallery","print_gallery","web_gallery");
var background_array = new Array("images/home_background2.jpg", "images/portfolio_background.jpg", "images/tower-page.jpg");

var gallery_images = new Array(0);
var print_gallery_images = new Array(0);
var web_gallery_images = new Array(0);

function init() {
  /*
  document.getElementById('loading').style.display = "block";
  preloadImages("gallery", gallery_images);
  preloadImages("print_gallery", print_gallery_images);
  preloadImages("web_gallery", web_gallery_images);
  document.getElementById('loading').style.display = "none";
  */


  document.body.background = background_array[0];
  document.body.style.backgroundRepeat = "no-repeat";
}

function preloadImages(gallery_name, image_array) {
   var li = document.getElementById(gallery_name).getElementsByTagName('li');
   for (j=0; j<li.length; j++) {
      image_array[j] = li[j].getElementsByTagName('img')[0].src;
   }
}

window.onload = init;

/*main nav script*/
var subs_array = new Array("about","portfolio","contact");// Put the id's of your hidden divs in this array

function displaySubs(the_sub){
	 if (document.getElementById(the_sub).style.display==""){
	   document.getElementById(the_sub).style.display = "none";
	   
	   if (the_sub == "portfolio") {
	     document.getElementById('captionBox').style.display = "none";
         document.getElementById('bigBox').style.display = "none";
         document.getElementById('button').style.display = "none";
	   }
	   return
  }

  if (the_sub != "portfolio") {
    document.getElementById('captionBox').style.display = "none";
    document.getElementById('bigBox').style.display = "none";
    document.getElementById('button').style.display = "none";
  }

  document.getElementById('photos').style.display = "none";

  for (i=0;i<subs_array.length;i++){
      var this_link = document.getElementById(subs_array[i] + "_link");

	   var my_sub = document.getElementById(subs_array[i]);
	   if (subs_array[i] == the_sub) {
		   my_sub.style.display = "block";
		   //this_link.style.color = "#890f0a";
		   document.body.background = background_array[i];


		} else { 
			my_sub.style.display = "none";
			//this_link.style.color = "#321903";
		}	
	}
  document.getElementById(the_sub).style.display = "";
  if (the_sub == 'portfolio') {
    displayGallery('gallery');
  }
}


function displayGallery(galleryName) {
  

  for (i=0;i<gallery_array.length;i++) {
    var this_link = document.getElementById(gallery_array[i] + "_link");

    var this_gallery = document.getElementById(gallery_array[i]);
     if (galleryName == gallery_array[i]) {
       this_gallery.style.display = "block";

       // Change the link text for this gallery to a new color
       //this_link.style.color = "890f0a";
       
      
        var li = document.getElementById(galleryName).getElementsByTagName('li');
        
        // Default to displaying element [0] from list
        var bigbox = document.getElementById('bigBox');
        bigbox.style.display = "block";

        bigbox.src = li[0].getElementsByTagName('img')[0].src;

        // Put text for element [0] in the captionBox
        var captionbox = document.getElementById('captionBox');
     	captionbox.style.display = "block";
     	captionbox.innertext = li[0].getElementsByTagName('img')[0].alt;
     	captionbox.innerHTML = li[0].getElementsByTagName('img')[0].alt;

        // Only display the button if there is a title (used as URL) defined for the img
        var button = document.getElementById('button');
        if (li[0].getElementsByTagName('img')[0].title) {
          button.style.display = "block";
          document.getElementById('weblink').href=li[0].getElementsByTagName('img')[0].title;
        } else {
          button.style.display = "none";
        }
     	
     	
      	for (j=0; j<li.length; j++) {
    		li[j].style.backgroundImage = 'url(' + li[j].getElementsByTagName('img')[0].src + ')';
   	    	li[j].title = li[j].getElementsByTagName('img')[0].alt;
      
   	    	addEvent(li[j], 'click', function() {
                // Display current element
               var bigbox2 = document.getElementById('bigBox');
               bigbox2.style.display = "block";

               bigbox2.src = this.getElementsByTagName('img')[0].src;


	           // Put text for current in the captionBox
	           var captionbox2 = document.getElementById('captionBox');
               captionbox2.style.display = "block";
     	       captionbox2.innertext = this.getElementsByTagName('img')[0].alt;
     	       captionbox2.innerHTML = this.getElementsByTagName('img')[0].alt;	      

               // Only display the button if there is a title (used as URL) defined for the img
               var button2 = document.getElementById('button');
               if (this.getElementsByTagName('img')[0].title) {
                 button2.style.display = "block";
                 document.getElementById('weblink').href=this.getElementsByTagName('img')[0].title;
               } else {
                 button2.style.display = "none";
               }

            }); 
        }
        
       
    } else {
       this_gallery.style.display = "none";
       //this_link.style.color = "#321903";
    }
  }  
}





function addEvent(obj, type, fn) {
   if (obj.addEventListener) {
 	  obj.addEventListener(type, fn, false);
   } else if (obj.attachEvent) {
      obj["e"+type+fn] = fn;
   	  obj[type+fn] = function() { 
        obj["e"+type+fn]( window.event );
      }
   	  obj.attachEvent("on"+type, obj[type+fn]);
   }
}






/*
var last_rollover_color = "#321903";

function setRolloverColor(el_name) {
  var el = document.getElementById(el_name);
  
  last_rollover_color = el.style.color;
  el.style.color = "white";
  el.style.background = "#321903";
}

function unsetRolloverColor(el_name) {
  var el = document.getElementById(el_name);

  el.style.color = last_rollover_color;
  el.style.background = "";
}
*/

function displayId(name) {
  var el = document.getElementById(name);

  el.style.display = "block";
}

function toggleDisplayId(name) {
  var el = document.getElementById(name);
  
  if (el.style.display == "block") {
    el.style.display = "none";
  } else {
    el.style.display = "block";
  }
}