// JavaScript Document
$(document).ready(function() {

    //Execute the slideShow
    slideShow();

});

function slideShow() {

    //Set the opacity of all images to 0
    $('#gallery a').css({ opacity: 0.0 });
    $('#gallery1 a').css({ opacity: 0.0 });
    $('#gallery2 a').css({ opacity: 0.0 });

//    $('#gallerya a').css({ opacity: 0.0 });
//    $('#gallery1a a').css({ opacity: 0.0 });
//    $('#gallery2a a').css({ opacity: 0.0 });

//    $('#galleryb a').css({ opacity: 0.0 });
//    $('#gallery1b a').css({ opacity: 0.0 });
//    $('#gallery2b a').css({ opacity: 0.0 });

    //Get the first image and display it (set it to full opacity)
    $('#gallery a:first').css({ opacity: 1.0 });
    $('#gallery1 a:first').css({ opacity: 1.0 });
    $('#gallery2 a:first').css({ opacity: 1.0 });

//    $('#gallerya a:first').css({ opacity: 1.0 });
//    $('#gallery1a a:first').css({ opacity: 1.0 });
//    $('#gallery2a a:first').css({ opacity: 1.0 });

//    $('#galleryb a:first').css({ opacity: 1.0 });
//    $('#gallery1b a:first').css({ opacity: 1.0 });
//    $('#gallery2b a:first').css({ opacity: 1.0 });

    //Set the caption background to semi-transparent
    $('#gallery .caption').css({ opacity: 0.7 });
    $('#gallery1 .caption').css({ opacity: 0.7 });
    $('#gallery2 .caption').css({ opacity: 0.7 });

//    $('#gallerya .caption').css({ opacity: 0.7 });
//    $('#gallery1a .caption').css({ opacity: 0.7 });
//    $('#gallery2a .caption').css({ opacity: 0.7 });

//    $('#galleryb .caption').css({ opacity: 0.7 });
//    $('#gallery1b .caption').css({ opacity: 0.7 });
//    $('#gallery2b .caption').css({ opacity: 0.7 });

    //Resize the width of the caption according to the image width
    $('#gallery .caption').css({ width: $('#gallery a').find('img').css('width') });
    $('#gallery1 .caption').css({ width: $('#gallery1 a').find('img').css('width') });
    $('#gallery2 .caption').css({ width: $('#gallery2 a').find('img').css('width') });

//    $('#gallerya .caption').css({ width: $('#gallery a').find('img').css('width') });
//    $('#gallery1a .caption').css({ width: $('#gallery1 a').find('img').css('width') });
//    $('#gallery2a .caption').css({ width: $('#gallery2 a').find('img').css('width') });

//    $('#galleryb .caption').css({ width: $('#gallery a').find('img').css('width') });
//    $('#gallery1b .caption').css({ width: $('#gallery1 a').find('img').css('width') });
//    $('#gallery2b .caption').css({ width: $('#gallery2 a').find('img').css('width') });

    //Get the caption of the first image from REL attribute and display it
  

        $('#gallery .content').html($('#gallery a:first').find('img').attr('rel'))

	.animate({ opacity: 0.7 }, 400);
   
    
    $('#gallery1 .content').html($('#gallery1 a:first').find('img').attr('rel'))
	.animate({ opacity: 0.7 }, 400);
    $('#gallery2 .content').html($('#gallery2 a:first').find('img').attr('rel'))
	.animate({ opacity: 0.7 }, 400);

//    $('#gallerya .content').html($('#gallerya a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);
//    $('#gallery1a .content').html($('#gallery1a a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);
//    $('#gallery2a .content').html($('#gallery2a a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);

//    $('#galleryb .content').html($('#galleryb a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);
//    $('#gallery1b .content').html($('#gallery1b a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);
//    $('#gallery2b .content').html($('#innerID2 #gallery2b a:first').find('img').attr('rel'))
//	.animate({ opacity: 0.7 }, 400);

    //Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds
    setInterval('t()', 2000); //setInterval('ta()', 2000); setInterval('tb()', 3000);
    setInterval('m()', 4000); //setInterval('ma()', 2000);setInterval('mb()', 3000);
    setInterval('b()', 6000); //setInterval('ba()', 2000);setInterval('bb()', 3000);

}





