// Fires when the DOM has loaded
window.addEvent('domready', function() {

    // Feature image paths
    var path = 'ucdnrs/includes/images/featurebox/'
    var images = [
	    path + '0.jpg',
        path + '1.jpg',
        path + '2.jpg',
        path + '3.jpg',
        path + '4.jpg',
        path + '5.jpg',
        path + '6.jpg'
    ];

    // Feature image titles
    var altTags = [
        'Map of UC Davis Natural Reserve System',
        'Tidal pool at Bodega Marine Reserve',
        'Eagle Lake with a snow-capped Mt. Lassen in the background',
        'Fields of Gold at Jepson Prairie Reserve',
        'Lupins in the field at McLaughlin Reserve',
        'Poppies after a fire at Quail Ridge Reserve',
        'A look down at Putah Creek from atop of Stebbins Cold Canyon Reserve'
    ];

    // Feature image, image container and feature title links
    var pgrmLinks = [
        'ucdnrs/about.html',
        'http://www.bml.ucdavis.edu/bmr/index.html',
        'http://www.csuchico.edu/biol/EagleLake/eaglelake.html',
        'Jepson.html',
        'McL/index.html',
        'Quail.html',
        'Stebbins.html'
    ];

    // Feature text (for apostrophes, use the escape character. EX: California\'s)
    var FeatureTxt = [
        'UC Davis Natural Reserve System manages six of the 36 reserves that comprise the largest and most diverse set of university-owned and operated reserves in the world. These reserves include examples of nearly every major ecosystem in the state. They provide secure sites for research, instruction, and public outreach.<span class="more"><a href="ucdnrs/about.html"><br />[ More ]</a></span>',
        'Bodega Marine Reserve encompasses 611 acres of terrestrial and marine habitats surrounding the Bodega Marine Laboratory, offering research and educational opportunities on both sides of the tide line. The reserve is a preeminent site for field research on environmental issues targeted by state and national initiatives, and a major training center for marine and coastal field biologists.<span class="more"><a href="http://www.bml.ucdavis.edu/bmr/index.html">[ More ]</a></span>',
        'Eagle Lake is the second-largest lake within California and one of the most pristine due to its unique chemistry, remote location, and harsh climate. On the lakeshore, the Eagle Lake Field Station gives researchers and classes access to the lake along with surrounding sagebrush and forest habitats.<span class="more"><a href="http://www.csuchico.edu/biol/EagleLake/eaglelake.html">[ More ]</a></span>',
        'Jepson Prairie Reserve is a 1500-acre remnant of the Central Valley’s highly endangered vernal pool and grassland ecosystem, only 20 minutes from the Davis campus. Its outstanding biological diversity, scientifically informed land management, and opportunities to study native species in a rare ecosystem have placed it at the forefront of conservation biology.<span class="more"><a href="Jepson.html">[ More ]</a></span>',
        'The 7000-acre McLaughlin Reserve provides protected woodland, grassland and chaparral research sites and a comfortable 15-person field station, 60 miles northwest of Davis in the inner North Coast Range. The reserve’s serpentine soils harbor a rich community of unique plants that have evolved tolerance to low nutrients and high levels of magnesium and heavy metals.<span class="more"><a href="McL/index.html">[ More ]</a></span>',
        'Quail Ridge Reserve, consisting of 1900 acres of native grasslands and oak woodlands on a rugged peninsula in Lake Berryessa, hosts the world’s most extensive wireless mesh network in a wildland setting. The reserve serves a diversity of classes and researchers, and provides an emerging model for the integration of communication technology and computer science with the environmental sciences.<span class="more"><a href="Quail.html">[ More ]</a></span>',
        'Stebbins Cold Canyon Reserve, set in a steep canyon 30 minutes west of Davis, provides excellent examples of Inner Coast Range riparian and hillside habitats. Its diversity, proximity, and spectacular views have made it a long-time favorite destination for UC Davis researchers and classes. As one of the few reserves open to the public, the reserve is also managed to accommodate visitors and enhance their experience.<span class="more"><a href="Stebbins.html">[ More ]</a></span>'
    ];

    // Feature titles (for apostrophes, use the escape character. EX: California\'s)
    var FeatureTitles = [
        '<a href=\'' + pgrmLinks[0] + '\'>UC Davis Natural Reserve System</a>',
        '<a href=\'' + pgrmLinks[1] + '\'>Bodega Marine Reserve</a>',
        '<a href=\'' + pgrmLinks[2] + '\'>Eagle Lake Field Station</a>',
        '<a href=\'' + pgrmLinks[3] + '\'>Jepson Prairie Reserve</a>',
        '<a href=\'' + pgrmLinks[4] + '\'>McLaughlin Natural Reserve</a>',
        '<a href=\'' + pgrmLinks[5] + '\'>Quail Ridge Reserve</a>',
        '<a href=\'' + pgrmLinks[6] + '\'>Stebbins Cold Canyon Reserve</a>'
    ];

    // Replace noscript links
    var myPrograms = $$('.program')
    myPrograms.each(function(item, index) {
        item.setStyle('cursor', 'pointer');
        item.addEvent('click', function() {
            document.location = pgrmLinks[index];
        });
    });

    // Load feature images
    var myImages = new Asset.images(images, {
        // Add thumbnail events after all images are loaded.
        onComplete: function() {
            $('p0').addEvents({ 'mouseover': function() { show(0); } });
            $('p1').addEvents({ 'mouseover': function() { show(1); } });
            $('p2').addEvents({ 'mouseover': function() { show(2); } });
            $('p3').addEvents({ 'mouseover': function() { show(3); } });
            $('p4').addEvents({ 'mouseover': function() { show(4); } });
            $('p5').addEvents({ 'mouseover': function() { show(5); } });
            $('p6').addEvents({ 'mouseover': function() { show(6); } });
        }
    });

    // Handles displaying/hiding thumbnails and images
    function show(which) {
        // Array of img elements who's class = "thumb"
        var myThumbs = $$('#programs_bar img.thumb');
        myThumbs.each(function(item, index) {
            if (index == which) {

                var image_bg = $('feature_img_bg');
                var image = $('feature_img');
                var title = $('feature_title');
                var link = $('feature_link');
                var blurb = $('feature_blurb');

                Tween(item, 'opacity', 0, '400');

                if (image.getStyle('opacity') > 0) {

                    // Instantainously set image background and title
                    image_bg.setStyle('background', 'url(' + path + which + '.jpg) no-repeat');
                    image_bg.set('title', altTags[which]);

                    // Update the container link
                    image_bg.addEvents({ 'click': function() { document.location = pgrmLinks[which]; } });
                    
                    // Tween to new parameters
                    Tween(image, 'opacity', 0, '300');
                    Tween(image_bg, 'width', myImages[which].width, '400');

                    // Set new text
                    blurb.set('html', FeatureTxt[which]);
                    title.set('html', FeatureTitles[which]);

                }
                else if (image.getStyle('opacity') < 1) {

                    // Instaintainously set image src and title
                    image.set('src', path + which + '.jpg');
                    image.set('title', altTags[which]);

                    // Tween to new parameters
                    Tween(image, 'opacity', 1, '300');
                    Tween(image_bg, 'width', myImages[which].width, '400');

                    // Set new text
                    blurb.set('html', FeatureTxt[which]);
                    title.set('html', FeatureTitles[which]);
                }
            }
            else {
                // Hide all other thumbnails
                Tween(item, 'opacity', 1, '400');
            }
        });
    }

    function Tween(which, property, value, speed) {
        which.set('tween', { duration: speed, link: 'cancel' });
        which.tween(property, value);
    }
});