var galleryXML;
//var gallery;
//var carousel;
var galleryLoaded = [];
var currentGallery;
var firstImage = 1;
var lastImage = 1;
var last;
var lastGalId;

function init () {
  $('div.page').hide();
	setCurrentPage($('a.current_link'), 'home');
    var gallery_file = 'gallery.xml';
	jQuery.get( gallery_file, {}, function (data) { 
		galleryXML = data;
		loadLinks();
    $(document).pngFix();  
	});
}

function loadLinks () {
  var linkAr = galleryXML.getElementsByTagName('gallery');
  for (var i=linkAr.length-1; i >= 0; i--) {
    var li = document.createElement('li');
    var a = document.createElement('a');
    $(a).attr('href', "Javascript:setCurrentPage(this, 'gallery', "+ i +")");
    $(a).addClass("links");
		$(a).text(linkAr[i].getAttribute('name'));
		$('#homelink').after($(li).append($(a)));
	}
  // Activate lava lamp
	$("ul.links").lavaLamp();
}

function setCurrentPage (link, current, galId) {

  var speed = 800;
  //$('#home, #contact, #bio, #thanks, #contact, #bio, #random_image').hide();
	//$('#galleryContainer, #thumbsContainer').hide();
  //$('#thumbsContainer div.wrapper').hide();
	//$('div.galleryOuter, div.galleryMiddle, div.galleryInner').hide()
  // thanks IE6 for the cluster of hide/css rules
  //$('div.galleryOuter').css('visibility', 'hidden');
  //$('div.title, div.desc').hide();

  // Fade from home, contact, bio to gallery and back, but not gallery to gallery
  if (current == 'gallery') {
		if (!galleryLoaded[galId]) {
			loadGallery(galId);
		}
    // move below the fade code
		currentGallery = galleryLoaded[galId];

    // thanks IE6 I really appreciate it 
    $('div.galleryOuter').css('visibility', 'hidden');

    if (last != 'gallery') {
      $('#'+last).fadeOut(speed, function () {
        $('#random_image').hide();
        //$('#galleryContainer, #thumbsContainer, #gallery' + galId + ' > *' +
          //' #thumbsWrapper' + galId + ' > *').fadeIn(speed, function () {
        $('#galleryPage' +  galId ).fadeIn(speed, function () {
	          $('#gallery' + galId).css('visibility', 'visible');
	          //$('#title' + galId).show();
	          //$('#desc' + galId).show();
          });
      });
    }
    else {
      $('#galleryPage' + lastGalId).hide();
      $('#galleryPage' + galId).show();
	    $('#gallery' + galId).css('visibility', 'visible');
    }

    last = current;
    lastGalId = galId;
    animateFooter(0);
  }
  else {
    if (last == 'gallery') {
      $('#galleryPage' + lastGalId).hide();
    }
    else {
      $('#'+last).hide();
    }
    //$('#home, #contact, #bio, #thanks, #contact, #bio, #random_image').fadeOut(speed);
    //$('#galleryContainer, #thumbsContainer, #gallery' + galId + ' > *' +
     // ' #thumbsWrapper' + galId + ' > *').fadeOut(speed, function () {
     



    if (current == 'contact' || current == 'bio') {
      if (current == 'contact') 
        animateFooter(1);
      else 
        animateFooter(0);
	    $('#contact_image').attr('src', get_random_image_string());
      $('#random_image').fadeIn(speed);
    }
    else {
      $('#random_image').hide();
      animateFooter(1);
    }
		$('#' + current).fadeIn(speed);
    last = current;
  }
  

	//if (current == 'gallery') {
    //$('#galleryContainer').css('display', 'table');
    
    ///$('#galleryContainer').show();
		///$('#thumbsContainer').show();
	  ///$('#gallery' + galId).css('visibility', 'visible');
	  ///$('#gallery' + galId).show();
	  ///$('#gallery' + galId + ' div.galleryMiddle').show();
	  ///$('#gallery' + galId + ' div.galleryInner').show();
		///$('#slide' + galId +',  #thumbsWrapper'+ galId).show();
	  //$('#title' + galId).show();
	  //$('#desc' + galId).show();

}

function animateFooter (upPosition) {
  var speed = 800;
  if (!upPosition) {
    $('#border, #signature, #copyright').animate({ top: 572}, speed);
  }
  else {
    if ($('#border').css('top') != 'auto') {
      $('#border, #copyright').animate({ top: 472}, speed);
      $('#signature').animate({top:482}, speed);
    }
  }
}

function updateFirstItem (carousel, li, index, state) {
	//alert ('Update Last Item index : ' + index * 2);
	firstImage = index;
}

function updateLastItem (carousel, li, index, state) {
	//alert ('Update Last Item index  : ' + index * 2);
  // hack - this fails if there are 3,4,5 images 
  //if (index > 2) {
    // This kills an image
    //alert('yo ' + state);
    //alert(carousel);
	  currentCarousel = carousel;
    if (index * 2 > 6)
	    lastImage = index * 2;
    //}
  //}
}

