jq$(document).ready(function($) {
  
  var breadCrumbActualWidth = 0,
      breadcrumbEl = 'li',
      collapsibleClass = 'collapsible',
      linkEl = 'a',
      textSpan = 'span.text',
      activeClass = 'active',
      $breadcrumbs = $('#toolbar li.breadcrumbs ul'),
      breadCrumbContainerWidth = $breadcrumbs.width(),
      $activeCrumb = $(breadcrumbEl+'.'+activeClass, $breadcrumbs);
      collapsedTextWidth = 20,
      widthUnit = 'px',
      totalWidthCollapsed = 0,
      expansionRoom = 0; 
  
  $(breadcrumbEl, $breadcrumbs).each(function(index) {
    
    var $this = $(this);
    
    breadCrumbActualWidth += $this.outerWidth();
    
    if (index > 0) { // Skip home breadcrumb
      
      var $text = $(textSpan, $this);
      var textWidth = $text.width();
      
      $this.data('fullTextWidth', textWidth);
      
      if (!$this.hasClass(activeClass)) {
        $this.addClass(collapsibleClass);
        totalWidthCollapsed += (textWidth - collapsedTextWidth);
      }
      
    }
    
  });
  
  // Only collapse if our width is too big for its container
  if (breadCrumbActualWidth > breadCrumbContainerWidth) {
    
    // This is how many pixels we have left until we overflow the container
    expansionRoom = breadCrumbContainerWidth - breadCrumbActualWidth + totalWidthCollapsed;
    
    // Collpase all breadcrumb text elements
    $(breadcrumbEl+'.'+collapsibleClass+' '+textSpan, $breadcrumbs).css({'width':collapsedTextWidth+widthUnit});
    
    $(breadcrumbEl+'.'+collapsibleClass, $breadcrumbs).hover(
      function() {
        var $this = $(this);
        var animateWidth = $this.data('fullTextWidth');
        var animateActiveWidth = collapsedTextWidth;
        
         if (animateWidth - collapsedTextWidth > expansionRoom) animateCrumb($activeCrumb, animateActiveWidth);
         animateCrumb($this, animateWidth);
      },
      function() {
        var $this = $(this);
        var animateWidth = collapsedTextWidth;
        var animateActiveWidth = $activeCrumb.data('fullTextWidth');
        
        animateCrumb($activeCrumb, animateActiveWidth);
        animateCrumb($this, animateWidth);
      }
    );
    
  }
  
  function animateCrumb($this, width) {
    $(textSpan, $this).animate({ width: width+widthUnit }, {duration : 400, queue: false});
  }

});
