2 * @author Jason Roy for CompareNetworks Inc.
3 * Thanks to mikejbond for suggested udaptes
6 * Copyright (c) 2009 CompareNetworks Inc.
8 * Licensed under the MIT license:
9 * http://www.opensource.org/licenses/mit-license.php
19 var _breadCrumbElements
= {};
20 var _autoIntervalArray
= [];
25 jQuery
.fn
.jBreadCrumb = function(options
)
27 _options
= $.extend({}, $.fn
.jBreadCrumb
.defaults
, options
);
29 return this.each(function()
39 function setupBreadCrumb()
41 //Check if easing plugin exists. If it doesn't, use "swing"
42 if(typeof(jQuery
.easing
) == 'object')
44 _easingEquation
= 'easeOutQuad'
48 _easingEquation
= 'swing'
51 //The reference object containing all of the breadcrumb elements
52 _breadCrumbElements
= jQuery(_container
).find('li');
54 //Keep it from overflowing in ie6 & 7
55 jQuery(_container
).find('ul').wrap('<div style="overflow:hidden; position:relative; width: ' + jQuery(_container
).css("width") + ';"><div>');
56 //Set an arbitrary width width to avoid float drop on the animation
57 jQuery(_container
).find('ul').width(5000);
59 //If the breadcrumb contains nothing, don't do anything
60 if (_breadCrumbElements
.length
> 0)
62 jQuery(_breadCrumbElements
[_breadCrumbElements
.length
- 1]).addClass('last');
63 jQuery(_breadCrumbElements
[0]).addClass('first');
65 //If the breadcrumb object length is long enough, compress.
67 if (_breadCrumbElements
.length
> _options
.minimumCompressionElements
)
74 function compressBreadCrumb()
77 // Factor to determine if we should compress the element at all
78 var finalElement
= jQuery(_breadCrumbElements
[_breadCrumbElements
.length
- 1]);
81 // If the final element is really long, compress more elements
82 if (jQuery(finalElement
).width() > _options
.maxFinalElementLength
)
84 if (_options
.beginingElementsToLeaveOpen
> 0)
86 _options
.beginingElementsToLeaveOpen
--;
89 if (_options
.endElementsToLeaveOpen
> 0)
91 _options
.endElementsToLeaveOpen
--;
94 // If the final element is within the short and long range, compress to the default end elements and 1 less beginning elements
95 if (jQuery(finalElement
).width() < _options
.maxFinalElementLength
&& jQuery(finalElement
).width() > _options
.minFinalElementLength
)
97 if (_options
.beginingElementsToLeaveOpen
> 0)
99 _options
.beginingElementsToLeaveOpen
--;
104 var itemsToRemove
= _breadCrumbElements
.length
- 1 - _options
.endElementsToLeaveOpen
;
106 // We compress only elements determined by the formula setting below
108 //TODO : Make this smarter, it's only checking the final elements length. It could also check the amount of elements.
109 jQuery(_breadCrumbElements
[_breadCrumbElements
.length
- 1]).css(
114 $(_breadCrumbElements
).each(function(i
, listElement
)
116 if (i
> _options
.beginingElementsToLeaveOpen
&& i
< itemsToRemove
)
119 jQuery(listElement
).find('a').wrap('<span></span>').width(jQuery(listElement
).find('a').width() + 10);
121 // Add the overlay png.
122 jQuery(listElement
).append(jQuery('<div class="' + _options
.overlayClass
+ '"></div>').css(
131 fixPNG(jQuery(listElement
).find('.' + _options
.overlayClass
).css(
140 width
: jQuery(listElement
).width(),
141 listElement
: jQuery(listElement
).find('span'),
143 element
: jQuery(listElement
).find('span')
146 jQuery(listElement
).bind('mouseover', options
, expandBreadCrumb
).bind('mouseout', options
, shrinkBreadCrumb
);
147 jQuery(listElement
).find('a').unbind('mouseover', expandBreadCrumb
).unbind('mouseout', shrinkBreadCrumb
);
148 listElement
.autoInterval
= setInterval(function()
150 clearInterval(listElement
.autoInterval
);
151 jQuery(listElement
).find('span').animate(
153 width
: _options
.previewWidth
154 }, _options
.timeInitialCollapse
, _options
.easing
);
162 function expandBreadCrumb(e
)
164 var elementID
= e
.data
.id
;
165 var originalWidth
= e
.data
.width
;
166 jQuery(e
.data
.element
).stop();
167 jQuery(e
.data
.element
).animate(
172 duration
: _options
.timeExpansionAnimation
,
173 easing
: _options
.easing
,
180 function shrinkBreadCrumb(e
)
182 var elementID
= e
.data
.id
;
183 jQuery(e
.data
.element
).stop();
184 jQuery(e
.data
.element
).animate(
186 width
: _options
.previewWidth
189 duration
: _options
.timeCompressionAnimation
,
190 easing
: _options
.easing
,
196 function isIE6OrLess()
198 var isIE6
= $.browser
.msie
&& /MSIE\s(5\.5|6\.)/.test(navigator
.userAgent
);
201 // Fix The Overlay for IE6
202 function fixPNG(element
)
205 if (jQuery(element
).is('img'))
207 image
= jQuery(element
).attr('src');
211 image
= $(element
).css('backgroundImage');
212 image
.match(/^url\(["']?(.*\.png)["']?\)$/i);
218 'backgroundImage': 'none',
219 'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='" + image
+ "')"
223 // Public global variables
225 jQuery
.fn
.jBreadCrumb
.defaults
=
227 maxFinalElementLength
: 400,
228 minFinalElementLength
: 200,
229 minimumCompressionElements
: 4,
230 endElementsToLeaveOpen
: 1,
231 beginingElementsToLeaveOpen
: 1,
232 timeExpansionAnimation
: 800,
233 timeCompressionAnimation
: 500,
234 timeInitialCollapse
: 600,
235 easing
: _easingEquation
,
236 overlayClass
: 'chevronOverlay',