├── CONTRIBUTORS ├── img ├── digits.png ├── digits2.png ├── digits2_red.png ├── digits2_blue.png ├── digits2_green.png ├── digits2_orange.png ├── digits2_purple.png ├── digits2_yellow.png ├── digits_inverted.png ├── digits_transparent.png └── digits_transparent.no-transitions.png ├── README.textile ├── gen.sh ├── test.html ├── index.html └── js ├── jquery.countdown.min.js ├── test.js └── jquery.countdown.js /CONTRIBUTORS: -------------------------------------------------------------------------------- 1 | Martijn 2 | Rune Antonsen -------------------------------------------------------------------------------- /img/digits.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits.png -------------------------------------------------------------------------------- /img/digits2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2.png -------------------------------------------------------------------------------- /img/digits2_red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_red.png -------------------------------------------------------------------------------- /img/digits2_blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_blue.png -------------------------------------------------------------------------------- /img/digits2_green.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_green.png -------------------------------------------------------------------------------- /img/digits2_orange.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_orange.png -------------------------------------------------------------------------------- /img/digits2_purple.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_purple.png -------------------------------------------------------------------------------- /img/digits2_yellow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits2_yellow.png -------------------------------------------------------------------------------- /img/digits_inverted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits_inverted.png -------------------------------------------------------------------------------- /img/digits_transparent.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits_transparent.png -------------------------------------------------------------------------------- /img/digits_transparent.no-transitions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/pfarmer/jquery-countdown/HEAD/img/digits_transparent.no-transitions.png -------------------------------------------------------------------------------- /README.textile: -------------------------------------------------------------------------------- 1 | This is a fork of http://code.google.com/p/jquery-countdown/ as the original author hasn't updated the project since 10th July 2009. 2 | 3 | Please see http://pfarmer.github.com/jquery-countdown/test.html for examples of how to setup different countdowns, documentation is coming shortly. 4 | 5 | h2. Improvements from the original code base: 6 | 7 | * startTime can be dd:hh:mm:ss or a date object. 8 | * Automatically detect format of startTime. 9 | * Zero pad numbers if needed. 10 | 11 | h2. Please add a link in the wiki to your site if you use this jQuery plugin. 12 | -------------------------------------------------------------------------------- /gen.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | case $1 in 4 | tag) 5 | if [ -z "$2" ]; then 6 | echo "TAG?" 7 | exit 8 | fi 9 | echo -e "/*\n * jquery-countdown plugin - v$2" > js/jquery.countdown.js.new 10 | sed -e 's| console.log| // console.log|' js/jquery.countdown.js -e '1,2d' >> js/jquery.countdown.js.new 11 | mv js/jquery.countdown.js.new js/jquery.countdown.js 12 | 13 | echo "/* jquery-countdown - v$2 - See un-minified version for license etc */" > js/jquery.countdown.min.js 14 | yuicompressor js/jquery.countdown.js >> js/jquery.countdown.min.js 15 | 16 | git commit -a -m "Release v$2" 17 | git tag -a v$2 -m "Release v$2" 18 | 19 | echo "Don't forget to \"git push ; git push --tags\"" 20 | ;; 21 | debug) 22 | sed -e 's| // console.log| console.log|' js/jquery.countdown.js > js/jquery.countdown.js.new 23 | mv js/jquery.countdown.js.new js/jquery.countdown.js 24 | ;; 25 | *) 26 | echo -e "usage:\n$0 prepare\tPrepare repository for final commit for release\n$0 debug\tPrepare repository for development" 27 | ;; 28 | esac 29 | -------------------------------------------------------------------------------- /test.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | jquery-countdown 4 | 5 | 6 | 7 | 8 | 9 | 14 | 28 |

9

29 |
30 |

60

31 |
32 |

1:1

33 |
34 |

11:11

35 |
36 |

1:1:1

37 |
38 |

11:11:11

39 |
40 |

1:1:1:1

41 |
42 |

11:11:11:11

43 |
44 |

April 22 (via Date object)

45 |
46 |

Jan 1st (Issue 5)

