﻿/*
* jQuery Help v1.1 - http://topix/sites/tmk/Development/jQuery/jquery.help.docx
*
* Wraps a DIV of help text with a common UI that supports expanding and 
* collapsing the help text.
*
* TERMS OF USE - jQuery Help
* 
* Copyright © 2009 Top Producer Systems, Inc. All rights reserved.
* 
* Redistribution and use in source and binary forms, with or without modification, 
* is not permitted.
* 
*/

(function($) {
    jQuery.fn.help = function(options) {
        // Options handling
        var defaults = {
            length: 100,
            showIcon: true,
            collapsed: true,
            iconOpen: 'icons/openHelpArrow.gif',
            iconClose: 'icons/closeHelpArrow.gif',
            ellipsisText: '...'
        };
        var options = jQuery.extend({}, defaults, options);

        // Operate upon each item selected
        return this.each(function() {
            obj = jQuery(this);
            var body = obj.html();

            // CSS
            obj.addClass('help');

            // Icon
            if (options.showIcon) {
                var openHelpAltText = "Click to expand help";
                var closeHelpAltText = "Click to collapse help";
                var helpImageSource = '<a href="##"><img class="help_image" alt="' + openHelpAltText + '" src="' + options.iconOpen + '" border="0" /></a>&nbsp;';
                if (!options.collapsed) {
                    helpImageSource = '<a href="##"><img class="help_image" alt="' + closeHelpAltText + '" src="' + options.iconClose + '" border="0" /></a>&nbsp;';
                }

                // Truncate the text
                if (body.length > options.length) {
                    var splitLocation = body.indexOf(' ', options.length);
                    if (splitLocation != -1) {
                        var str1 = body.substring(0, splitLocation);
                        var str2 = body.substring(splitLocation, body.length);
                        obj.html(
                            helpImageSource +
                            str1 + '<span class="help_ellipsis">' + options.ellipsisText + '</span>' +
                            '<span class="help_more">' + str2 + '</span>'
                        );
                        var helpMore = $('.help_more', obj);
                        helpMore.css('display', 'none');

                        // set onclick event for more/less link
                        var helpImage = $('.help_image', obj);
                        var helpEllipsis = $('.help_ellipsis', obj);
                        helpImage.click(function() {
                            if (helpMore.css('display') == 'none') {
                                helpImage[0].src = options.iconClose;
                                helpImage[0].alt = closeHelpAltText;
                                helpImage[0].title = closeHelpAltText;
                                helpEllipsis.css('display', 'none');
                                helpMore.css('display', 'inline');
                            }
                            else {
                                helpImage[0].src = options.iconOpen;
                                helpImage[0].alt = openHelpAltText;
                                helpImage[0].title = openHelpAltText;
                                helpEllipsis.css('display', 'inline');
                                helpMore.css('display', 'none');
                            }
                        });

                        if (!options.collapsed) helpImage.click(); // expand the help text.
                    }
                }
            }
        });
    };
})(jQuery);
