$(document).ready(function () {
    createSlider();
    if ($('.social_media_links_column').length > 0) { setTimeout(function () { shareBox(); }, 500); }

    function createSlider() {
        var container = $("#homebanner");
        var nav = $("<div id='flowtabs' class='navi'></div>");
        var timeout;
        var autoInterval;

        container.find(".left_colum").each(function () {
            var banner = $(this);
            var navItem = $("<a />")
            navItem.click(function (e) {
                if (e.cancelable) {
                    clearInterval(autoInterval);
                }

                if (!$(this).hasClass("sel")) {
                    var selected = container.find(".left_colum.sel");
                    slideOut(selected);
                    slideIn(banner);

                    banner.addClass("sel");
                    selected.removeClass("sel");
                    nav.find("a").removeClass("sel");
                    $(this).addClass("sel");
                }
            });

            nav.append(navItem);
            banner.show();
        });

        container.append(nav);
        container.find(".left_colum:first-child").addClass("sel");
        $("a:first-child", nav).addClass("sel");

        function slideOut(banner, callback) {

            banner.find(".feature_image").animate({
                left: -500
            }, 1200, function () {
                $(this).css({ left: 0 });
            });

            banner.stop(true).animate({
                left: -3000
            },
			{
			    duration: 1000,
			    easing: 'easeInExpo'
			}, 1200);
        }

        function slideIn(banner) {
            clearTimeout(timeout);
            timeout = setTimeout(function () {
                banner.find(".feature_image").stop(true, true);
                banner.stop(true).animate({
                    left: 0
                }, {
                    duration: 1000,
                    easing: 'easeOutExpo'
                });
            }, 1000);
        }

        autoInterval = setInterval(function () {
            var element = $("a.sel", nav).next();
            if (element.length == 0) {
                element = $("a:first-child", nav);
            }

            element.click();
        }, 5000);
    }

    function shareBox() {
        var nav = $('.social_media_links_column'),
        content = $('#page_content_container'),
        sharesHeight = nav.outerHeight(true),
        sharesLeft = nav.offset().left,
        navHeight = nav.outerHeight(true),
        navLeft = nav.offset().left,
        //header = $('.h1').outerHeight(true);
        yMin = content.offset().top - parseInt(nav.css('margin-top'), 10),
        navFix = navHeight + content.offset().top,
        yMax = content.offset().top + content.outerHeight(),
        position = 'default',
        positionCSS = {
            'default': { position: 'relative', top: 0 },
            'fixed': { position: 'fixed', top: 0 },
            'bottom': { position: 'absolute', top: yMax - content.offset().top - navHeight }
        };



        $('.social_media_scroll_cont').css({ opacity: 0.999 });
        function setSharesPosition() {
            var w = $(this), x = w.scrollLeft(), y = w.scrollTop();
            if (y > yMin) {
                if (y + sharesHeight < yMax) {
                    position = 'fixed';
                }
                else {
                    position = 'bottom';
                }
            }
            else {
                position = 'default';
            }
            // Clear all styles, then set appropriately.
            nav.removeAttr('style');
            nav.css(positionCSS[position]);
            // Adjust for horizontal scroll.
            if (position === 'fixed' && x > 0) {
                nav.css({ left: sharesLeft - x });
            }
        }
        // Only slide the shares box on articles that are long enough.
        if (yMax - sharesHeight > yMin) {
            $(window).scroll(setSharesPosition);
            setSharesPosition();
        }
    };
});