/*

    GalleryView - jQuery Content Gallery Plugin
    Author:         Jack Anderson
    Version:        1.1 (April 5, 2009)
    Documentation:     http://www.spaceforaname.com/jquery/galleryview/

    Please use this development script if you intend to make changes to the
    plugin code.  For production sites, please use jquery.galleryview-1.0.1-pack.js.

*/

var window_loaded = false;
(function($){
    $.fn.galleryView = function(options) {
        var opts = $.extend($.fn.galleryView.defaults,options);

        var id;
        var iterator = 0;
        var gallery_width;
        var gallery_height;
        var frame_margin = 10;
        var strip_width;
        var wrapper_width;
        var item_count = 0;
        var slide_method;
        var img_path;
        var paused = true;
        var frame_caption_size = 20;
        var frame_margin_top = 5;
        var pointer_width = 2;
        var heightStripPointerImg = 55;// Orange arrow img at top

        //Define jQuery objects for reuse
        var j_gallery;
        var j_filmstrip;
        var j_frames;
        var j_panels;
        var j_pointer;

/************************************************/
/*    Plugin Methods                                */
/************************************************/
        function showItem(i) {
            //Disable next/prev buttons until transition is complete
            $('img.nav-next').unbind('click');
            $('img.nav-prev').unbind('click');
            j_frames.unbind('click');
            if(has_panels) {
                if(opts.fade_panels) {
                    // Fade out all panels and fade in target panel
                    j_panels.fadeOut(opts.transition_speed);
                    // Next panel to show
                    $nextPanel = j_panels.eq(i%item_count);
                    // Next height (add 150 for reflection plugin)
                    nextHeight = $nextPanel.height()+(opts.frame_height+frame_margin_top+heightStripPointerImg)+150;
                    //j_gallery.animate({'height' : nextHeight},opts.transition_speed,'easeOutQuad');
                    j_gallery.css({'height' : nextHeight});
                    
                    $nextPanel.fadeIn(opts.transition_speed,function(){
                        if(!has_filmstrip) {
                            $('img.nav-prev').click(showPrevItem);
                            $('img.nav-next').click(showNextItem);
                        }
                    });
                }
            }

            if(has_filmstrip) {
                //Slide either pointer or filmstrip, depending on transition method
                //slide_method = 'pointer';
                if(slide_method=='strip') {
                    //Stop filmstrip if it's currently in motion
                    j_filmstrip.stop();

                    //Determine distance between pointer (eventual destination) and target frame
                    var distance = getPos(j_frames[i]).left - (getPos(j_pointer[0]).left+2 + 5);//+6 fix for large #pointer
                    var leftstr = (distance>=0?'-=':'+=')+Math.abs(distance)+'px';

                    //Animate filmstrip and slide target frame under pointer
                    //If target frame is a duplicate, jump back to 'original' frame
                    j_filmstrip.animate({
                        'left':leftstr
                    },opts.transition_speed,opts.easing,function(){
                        //Always ensure that there are a sufficient number of hidden frames on either
                        //side of the filmstrip to avoid empty frames
                        if(i>item_count) {
                            i = i%item_count;
                            iterator = i;
                            j_filmstrip.css('left','-'+((opts.frame_width+frame_margin)*i)+'px');
                        } else if (i<=(item_count-strip_size)) {
                            i = (i%item_count)+item_count;
                            iterator = i;
                            j_filmstrip.css('left','-'+((opts.frame_width+frame_margin)*i)+'px');
                        }

                        if(!opts.fade_panels) {
                            j_panels.hide().eq(i%item_count).show();
                        }
                        $('img.nav-prev').click(showPrevItem);
                        $('img.nav-next').click(showNextItem);
                        enableFrameClicking();
                    });
                } else if(slide_method=='pointer') {
                    //Stop pointer if it's currently in motion
                    j_pointer.stop();
                    //Get position of target frame
                    var pos = getPos(j_frames[i]);
                    //Slide the pointer over the target frame
                    j_pointer.animate({
                        'left':(pos.left-2-5+'px')
                    },opts.transition_speed,opts.easing,function(){
                        if(!opts.fade_panels) {
                            j_panels.hide().eq(i%item_count).show();
                        }
                        $('img.nav-prev').click(showPrevItem);
                        $('img.nav-next').click(showNextItem);
                        enableFrameClicking();
                    });
                }

                if($('a',j_frames[i])[0]) {
                    j_pointer.unbind('click').click(function(){
                        var a = $('a',j_frames[i]).eq(0);
                        if(a.attr('target')=='_blank') {window.open(a.attr('href'));}
                        else {location.href = a.attr('href');}
                    });
                }
            }
            
            /////////////
            // PLUGINS // 
            /////////////
            // Img Reflection
            $('.addReflect',$nextPanel).each(function(){
                // Remove class to prevent refelecting again
                $(this).removeClass('addReflect');
                Reflection.add(this, { height: 1/4, opacity: 1/4 });
            });
            
            // Stop all videos on new case study
            for(key in cs_videos){
                var video = document.getElementById(cs_videos[key]+'-video-player');
                if(typeof video.sendEvent == 'function'){
                    video.sendEvent("STOP","true");
                }
            }

        };
        function showNextItem() {
            //$(document).stopTime("transition");
            if(++iterator==j_frames.length) {iterator=0;}
            showItem(iterator);
            //$(document).everyTime(opts.transition_interval,"transition",function(){
            //    showNextItem();
            //});
        };
        function showPrevItem() {
            //$(document).stopTime("transition");
            if(--iterator<0) {iterator = item_count-1;}
            //alert(iterator);
            showItem(iterator);
            //$(document).everyTime(opts.transition_interval,"transition",function(){
            //    showNextItem();
            //});
        };
        function getPos(el) {
            var left = 0, top = 0;
            var el_id = el.id;
            if(el.offsetParent) {
                do {
                    left += el.offsetLeft;
                    top += el.offsetTop;
                } while(el = el.offsetParent);
            }
            //If we want the position of the gallery itself, return it
            if(el_id == id) {return {'left':left,'top':top};}
            //Otherwise, get position of element relative to gallery
            else {
                var gPos = getPos(j_gallery[0]);
                var gLeft = gPos.left;
                var gTop = gPos.top;

                return {'left':left-gLeft,'top':top-gTop};
            }
        };
        function enableFrameClicking() {
            j_frames.each(function(i){
                //If there isn't a link in this frame, set up frame to slide on click
                //Frames with links will handle themselves
                if($('a',this).length==0) {
                    $(this).click(function(){
                        //$(document).stopTime("transition");
                        showItem(i);
                        iterator = i;
                        //$(document).everyTime(opts.transition_interval,"transition",function(){
                        //    showNextItem();
                        //});
                    });
                }
            });
        };

        function buildPanels() {
            //If there are panel captions, add overlay divs
            if($('.panel-overlay').length>0) {j_panels.append('<div class="overlay"></div>');}

            j_panels.css({
                'width':(opts.panel_width-parseInt(j_panels.css('paddingLeft').split('px')[0],10)-parseInt(j_panels.css('paddingRight').split('px')[0],10))+'px',
                //'height':(opts.panel_height-parseInt(j_panels.css('paddingTop').split('px')[0],10)-parseInt(j_panels.css('paddingBottom').split('px')[0],10))+'px',
                'position':'absolute',
                'top':((opts.frame_height+frame_margin_top+heightStripPointerImg)+'px'),
                'left':'0px',
                'overflow':'hidden',
                //'background':'white',
                'display':'none'
            });

        };

        function buildFilmstrip() {
            //Add wrapper to filmstrip to hide extra frames
            j_filmstrip.wrap('<div class="strip_wrapper"></div>');
            if(slide_method=='strip') {
                j_frames.clone().appendTo(j_filmstrip);
                j_frames.clone().appendTo(j_filmstrip);
                j_frames = $('li',j_filmstrip);
            }
            //If captions are enabled, add caption divs and fill with the image titles
            if(opts.show_captions) {
                j_frames.append('<div class="caption"></div>').each(function(i){
                    $(this).find('.caption').html($(this).find('img').attr('title'));
                });
            }

            j_filmstrip.css({
                'listStyle':'none',
                'margin':'0',
                'padding':'0',
                'width':strip_width+'px',
                'position':'absolute',
                'zIndex':'900',
                'top':'0',
                'left':'0',
                //'background':opts.background_color,
                'height':(opts.frame_height+10)+'px'
            });
            j_frames.css({
                'float':'left',
                'position':'relative',
                'height':opts.frame_height+'px',
                'zIndex':'901',
                'marginTop':frame_margin_top+'px',
                'marginBottom':'0px',
                'marginRight':frame_margin+'px',
                'padding':'0',
                'cursor':'pointer'
            });
            $('img',j_frames).css({
                'border':'none'
            });
            $('.strip_wrapper',j_gallery).css({
                'position':'absolute',
                'top':(opts.filmstrip_position=='top'?'0px':opts.panel_height+'px'),
                'left':((gallery_width-wrapper_width)/2)+'px',
                'width':wrapper_width+'px',
                'height':(opts.frame_height+frame_margin_top+(opts.show_captions?frame_caption_size:frame_margin_top))+'px',
                'overflow':'hidden'
            });
            $('.caption',j_gallery).css({
                'position':'absolute',
                'top':opts.frame_height+'px',
                'left':'0',
                'margin':'0',
                'width':opts.frame_width+'px',
                'padding':'0',
                'color':opts.caption_text_color,
                'textAlign':'center',
                'fontSize':'10px',
                'height':frame_caption_size+'px',

                'lineHeight':frame_caption_size+'px'
            });
            var pointer = $('<div></div>');
            pointer.attr('id','pointer').appendTo(j_gallery).css({
                 'position':'absolute',
                 'zIndex':'1000',
                 'cursor':'pointer',
                 'top':getPos(j_frames[0]).top-(pointer_width/2)-4+'px',
                 'left':getPos(j_frames[0]).left-(pointer_width/2)-6+'px',//-6 fix for large #pointer
                 'height':'102px',
                 'width':'82px'
            });
            j_pointer = $('#pointer',j_gallery);

            //If the filmstrip is animating, move the strip to the middle third
            if(slide_method=='strip') {
                j_filmstrip.css('left','-'+((opts.frame_width+frame_margin)*item_count)+'px');
                iterator = item_count;
            }
            //If there's a link under the pointer, enable clicking on the pointer
            if($('a',j_frames[iterator])[0]) {
                j_pointer.click(function(){
                    var a = $('a',j_frames[iterator]).eq(0);
                    if(a.attr('target')=='_blank') {window.open(a.attr('href'));}
                    else {location.href = a.attr('href');}
                });
            }

            //Add navigation buttons
            $('<img />').addClass('nav-next').attr('src','/img/case-studies/common/next.png').appendTo(j_gallery).css({
                'position':'absolute',
                'cursor':'pointer',
                'top':(opts.filmstrip_position=='top'?0:opts.panel_height)+frame_margin_top+((opts.frame_height-44)/2)+'px',
                'right':(gallery_width/2)-(wrapper_width/2)-10-14+'px',
                'z-index':'1005'
            }).click(showNextItem);
            $('<img />').addClass('nav-prev').attr('src','/img/case-studies/common/prev.png').appendTo(j_gallery).css({
                'position':'absolute',
                'cursor':'pointer',
                'top':(opts.filmstrip_position=='top'?0:opts.panel_height)+frame_margin_top+((opts.frame_height-44)/2)+'px',
                'left':(gallery_width/2)-(wrapper_width/2)-10-14+'px',
                'z-index':'1005'
            }).click(showPrevItem);

            $('<img />').attr('src','/img/case-studies/common/thumbnail-circle-path.png').appendTo(j_gallery).css({
                'position':'absolute',
                'top': '97px',
                'right':'0px',
                'z-index':'1000'
            })
        };

        function buildGallery(){

            /************************************************/
            /*    Apply CSS Styles                            */
            /************************************************/
                    j_gallery.css({
                        'position':'relative',
                        'margin':'0',
                        //'background':opts.background_color,
                        //'border':opts.border,
                        'width':gallery_width+'px',
                        'height':gallery_height+'px'
                    });

            /************************************************/
            /*    Build filmstrip and/or panels                */
            /************************************************/
                    if(has_filmstrip) {
                        buildFilmstrip();
                    }
                    if(has_panels) {
                        buildPanels();
                    }


            /************************************************/
            /*    Add events to various elements                */
            /************************************************/
                    if(has_filmstrip) enableFrameClicking();

                    // NOTE: Removed all $().mousemove functions


            /************************************************/
            /*    Initiate Automated Animation                */
            /************************************************/
                    //(Do Not) Show the first panel
                    //j_panels.eq(0).show();

                    //If we have more than one item, begin automated transitions
                    //if(item_count > 1) {
                    //    $(document).everyTime(opts.transition_interval,"transition",function(){
                    //        showNextItem();
                    //    });
                    //}

                    //Make gallery visible now that work is complete
                    j_gallery.css('visibility','visible');

                    
                    if(location.hash!=""){
                        var $page = $(location.hash+'-panel');
                        //alert($(page+'-panel').attr('id'));
                        //alert();
                        iterator = $('.panel').index($page);
                    }
                    $j_loader = $('div.loader');
                    $j_loader.fadeOut(800,function(){
                        //Show the 'first' panel
                        //$(this).css({'dispaly':'none'});
                        showItem(iterator);
                        //If we have more than one item, begin automated transitions
                        //if(item_count > 1) {
                        //    $(document).everyTime(opts.transition_interval,"transition",function(){
                        //        showNextItem();
                        //    });
                        //}
                    });

        }

/************************************************/
/*    Main Plugin Code                            */
/************************************************/
        return this.each(function() {
            j_gallery = $(this);
            //Determine path between current page and filmstrip images
            //Scan script tags and look for path to GalleryView plugin
            $('script').each(function(i){
                var s = $(this);
                if(s.attr('src') && s.attr('src').match(/jquery\.galleryview/)){
                    img_path = '/new/img/case-studies/themes/';
                }
            });

            //Hide gallery to prevent Flash of Unstyled Content (FoUC) in IE
            //j_gallery.css({'visibility':'hidden','height':'100px'});

            //Assign elements to variables for reuse
            j_filmstrip = $('.filmstrip',j_gallery);
            j_frames = $('li',j_filmstrip);
            j_panels = $('.panel',j_gallery);
            
            j_frames.css({'position':'relative','float':'left'});
            j_gallery.css({'visibility':'hidden','height':'100px'});

            id = j_gallery.attr('id');

            has_panels = j_panels.length > 0;
            has_filmstrip = j_frames.length > 0;

            if(!has_panels) opts.panel_height = 0;

            //Number of frames in filmstrip
            item_count = has_panels?j_panels.length:j_frames.length;

            //Number of frames that can display within the screen's width
            //64 = width of block for navigation button * 2
            //5 = minimum frame margin
            strip_size = has_panels?Math.floor((opts.panel_width-64)/(opts.frame_width+frame_margin)):Math.min(item_count,opts.filmstrip_size);


            /************************************************/
            /*    Determine transition method for filmstrip    */
            /************************************************/
                    //If more items than strip size, slide filmstrip
                    //Otherwise, slide pointer
                    if(strip_size >= item_count) {
                        slide_method = 'pointer';
                        strip_size = item_count;
                    }
                    else {slide_method = 'strip';}

            /************************************************/
            /*    Determine dimensions of various elements    */
            /************************************************/

                    //Width of gallery block
                    gallery_width = has_panels?opts.panel_width:(strip_size*(opts.frame_width+frame_margin))-frame_margin+64;

                    //Height of gallery block = screen + filmstrip + captions (optional)
                    gallery_height = (has_panels?opts.panel_height:0)+(has_filmstrip?opts.frame_height+frame_margin_top+(opts.show_captions?frame_caption_size:frame_margin_top):0);

                    //Width of filmstrip
                    if(slide_method == 'pointer') {strip_width = (opts.frame_width*item_count)+(frame_margin*(item_count));}
                    else {strip_width = (opts.frame_width*item_count*3)+(frame_margin*(item_count*3));}

                    //Width of filmstrip wrapper (to hide overflow)
                    wrapper_width = ((strip_size*opts.frame_width)+((strip_size-1)*frame_margin));

            /********************************************************/
            /*    PLACE LOADING BOX OVER GALLERY UNTIL IMAGES LOAD    */
            /********************************************************/
                    galleryPos = getPos(j_gallery[0]);

            if(!window_loaded) {
                $(window).load(function(){
                    window_loaded = true;
                    buildGallery();
                });
            } else {
                buildGallery();
            }

        });
    };

    $.fn.galleryView.defaults = {
        panel_width: 400,
        panel_height: 300,
        frame_width: 80,
        frame_height: 80,
        filmstrip_size: 3,
        overlay_height: 70,
        overlay_font_size: '1em',
        transition_speed: 400,
        transition_interval: 6000,
        overlay_opacity: 0.6,
        //overlay_color: 'black',
        //background_color: 'black',
        //overlay_text_color: 'white',
        //caption_text_color: 'white',
        //border: '1px solid black',
        nav_theme: 'light',
        easing: 'swing',
        filmstrip_position: 'bottom',
        overlay_position: 'bottom',
        show_captions: false,
        fade_panels: true,
        pause_on_hover: false
    };
})(jQuery);