47 |
48 | 49 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 3 | 4 | 5 | 6 | 7 | Countdown that doesn't sucks 8 | 9 | 10 | 25 | 43 | 44 | 45 |
46 |
47 |
Días
48 |
Horas
49 |
Minutos
50 |
Segundos
51 |
52 | Pause | Start 53 |
54 |
55 |
56 |
57 |
58 |
Minutos
59 |
Segundos
60 |
61 | 62 | 63 | -------------------------------------------------------------------------------- /js/jquery.countdown.min.js: -------------------------------------------------------------------------------- 1 | /* jquery-countdown - v0.2 - See un-minified version for license etc */ 2 | jQuery.fn.countdown=function(g){var b={stepTime:60,format:"dd:hh:mm:ss",startTime:"01:12:32:55",digitImages:6,digitWidth:53,digitHeight:77,timerEnd:function(){},image:"digits.png"};var f=[],a;var c=function(o){var q=0;var w=0;var h=0;var x=0;if(typeof b.startTime=="object"){var j=new Date();if(b.startTime.getTime()r){p[n]=r}if(p[n].length<2){p[n]="0"+p[n]}}b.startTime=p.join(":");switch(cCounter){case 3:if(b.startTime.split(":")[0].length==3){b.format="ddd:hh:mm:ss"}else{b.format="dd:hh:mm:ss"}break;case 2:b.format="hh:mm:ss";break;case 1:b.format="mm:ss";break;case 0:b.format="ss";break}b.startTime=b.startTime.split("");b.format=b.format.split("");for(var n=0;n=0){var l=jQuery('
').css({height:b.digitHeight*b.digitImages*10,"float":"left",background:"url('"+b.image+"')",width:b.digitWidth});f.push(l);e(q,-((parseInt(b.startTime[n])*b.digitHeight*b.digitImages)));f[q].__max=9;switch(b.format[n]){case"h":if(w<1){f[q].__max=2;w=1}else{f[q].__condmax=3}break;case"d":f[q].__max=9;break;case"m":if(h<1){f[q].__max=5;h=1}else{f[q].__condmax=9}break;case"s":if(x<1){f[q].__max=5;x=1}else{f[q].__condmax=9}break}++q}else{l=jQuery('
').css({"float":"left"}).text(b.startTime[n])}o.append("
");o.append(l);o.append("
")}};var e=function(h,i){if(i!==undefined){return f[h].css({marginTop:i+"px"})}return parseInt(f[h].css("marginTop").replace("px",""))};var d=function(h){f[h]._digitInitial=-(f[h].__max*b.digitHeight*b.digitImages);return function i(){mtop=e(h)+b.digitHeight;if(mtop==b.digitHeight){e(h,f[h]._digitInitial);if(h>0){d(h-1)()}else{clearInterval(a);for(var j=0;j0)&&(f[h].__condmax!==undefined)&&(f[h-1]._digitInitial==e(h-1))){e(h,-(f[h].__condmax*b.digitHeight*b.digitImages))}return}e(h,mtop);if(e(h)/b.digitHeight%b.digitImages!=0){setTimeout(i,b.stepTime)}if(mtop==0){f[h].__ismax=true}}};$.extend(b,g);this.css({height:b.digitHeight,overflow:"hidden"});c(this);a=setInterval(d(f.length-1),1000)}; -------------------------------------------------------------------------------- /js/test.js: -------------------------------------------------------------------------------- 1 | function do_counter() { 2 | $('#counter2').countdown({ 3 | startTime: "9", 4 | stepTime: 1, 5 | digitImages: 6, 6 | digitWidth: 53, 7 | digitHeight: 77, 8 | image: "img/digits.png" 9 | }); 10 | 11 | $('#counter3').countdown({ 12 | startTime: "60", 13 | stepTime: 1, 14 | digitImages: 6, 15 | digitWidth: 53, 16 | digitHeight: 77, 17 | image: "img/digits_transparent.png" 18 | }); 19 | 20 | $('#counter4').countdown({ 21 | startTime: "1:1", 22 | stepTime: 1, 23 | digitImages: 6, 24 | digitWidth: 53, 25 | digitHeight: 77, 26 | image: "img/digits_inverted.png" 27 | }); 28 | 29 | $('#counter5').countdown({ 30 | startTime: "11:11", 31 | stepTime: 1, 32 | digitImages: 6, 33 | digitWidth: 53, 34 | digitHeight: 77, 35 | image: "img/digits2.png" 36 | }); 37 | 38 | $('#counter6').countdown({ 39 | startTime: "1:1:1", 40 | stepTime: 1, 41 | digitImages: 6, 42 | digitWidth: 53, 43 | digitHeight: 77, 44 | image: "img/digits2_red.png" 45 | }); 46 | 47 | $('#counter7').countdown({ 48 | startTime: "11:11:11", 49 | stepTime: 1, 50 | digitImages: 6, 51 | digitWidth: 53, 52 | digitHeight: 77, 53 | image: "img/digits2_blue.png" 54 | }); 55 | 56 | $('#counter8').countdown({ 57 | startTime: "1:1:1:1", 58 | stepTime: 1, 59 | digitImages: 6, 60 | digitWidth: 53, 61 | digitHeight: 77, 62 | image: "img/digits2_green.png" 63 | }); 64 | 65 | $('#counter9').countdown({ 66 | startTime: "11:11:11:11", 67 | stepTime: 1, 68 | digitImages: 6, 69 | digitWidth: 53, 70 | digitHeight: 77, 71 | image: "img/digits2_yellow.png" 72 | }); 73 | 74 | var _date = new Date(); 75 | _date.setMonth(3); 76 | _date.setDate(22); 77 | _date.setHours(0); 78 | _date.setMinutes(0); 79 | _date.setSeconds(0); 80 | $('#counter10').countdown({ 81 | startTime: _date, 82 | stepTime: 1, 83 | digitImages: 6, 84 | digitWidth: 53, 85 | digitHeight: 77, 86 | image: "img/digits2_purple.png" 87 | }); 88 | 89 | var _date = new Date(); 90 | _date.setMonth(0); 91 | _date.setDate(1); 92 | _date.setHours(0); 93 | _date.setMinutes(0); 94 | _date.setSeconds(0); 95 | $('#counter11').countdown({ 96 | startTime: _date, 97 | stepTime: 1, 98 | digitImages: 6, 99 | digitWidth: 53, 100 | digitHeight: 77, 101 | image: "img/digits2_orange.png" 102 | }); 103 | }; 104 | -------------------------------------------------------------------------------- /js/jquery.countdown.js: -------------------------------------------------------------------------------- 1 | /* 2 | * jquery-countdown plugin - v0.2 3 | * 4 | * Copyright (c) 2009 Martin Conte Mac Donell 5 | * Copyright (c) 2011 Peter Farmer 6 | * 7 | * Dual licensed under the MIT and GPL licenses. 8 | * http://docs.jquery.com/License 9 | */ 10 | 11 | (function( $ ) { 12 | var init = function( userOptions ) { 13 | var options = { 14 | stepTime: 60, 15 | format: "dd:hh:mm:ss", 16 | startTime: "01:12:32:55", 17 | digitImages: 6, 18 | digitWidth: 53, 19 | digitHeight: 77, 20 | autoStart: true, 21 | timerEnd: function() { 22 | }, 23 | image: "digits.png" 24 | }; 25 | var digits = [], interval; 26 | 27 | // Draw digits in given container 28 | var createDigits = function(where) { 29 | var c = 0; 30 | var hCounter = 0; 31 | var mCounter = 0; 32 | var sCounter = 0; 33 | 34 | // Check the incoming startTime 35 | // console.log("options.startTime = " + options.startTime); 36 | 37 | if ((typeof options.startTime == 'object') && (options.startTime.constructor == Date)) { 38 | // console.log("Have been passed a date object? hopefully?"); 39 | var now = new Date(); 40 | if (options.startTime.getTime() < now.getTime()) { 41 | options.startTime.setFullYear(options.startTime.getFullYear() + 1); 42 | // console.log("options.startTime is now = " + options.startTime); 43 | } 44 | // console.log("options.startTime.getTime() = " + options.startTime.getTime()); 45 | // console.log("now.getTime() = " + now.getTime()); 46 | var datediff = Math.ceil((options.startTime.getTime() - now.getTime()) / 1000); 47 | // console.log("datediff = " + datediff); 48 | var days = Math.floor(datediff / 86400); 49 | // console.log("days = " + days); 50 | var hours = Math.floor((datediff % 86400) / 3600); 51 | var minutes = Math.floor(((datediff % 86400) % 3600) / 60); 52 | var seconds = ((datediff % 86400) % 3600) % 60; 53 | options.startTime = days + ":" + hours + ":" + minutes + ":" + seconds; 54 | } 55 | 56 | _startTime = options.startTime.split(""); 57 | // Count the number of ":" in the startTime. 58 | cCounter = 0; 59 | for (var i = 0; i < _startTime.length; i++) { 60 | if (isNaN(parseInt(_startTime[i]))) { 61 | // console.log("cCounter++ (" + _startTime[i] + ")"); 62 | cCounter = cCounter + 1; 63 | } 64 | } 65 | 66 | // Zero pad each section of the startTime if required. 67 | // console.log("options.startTime = " + options.startTime) 68 | var chunks = options.startTime.split(":"); 69 | // console.log("chunks.length = " + chunks.length); 70 | var newstartTime = ""; 71 | for (var i = 0; i < chunks.length; i++) { 72 | var max = 59; 73 | if (chunks.length == 3) { 74 | if (i == 0) { 75 | max = 23; 76 | } 77 | } 78 | if (chunks.length == 4) { 79 | if (i == 0) { 80 | max = 9999; 81 | } 82 | if (i == 1) { 83 | max = 23; 84 | } 85 | } 86 | 87 | if (chunks[i] > max) { 88 | chunks[i] = max; 89 | } 90 | if (chunks[i].length < 2) { 91 | chunks[i] = "0" + chunks[i]; 92 | } 93 | } 94 | 95 | options.startTime = chunks.join(":"); 96 | // console.log("options.startTime = " + options.startTime) 97 | 98 | // Calculate what the format should be: 99 | switch (cCounter) { 100 | case 3: 101 | // console.log("options.startTime.split(':', 1).length is " + options.startTime.split(":")[0].length); 102 | if (options.startTime.split(":")[0].length == 3) { 103 | options.format = "ddd:hh:mm:ss"; 104 | } else { 105 | options.format = "dd:hh:mm:ss"; 106 | } 107 | break; 108 | case 2: 109 | options.format = "hh:mm:ss"; 110 | break; 111 | case 1: 112 | options.format = "mm:ss"; 113 | break; 114 | case 0: 115 | options.format = "ss"; 116 | break; 117 | } 118 | 119 | // console.log("cCounter == " + cCounter); 120 | // console.log("options.format == " + options.format); 121 | 122 | // Iterate each startTime digit, if it is not a digit 123 | // we'll assume that it's a separator 124 | options.startTime = options.startTime.split(""); 125 | options.format = options.format.split(""); 126 | // console.log("options.startTime = " + options.startTime); 127 | // console.log("options.startTime.length = " + options.startTime.length); 128 | for (var i = 0; i < options.startTime.length; i++) { 129 | // console.log("options.startTime[" + i + "] = " + options.startTime[i]); 130 | if (parseInt(options.startTime[i]) >= 0) { 131 | // console.log("parseInt >= 0"); 132 | var elem = jQuery('
').css({ 133 | height: options.digitHeight * options.digitImages * 10, 134 | "float": 'left', background: 'url(\'' + options.image + '\')', 135 | width: options.digitWidth}); 136 | // console.log("elem = " + elem); 137 | digits.push(elem); 138 | margin(c, -((parseInt(options.startTime[i]) * options.digitHeight * 139 | options.digitImages))); 140 | digits[c].__max = 9; 141 | // Add max digits, for example, first digit of minutes (mm) has 142 | // a max of 5. Conditional max is used when the left digit has reach 143 | // the max. For example second "hours" digit has a conditional max of 4 144 | // console.log("options.format[" + i + "] = " + options.format[i]); 145 | switch (options.format[i]) { 146 | case 'h': 147 | if (hCounter < 1) { 148 | // console.log("digits[c] = " + digits[c]); 149 | digits[c].__max = 2; 150 | // console.log("settings digits[" + c + "].__max = 2"); 151 | hCounter = 1; 152 | } else { 153 | digits[c].__condmax = 3; 154 | // console.log("settings digits[" + c + "].__condmax = 3"); 155 | } 156 | break; 157 | case 'd': 158 | digits[c].__max = 9; 159 | break; 160 | case 'm': 161 | if (mCounter < 1) { 162 | digits[c].__max = 5; 163 | mCounter = 1; 164 | } else { 165 | digits[c].__condmax = 9; 166 | } 167 | break; 168 | case 's': 169 | if (sCounter < 1) { 170 | digits[c].__max = 5; 171 | sCounter = 1; 172 | } else { 173 | digits[c].__condmax = 9; 174 | } 175 | break; 176 | } 177 | ++c; 178 | } else { 179 | elem = jQuery('
').css({"float": 'left'}).text(options.startTime[i]); 180 | } 181 | where.append('
'); 182 | where.append(elem); 183 | where.append('
'); 184 | } 185 | }; 186 | 187 | // Set or get element margin 188 | var margin = function(elem, val) { 189 | if (val !== undefined) 190 | return digits[elem].css({'marginTop': val + 'px'}); 191 | 192 | return parseInt(digits[elem].css('marginTop').replace('px', '')); 193 | }; 194 | 195 | // Makes the movement. This is done by "digitImages" steps. 196 | var moveStep = function(elem) { 197 | // console.log("digits[elem] = " + digits[elem]); 198 | digits[elem]._digitInitial = -(digits[elem].__max * options.digitHeight * options.digitImages); 199 | return function _move() { 200 | mtop = margin(elem) + options.digitHeight; 201 | if (mtop == options.digitHeight) { 202 | margin(elem, digits[elem]._digitInitial); 203 | if (elem > 0) moveStep(elem - 1)(); 204 | else { 205 | clearInterval(interval); 206 | for (var i = 0; i < digits.length; i++) margin(i, 0); 207 | options.timerEnd(); 208 | return; 209 | } 210 | if ((elem > 0) && (digits[elem].__condmax !== undefined) && 211 | (digits[elem - 1]._digitInitial == margin(elem - 1))) 212 | margin(elem, -(digits[elem].__condmax * options.digitHeight * options.digitImages)); 213 | return; 214 | } 215 | 216 | margin(elem, mtop); 217 | if (margin(elem) / options.digitHeight % options.digitImages != 0) 218 | setTimeout(_move, options.stepTime); 219 | 220 | if (mtop == 0) digits[elem].__isma = true; 221 | } 222 | }; 223 | 224 | var start = function() { 225 | if (interval == undefined) 226 | interval = setInterval(moveStep(digits.length - 1), 1000); 227 | } 228 | 229 | var pause = function() { 230 | if (interval) { 231 | window.clearInterval(interval); 232 | interval = undefined; 233 | } 234 | } 235 | 236 | this.data("countdown", { 237 | "start": start, 238 | "pause": pause 239 | }); 240 | 241 | $.extend(options, userOptions); 242 | this.css({height: options.digitHeight, overflow: 'hidden'}); 243 | createDigits(this); 244 | if (options.autoStart) { 245 | start(); 246 | } 247 | }; 248 | 249 | $.fn.countdown = function( method ) { 250 | var methods = this.data("countdown"); 251 | if ( methods && methods[method] ) { 252 | return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 )); 253 | } else if ( typeof method === 'object' || ! method ) { 254 | return init.apply( this, arguments ); 255 | } else { 256 | $.error( 'Method ' + method + ' does not exist on jQuery.countdown' ); 257 | } 258 | }; 259 | })( jQuery ); 260 | --------------------------------------------------------------------------------