(function($)
{
  $.mojo = $.mojo || {};

  $.fn.collapsable = function(o) {
    return this.each(function() {
       if (!$(this).is(".mojo-collapsable")) new $.mojo.collapsable(this, o);
    });
  }

  $.mojo.collapsable = function(el, o){
    var options = {
      collapsed_img: '/images/plus_s.png',
      uncollapsed_img: '/images/minus_s.png',
      collapsed: false,
      title: '',
      scroll: false,
      height: '',
      width: ''
    };
    var o = o || {}; $.extend(options, o); //Extend and copy options
    this.element = el; var self = this;
    $.data(this.element, "mojo-collapsable", this);

    var id = $(el).attr('id');

    var img = options.uncollapsed_img;
    if( options.collapsed )
      img = options.collapsed_img;

    style = '';
    if( options.scroll )
    {
      height = '';
      if( options.height.length > 0 )//&& !jQuery.browser.msie )
        height = ';max-height:'+options.height;
      //else
      //  height = ';height: expression( this.scrollHeight > '+(options.height-1)+' ? "'+options.height+'px" : "auto" );';
      style = 'zoom:1;overflow:auto'+height;
      
    }

    if( options.width )
      style += ';width:'+options.width;

    if( options.title.length == 0 )
      options.title = $(el).attr('title');

    $(el).wrap("<div id='"+id+"_collapse_container'></div>")
      .wrap("<div id='"+id+"_collapse_inner_container' style='"+style+"' class='mojo_collapsable_maxheight'></div>").parent().eq(0).parent().eq(0)
      .prepend("<div style='position:relative;left:0;top:0'> \
                  <img src='"+img+"' id='"+id+"_collapse_image' />\
                  <span id='"+id+"_collapse_title' class='mojo_collapsable_title'>&nbsp;</span> \
                </div>");

    $("#"+id+"_collapse_image").click(function(e){
      options.collapsed = !options.collapsed;
      if( options.collapsed )
      {
        $(this).attr('src', options.collapsed_img );
        $("#"+id+"_collapse_inner_container").hide();
        $("#"+id+"_collapse_title").html(options.title);
      }
      else
      {
        $(this).attr('src', options.uncollapsed_img );
        $("#"+id+"_collapse_inner_container").show();
        $("#"+id+"_collapse_title").html("&nbsp;");
      }
    });

    if( options.collapsed )
    {
      $("#"+id+"_collapse_inner_container").hide();
      $("#"+id+"_collapse_title").html(options.title);
    }
  }
})(jQuery);