1/* ---------------------------------- 2jQuery Timelinr 0.9.7 3tested with jQuery v1.6+ 4 5Copyright 2011, CSSLab.cl 6Free under the MIT license. 7http://www.opensource.org/licenses/mit-license.php 8 9instructions: http://www.csslab.cl/2011/08/18/jquery-timelinr/ 10---------------------------------- */ 11 12jQuery.fn.timelinr = function(options){ 13 // default plugin settings 14 settings = jQuery.extend({ 15 orientation: 'horizontal', // value: horizontal | vertical, default to horizontal 16 containerDiv: '#timeline', // value: any HTML tag or #id, default to #timeline 17 datesDiv: '#dates', // value: any HTML tag or #id, default to #dates 18 datesSelectedClass: 'selected', // value: any class, default to selected 19 datesSpeed: 'normal', // value: integer between 100 and 1000 (recommended) or 'slow', 'normal' or 'fast'; default to normal 20 issuesDiv: '#issues', // value: any HTML tag or #id, default to #issues 21 issuesSelectedClass: 'selected', // value: any class, default to selected 22 issuesSpeed: 'fast', // value: integer between 100 and 1000 (recommended) or 'slow', 'normal' or 'fast'; default to fast 23 issuesTransparency: 0.2, // value: integer between 0 and 1 (recommended), default to 0.2 24 issuesTransparencySpeed: 500, // value: integer between 100 and 1000 (recommended), default to 500 (normal) 25 prevButton: '#prev', // value: any HTML tag or #id, default to #prev 26 nextButton: '#next', // value: any HTML tag or #id, default to #next 27 arrowKeys: 'false', // value: true | false, default to false 28 startAt: 1, // value: integer, default to 1 (first) 29 autoPlay: 'false', // value: true | false, default to false 30 autoPlayDirection: 'forward', // value: forward | backward, default to forward 31 autoPlayPause: 2000 // value: integer (1000 = 1 seg), default to 2000 (2segs) 32 }, options); 33 34 $(function(){ 35 // Checks if required elements exist on page before initializing timelinr | improvement since 0.9.55 36 if ($(settings.datesDiv).length > 0 && $(settings.issuesDiv).length > 0) { 37 // setting variables... many of them 38 var howManyDates = $(settings.datesDiv+' li').length; 39 var howManyIssues = $(settings.issuesDiv+' li').length; 40 var currentDate = $(settings.datesDiv).find('a.'+settings.datesSelectedClass); 41 var currentIssue = $(settings.issuesDiv).find('li.'+settings.issuesSelectedClass); 42 var widthContainer = $(settings.containerDiv).width(); 43 var heightContainer = $(settings.containerDiv).height(); 44 var widthIssues = $(settings.issuesDiv).width(); 45 var heightIssues = $(settings.issuesDiv).height(); 46 var widthIssue = $(settings.issuesDiv+' li').width(); 47 var heightIssue = $(settings.issuesDiv+' li').height(); 48 var widthDates = $(settings.datesDiv).width(); 49 var heightDates = $(settings.datesDiv).height(); 50 var widthDate = $(settings.datesDiv+' li').width(); 51 var heightDate = $(settings.datesDiv+' li').height(); 52 // set positions! 53 if(settings.orientation == 'horizontal') { 54 $(settings.issuesDiv).width(widthIssue*howManyIssues); 55 $(settings.datesDiv).width(widthDate*howManyDates).css('marginLeft',widthContainer/2-widthDate/2); 56 var defaultPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 57 } else if(settings.orientation == 'vertical') { 58 $(settings.issuesDiv).height(heightIssue*howManyIssues); 59 $(settings.datesDiv).height(heightDate*howManyDates).css('marginTop',heightContainer/2-heightDate/2); 60 var defaultPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 61 } 62 63 $(settings.datesDiv+' a').click(function(event){ 64 event.preventDefault(); 65 // first vars 66 var whichIssue = $(this).text(); 67 var currentIndex = $(this).parent().prevAll().length; 68 // moving the elements 69 if(settings.orientation == 'horizontal') { 70 $(settings.issuesDiv).animate({'marginLeft':-widthIssue*currentIndex},{queue:false, duration:settings.issuesSpeed}); 71 } else if(settings.orientation == 'vertical') { 72 $(settings.issuesDiv).animate({'marginTop':-heightIssue*currentIndex},{queue:false, duration:settings.issuesSpeed}); 73 } 74 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}).removeClass(settings.issuesSelectedClass).eq(currentIndex).addClass(settings.issuesSelectedClass).fadeTo(settings.issuesTransparencySpeed,1); 75 // prev/next buttons now disappears on first/last issue | bugfix from 0.9.51: lower than 1 issue hide the arrows | bugfixed: arrows not showing when jumping from first to last date 76 if(howManyDates == 1) { 77 $(settings.prevButton+','+settings.nextButton).fadeOut('fast'); 78 } else if(howManyDates == 2) { 79 if($(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass)) { 80 $(settings.prevButton).fadeOut('fast'); 81 $(settings.nextButton).fadeIn('fast'); 82 } 83 else if($(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass)) { 84 $(settings.nextButton).fadeOut('fast'); 85 $(settings.prevButton).fadeIn('fast'); 86 } 87 } else { 88 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 89 $(settings.nextButton).fadeIn('fast'); 90 $(settings.prevButton).fadeOut('fast'); 91 } 92 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 93 $(settings.prevButton).fadeIn('fast'); 94 $(settings.nextButton).fadeOut('fast'); 95 } 96 else { 97 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 98 } 99 } 100 // now moving the dates 101 $(settings.datesDiv+' a').removeClass(settings.datesSelectedClass); 102 $(this).addClass(settings.datesSelectedClass); 103 if(settings.orientation == 'horizontal') { 104 $(settings.datesDiv).animate({'marginLeft':defaultPositionDates-(widthDate*currentIndex)},{queue:false, duration:'settings.datesSpeed'}); 105 } else if(settings.orientation == 'vertical') { 106 $(settings.datesDiv).animate({'marginTop':defaultPositionDates-(heightDate*currentIndex)},{queue:false, duration:'settings.datesSpeed'}); 107 } 108 }); 109 110 $(settings.nextButton).bind('click', function(event){ 111 event.preventDefault(); 112 // bugixed from 0.9.54: now the dates gets centered when there's too much dates. 113 var currentIndex = $(settings.issuesDiv).find('li.'+settings.issuesSelectedClass).index(); 114 if(settings.orientation == 'horizontal') { 115 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginLeft').substring(0,$(settings.issuesDiv).css('marginLeft').indexOf('px'))); 116 var currentIssueIndex = currentPositionIssues/widthIssue; 117 var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 118 var currentIssueDate = currentPositionDates-widthDate;
119 if(currentPositionIssues <= -(widthIssue*howManyIssues-(widthIssue))) { 120 $(settings.issuesDiv).stop(); 121 $(settings.datesDiv+' li:last-child a').click(); 122 } else { 123 if (!$(settings.issuesDiv).is(':animated')) { 124 // bugixed from 0.9.52: now the dates gets centered when there's too much dates. 125 $(settings.datesDiv+' li').eq(currentIndex+1).find('a').trigger('click'); 126 } 127 } 128 } else if(settings.orientation == 'vertical') { 129 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginTop').substring(0,$(settings.issuesDiv).css('marginTop').indexOf('px'))); 130 var currentIssueIndex = currentPositionIssues/heightIssue; 131 var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 132 var currentIssueDate = currentPositionDates-heightDate; 133 if(currentPositionIssues <= -(heightIssue*howManyIssues-(heightIssue))) { 134 $(settings.issuesDiv).stop(); 135 $(settings.datesDiv+' li:last-child a').click(); 136 } else { 137 if (!$(settings.issuesDiv).is(':animated')) { 138 // bugixed from 0.9.54: now the dates gets centered when there's too much dates. 139 $(settings.datesDiv+' li').eq(currentIndex+1).find('a').trigger('click'); 140 } 141 } 142 } 143 // prev/next buttons now disappears on first/last issue | bugfix from 0.9.51: lower than 1 issue hide the arrows 144 if(howManyDates == 1) { 145 $(settings.prevButton+','+settings.nextButton).fadeOut('fast'); 146 } else if(howManyDates == 2) { 147 if($(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass)) { 148 $(settings.prevButton).fadeOut('fast'); 149 $(settings.nextButton).fadeIn('fast'); 150 } 151 else if($(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass)) { 152 $(settings.nextButton).fadeOut('fast'); 153 $(settings.prevButton).fadeIn('fast'); 154 } 155 } else { 156 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 157 $(settings.prevButton).fadeOut('fast'); 158 } 159 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 160 $(settings.nextButton).fadeOut('fast'); 161 } 162 else { 163 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 164 } 165 } 166 }); 167 168 $(settings.prevButton).click(function(event){ 169 event.preventDefault(); 170 // bugixed from 0.9.54: now the dates gets centered when there's too much dates. 171 var currentIndex = $(settings.issuesDiv).find('li.'+settings.issuesSelectedClass).index(); 172 if(settings.orientation == 'horizontal') { 173 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginLeft').substring(0,$(settings.issuesDiv).css('marginLeft').indexOf('px'))); 174 var currentIssueIndex = currentPositionIssues/widthIssue; 175 var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 176 var currentIssueDate = currentPositionDates+widthDate; 177 if(currentPositionIssues >= 0) { 178 $(settings.issuesDiv).stop(); 179 $(settings.datesDiv+' li:first-child a').click(); 180 } else { 181 if (!$(settings.issuesDiv).is(':animated')) { 182 // bugixed from 0.9.54: now the dates gets centered when there's too much dates. 183 $(settings.datesDiv+' li').eq(currentIndex-1).find('a').trigger('click'); 184 } 185 } 186 } else if(settings.orientation == 'vertical') { 187 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginTop').substring(0,$(settings.issuesDiv).css('marginTop').indexOf('px'))); 188 var currentIssueIndex = currentPositionIssues/heightIssue; 189 var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 190 var currentIssueDate = currentPositionDates+heightDate; 191 if(currentPositionIssues >= 0) { 192 $(settings.issuesDiv).stop(); 193 $(settings.datesDiv+' li:first-child a').click(); 194 } else { 195 if (!$(settings.issuesDiv).is(':animated')) { 196 // bugixed from 0.9.54: now the dates gets centered when there's too much dates. 197 $(settings.datesDiv+' li').eq(currentIndex-1).find('a').trigger('click'); 198 } 199 } 200 } 201 // prev/next buttons now disappears on first/last issue | bugfix from 0.9.51: lower than 1 issue hide the arrows 202 if(howManyDates == 1) { 203 $(settings.prevButton+','+settings.nextButton).fadeOut('fast'); 204 } else if(howManyDates == 2) { 205 if($(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass)) { 206 $(settings.prevButton).fadeOut('fast'); 207 $(settings.nextButton).fadeIn('fast'); 208 } 209 else if($(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass)) { 210 $(settings.nextButton).fadeOut('fast'); 211 $(settings.prevButton).fadeIn('fast'); 212 } 213 } else { 214 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 215 $(settings.prevButton).fadeOut('fast'); 216 } 217 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 218 $(settings.nextButton).fadeOut('fast'); 219 } 220 else { 221 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 222 } 223 } 224 }); 225 // keyboard navigation, added since 0.9.1 226 if(settings.arrowKeys=='true') { 227 if(settings.orientation=='horizontal') { 228 $(document).keydown(function(event){ 229 if (event.keyCode == 39) { 230 $(settings.nextButton).click(); 231 } 232 if (event.keyCode == 37) { 233 $(settings.prevButton).click(); 234 } 235 }); 236 } else if(settings.orientation=='vertical') { 237 $(document).keydown(function(event){ 238 if (event.keyCode == 40) { 239 $(settings.nextButton).click(); 240 } 241 if (event.keyCode == 38) { 242 $(settings.prevButton).click(); 243 } 244 }); 245 } 246 } 247 // default position startAt, added since 0.9.3 248 $(settings.datesDiv+' li').eq(settings.startAt-1).find('a').trigger('click'); 249 // autoPlay, added since 0.9.4 250 if(settings.autoPlay == 'true') { 251 // set default timer 252 var timer = setInterval(autoPlay, settings.autoPlayPause); 253 // pause autoplay on hover 254 $(settings.containerDiv).hover(function(ev){ 255 clearInterval(timer); 256 }, function(ev){ 257 // start again timer on mouse out 258 timer = setInterval(autoPlay, settings.autoPlayPause); 259 }); 260 261 } 262 } 263 }); 264} 265 266// autoPlay, added since 0.9.4 267function autoPlay(){ 268 var currentDate = $(settings.datesDiv).find('a.'+settings.datesSelectedClass); 269 if(settings.autoPlayDirection == 'forward') { 270 if(currentDate.parent().is('li:last-child')) { 271 $(settings.datesDiv+' li:first-child').find('a').trigger('click'); 272 } else { 273 currentDate.parent().next().find('a').trigger('click'); 274 } 275 } else if(settings.autoPlayDirection == 'backward') { 276 if(currentDate.parent().is('li:first-child')) { 277 $(settings.datesDiv+' li:last-child').find('a').trigger('click'); 278 } else { 279 currentDate.parent().prev().find('a').trigger('click'); 280 } 281 } 282}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.