// Declare namespace.
YAHOO.namespace("YAHOO.futurarose");

// Singleton pattern.
YAHOO.futurarose.portfolio = (function() {
    //
    // Private variables
    //
    var isExpanded = {};
    var timerId = null;
    var currentSlide = -1;
    var currentView = 0;   // 0 == Main
    var animEasingOptions = [
        //YAHOO.util.Easing.backBoth,
        //YAHOO.util.Easing.backIn,
        //YAHOO.util.Easing.backOut,
        YAHOO.util.Easing.bounceBoth,
        YAHOO.util.Easing.bounceIn,
        YAHOO.util.Easing.bounceOut//,
        //YAHOO.util.Easing.easeBoth,
        //YAHOO.util.Easing.easeBothStrong,
        //YAHOO.util.Easing.easeIn,
        //YAHOO.util.Easing.easeInStrong,
        //YAHOO.util.Easing.easeNone,
        //YAHOO.util.Easing.easeOut,
        //YAHOO.util.Easing.easeOutStrong//,
        // The elastic ones are too busy.
        //YAHOO.util.Easing.elasticBoth,
        //YAHOO.util.Easing.elasticIn,
        //YAHOO.util.Easing.elasticOut
    ];
    var galleryPieces = {
        0: [
            {
                url: "images/preview_slideshow/pvd01_stanford.jpg",
                // The "see" key refers to another item in this object.
                see: "[2][0]"
            },
            {
                url: "images/preview_slideshow/pvued02_intel.jpg",
                see: "[3][1]"
            },
            {
                url: "images/preview_slideshow/pva01_stilllife_violin.jpg",
                see: "[1][0]"
            },
            {
                url: "images/preview_slideshow/pvd05_concept_disk.jpg",
                see: "[2][4]"
            },
            {
                url: "images/preview_slideshow/pva02_stilllife_hat.jpg",
                see: "[1][1]"
            },
            {
                url: "images/preview_slideshow/pvd02_intel_hawking.jpg",
                see: "[2][1]"
            },
            {
                url: "images/preview_slideshow/pva03_colorstudyhomage_picasso.jpg",
                see: "[1][2]"
            },
            {
                url: "images/preview_slideshow/pvd04_sgi_webforce.jpg",
                see: "[2][2]"
            },
            {
                url: "images/preview_slideshow/pva05_stoneage_spaceage.jpg",
                see: "[1][4]"
            },
            {
                url: "images/preview_slideshow/pvd08_poster_etheridge.jpg",
                see: "[2][7]"
            },
            {
                url: "images/preview_slideshow/pva07_study_grabbinghands.jpg",
                see: "[1][5]"
            },
            {
                url: "images/preview_slideshow/pvued04_mf1.jpg",
                see: "[3][3]"
            },
            {
                url: "images/preview_slideshow/pva08_stilllife_vase.jpg",
                see: "[1][6]"
            },
            {
                url: "images/preview_slideshow/pvued03_scu.jpg",
                see: "[3][2]"
            },
            {
                url: "images/preview_slideshow/pva09_gourds.jpg",
                see: "[1][7]"
            },
            {
                url: "images/preview_slideshow/pva10_ralstons_waterfountain.jpg",
                see: "[1][8]"
            },
            {
                url: "images/preview_slideshow/pva11_knowledge_hope.jpg",
                see: "[1][9]"
            },
            {
                url: "images/preview_slideshow/pva12_stilllife_guitar.jpg",
                see: "[1][10]"
            },
            {
                url: "images/preview_slideshow/pvd03_intel_vcomputing.jpg",
                see: "[2][1]"
            },
            {
                url: "images/preview_slideshow/pvd06_logo_polaris.jpg",
                see: "[2][5]"
            },
            {
                url: "images/preview_slideshow/pvd07_stationery_potlood.jpg",
                see: "[2][6]"
            },
            {
                url: "images/preview_slideshow/pvd09_bookcover_myth.jpg",
                see: "[2][8]"
            },
            {
                url: "images/preview_slideshow/pvd11_postcard_front.jpg",
                see: "[2][9]"
            },
            {
                url: "images/preview_slideshow/pvd10_brochure_outside.jpg",
                see: "[2][10]"
            },
            {
                url: "images/preview_slideshow/pvued01_stanford.jpg",
                see: "[3][0]"
            },
            {
                url: "images/preview_slideshow/pvued04_mf0.jpg",
                see: "[3][3]"
            },
            {
                url: "images/preview_slideshow/pvued04_mf2.jpg",
                see: "[3][3]"
            }
        ],
        1: [
            {
                url: "images/thumbnails/thumbs_art_gallery/01t_stilllife_violin.jpg",
                thumb: "still life with violin",
                title: ""Still Life with Violin"",
                descr: " <p>Medium: soft pastels on charcoal paper, 19&quot;x24&quot;</p> <p>Notes: CND (Notre Dame de Namur), April 2001</p> ",
                clickurl: "images/artwork/01_stilllife_violin.jpg",
                img_w: 243,
                img_h: 354
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/02t_stilllife_hat.jpg",
                thumb: "still life with hat",
                title: "&quot;Still Life with Hat&quot;",
                descr: " <p>Medium: pen &amp; ink wash, black india ink on drawing paper, 18&quot;x24&quot;</p> <p>Notes: CND (Notre Dame de Namur), March 2001</p> ",
                clickurl: "images/artwork/02_stilllife_hat.jpg",
                img_w: 238,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/03t_colorstudyhomage_picasso.jpg",
                thumb: "color study: picasso",
                title: "&quot;Color Study: Picasso&quot;",
                descr: " <p>Medium: acrylic on bristol board, 14.25&quot;x17&quot;</p> <p>Notes: color theory (light/dark contrast); April 2001</p> ",
                clickurl: "images/artwork/03_colorstudyhomage_picasso.jpg",
                img_w: 214,
                img_h: 337
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/04t_trinity.jpg",
                thumb: "trinity",
                title: "Trinity",
                // TODO: descr
                descr: " ",
                clickurl: "images/artwork/04_trinity.jpg",
                img_w: 455,
                img_h: 315
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/05t_stoneage_spaceage.jpg",
                thumb: "stone age / space age",
                title: "&quot;Stone Age / Space Age&quot;",
                descr: " <p>Medium: acrylic and gloss medium on bristol board, 10&quot;x8&quot;</p> <p>Notes: CND (Notre Dame de Namur), color theory, March 2001</p> ",
                clickurl: "images/artwork/05_stoneage_spaceage.jpg",
                img_w: 437,
                img_h: 295
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/07t_study_grabbinghands.jpg",
                thumb: "study: grabbing hands",
                title: "&quot;Study: Grabbing Hands&quot;",
                descr: " <p>Medium: pencil on sketching paper, 24&quot;x18&quot;</p> <p>Notes: CND (Notre Dame de Namur), March 2000</p> ",
                clickurl: "images/artwork/07_study_grabbinghands.jpg",
                img_w: 455,
                img_h: 315
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/08t_stilllife_vase.jpg",
                thumb: "still life with vase",
                title: "&quot;Still Life with Vase&quot;",
                descr: " <p>Medium:  sumi ink wash on drawing paper, 23&quot;x18&quot;</p> <p>Notes: CND (Notre Dame de Namur), March 2001</p> ",
                clickurl: "images/artwork/08_stilllife_vase.jpg",
                img_w: 455,
                img_h: 315
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/09t_gourds.jpg",
                thumb: "gourds",
                title: "&quot;Gourds&quot;",
                descr: " <p>Medium: ink wash on drawing paper, 9.5&quot;x8&quot;</p> <p>Notes: sanguine-pigmented ink, October 2000</p> ",
                clickurl: "images/artwork/09_gourds.jpg",
                img_w: 455,
                img_h: 354
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/10t_ralstons_waterfountain.jpg",
                thumb: "ralston's fountain",
                title: "&quot;Ralston's Fountain&quot;",
                descr: " <p>Medium: charcoal on charcoal paper, 16.5&quot;x14&quot;</p> <p>Notes: compressed charcoal, CND (Notre Dame de Namur), November 2000</p> ",
                clickurl: "images/artwork/10_ralstons_waterfountain.jpg",
                img_w: 455,
                img_h: 354
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/11t_knowledge_hope.jpg",
                thumb: "knowledge & hope",
                title: "&quot;Knowledge &amp; Hope&quot;",
                descr: " <p>Medium: egg tempera paint on gessoed masonite board, 5&quot;x5&quot;</p> <p>Notes: Sold (commissioned piece); December 2000;</p> <p>experience with mixing powdered colors; cutting &amp; preparing masonite with gesso</p> ",
                clickurl: "images/artwork/11_knowledge_hope.jpg",
                img_w: 339,
                img_h: 311
            },
            {
                url: "images/thumbnails/thumbs_art_gallery/12t_stilllife_guitar.jpg",
                thumb: "still life with guitar",
                title: "&quot;Still Life with Guitar&quot;",
                descr: " <p>Medium: arcylic on bristol board, 14.25&quot;x17&quot;</p> <p>Notes: Sold (commissioned piece), March 2001</p> ",
                clickurl: "images/artwork/12_stilllife_guitar.jpg",
                img_w: 308,
                img_h: 370
            }
        ],
        2: [
            {
                url: "images/thumbnails/thumbs_design_gallery/01t_stanford.jpg",
                thumb: "stanford university",
                title: "Stanford University web design &amp; development",
                descr: " <p> Role: web designer &amp; developer </p> <p>Medium: website, 640x480 pixels, as well as various monitor display requirements</p> <p>Notes: Stanford University, Computing &amp; Communcations, 1998</p> <p>As a core team member within the ITSS (now ITS) Dept., responsible for design, development, and maintainance of many internal and external web sites (one such project was &quot;Stanford dot You&quot;, pictured above).</p> ",
                clickurl: "images/design/01_stanford.jpg",
                img_w: 350,
                img_h: 253
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/02t_intel.jpg",
                thumb: "intel corp.",
                title: "Intel, Corp. web design &amp; development",
                descr: " <p> Role: web graphic designer & web site developer</p> <p>Medium:  website, 720x480 pixels, as well as various monitor display requirements</p> <p>Notes: Adobe Photoshop, Adobe Illustrator, version-queue/content-management software &amp; GoLive editor</p> ",
                clickurl: "images/design/02_intel.jpg",
                img_w: 270,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/03t_sgi.jpg",
                thumb: "silicon graphics inc.",
                title: "SGI web design &amp; development",
                descr: " <p>Role: web developer &amp; designer, consultant</p> <p>Medium: website, 800x600 pixels, as well as various monitor display requirements</p> <p>Notes: Adobe Photoshop, Illustrator, Quark Xpress; Silicon Graphics, Inc., (consulting at WebFORCE, 1996 &amp; Cosmo Software 1997)</p> ",
                clickurl: "images/design/03_sgi.jpg",
                img_w: 280,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/04t_layout_mars.jpg",
                thumb: "layout design",
                title: "Layout Design: &quot;Exploring Mars&quot;",
                descr: " <p>Role: design student</p> <p>Medium: magazine article (for hardcopy &amp; digital, i.e. PDF &amp; online)</p> <p>Notes: editorial layout using Adobe Photoshop, Illustrator, &amp; PageMaker; CCAC, 2002</p> ",
                clickurl: "images/design/04_layout_mars.jpg",
                img_w: 267,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/05t_concept_disk.jpg",
                thumb: "conceptual design",
                title: "Conceptual Design: &quot;Flight Disc&quot;",
                descr: " <p>Role: design student</p> <p>Medium: zip disc cover, 8&quot;x3.75&quot;</p> <p>Notes: Quark Xpress, Adobe Illustrator, &amp; Photoshop; CCAC, April 2000</p> ",
                clickurl: "images/design/05_concept_disc.jpg",
                img_w: 350,
                img_h: 257
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/06t_logo_polaris.jpg",
                thumb: "logo design",
                title: "Logo Design: &quot;Polaris&quot;",
                descr: " <p>Role: design student</p> <p>Medium: logo, 6&quot;x2.75&quot;</p> <p>Notes: Adobe Illustrator &amp; Photoshop; CCAC, 2002</p> ",
                clickurl: "images/design/06_logo_polaris.jpg",
                img_w: 350,
                img_h: 89
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/07t_station_potlood.jpg",
                thumb: "stationary design",
                title: "Stationery Design: &quot;Potlood&quot;",
                descr: " <p>Role: design student</p> <p>Medium: stationery, 8.5&quot;x11&quot; (letterhead) &amp; 3.5&quot;x2&quot; (business card)</p> <p>Notes: Adobe Illustrator, Quark Xpress &amp; PageMaker; CCAC, 2002</p> ",
                clickurl: "images/design/07_station_potlood.jpg",
                img_w: 270,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/08t_poster_breakdown.jpg",
                thumb: "poster design",
                title: "Poster Design: &quot;Breakdown&quot;",
                descr: " <p>Role: design student</p> <p>Medium: poster, 15&quot;x20&quot;</p> <p>Notes: Adobe Photoshop, Illustrator &amp; Quark Xpress; CND (Notre Dame de Namur), November 1999</p> ",
                clickurl: "images/design/08_poster_breakdown.jpg",
                img_w: 264,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/09t_bookcover_myth.jpg",
                thumb: "bookcover design",
                title: "Book Cover Design: &quot;Mythology&quot;",
                descr: " <p>Role: design student</p> <p>Medium: book cover, 19.5&quot;x10&quot;</p> <p>Notes: Adobe Photoshop, Ilustrator &amp; Quark Xpress; CND, December 2000</p> ",
                clickurl: "images/design/09_bookcover_myth.jpg",
                img_w: 350,
                img_h: 176
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/10t_gall_postcard.jpg",
                thumb: "gallery postcard design",
                title: "Gallery Postcard Design",
                descr: " <p>Role: design student</p> <p>Medium: postcard, 5.5&quot;x8.5&quot;</p> <p>Notes: Wiegand Gallery exhibit, CND (Notre Dame de Namur), October 2000</p> ",
                clickurl: "images/design/10_gall_postcard_f.jpg",
                img_w: 219,
                img_h: 350
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/11t_exhib_brochure.jpg",
                thumb: "brochure design",
                title: "Exhibit Brochure Design",
                descr: " <p>Role: design student</p> <p>Medium: brochure, 10.5&quot;x8.25&quot;</p> <p>Notes: student art exhibit, CND (Notre Dame de Namur), November 2000</p> ",
                clickurl: "images/design/11_exhib_broch_i.jpg",
                img_w: 350,
                img_h: 285
            },
            {
                url: "images/thumbnails/thumbs_design_gallery/12t_typography.jpg",
                thumb: "typography",
                title: "&quot;Typography Is...&quot;",
                descr: " <p>Role: typographic design student</p> <p>Medium: poster, 15&quot;x20&quot;</p> <p>Notes: Adobe Photoshop, Illustrator &amp; Quark Xpress; CCAC, typographic studies, December 2000</p> ",
                clickurl: "images/design/12_typography.jpg",
                img_w: 263,
                img_h: 350
            }
        ],
        3: [
            {
                url: "images/thumbnails/thumbs_ued_gallery/design_process/01t_UED_stanford.jpg",
                thumb: "ued process: stanford university",
                title: "Stanford University web design &amp; development",
                descr: " <p> Role: web designer &amp; developer </p> <p>Medium: website, 640x480 pixels, as well as various monitor display requirements</p> <p>Notes: Stanford University, Computing &amp; Communcations, 1998</p> <p>As a core team member within the ITSS (now ITS) Dept., responsible for design, development, and maintainance of many internal and external web sites (one such project was &quot;Stanford dot You&quot;, pictured above).</p> ",
                clickurl: "images/preview_slideshow/pvued01_stanford.jpg",
                img_w: 950,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_ued_gallery/design_process/02t_UED_intel.jpg",
                thumb: "ued process: intel corp.",
                title: "Intel, Corp. web design &amp; development",
                descr: " <p> Role: web graphic designer & web site developer</p> <p>Medium:  website, 720x480 pixels, as well as various monitor display requirements</p> <p>Notes: Adobe Photoshop, Adobe Illustrator, version-queue/content-management software &amp; GoLive editor</p> ",
                clickurl: "images/preview_slideshow/pvued02_intel.jpg",
                img_w: 950,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_ued_gallery/design_process/03t_UED_scu.jpg",
                thumb: "ued process: santa clara university",
                title: "SCU User Experience &amp; Design",
                descr: " <p>Role: web UX designer</p> <p>Medium: website, 800x600 pixels, as well as various monitor display requirements</p> <p>Notes: Adobe Creative Suite, Visio, Dreamweaver; SCU 2006/2007</p> ",
                clickurl: "images/preview_slideshow/pvued03_scu.jpg",
                img_w: 950,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_ued_gallery/design_process/04t_UED_mcafee.jpg",
                thumb: "ued process: mcafee inc.",
                title: "McAfee User Experience &amp; Design",
                descr: " <p>Role: web UI/UE visual designer</p> <p>Medium: website, 1024x768 pixels, as well as various monitor display requirements</p> <p>Notes: Adobe Creative Suite, Visio, Dreamweaver; McAfee, Inc. 2007/2008</p> ",
                clickurl: "images/preview_slideshow/pvued04_mf0.jpg",
                img_w: 950,
                img_h: 344
            }
        ],
        4: [
            {
                url: "images/thumbnails/thumbs_design_playground/02t_dp_dnd.jpg",
                //TODO
                thumb: "rearrange my cubicle!",
                title: "&quot;Rearrange My Cubicle!&quot; (Drag & Drop UED Example)",
                descr: " <p>Role: visual designer, UX designer, & UI developer</p> <p>Medium: website, 800x600 pixels, as well as various monitor display requirements</p> <p>Notes: a UED (visual design & interaction design) example for the Stellamaris Center non-profit (tech workshop/mentoring), utilizing the YUI Libraries, Adobe Creative Suite, Dreamweaver and Visio, July 2007</p> ",
                clickurl: "images/preview_slideshow/pvued04_mf0.jpg",
                img_w: 950,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_design_playground/03t_dp_slider.jpg",
                //TODO
                thumb: "ode to tufte & galileo",
                title: "&quot;Ode to Edward Tufte: Galileo's 1613 Sketches&quot; (Slider UED Example)",
                descr: " <p>Role: visual designer, UX designer, & UI developer</p> <p>Medium: website, 800x600 pixels, as well as various monitor display requirements</p> <p>Notes: a UED (visual design & interaction design) example for the Stellamaris Center non-profit (tech workshop/mentoring), utilizing the YUI Libraries, Adobe Creative Suite, and Dreamweaver, July 2007</p> ",
                clickurl: "images/preview_slideshow/pvued04_mf0.jpg",
                img_w: 950,
                img_h: 344
            },
            {
                url: "images/thumbnails/thumbs_design_playground/04t_dp_myblog.jpg",
                //TODO
                thumb: "my blog",
                title: "My Blog",
                descr: "",
                clickurl: "images/preview_slideshow/pvued04_mf0.jpg",
                img_w: 950,
                img_h: 344
            }
        ],
        5: [
        ]
    };



    //
    // Private functions
    //
    function _showSlide() {
        // Fade out current image.
        var anim = new YAHOO.util.Anim('slideshow', { 
            opacity: { from: 1, to: 0 } 
        }, 0.5);
        anim.onComplete.subscribe(function() {
            currentSlide = (currentSlide + 1) % galleryPieces[0].length;
            var slideHolder = YAHOO.util.Dom.get('slideshow');
            slideHolder.style.backgroundImage = "url('" + galleryPieces[0][currentSlide].url + "')";

            // Fade in new image.
            anim = new YAHOO.util.Anim('slideshow', { 
                opacity: { from: 0, to: 1 } 
            }, 0.5);
            anim.animate();
        });
        anim.animate();

        // Load the next slide.
        var nextSlide = (currentSlide + 1) % galleryPieces[0].length;
        var img = new Image();
        img.src = galleryPieces[0][nextSlide].url;   // Load.
    }

    function _expandTabContent(tabNum) {
        //YAHOO.util.Dom.replaceClass('tabcontent'+tabNum, 'tabcontent', 'sel_tabcontent');
        YAHOO.util.Dom.setStyle('tabcontent'+tabNum, 'visibility', 'visible');
        YAHOO.util.Dom.setStyle('tabtopcorner'+tabNum, 'visibility', 'visible');
    
        // Active tabs should be above everything, even .header3.
        YAHOO.util.Dom.setStyle('tab'+tabNum, 'z-index', 600);
    
        var anim = new YAHOO.util.Anim('tabcontent'+tabNum, { 
            opacity: { from: 0, to: 0.9 } 
        }, 0.25);
        anim.animate();
    
        anim = new YAHOO.util.Anim('tabtopcorner'+tabNum, { 
            opacity: { from: 0, to: 0.9 } 
        }, 0.25);
        anim.animate();
    }

    function _resetTabContent(tabNum) {
        //YAHOO.util.Dom.replaceClass('tabcontent'+tabNum, 'sel_tabcontent', 'tabcontent');
    
        var anim = new YAHOO.util.Anim('tabcontent'+tabNum, { 
            opacity: { from: 0.9, to: 0 } 
        }, 0.25);
        anim.onComplete.subscribe(function() {
            YAHOO.util.Dom.setStyle('tabcontent'+tabNum, 'visibility', 'hidden');
    
            // Non-active tabs should be at default level.
            YAHOO.util.Dom.setStyle('tab'+tabNum, 'z-index', 100);
        });
        anim.animate();
    
        anim = new YAHOO.util.Anim('tabtopcorner'+tabNum, { 
            opacity: { from: 0.9, to: 0 } 
        }, 0.25);
        anim.onComplete.subscribe(function() {
            YAHOO.util.Dom.setStyle('tabtopcorner'+tabNum, 'visibility', 'hidden');
        });
        anim.animate();
    }

    function _expandTabDivider(tabNum) {
        YAHOO.util.Dom.replaceClass('tabdivider'+tabNum, 'tabdivider', 'sel_tabdivider');
    }

    function _resetTabDivider(tabNum) {
        YAHOO.util.Dom.replaceClass('tabdivider'+tabNum, 'sel_tabdivider', 'tabdivider');
    }

    function _expandTabBase(tabNum) {
        //YAHOO.util.Dom.replaceClass('tabbase'+tabNum, 'tabbase', 'sel_tabbase');

        var anim = new YAHOO.util.Anim('tabbase'+tabNum, { 
            height: { to: 65 } 
        }, 0.25, YAHOO.util.Easing.easeOut);
        anim.animate();
    }

    function _resetTabBase(tabNum) {
        //YAHOO.util.Dom.replaceClass('tabbase'+tabNum, 'sel_tabbase', 'tabbase');
    
        var anim = new YAHOO.util.Anim('tabbase'+tabNum, { 
            height: { to: 31 } 
        }, 0.75, YAHOO.util.Easing.easeOut);
        anim.animate();
    }

    function startSlideShow() {
        // Start slide show.
        timerId = setInterval(YAHOO.futurarose.portfolio.showSlide, 6000);    
    }

    function stopSlideShow() {
        if (null != timerId) {
            // Stop current slideshow.
            clearInterval(timerId);
            timerId = null;
        }
    }

    function closeOverlay(e) {
        YAHOO.futurarose.portfolio.overlay.hide();
    }

    function showOverlayForSlideShow(e) {
        if (-1 != currentSlide) {
            var piece = eval("galleryPieces" + galleryPieces[0][currentSlide].see);
            showOverlayForPiece(piece);
        }
    }

    function showOverlay(e, piece) {
        // TODO: remove special handling; integrate with new portfolio.
        if (4 == currentView) {
            var playgroundUrls = {
                0: "http://tenhanna.com/futurarose/design_playground/ued_gallery/02_dnd/dnd.html",
                1: "http://tenhanna.com/futurarose/design_playground/ued_gallery/01_slider/slider.html",
                2: "http://divineinteraction.wordpress.com/"
            };
            window.location = playgroundUrls[piece];
            return;
        }

        showOverlayForPiece(galleryPieces[currentView][piece]);
    }

    function showOverlayForPiece(piece) {
        YAHOO.futurarose.portfolio.overlay.setHeader(piece.title);

        var imgLink = YAHOO.util.Dom.get('overlayCloser');
        imgLink.innerHTML = '<img src="' + piece.clickurl + '" alt="' + piece.thumb + '" />';

        var descr = YAHOO.util.Dom.get('overlayDescription');
        descr.innerHTML = '';
        if (piece.descr) {
            descr.innerHTML = piece.descr;
        }

        YAHOO.futurarose.portfolio.overlay.render(document.body);

        // The wxh are that of the img, so add some space for the text.
        var textWidth = 400;
        var textHeight = 100;
        YAHOO.futurarose.portfolio.overlay.cfg.setProperty(
                "width", Math.max(textWidth, 20 + piece.img_w) + "px");
        YAHOO.futurarose.portfolio.overlay.cfg.setProperty(
                "height", (textHeight + 20 + piece.img_h) + "px");

        YAHOO.futurarose.portfolio.overlay.center();
        YAHOO.futurarose.portfolio.overlay.show();
    }

    function expandTab(e, tabNum) {
        if (!isExpanded[tabNum])
        {
            isExpanded[tabNum] = true;
            _expandTabContent(tabNum);
            _expandTabDivider(tabNum);
            _expandTabBase(tabNum);
        }
    }

    function resetTab(e, tabNum) {
        var target = YAHOO.util.Event.getRelatedTarget(e);
        if (isExpanded[tabNum]
                && target
                && target.id != 'tabcontent'+tabNum
                && target.id != 'tabdivider'+tabNum
                && target.id != 'tabbase'+tabNum
                && target.id != 'link'+tabNum
                && target.id != 'switchTab'+tabNum)
        {
            isExpanded[tabNum] = false;
            _resetTabContent(tabNum);
            if (currentView != tabNum) {
                _resetTabDivider(tabNum);
                _resetTabBase(tabNum);
            }
        }
    }

    function switchToTab(e, tabNum) {
        if (currentView == tabNum) {
            return;
        }

        // Reset tab.
        _resetTabContent(tabNum);
        // Show the user which tab is selected.
        //_resetTabDivider(tabNum);
        //_resetTabBase(tabNum);

        // Reset previous tab.
        _resetTabDivider(currentView);
        _resetTabBase(currentView);

        if (0 == currentView) {
            stopSlideShow();

            var ssX = YAHOO.util.Dom.getX('slideshow');
            var ssY = YAHOO.util.Dom.getY('slideshow');

            // Move slideshow pane out of view to the left.
            var anim = new YAHOO.util.Motion('slideshow', { points: { to: [ssX - 1300, ssY] } }, 1, YAHOO.util.Easing.easeIn);
            anim.onComplete.subscribe(function() {
                // Move slideshow pane back into view from the right.
                clearSplashImage();

                var anim = new YAHOO.util.Motion('slideshow', { points: { from: [ssX + 1300, ssY], to: [ssX, ssY] } }, 1, YAHOO.util.Easing.easeOut);
                anim.onComplete.subscribe(function() {
                    dropGalleryPieces(tabNum);
                });
                anim.animate();
            });
            anim.animate();
        }
        else {
            replaceGallery(currentView, tabNum);
        }

        currentView = tabNum;
    }

    function replaceGallery(currentView, tabNum) {
        // Wait until the current gallery is cleared before showing the new one.
        // This means we cannot just call clearGallery(currentView).
        //clearGallery(currentView);
        for (var pp = 1; pp <= galleryPieces[currentView].length; pp++) {
            clearPiece(pp);
        }
        // Always clear the back button.
        //clearPiece(16);
        var anim = new YAHOO.util.Motion('p16', { points: { to: [YAHOO.util.Dom.getX('p16'), -200] } }, 0.5, YAHOO.util.Easing.easeIn);
        anim.onComplete.subscribe(function() {
            dropGalleryPieces(tabNum);
        });
        anim.animate();
    }

    function clearGallery(tabNum) {
        for (var pp = 1; pp <= galleryPieces[tabNum].length; pp++) {
            clearPiece(pp);
        }
        // Always clear the back button.
        clearPiece(16);
    }

    function clearPiece(pp) {
        var anim = new YAHOO.util.Motion('p'+pp, { points: { to: [YAHOO.util.Dom.getX('p'+pp), -200] } }, 0.5, YAHOO.util.Easing.easeIn);
        anim.animate();
    }

    function dropGalleryPieces(tabNum) {
        // Make the gallery pieces fall from the sky.
        for (var pp = 1; pp <= galleryPieces[tabNum].length; pp++) {
            var piece = YAHOO.util.Dom.get('p'+pp);
            piece.style.backgroundImage = "url('" + galleryPieces[tabNum][pp - 1].url + "')";

            var text = YAHOO.util.Dom.get('pp'+pp);
            text.innerHTML = galleryPieces[tabNum][pp - 1].thumb;

            dropPiece(pp);
        }
        // Always drop the back button.
        dropPiece(16);
    }

    function dropPiece(pp) {
        var rnd = Math.round(Math.random() * animEasingOptions.length);
        var easing = animEasingOptions[rnd];
        var yy = (pp % 2 == 0) ? 293 : 128;
        var anim = new YAHOO.util.Motion('p'+pp, { points: { to: [YAHOO.util.Dom.getX('p'+pp), yy] } }, 0.5 + rnd/10, easing);
        anim.animate();
    }

    function switchToHome(e) {
        clearGallery(currentView);
        _resetTabDivider(currentView);
        _resetTabBase(currentView);

        var ssX = YAHOO.util.Dom.getX('slideshow');
        var ssY = YAHOO.util.Dom.getY('slideshow');

        // Move slideshow pane out of view to the left.
        var anim = new YAHOO.util.Motion('slideshow', { points: { to: [ssX - 1300, ssY] } }, 1, YAHOO.util.Easing.easeIn);
        anim.onComplete.subscribe(function() {
            _showSlide();

            // A 1 second transition here makes the image fade in too late.  Give it more time.
            var anim = new YAHOO.util.Motion('slideshow', { points: { from: [ssX + 1300, ssY], to: [ssX, ssY] } }, 1.5, YAHOO.util.Easing.easeOut);
            anim.onComplete.subscribe(function() {
                startSlideShow();
            });
            anim.animate();
        });
        anim.animate();

        currentView = 0;
    }

    function init2() {
        var tabNum;
        for (tabNum = 1; tabNum <= 5; tabNum++) {
            // Workaround for IE7 issue; see comment in CSS for .tabcontent.
            YAHOO.util.Dom.setStyle('tabcontent'+tabNum, 'opacity', 0);
            YAHOO.util.Dom.setStyle('tabcontent'+tabNum, 'visibility', 'visible');

            // Workaround for IE7 issue; see comment in CSS for .top-roundedcorner.
            YAHOO.util.Dom.setStyle('tabtopcorner'+tabNum, 'opacity', 0);
            YAHOO.util.Dom.setStyle('tabtopcorner'+tabNum, 'visibility', 'visible');

            // Detect the expandTab events.
            YAHOO.util.Event.addListener(['tabbase'+tabNum, 'tabdivider'+tabNum], 'mouseover', expandTab, tabNum);

            // Detect the resetTab events.
            YAHOO.util.Event.addListener(['tabbase'+tabNum, 'tabdivider'+tabNum, 'tabcontent'+tabNum], 'mouseout', resetTab, tabNum);

            // Detect tab change events.
            if (5 != tabNum) {   // Except for contact info.
                YAHOO.util.Event.addListener(['tabbase'+tabNum, 'switchTab'+tabNum], 'click', switchToTab, tabNum);
            }

            // Init isExpanded value.
            isExpanded[tabNum] = false;
        }

        var tabPreviewOrder = [1, 2, 3, 4, 5];
        for (var tt = 0; tt < tabPreviewOrder.length; tt++) {
            tabNum = tabPreviewOrder[tt];
            var delay = (tt + 1) * 200;
            // Show the user this functionality.
            setTimeout(
                    "YAHOO.futurarose.portfolio.expandTabContent("+tabNum+");" +
                    "YAHOO.futurarose.portfolio.expandTabDivider("+tabNum+");" +
                    "YAHOO.futurarose.portfolio.expandTabBase("+tabNum+");", delay);
            setTimeout(
                    "YAHOO.futurarose.portfolio.resetTabContent("+tabNum+");" +
                    "YAHOO.futurarose.portfolio.resetTabDivider("+tabNum+");" +
                    "YAHOO.futurarose.portfolio.resetTabBase("+tabNum+");", delay + 400);
        }

        YAHOO.util.Event.addListener('slideshow', 'click', showOverlayForSlideShow);

        // Initialize the overlay.
        YAHOO.futurarose.portfolio.overlay = 
                new YAHOO.widget.Panel("overlay",  
                            { width:"100px", 
                              height:"100px", 
                              fixedcenter:true, 
                              close:true, 
                              draggable:false, 
                              zindex:500,
                              modal:true,
                              effect:{effect:YAHOO.widget.ContainerEffect.FADE,duration:0.25},
                              visible:false
                            } 
                );
        // Add overlay users.
        for (var pp = 1; pp <= 15; pp++) {   // Skip back button!
            YAHOO.util.Event.addListener('p'+pp, 'click', showOverlay, pp - 1);
        } 
        // Close the overlay on click.
        YAHOO.util.Event.addListener('overlayCloser', 'click', closeOverlay);

        // Detect home button events.
        YAHOO.util.Event.addListener('p16', 'click', switchToHome);

        // Load the first image.  Subsequent images are loaded in _showSlide().
        var img = new Image();
        img.src = galleryPieces[0][0].url;   // Load.

        startSlideShow();
    }

    function setSplashImage() {
        var slideHolder = YAHOO.util.Dom.get('slideshow');
        slideHolder.style.backgroundImage = "url('images/preview_slideshow/pv00_futurarose.jpg')";
    }

    function clearSplashImage() {
        var slideHolder = YAHOO.util.Dom.get('slideshow');
        slideHolder.style.backgroundImage = '';
    }



    // Return publicly accessible variables and functions.
    return {
        //
        // Public functions
        // (These access private variables and functions through "closure".)
        //

        // These functions are public only because of setInterval/setTimeout.
        showSlide: function() {
            _showSlide();
        },
        expandTabContent: function(tabNum) {
            _expandTabContent(tabNum);
        },
        resetTabContent: function(tabNum) {
            _resetTabContent(tabNum);
        },
        expandTabDivider: function(tabNum) {
            _expandTabDivider(tabNum);
        },
        resetTabDivider: function(tabNum) {
            _resetTabDivider(tabNum);
        },
        expandTabBase: function(tabNum) {
            _expandTabBase(tabNum);
        },
        resetTabBase: function(tabNum) {
            _resetTabBase(tabNum);
        },

        // Kickstart function.
        init: function() {
            // Load the main image before calling the real init().
            var img = new Image();
            img.onload = function() {
                setSplashImage();
                init2();
            };
            img.src = 'images/preview_slideshow/pv00_futurarose.jpg';   // Load.
        }
    };
})();
// End singleton pattern.