(function(jQuery) {

    /**
     *
     * JavaScript Stage
     *
     * Function to change Stage themes manually and automatically
     *
     * @param timer int - set time in seconds to change stage themes automatically
     * @param hold int - set time in seconds to wait on click until stage theme change
     * @param autochange boolean - activate/deactivate automatic change of Stage motives
     *
     *
     */


    jQuery.fn.jsStage = function(options) {


        var defaults = {
            time: 5,
            hold: 20,
            autochange: true
        }

        /* return if empty selection */
        if (this.length == 0) return;


        /* Set options */
        var opts = jQuery.extend(defaults, options);

        //init
        //Stage
        var $stage = jQuery(this);
        // Get all Stage Elements
        var $features = jQuery(this).find('.stage-element');
        // Get all navigation Elements
        var $navStage = jQuery(this).find('.nav-stage');
        var navpoints = [];
        $navStage.each(function(index) {
            navpoints[index] = $navStage.eq(index).find('.nav-stage-element').children();
        })

        // get index of selected Element
        var indexSelected;
        $features.each(function(index) {
            if (jQuery(this).hasClass('selected')) {
                indexSelected = index;
            }
        });
        // set navigation Class depending on how many nav points are present
        /*
         if ($navpoints.length > 1) {
         $navStage.addClass("Elements-"+$navpoints.length)
         }
         */
        // set autochange of Stage Items
        if (opts.autochange) {
            set_change_timer(opts.time);
        }


        jQuery(navpoints).each(function(indexElement) {

            jQuery(this).click(function() {

                change_stage(jQuery(this), opts.hold);
                return false;
                
            });

        })


        function change_stage(selected, time) {

            var TrendsInsights = $stage.hasClass('stage-trendsInsights');
            var navselectedold;
            var navselected = selected.parent().index();
            // animate navigation Items


            //previous selected
            jQuery(navpoints).each(function(indexElement) {
                jQuery(this).each(function(index) {
                    if (jQuery(this).hasClass('selected')) {
                        navselectedold = index;
                        // check for navigation type
                        if (TrendsInsights) {
                            jQuery(this).animate({"margin-left": "+=21px"}, "fast").removeClass("selected");
                        } else {
                            jQuery(this).removeClass("selected");
                        }
                    }
                });

                // new selected
                // check for navigation type
                if (TrendsInsights) {
                    jQuery(this).eq(navselected).animate({"margin-left": "-=21px"}, "fast").addClass("selected");
                } else {
                    jQuery(this).eq(navselected).addClass("selected");
                }

            })


            // change stage
            /* return if same nav point was selected as active */
            if (navselectedold == navselected) {
                reset_timer(time)
                return false;
            }

            var $bgnew;
            $features.each(function(index) {
                if (index == navselected) {
                    $bgnew = jQuery(this);
                }
            });

            var $bgold = $features.not($bgnew);

            $bgold.css('z-index', '0');
            $bgnew.find('object').css('display', 'block');

            $bgnew.css({'opacity': '0','z-index':'2'}).animate({"opacity": "1"}, "slow", function() {
                $bgold.css({ opacity: '0'})
                $bgold.find('object').css('display', 'none');
            });

            reset_timer(time)

        }

        // reset the timer to autochange Stage Items
        function reset_timer(time) {
            // set autochange of Stage Items
            if (opts.autochange) {
                //reset timer
                clearTimeout(stage_timer);
                set_change_timer(time)
            }
        }

        // change motives automatically
        function set_change_timer(time) {

            stage_timer = window.setTimeout(function() {

                var navselected = jQuery(navpoints[0]).filter('.selected').parent().index();

                // calculate position of new navigation
                var newnav = (navselected + 1) % jQuery(navpoints[0]).length;
                change_stage(jQuery(navpoints[0]).eq(newnav), opts.time);
            }, time * 1000);
        }
    }
})(jQuery);