function checkThumbVisible () {
	var i = currentGallery['gallery'].currentIndex + 1;
	if (i >= currentGallery['size']) {
		currentCarousel.scroll(1);
	}
	//alert('Current, first, last ('+i +','+firstImage+','+lastImage+')');
	if (i <= firstImage) {
		currentCarousel.prev();
	}
	else if (i >= lastImage) {
		currentCarousel.next();
	}
}

function loadGallery (galleryIndex) {

  var paintAr = galleryXML.getElementsByTagName('gallery').
	  item(galleryIndex).getElementsByTagName('painting');
  if (!paintAr || paintAr.length == 0) return;

	var galleryPage = document.createElement('div');
	$(galleryPage).attr('id', 'galleryPage' + galleryIndex);
	$(galleryPage).attr('class', 'galleryPage');
	$(galleryPage).hide();

  var galleryDiv = createGallery(galleryIndex);
	$(galleryPage).append(galleryDiv);

  var thumbsDiv = createCarousel(galleryIndex);
	$(galleryPage).append(thumbsDiv);

  $('#links').after(galleryPage);

	// Create thumbnails for gallerific
  for (var i=0; i < paintAr.length; i++) {
    var url = paintAr[i].getAttribute('url');
    var title = paintAr[i].getAttribute('title');
    if (title == null) title = "";
    var desc = paintAr[i].getAttribute('description');
    if (desc == null) desc = "";

    var li = createImage(galleryIndex, url, title, desc);
		$('#thumbs'+ galleryIndex +' ul.thumbs').append(li);
  }

  // TODO if paintar.length is 0 then don't do this
  
	var gallery = $('#gallery'+ galleryIndex).galleriffic('#thumbs'+ galleryIndex, {
		delay:                3000,
		numThumbs:            20,
		preloadAhead:         40, // Set to -1 to preload all images
		enableTopPager:       false,
		enableBottomPager:    false,
		imageContainerSel:    '#slide' + galleryIndex,
		controlsContainerSel: '',
		titleContainerSel:    '#title' + galleryIndex,
		descContainerSel:    '#desc' + galleryIndex,
		renderSSControls:     false,
		renderNavControls:    false
	});
	//alert('Count : '+Math.round(paintAr.length/2));
	jQuery('#thumbs' + galleryIndex).jcarousel({
    easing:'easeOutQuad',
		animation: 250,
		vertical: true ,
		scroll:1,
		size:Math.round(paintAr.length/2),
		itemFirstInCallback: {
		  onBeforeAnimation: updateFirstItem
		},
		itemLastInCallback: {
		  onBeforeAnimation: updateLastItem
		}

	});

	$('#slide' + galleryIndex).bind('click', function() { checkThumbVisible(); });
	galleryLoaded[galleryIndex] = {gallery: gallery, size: paintAr.length};
}

function createGallery (galleryIndex) {
	var galleryContainer = document.createElement('div');
	$(galleryContainer).attr('class', 'frame');
	var outer = document.createElement('div');
	$(outer).attr('id', 'gallery' + galleryIndex);
	$(outer).addClass('galleryOuter');
	var middle = document.createElement('div');
	$(middle).addClass('galleryMiddle');
	var inner = document.createElement('div');
	$(inner).attr('id', 'slide' + galleryIndex);
	$(inner).addClass('galleryInner');
	var title = document.createElement('div');
	$(title).attr('id', 'title' + galleryIndex);
	$(title).addClass('title');
	var desc = document.createElement('div');
	$(desc).attr('id', 'desc' + galleryIndex);
	$(desc).addClass('desc');
	$(galleryContainer).append($(outer).append($(middle).append($(inner))).append(title).append(desc));
  return galleryContainer;
}

function createCarousel (galleryIndex) {

	// jcarousel creates a wrapper with no specific id
	// so we create a wrapper around that
	//var wrap = document.createElement('div');
	//$(wrap).attr('id', 'thumbsWrapper' + galleryIndex);
	//$(wrap).addClass('wrapper');
	var div = document.createElement('div');
	$(div).attr('id', 'thumbs' + galleryIndex);
	$(div).addClass('jcarousel-skin-tango');
	var ul = document.createElement('ul');
	$(ul).addClass('thumbs');
	//$(wrap).append($(div).append(ul));
	$(div).append(ul);
  return div;
}

function createImage (galleryIndex, url, titleText, descText) {
  var img_prefix = 'images/galleries/' + galleryIndex + '/';
  var thumb_prefix = img_prefix + 'thumb/';

  var li = document.createElement('li');
  var a = document.createElement('a');
  $(a).attr('href', img_prefix + url);
  $(a).attr('title', titleText); 
  $(a).attr('description', descText);
  var img = document.createElement('img');
  $(img).attr('src', thumb_prefix + url);
  $(img).attr('alt', titleText);
	$(li).append($(a).append(img));
  return li;
}

function get_random_image_string () {
	var num_images = 5;
	var image_num = Math.floor (Math.random() * num_images + 1);
	var image_name = 'images/random/'+ image_num + '.jpg';
	return image_name;
}