jQuery.fn.timelinr = function(a) { settings = jQuery.extend({ orientation: "horizontal", containerDiv: "#timeline", datesDiv: "#dates", datesSelectedClass: "selected", datesSpeed: 500, issuesDiv: "#issues", issuesSelectedClass: "selected", issuesSpeed: 200, issuesTransparency: .2, issuesTransparencySpeed: 500, prevButton: "#prev", nextButton: "#next", arrowKeys: "false", startAt: 1, autoPlay: "false", autoPlayDirection: "forward", autoPlayPause: 2e3 }, a); $(function() { var a = $(settings.datesDiv + " li").length; var b = $(settings.issuesDiv + " li").length; var c = $(settings.datesDiv).find("a." + settings.datesSelectedClass); var d = $(settings.issuesDiv).find("li." + settings.issuesSelectedClass); var e = $(settings.containerDiv).width(); var f = $(settings.containerDiv).height(); var g = $(settings.issuesDiv).width(); var h = $(settings.issuesDiv).height(); var i = $(settings.issuesDiv + " li").width(); var j = $(settings.issuesDiv + " li").height(); var k = $(settings.datesDiv).width(); var l = $(settings.datesDiv).height(); var m = $(settings.datesDiv + " li").width(); var n = $(settings.datesDiv + " li").height(); if (settings.orientation == "horizontal") { $(settings.issuesDiv).width(i * b); $(settings.datesDiv).width(m * a).css("marginLeft", e / 2 - m / 2); var o = parseInt($(settings.datesDiv).css("marginLeft").substring(0, $(settings.datesDiv).css("marginLeft").indexOf("px"))) } else if (settings.orientation == "vertical") { $(settings.issuesDiv).height(j * b); $(settings.datesDiv).height(n * a).css("marginTop", f / 2 - n / 2); var o = parseInt($(settings.datesDiv).css("marginTop").substring(0, $(settings.datesDiv).css("marginTop").indexOf("px"))) } $(settings.datesDiv + " a").click(function(a) { a.preventDefault(); var b = $(this).text(); var c = $(this).parent().prevAll().length; if (settings.orientation == "horizontal") { $(settings.issuesDiv).animate({ marginLeft: -i * c }, { queue: false, duration: settings.issuesSpeed }) } else if (settings.orientation == "vertical") { $(settings.issuesDiv).animate({ marginTop: -j * c }, { queue: false, duration: settings.issuesSpeed }) } $(settings.issuesDiv + " li").animate({ opacity: settings.issuesTransparency }, { queue: false, duration: settings.issuesSpeed }).removeClass(settings.issuesSelectedClass).eq(c).addClass(settings.issuesSelectedClass).fadeTo(settings.issuesTransparencySpeed, 1); $(settings.datesDiv + " a").removeClass(settings.datesSelectedClass); $(this).addClass(settings.datesSelectedClass); if (settings.orientation == "horizontal") { $(settings.datesDiv).animate({ marginLeft: o - m * c }, { queue: false, duration: settings.datesSpeed }) } else if (settings.orientation == "vertical") { $(settings.datesDiv).animate({ marginTop: o - n * c }, { queue: false, duration: settings.datesSpeed }) } }); $(settings.nextButton).bind("click", function(a) { a.preventDefault(); if (settings.orientation == "horizontal") { var c = parseInt($(settings.issuesDiv).css("marginLeft").substring(0, $(settings.issuesDiv).css("marginLeft").indexOf("px"))); var d = c / i; var e = parseInt($(settings.datesDiv).css("marginLeft").substring(0, $(settings.datesDiv).css("marginLeft").indexOf("px"))); var f = e - m; if (c <= -(i * b - i)) { $(settings.issuesDiv).stop(); $(settings.datesDiv + " li:last-child a").click() } else { if (!$(settings.issuesDiv).is(":animated")) { $(settings.issuesDiv).animate({ marginLeft: c - i }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li").animate({ opacity: settings.issuesTransparency }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li." + settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).next().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); $(settings.datesDiv).animate({ marginLeft: f }, { queue: false, duration: settings.datesSpeed }); $(settings.datesDiv + " a." + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass) } } } else if (settings.orientation == "vertical") { var c = parseInt($(settings.issuesDiv).css("marginTop").substring(0, $(settings.issuesDiv).css("marginTop").indexOf("px"))); var d = c / j; var e = parseInt($(settings.datesDiv).css("marginTop").substring(0, $(settings.datesDiv).css("marginTop").indexOf("px"))); var f = e - n; if (c <= -(j * b - j)) { $(settings.issuesDiv).stop(); $(settings.datesDiv + " li:last-child a").click() } else { if (!$(settings.issuesDiv).is(":animated")) { $(settings.issuesDiv).animate({ marginTop: c - j }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li").animate({ opacity: settings.issuesTransparency }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li." + settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).next().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); $(settings.datesDiv).animate({ marginTop: f }, { queue: false, duration: settings.datesSpeed }); $(settings.datesDiv + " a." + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass) } } } }); $(settings.prevButton).click(function(a) { a.preventDefault(); if (settings.orientation == "horizontal") { var b = parseInt($(settings.issuesDiv).css("marginLeft").substring(0, $(settings.issuesDiv).css("marginLeft").indexOf("px"))); var c = b / i; var d = parseInt($(settings.datesDiv).css("marginLeft").substring(0, $(settings.datesDiv).css("marginLeft").indexOf("px"))); var e = d + m; if (b >= 0) { $(settings.issuesDiv).stop(); $(settings.datesDiv + " li:first-child a").click() } else { if (!$(settings.issuesDiv).is(":animated")) { $(settings.issuesDiv).animate({ marginLeft: b + i }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li").animate({ opacity: settings.issuesTransparency }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li." + settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).prev().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); $(settings.datesDiv).animate({ marginLeft: e }, { queue: false, duration: settings.datesSpeed }); $(settings.datesDiv + " a." + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass) } } } else if (settings.orientation == "vertical") { var b = parseInt($(settings.issuesDiv).css("marginTop").substring(0, $(settings.issuesDiv).css("marginTop").indexOf("px"))); var c = b / j; var d = parseInt($(settings.datesDiv).css("marginTop").substring(0, $(settings.datesDiv).css("marginTop").indexOf("px"))); var e = d + n; if (b >= 0) { $(settings.issuesDiv).stop(); $(settings.datesDiv + " li:first-child a").click() } else { if (!$(settings.issuesDiv).is(":animated")) { $(settings.issuesDiv).animate({ marginTop: b + j }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li").animate({ opacity: settings.issuesTransparency }, { queue: false, duration: settings.issuesSpeed }); $(settings.issuesDiv + " li." + settings.issuesSelectedClass).removeClass(settings.issuesSelectedClass).prev().fadeTo(settings.issuesTransparencySpeed, 1).addClass(settings.issuesSelectedClass); $(settings.datesDiv).animate({ marginTop: e }, { queue: false, duration: settings.datesSpeed }, { queue: false, duration: settings.issuesSpeed }); $(settings.datesDiv + " a." + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass) } } } }); if (settings.arrowKeys == "true") { if (settings.orientation == "horizontal") { $(document).keydown(function(a) { if (a.keyCode == 39) { $(settings.nextButton).click() } if (a.keyCode == 37) { $(settings.prevButton).click() } }) } else if (settings.orientation == "vertical") { $(document).keydown(function(a) { if (a.keyCode == 40) { $(settings.nextButton).click() } if (a.keyCode == 38) { $(settings.prevButton).click() } }) } } $(settings.datesDiv + " li").eq(settings.startAt - 1).find("a").trigger("click"); if (settings.autoPlay == "true") { setInterval(function() { var a = $(settings.datesDiv).find("a." + settings.datesSelectedClass); if (settings.autoPlayDirection == "forward") { if (a.parent().is("li:last-child")) { $(settings.datesDiv + " li:first-child").find("a").trigger("click") } else { a.parent().next().find("a").trigger("click") } } else if (settings.autoPlayDirection == "backward") { if (a.parent().is("li:first-child")) { $(settings.datesDiv + " li:last-child").find("a").trigger("click") } else { a.parent().prev().find("a").trigger("click") } } }, settings.autoPlayPause) } }) }