/*
 Usage:
 */
(function($) {
    $.fn.extend({
        guideMicroArticle: function(options) {
            var settings = $.extend($.fn.guideMicroArticle.defaults, options);

            return this.each(function() {

                var $wrapper = $(this);

                //As jQuery is working, turn on the jquery styles
                var $bottomlink = $wrapper.children('div.mg_more_jquery_off');
                $bottomlink.removeClass('mg_more_jquery_off');
                $bottomlink.addClass('mg_more');

                var $more = $bottomlink.children('a').hide();

                var $content = $wrapper.children('ul.mg_content_jquery_off');
                $content.removeClass('mg_content_jquery_off');
                $content.addClass('mg_content');

                var $LIs = $content.children('li');
                var $currentLI = $LIs.eq(0);

                var pageList = $wrapper.children('ul.mg_nav_jquery_off');
                pageList.removeClass('mg_nav_jquery_off');
                pageList.addClass('mg_nav');

                //Step through each list item. Hide all of the 'selected' page icons
                $LIs.each(function(index) {
                    
                    var iconIndex = index + 1;
                    $(pageList).find('li a.page_' + iconIndex + '.selected').hide();
                });

                //Show the first article page 
                $(pageList).find('li a.page_1').hide();
                $(pageList).find('li a.page_1.selected').show();

                var animating = false;

                var changeImage = function($li) {
                    if (!animating) {
                        animating = true;

                        $li.children('div').hide();
                        $li.children('img').hide();
                        $li.css({ display: 'list-item' });


                        //Hide old MG article (text & title), and display new one
                        $currentLI.children('div').fadeOut(settings.fadeOutSpeed, function() {
                            $li.children('div').fadeIn(settings.fadeOutSpeed);
                        })

                        //Hide old MG article (image)
                        $currentLI.children('img').fadeOut(settings.fadeOutSpeed * 2);

                        var oldIndex = $LIs.index($currentLI);
                        var newIndex = $LIs.index($li);

                        if ((newIndex == $LIs.length - 1) || (newIndex >= 6)) {
                            //Show more link
                            $more.fadeIn(settings.fadeOutSpeed);
                        }
                        else {
                            //Hide more link
                            $more.fadeOut(settings.fadeOutSpeed);
                        }

                        $li.find('img').fadeIn(settings.fadeOutSpeed * 2, function() {
                            //only hide the old article image if the old and new articles are different
                            if (oldIndex != newIndex) { $currentLI.hide(); }
                            $currentLI = $li;
                            animating = false;
                        });

                        oldIndex++;
                        newIndex++;

                        $(pageList).find('li a.page_' + oldIndex).fadeIn(settings.fadeOutSpeed);
                        $(pageList).find('li a.page_' + oldIndex + '.selected').fadeOut(settings.fadeOutSpeed, function() {
                            $(pageList).find('li a.page_' + newIndex).fadeOut(settings.fadeOutSpeed);
                            $(pageList).find('li a.page_' + newIndex + '.selected').fadeIn(settings.fadeOutSpeed);

                        });

                    }
                }


                //Puts jScript onclick onto blue circles. 
                $pageList = $(pageList);
                $pages = $pageList.children('li');
                $pages.bind('click', function() {
                    //Get current page index
                    var index = $pages.index($(this));
                    //Pass current article to 'changeImage' function
                    changeImage($LIs.eq(index));
                });
            });
        }
    });
    $.fn.guideMicroArticle.defaults = {
        fadeOutSpeed: 600
    }
})(jQuery);

$(document).ready(function() {
    //$('div.guide_micro_article_wrapper').guideMicroArticle();
    $('div.mg_wrapper').guideMicroArticle();
});