/*
    This class will truncate the contents of a div to 100 words, giving the user
    the ability to toggle between the shortened version and the full text.
*/

Site.Controllers.Truncator = Class.create
(
    Site.Base,
    {
        initialize: function($super, element)
        {
            $super();

            if (element != null)
            {
                this.addObservers("readMoreLink", "readLessLink");

                var bioContentDiv = element;
                var bioContent = bioContentDiv.innerHTML.strip();
                bioContent = bioContent.replace(/[\r\n]+/g, "");
                while (bioContent.include("  "))
                {
                    bioContent = bioContent.gsub("  ", " ");
                }
                var bioArray = bioContent.toArray();
                var count = 0;
                var charCount = 0;
                for (i=0; i<bioArray.length; ++i)
                {
                   if (bioArray[i] == " ")
                   {
                       ++count;
                   }
                   if (count == 100)
                   {
                       charCount = i+3;
                       break;
                   }
                }

                if (count >= 100)
                {
                    var origContent = bioContentDiv.innerHTML;

                    bioContentDiv.innerHTML = bioContent.truncate(charCount, '...');

                    var children = bioContentDiv.childElements();
                    if (children[(children.length-1)].getStyle('display') == 'block')
                    {
                        children[(children.length-1)].insert({bottom: '&nbsp;<a id="'+bioContentDiv.id+'readMoreLink" href="#">Read more</a>'});
                    }
                    else
                    {
                        bioContentDiv.insert({bottom: '&nbsp;<a id="'+bioContentDiv.id+'readMoreLink" href="#">Read more</a>'});
                    }

                    addEvent($(bioContentDiv.id+'readMoreLink'), "click", this.observers.readMoreLink);

                    bioContentDiv.insert({after: ' <div id="'+bioContentDiv.id+'Full" style="display: none;">'+origContent+'</div>'});
                    var bioContentFullDiv = $(bioContentDiv.id+'Full');
                    var children = bioContentFullDiv.childElements();
                    if (children[(children.length-1)].getStyle('display') == 'block')
                    {
                        children[(children.length-1)].insert({bottom: '&nbsp;<a id="'+bioContentDiv.id+'readLessLink" href="#">Read less</a>'});
                    }
                    else
                    {
                        bioContentFullDiv.insert({bottom: '&nbsp;<a id="'+bioContentDiv.id+'readLessLink" href="#">Read less</a>'});
                    }
                    addEvent($(bioContentDiv.id+'readLessLink'), "click", this.observers.readLessLink);
                }
            }
        },
        readMoreLink: function(event)
        {
            Event.stop(event);
            var element = Event.element(event);
            var baseID = element.id.gsub("readMoreLink", "");
            $(baseID+'Full').show();
            $(baseID).hide();
        },
        readLessLink: function(event)
        {
            Event.stop(event);
            var element = Event.element(event);
            var baseID = element.id.gsub("readLessLink", "");
            $(baseID+'Full').hide();
            $(baseID).show();
            var divPositioning = $(baseID).viewportOffset();
            if(divPositioning[1] <= 0)
            {
                Effect.ScrollTo(baseID, {duration: .5});
            }
        }
    }
);