function t() {

    //if no IMGs have the show class, grab the first image
    var current = ($('#gallery a.show') ? $('#gallery a.show') : $('#gallery a:first'));

    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next = ((current.next().length) ? ((current.next().hasClass('caption')) ? $('#gallery a:first') : current.next()) : $('#gallery a:first'));
    
    //Get next image caption
    var caption = next.find('img').attr('rel');

    //Set the fade in effect for the next image, show class has higher z-index
    next.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
   

    //Hide the current image
    current.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
   
    //Set the opacity to 0 and height to 1px
    $('#gallery .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
   //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
    $('#gallery .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
   //Display the content
    $('#gallery .content').html(caption);
}
//function ta() {

//    //if no IMGs have the show class, grab the first image
//    var current = ($('#gallerya a.show') ? $('#gallerya a.show') : $('#gallerya a:first'));

//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next = ((current.next().length) ? ((current.next().hasClass('caption')) ? $('#gallerya a:first') : current.next()) : $('#gallerya a:first'));
//  
//    //Get next image caption
//    var caption = next.find('img').attr('rel');


//    //Set the fade in effect for the next image, show class has higher z-index
//    next.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 1.0 }, 1000);


//    //Hide the current image
//    current.animate({ opacity: 0.0 }, 1000)
//	.removeClass('show');

//    //Set the opacity to 0 and height to 1px
//    $('#gallerya .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
//    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
//    $('#gallerya .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
//    //Display the content
//    $('#gallerya .content').html(caption);
//}
//function tb() {

//    //if no IMGs have the show class, grab the first image
//    var current = ($('#galleryb a.show') ? $('#galleryb a.show') : $('#galleryb a:first'));

//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next = ((current.next().length) ? ((current.next().hasClass('caption')) ? $('#galleryb a:first') : current.next()) : $('#galleryb a:first'));

//    //Get next image caption
//    var caption = next.find('img').attr('rel');
//    

//    //Set the fade in effect for the next image, show class has higher z-index
//    next.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 1.0 }, 1000);


//    //Hide the current image
//    current.animate({ opacity: 0.0 }, 1000)
//	.removeClass('show');

//    //Set the opacity to 0 and height to 1px
//    $('#galleryb .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
//    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
//    $('#galleryb .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
//    //Display the content
//    $('#galleryb .content').html(caption);
//}
function m() {

    //if no IMGs have the show class, grab the first image
   
    var current1 = ($('#gallery1 a.show') ? $('#gallery1 a.show') : $('#gallery1 a:first'));
     //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next1 = ((current1.next().length) ? ((current1.next().hasClass('caption')) ? $('#gallery1 a:first') : current1.next()) : $('#gallery1 a:first'));
    //Get next image caption
    var caption1 = next1.find('img').attr('rel');
       //Set the fade in effect for the next image, show class has higher z-index

    next1.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
   

    //Hide the current image
    
    current1.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
   

    //Set the opacity to 0 and height to 1px
    $('#gallery1 .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
   
    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
    $('#gallery1 .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    //Display the content
    try {
        $('#gallery1 .content').html(caption);
    }
    catch (exxx) {
    }
   

}
//function ma() {

//    //if no IMGs have the show class, grab the first image

//    var current1 = ($('#gallery1a a.show') ? $('#gallery1a a.show') : $('#gallery1a a:first'));
//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next1 = ((current1.next().length) ? ((current1.next().hasClass('caption')) ? $('#gallery1a a:first') : current1.next()) : $('#gallery1a a:first'));
//    //Get next image caption
//    var caption1 = next1.find('img').attr('rel');
//    //Set the fade in effect for the next image, show class has higher z-index

//    next1.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 1.0 }, 1000);


//    //Hide the current image

//    current1.animate({ opacity: 0.0 }, 1000)
//	.removeClass('show');


//    //Set the opacity to 0 and height to 1px
//    $('#gallery1a .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });

//    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
//    $('#gallery1a .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
//    //Display the content
//    $('#gallery1a .content').html(caption);

//}

//function mb() {

//    //if no IMGs have the show class, grab the first image

//    var current1 = ($('#gallery1b a.show') ? $('#gallery1b a.show') : $('#gallery1b a:first'));
//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next1 = ((current1.next().length) ? ((current1.next().hasClass('caption')) ? $('#gallery1b a:first') : current1.next()) : $('#gallery1b a:first'));
//    //Get next image caption
//    var caption1 = next1.find('img').attr('rel');
//    //Set the fade in effect for the next image, show class has higher z-index

//    next1.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 1.0 }, 1000);


//    //Hide the current image

//    current1.animate({ opacity: 0.0 }, 1000)
//	.removeClass('show');


//    //Set the opacity to 0 and height to 1px
//    $('#gallery1b .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });

//    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
//    $('#gallery1b .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
//    //Display the content
//    $('#gallery1b .content').html(caption);

//}
function b() {

    //if no IMGs have the show class, grab the first image

    var current2 = ($('#gallery2 a.show') ? $('#gallery2 a.show') : $('#gallery2 a:first'));
    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next2 = ((current2.next().length) ? ((current2.next().hasClass('caption')) ? $('#gallery2 a:first') : current2.next()) : $('#gallery2 a:first'));
    //Get next image caption
    var caption2 = next2.find('img').attr('rel');
    //Set the fade in effect for the next image, show class has higher z-index

    next2.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 2.0 }, 2000);


    //Hide the current image

    current2.animate({ opacity: 0.0 }, 2000)
	.removeClass('show');


    //Set the opacity to 0 and height to 2px
    $('#gallery2 .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '2px' }, { queue: true, duration: 300 });

    //Animate the caption, opacity to 0.7 and heigth to 200px, a slide up effect
    $('#gallery2 .caption').animate({ opacity: 0.7 }, 200).animate({ height: '200px' }, 500);
    //Display the content

    try {
        $('#gallery2 .content').html(caption);
    }
    catch (exx) {
    }

}
//function ba() {

//    //if no IMGs have the show class, grab the first image

//    var current2 = ($('#gallery2a a.show') ? $('#gallery2a a.show') : $('#gallery2a a:first'));
//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next2 = ((current2.next().length) ? ((current2.next().hasClass('caption')) ? $('#gallery2a a:first') : current2.next()) : $('#gallery2a a:first'));
//    //Get next image caption
//    var caption2 = next2.find('img').attr('rel');
//    //Set the fade in effect for the next image, show class has higher z-index

//    next2.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 2.0 }, 2000);


//    //Hide the current image

//    current2.animate({ opacity: 0.0 }, 2000)
//	.removeClass('show');


//    //Set the opacity to 0 and height to 2px
//    $('#gallery2a .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '2px' }, { queue: true, duration: 300 });

//    //Animate the caption, opacity to 0.7 and heigth to 200px, a slide up effect
//    $('#gallery2a .caption').animate({ opacity: 0.7 }, 200).animate({ height: '200px' }, 500);
//    //Display the content
//    $('#gallery2a .content').html(caption);

//}
//function bb() {

//    //if no IMGs have the show class, grab the first image

//    var current2 = ($('#gallery2b a.show') ? $('#gallery2b a.show') : $('#gallery2b a:first'));
//    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
//    var next2 = ((current2.next().length) ? ((current2.next().hasClass('caption')) ? $('#gallery2b a:first') : current2.next()) : $('#gallery2b a:first'));
//    //Get next image caption
//    var caption2 = next2.find('img').attr('rel');
//    //Set the fade in effect for the next image, show class has higher z-index

//    next2.css({ opacity: 0.0 })
//	.addClass('show')
//	.animate({ opacity: 2.0 }, 2000);


//    //Hide the current image

//    current2.animate({ opacity: 0.0 }, 2000)
//	.removeClass('show');


//    //Set the opacity to 0 and height to 2px
//    $('#gallery2b .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '2px' }, { queue: true, duration: 300 });

//    //Animate the caption, opacity to 0.7 and heigth to 200px, a slide up effect
//    $('#gallery2b .caption').animate({ opacity: 0.7 }, 200).animate({ height: '200px' }, 500);
//    //Display the content
//    $('#gallery2b .content').html(caption);

//}
function gallery() {

    //if no IMGs have the show class, grab the first image
    var current = ($('#gallery a.show') ? $('#gallery a.show') : $('#gallery a:first'));
    var current1 = ($('#gallery1 a.show') ? $('#gallery1 a.show') : $('#gallery1 a:first'));
    var current2 = ($('#gallery2 a.show') ? $('#gallery2 a.show') : $('#gallery2 a:first'));

    var currenta = ($('#gallerya a.show') ? $('#gallerya a.show') : $('#gallerya a:first'));
    var current1a = ($('#gallery1a a.show') ? $('#gallery1a a.show') : $('#gallery1a a:first'));
    var current2a = ($('#gallery2a a.show') ? $('#gallery2a a.show') : $('#gallery2a a:first'));

    var currentb = ($('#galleryb a.show') ? $('#galleryb a.show') : $('#galleryb a:first'));
    var current1b = ($('#gallery1b a.show') ? $('#gallery1b a.show') : $('#gallery1b a:first'));
    var current2b = ($('#gallery2b a.show') ? $('#gallery2b a.show') : $('#gallery2b a:first'));

    //Get next image, if it reached the end of the slideshow, rotate it back to the first image
    var next = ((current.next().length) ? ((current.next().hasClass('caption')) ? $('#gallery a:first') : current.next()) : $('#gallery a:first'));
    var next1 = ((current1.next().length) ? ((current1.next().hasClass('caption')) ? $('#gallery1 a:first') : current1.next()) : $('#gallery1 a:first'));
    var next2 = ((current2.next().length) ? ((current2.next().hasClass('caption')) ? $('#gallery2 a:first') : current2.next()) : $('#gallery2 a:first'));

    var nexta = ((currenta.next().length) ? ((currenta.next().hasClass('caption')) ? $('#gallerya a:first') : currenta.next()) : $('#gallerya a:first'));
    var next1a = ((current1a.next().length) ? ((current1a.next().hasClass('caption')) ? $('#gallery1a a:first') : current1a.next()) : $('#gallery1a a:first'));
    var next2a = ((current2a.next().length) ? ((current2a.next().hasClass('caption')) ? $('#gallery2a a:first') : current2a.next()) : $('#gallery2a a:first'));

    var nextb = ((currentb.next().length) ? ((currentb.next().hasClass('caption')) ? $('#galleryb a:first') : currentb.next()) : $('#galleryb a:first'));
    var next1b = ((current1b.next().length) ? ((current1b.next().hasClass('caption')) ? $('#gallery1b a:first') : current1b.next()) : $('#gallery1b a:first'));
    var next2b = ((current2b.next().length) ? ((current2b.next().hasClass('caption')) ? $('#gallery2b a:first') : current2b.next()) : $('#gallery2b a:first'));
    //Get next image caption
    var caption = next.find('img').attr('rel');
    var caption1 = next1.find('img').attr('rel');
    var caption2 = next2.find('img').attr('rel');

    var captiona = nexta.find('img').attr('rel');
    var caption1a = next1a.find('img').attr('rel');
    var caption2a = next2a.find('img').attr('rel');

    var captionb = nextb.find('img').attr('rel');
    var caption1b = next1b.find('img').attr('rel');
    var caption2b = next2b.find('img').attr('rel');

    //Set the fade in effect for the next image, show class has higher z-index
    next.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next1.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next2.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);

    nexta.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next1a.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next2a.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);

    nextb.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next1b.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);
    next2b.css({ opacity: 0.0 })
	.addClass('show')
	.animate({ opacity: 1.0 }, 1000);

    //Hide the current image
    current.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current1.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current2.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');

    currenta.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current1a.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current2a.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');

    currentb.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current1b.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');
    current2b.animate({ opacity: 0.0 }, 1000)
	.removeClass('show');

    //Set the opacity to 0 and height to 1px
    $('#gallery .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery1 .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery2 .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });

    $('#gallerya .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery1a .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery2a .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });

    $('#galleryb .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery1b .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });
    $('#gallery2b .caption').animate({ opacity: 0.0 }, { queue: false, duration: 0 }).animate({ height: '1px' }, { queue: true, duration: 300 });

    //Animate the caption, opacity to 0.7 and heigth to 100px, a slide up effect
    $('#gallery .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery1 .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery2 .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallerya .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery1a .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery2a .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#galleryb .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery1b .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    $('#gallery2b .caption').animate({ opacity: 0.7 }, 100).animate({ height: '100px' }, 500);
    //Display the content
    $('#gallery .content').html(caption);
    $('#gallery1 .content').html(caption);
    $('#gallery2 .content').html(caption);
    $('#gallerya .content').html(caption);
    $('#gallery1a .content').html(caption);
    $('#gallery2a .content').html(caption);
    $('#galleryb .content').html(caption);
    $('#gallery1b .content').html(caption);
    $('#gallery2b .content').html(caption);
}