1/* ---------------------------------- 2jQuery Timelinr 0.9.5 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 jQuery(document).ready(function($){ 35 // setting variables... many of them 36 var howManyDates = $(settings.datesDiv+' li').length; 37 var howManyIssues = $(settings.issuesDiv+' li').length; 38 var currentDate = $(settings.datesDiv).find('a.'+settings.datesSelectedClass); 39 var currentIssue = $(settings.issuesDiv).find('li.'+settings.issuesSelectedClass); 40 var widthContainer = $(settings.containerDiv).width(); 41 var heightContainer = $(settings.containerDiv).height(); 42 var widthIssues = $(settings.issuesDiv).width(); 43 var heightIssues = $(settings.issuesDiv).height(); 44 var widthIssue = $(settings.issuesDiv+' li').width(); 45 var heightIssue = $(settings.issuesDiv+' li').height(); 46 var widthDates = $(settings.datesDiv).width(); 47 var heightDates = $(settings.datesDiv).height(); 48 var widthDate = $(settings.datesDiv+' li').width(); 49 var heightDate = $(settings.datesDiv+' li').height(); 50 51 // set positions! 52 if(settings.orientation == 'horizontal') { 53 $(settings.issuesDiv).width(widthIssue*howManyIssues); 54 $(settings.datesDiv).width(widthDate*howManyDates).css('marginLeft',widthContainer/2-widthDate/2); 55 var defaultPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 56 } else if(settings.orientation == 'vertical') { 57 $(settings.issuesDiv).height(heightIssue*howManyIssues); 58 $(settings.datesDiv).height(heightDate*howManyDates).css('marginTop',heightContainer/2-heightDate/2); 59 var defaultPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 60 } 61 62 $(settings.datesDiv+' a').click(function(event){ 63 event.preventDefault(); 64 // first vars 65 var whichIssue = $(this).text(); 66 var currentIndex = $(this).parent().prevAll().length; 67 // moving the elements 68 if(settings.orientation == 'horizontal') { 69 $(settings.issuesDiv).animate({'marginLeft':-widthIssue*currentIndex},{queue:false, duration:settings.issuesSpeed}); 70 } else if(settings.orientation == 'vertical') { 71 $(settings.issuesDiv).animate({'marginTop':-heightIssue*currentIndex},{queue:false, duration:settings.issuesSpeed}); 72 } 73 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}).removeClass(settings.issuesSelectedClass).eq(currentIndex).addClass(settings.issuesSelectedClass).fadeTo(settings.issuesTransparencySpeed,1); 74 // prev/next buttons now disappears on first/last issue 75 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 76 $(settings.prevButton).fadeOut('fast'); 77 } 78 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 79 $(settings.nextButton).fadeOut('fast'); 80 } 81 else { 82 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 83 } 84 // now moving the dates 85 $(settings.datesDiv+' a').removeClass(settings.datesSelectedClass); 86 $(this).addClass(settings.datesSelectedClass); 87 if(settings.orientation == 'horizontal') { 88 $(settings.datesDiv).animate({'marginLeft':defaultPositionDates-(widthDate*currentIndex)},{queue:false, duration:'settings.datesSpeed'}); 89 } else if(settings.orientation == 'vertical') { 90 $(settings.datesDiv).animate({'marginTop':defaultPositionDates-(heightDate*currentIndex)},{queue:false, duration:'settings.datesSpeed'}); 91 } 92 93 }); 94 95 $(settings.nextButton).bind('click', function(event){ 96 event.preventDefault(); 97 if(settings.orientation == 'horizontal') { 98 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginLeft').substring(0,$(settings.issuesDiv).css('marginLeft').indexOf('px'))); 99 var currentIssueIndex = currentPositionIssues/widthIssue; 100 var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 101 var currentIssueDate = currentPositionDates-widthDate;
102 if(currentPositionIssues <= -(widthIssue*howManyIssues-(widthIssue))) { 103 $(settings.issuesDiv).stop(); 104 $(settings.datesDiv+' li:last-child a').click(); 105 } else { 106 if (!$(settings.issuesDiv).is(':animated')) { 107 $(settings.issuesDiv).animate({'marginLeft':currentPositionIssues-widthIssue},{queue:false, duration:settings.issuesSpeed}); 108 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}); 109 $(settings.issuesDiv+' li.'+settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).next().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); 110 $(settings.datesDiv).animate({'marginLeft':currentIssueDate},{queue:false, duration:'settings.datesSpeed'}); 111 $(settings.datesDiv+' a.'+settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass); 112 } 113 } 114 } else if(settings.orientation == 'vertical') { 115 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginTop').substring(0,$(settings.issuesDiv).css('marginTop').indexOf('px'))); 116 var currentIssueIndex = currentPositionIssues/heightIssue; 117 var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 118 var currentIssueDate = currentPositionDates-heightDate; 119 if(currentPositionIssues <= -(heightIssue*howManyIssues-(heightIssue))) { 120 $(settings.issuesDiv).stop(); 121 $(settings.datesDiv+' li:last-child a').click(); 122 } else { 123 if (!$(settings.issuesDiv).is(':animated')) { 124 $(settings.issuesDiv).animate({'marginTop':currentPositionIssues-heightIssue},{queue:false, duration:settings.issuesSpeed}); 125 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}); 126 $(settings.issuesDiv+' li.'+settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).next().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); 127 $(settings.datesDiv).animate({'marginTop':currentIssueDate},{queue:false, duration:'settings.datesSpeed'}); 128 $(settings.datesDiv+' a.'+settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass); 129 } 130 } 131 } 132 // prev/next buttons now disappears on first/last issue 133 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 134 $(settings.prevButton).fadeOut('fast'); 135 } 136 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 137 $(settings.nextButton).fadeOut('fast'); 138 } 139 else { 140 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 141 } 142 }); 143 144 $(settings.prevButton).click(function(event){ 145 event.preventDefault(); 146 if(settings.orientation == 'horizontal') { 147 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginLeft').substring(0,$(settings.issuesDiv).css('marginLeft').indexOf('px'))); 148 var currentIssueIndex = currentPositionIssues/widthIssue; 149 var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0,$(settings.datesDiv).css('marginLeft').indexOf('px'))); 150 var currentIssueDate = currentPositionDates+widthDate; 151 if(currentPositionIssues >= 0) { 152 $(settings.issuesDiv).stop(); 153 $(settings.datesDiv+' li:first-child a').click(); 154 } else { 155 if (!$(settings.issuesDiv).is(':animated')) { 156 $(settings.issuesDiv).animate({'marginLeft':currentPositionIssues+widthIssue},{queue:false, duration:settings.issuesSpeed}); 157 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}); 158 $(settings.issuesDiv+' li.'+settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).prev().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); 159 $(settings.datesDiv).animate({'marginLeft':currentIssueDate},{queue:false, duration:'settings.datesSpeed'}); 160 $(settings.datesDiv+' a.'+settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass); 161 } 162 } 163 } else if(settings.orientation == 'vertical') { 164 var currentPositionIssues = parseInt($(settings.issuesDiv).css('marginTop').substring(0,$(settings.issuesDiv).css('marginTop').indexOf('px'))); 165 var currentIssueIndex = currentPositionIssues/heightIssue; 166 var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0,$(settings.datesDiv).css('marginTop').indexOf('px'))); 167 var currentIssueDate = currentPositionDates+heightDate; 168 if(currentPositionIssues >= 0) { 169 $(settings.issuesDiv).stop(); 170 $(settings.datesDiv+' li:first-child a').click(); 171 } else { 172 if (!$(settings.issuesDiv).is(':animated')) { 173 $(settings.issuesDiv).animate({'marginTop':currentPositionIssues+heightIssue},{queue:false, duration:settings.issuesSpeed}); 174 $(settings.issuesDiv+' li').animate({'opacity':settings.issuesTransparency},{queue:false, duration:settings.issuesSpeed}); 175 $(settings.issuesDiv+' li.'+settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).prev().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); 176 $(settings.datesDiv).animate({'marginTop':currentIssueDate},{queue:false, duration:'settings.datesSpeed'},{queue:false, duration:settings.issuesSpeed}); 177 $(settings.datesDiv+' a.'+settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass); 178 } 179 } 180 } 181 // prev/next buttons now disappears on first/last issue 182 if( $(settings.issuesDiv+' li:first-child').hasClass(settings.issuesSelectedClass) ) { 183 $(settings.prevButton).fadeOut('fast'); 184 } 185 else if( $(settings.issuesDiv+' li:last-child').hasClass(settings.issuesSelectedClass) ) { 186 $(settings.nextButton).fadeOut('fast'); 187 } 188 else { 189 $(settings.nextButton+','+settings.prevButton).fadeIn('slow'); 190 } 191 }); 192 193 // keyboard navigation, added since 0.9.1 194 if(settings.arrowKeys=='true') { 195 if(settings.orientation=='horizontal') { 196 $(document).keydown(function(event){ 197 if (event.keyCode == 39) { 198 $(settings.nextButton).click(); 199 } 200 if (event.keyCode == 37) { 201 $(settings.prevButton).click(); 202 } 203 }); 204 } else if(settings.orientation=='vertical') { 205 $(document).keydown(function(event){ 206 if (event.keyCode == 40) { 207 $(settings.nextButton).click(); 208 } 209 if (event.keyCode == 38) { 210 $(settings.prevButton).click(); 211 } 212 }); 213 } 214 } 215 216 // default position startAt, added since 0.9.3 217 $(settings.datesDiv+' li').eq(settings.startAt-1).find('a').trigger('click'); 218 219 // autoPlay, added since 0.9.4 220 if(settings.autoPlay == 'true') { 221 setInterval("autoPlay()", settings.autoPlayPause); 222 } 223 224 }); 225 226}; 227 228 229// autoPlay, added since 0.9.4 230function autoPlay(){ 231 var currentDate = $(settings.datesDiv).find('a.'+settings.datesSelectedClass); 232 if(settings.autoPlayDirection == 'forward') { 233 if(currentDate.parent().is('li:last-child')) { 234 $(settings.datesDiv+' li:first-child').find('a').trigger('click'); 235 } else { 236 currentDate.parent().next().find('a').trigger('click'); 237 } 238 } else if(settings.autoPlayDirection == 'backward') { 239 if(currentDate.parent().is('li:first-child')) { 240 $(settings.datesDiv+' li:last-child').find('a').trigger('click'); 241 } else { 242 currentDate.parent().prev().find('a').trigger('click'); 243 } 244 } 245}
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.