diff --git a/docs/intro.md b/docs/intro.md index 35536d5..fefd54a 100644 --- a/docs/intro.md +++ b/docs/intro.md @@ -119,7 +119,8 @@ You can set options by creating a `odometerOptions` object: window.odometerOptions = { auto: false, // Don't automatically initialize everything with class 'odometer' selector: '.my-numbers', // Change the selector used to automatically find things to be animated - format: '(,ddd).dd', // Change how digit groups are formatted, and how many digits are shown after the decimal point + format: '(,ddd).dd', // Change how digit groups are formatted, and how many digits are shown after the decimal point, + minIntegerLen: '6', // Specify the minimal number of digits in the integer part of the number duration: 3000, // Change how long the javascript expects the CSS animation to take theme: 'car', // Specify the theme (if you have more than one theme css file on the page) animation: 'count' // Count is a simpler animation method which just increments the value, @@ -152,12 +153,18 @@ Format The format option allows you to configure how the digit groups are formatted, and how many digits are shown after the decimal point. - Format - Example - (,ddd) - 12,345,678 - (,ddd).dd - 12,345,678.09 - (.ddd),dd - 12.345.678,09 - ( ddd),dd - 12 345 678,09 - d - 12345678 + Number - Format - Example + 12345678.09 - (,ddd) - 12,345,678 + 12345678.09 - (,ddd).dd - 12,345,678.09 + 12345678.09 - (.ddd),dd - 12.345.678,09 + 12345678.09 - ( ddd),dd - 12 345 678,09 + 12345678.09 - d - 12345678 + +Furthermore, using a capital D for decimal the fractional part will specify required digits after the decimal point, and add trailing zeros if needed. + Number - Format - Example + 12345678.09 - (,ddd).ddd - 12,345,678.09 + 12345678.09 - (,ddd).DDd - 12,345,678.09 + 12345678.09 - (,ddd).DDD - 12,345,678.090 Browser Support --------------- diff --git a/odometer.coffee b/odometer.coffee index 798cc13..638af0a 100644 --- a/odometer.coffee +++ b/odometer.coffee @@ -16,7 +16,10 @@ FORMAT_MARK_HTML = '' # This is just the default, it can also be set as options.format. DIGIT_FORMAT = '(,ddd).dd' -FORMAT_PARSER = /^\(?([^)]*)\)?(?:(.)(d+))?$/ +# What is the minimal length (no of digits) of the integer-part of the number +MIN_INTEGER_LEN = 0; + +FORMAT_PARSER = /^\(?([^)]*)\)?(?:(.)(D*)(d*))?$/ # What is our target framerate? FRAMERATE = 30 @@ -88,9 +91,6 @@ truncate = (val) -> else Math.floor(val) -fractionalPart = (val) -> - val - round(val) - _jQueryWrapped = false do wrapJQuery = -> return if _jQueryWrapped @@ -223,11 +223,13 @@ class Odometer if not parsed throw new Error "Odometer: Unparsable digit format" - [repeating, radix, fractional] = parsed[1..3] + [repeating, radix, fractional1, fractional2] = parsed[1..4] + + fractional = fractional1?.length or 0 - precision = fractional?.length or 0 + precision = fractional + fractional2?.length or 0 - @format = {repeating, radix, precision} + @format = {repeating, radix, precision, fractional} render: (value=@value) -> @stopWatchingMutations() @@ -275,7 +277,7 @@ class Odometer if @options.formatFunction valueString = @options.formatFunction(value) for valueDigit in valueString.split('').reverse() - if valueDigit.match(/0-9/) + if valueDigit.match(/[0-9]/) digit = @renderDigit() digit.querySelector('.odometer-value').innerHTML = valueDigit @digits.push digit @@ -283,12 +285,27 @@ class Odometer else @addSpacer valueDigit else - wholePart = not @format.precision or not fractionalPart(value) or false - for digit in value.toString().split('').reverse() - if digit is '.' - wholePart = true + v = Math.abs value + fractionalCount = Math.max @format.fractional, @getFractionalDigitCount v + if fractionalCount + v = Math.round(v * Math.pow(10, fractionalCount)) + + i = 0 + while v > 0 + @addDigit (v % 10).toString(), i >= fractionalCount + v = Math.floor(v / 10); + i += 1 + if i == fractionalCount + @addDigit '.', true + + # if mininaml integer length is given, we need to pad with zeroes + minIntegerLen = @options.minIntegerLen ? MIN_INTEGER_LEN + for i in [i - fractionalCount...minIntegerLen] by 1 + @addDigit 0, true + - @addDigit digit, wholePart + if value < 0 + @addDigit '-', true return @@ -432,17 +449,19 @@ class Odometer animateSlide: (newValue) -> oldValue = @value - fractionalCount = @getFractionalDigitCount oldValue, newValue + fractionalCount = Math.max @format.fractional, @getFractionalDigitCount oldValue, newValue if fractionalCount - newValue = newValue * Math.pow(10, fractionalCount) - oldValue = oldValue * Math.pow(10, fractionalCount) + newValue = Math.round(newValue * Math.pow(10, fractionalCount)) + oldValue = Math.round(oldValue * Math.pow(10, fractionalCount)) return unless diff = newValue - oldValue @bindTransitionEnd() - digitCount = @getDigitCount(oldValue, newValue) + # if integer part of newValue has less digits than given minimal integer length, we need to pad with zeroes + minIntegerLen = @options.minIntegerLen ? MIN_INTEGER_LEN + digitCount = Math.max @getDigitCount(oldValue, newValue), minIntegerLen + fractionalCount digits = [] boosted = 0 diff --git a/odometer.js b/odometer.js index dcf926c..3714619 100644 --- a/odometer.js +++ b/odometer.js @@ -1,5 +1,5 @@ (function() { - var COUNT_FRAMERATE, COUNT_MS_PER_FRAME, DIGIT_FORMAT, DIGIT_HTML, DIGIT_SPEEDBOOST, DURATION, FORMAT_MARK_HTML, FORMAT_PARSER, FRAMERATE, FRAMES_PER_VALUE, MS_PER_FRAME, MutationObserver, Odometer, RIBBON_HTML, TRANSITION_END_EVENTS, TRANSITION_SUPPORT, VALUE_HTML, addClass, createFromHTML, fractionalPart, now, removeClass, requestAnimationFrame, round, transitionCheckStyles, trigger, truncate, wrapJQuery, _jQueryWrapped, _old, _ref, _ref1, + var COUNT_FRAMERATE, COUNT_MS_PER_FRAME, DIGIT_FORMAT, DIGIT_HTML, DIGIT_SPEEDBOOST, DURATION, FORMAT_MARK_HTML, FORMAT_PARSER, FRAMERATE, FRAMES_PER_VALUE, MIN_INTEGER_LEN, MS_PER_FRAME, MutationObserver, Odometer, RIBBON_HTML, TRANSITION_END_EVENTS, TRANSITION_SUPPORT, VALUE_HTML, addClass, createFromHTML, now, removeClass, requestAnimationFrame, round, transitionCheckStyles, trigger, truncate, wrapJQuery, _jQueryWrapped, _old, _ref, _ref1, __slice = [].slice; VALUE_HTML = ''; @@ -12,7 +12,9 @@ DIGIT_FORMAT = '(,ddd).dd'; - FORMAT_PARSER = /^\(?([^)]*)\)?(?:(.)(d+))?$/; + MIN_INTEGER_LEN = 0; + + FORMAT_PARSER = /^\(?([^)]*)\)?(?:(.)(D*)(d*))?$/; FRAMERATE = 30; @@ -89,10 +91,6 @@ } }; - fractionalPart = function(val) { - return val - round(val); - }; - _jQueryWrapped = false; (wrapJQuery = function() { @@ -261,19 +259,21 @@ }; Odometer.prototype.resetFormat = function() { - var format, fractional, parsed, precision, radix, repeating, _ref, _ref1; + var format, fractional, fractional1, fractional2, parsed, precision, radix, repeating, _ref, _ref1; format = (_ref = this.options.format) != null ? _ref : DIGIT_FORMAT; format || (format = 'd'); parsed = FORMAT_PARSER.exec(format); if (!parsed) { throw new Error("Odometer: Unparsable digit format"); } - _ref1 = parsed.slice(1, 4), repeating = _ref1[0], radix = _ref1[1], fractional = _ref1[2]; - precision = (fractional != null ? fractional.length : void 0) || 0; + _ref1 = parsed.slice(1, 5), repeating = _ref1[0], radix = _ref1[1], fractional1 = _ref1[2], fractional2 = _ref1[3]; + fractional = (fractional1 != null ? fractional1.length : void 0) || 0; + precision = fractional + (fractional2 != null ? fractional2.length : void 0) || 0; return this.format = { repeating: repeating, radix: radix, - precision: precision + precision: precision, + fractional: fractional }; }; @@ -318,14 +318,14 @@ }; Odometer.prototype.formatDigits = function(value) { - var digit, valueDigit, valueString, wholePart, _i, _j, _len, _len1, _ref, _ref1; + var digit, fractionalCount, i, minIntegerLen, v, valueDigit, valueString, _i, _j, _len, _ref, _ref1, _ref2; this.digits = []; if (this.options.formatFunction) { valueString = this.options.formatFunction(value); _ref = valueString.split('').reverse(); for (_i = 0, _len = _ref.length; _i < _len; _i++) { valueDigit = _ref[_i]; - if (valueDigit.match(/0-9/)) { + if (valueDigit.match(/[0-9]/)) { digit = this.renderDigit(); digit.querySelector('.odometer-value').innerHTML = valueDigit; this.digits.push(digit); @@ -335,14 +335,26 @@ } } } else { - wholePart = !this.format.precision || !fractionalPart(value) || false; - _ref1 = value.toString().split('').reverse(); - for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) { - digit = _ref1[_j]; - if (digit === '.') { - wholePart = true; + v = Math.abs(value); + fractionalCount = Math.max(this.format.fractional, this.getFractionalDigitCount(v)); + if (fractionalCount) { + v = Math.round(v * Math.pow(10, fractionalCount)); + } + i = 0; + while (v > 0) { + this.addDigit((v % 10).toString(), i >= fractionalCount); + v = Math.floor(v / 10); + i += 1; + if (i === fractionalCount) { + this.addDigit('.', true); } - this.addDigit(digit, wholePart); + } + minIntegerLen = (_ref1 = this.options.minIntegerLen) != null ? _ref1 : MIN_INTEGER_LEN; + for (i = _j = _ref2 = i - fractionalCount; _j < minIntegerLen; i = _j += 1) { + this.addDigit(0, true); + } + if (value < 0) { + this.addDigit('-', true); } } }; @@ -505,18 +517,19 @@ }; Odometer.prototype.animateSlide = function(newValue) { - var boosted, cur, diff, digitCount, digits, dist, end, fractionalCount, frame, frames, i, incr, j, mark, numEl, oldValue, start, _base, _i, _j, _k, _l, _len, _len1, _len2, _m, _ref, _results; + var boosted, cur, diff, digitCount, digits, dist, end, fractionalCount, frame, frames, i, incr, j, mark, minIntegerLen, numEl, oldValue, start, _base, _i, _j, _k, _l, _len, _len1, _len2, _m, _ref, _ref1, _results; oldValue = this.value; - fractionalCount = this.getFractionalDigitCount(oldValue, newValue); + fractionalCount = Math.max(this.format.fractional, this.getFractionalDigitCount(oldValue, newValue)); if (fractionalCount) { - newValue = newValue * Math.pow(10, fractionalCount); - oldValue = oldValue * Math.pow(10, fractionalCount); + newValue = Math.round(newValue * Math.pow(10, fractionalCount)); + oldValue = Math.round(oldValue * Math.pow(10, fractionalCount)); } if (!(diff = newValue - oldValue)) { return; } this.bindTransitionEnd(); - digitCount = this.getDigitCount(oldValue, newValue); + minIntegerLen = (_ref = this.options.minIntegerLen) != null ? _ref : MIN_INTEGER_LEN; + digitCount = Math.max(this.getDigitCount(oldValue, newValue), minIntegerLen + fractionalCount); digits = []; boosted = 0; for (i = _i = 0; 0 <= digitCount ? _i < digitCount : _i > digitCount; i = 0 <= digitCount ? ++_i : --_i) { @@ -549,9 +562,9 @@ digits.push(frames); } this.resetDigits(); - _ref = digits.reverse(); - for (i = _l = 0, _len1 = _ref.length; _l < _len1; i = ++_l) { - frames = _ref[i]; + _ref1 = digits.reverse(); + for (i = _l = 0, _len1 = _ref1.length; _l < _len1; i = ++_l) { + frames = _ref1[i]; if (!this.digits[i]) { this.addDigit(' ', i >= fractionalCount); } diff --git a/odometer.min.js b/odometer.min.js index 2c08ad7..e76889b 100644 --- a/odometer.min.js +++ b/odometer.min.js @@ -1,2 +1,2 @@ /*! odometer 0.4.7 */ -(function(){var a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G=[].slice;q='',n=''+q+"",d='8'+n+"",g='',c="(,ddd).dd",h=/^\(?([^)]*)\)?(?:(.)(d+))?$/,i=30,f=2e3,a=20,j=2,e=.5,k=1e3/i,b=1e3/a,o="transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd",y=document.createElement("div").style,p=null!=y.transition||null!=y.webkitTransition||null!=y.mozTransition||null!=y.oTransition,w=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame,l=window.MutationObserver||window.WebKitMutationObserver||window.MozMutationObserver,s=function(a){var b;return b=document.createElement("div"),b.innerHTML=a,b.children[0]},v=function(a,b){return a.className=a.className.replace(new RegExp("(^| )"+b.split(" ").join("|")+"( |$)","gi")," ")},r=function(a,b){return v(a,b),a.className+=" "+b},z=function(a,b){var c;return null!=document.createEvent?(c=document.createEvent("HTMLEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):void 0},u=function(){var a,b;return null!=(a=null!=(b=window.performance)&&"function"==typeof b.now?b.now():void 0)?a:+new Date},x=function(a,b){return null==b&&(b=0),b?(a*=Math.pow(10,b),a+=.5,a=Math.floor(a),a/=Math.pow(10,b)):Math.round(a)},A=function(a){return 0>a?Math.ceil(a):Math.floor(a)},t=function(a){return a-x(a)},C=!1,(B=function(){var a,b,c,d,e;if(!C&&null!=window.jQuery){for(C=!0,d=["html","text"],e=[],b=0,c=d.length;c>b;b++)a=d[b],e.push(function(a){var b;return b=window.jQuery.fn[a],window.jQuery.fn[a]=function(a){var c;return null==a||null==(null!=(c=this[0])?c.odometer:void 0)?b.apply(this,arguments):this[0].odometer.update(a)}}(a));return e}})(),setTimeout(B,0),m=function(){function a(b){var c,d,e,g,h,i,l,m,n,o,p=this;if(this.options=b,this.el=this.options.el,null!=this.el.odometer)return this.el.odometer;this.el.odometer=this,m=a.options;for(d in m)g=m[d],null==this.options[d]&&(this.options[d]=g);null==(h=this.options).duration&&(h.duration=f),this.MAX_VALUES=this.options.duration/k/j|0,this.resetFormat(),this.value=this.cleanValue(null!=(n=this.options.value)?n:""),this.renderInside(),this.render();try{for(o=["innerHTML","innerText","textContent"],i=0,l=o.length;l>i;i++)e=o[i],null!=this.el[e]&&!function(a){return Object.defineProperty(p.el,a,{get:function(){var b;return"innerHTML"===a?p.inside.outerHTML:null!=(b=p.inside.innerText)?b:p.inside.textContent},set:function(a){return p.update(a)}})}(e)}catch(q){c=q,this.watchForMutations()}}return a.prototype.renderInside=function(){return this.inside=document.createElement("div"),this.inside.className="odometer-inside",this.el.innerHTML="",this.el.appendChild(this.inside)},a.prototype.watchForMutations=function(){var a,b=this;if(null!=l)try{return null==this.observer&&(this.observer=new l(function(){var a;return a=b.el.innerText,b.renderInside(),b.render(b.value),b.update(a)})),this.watchMutations=!0,this.startWatchingMutations()}catch(c){a=c}},a.prototype.startWatchingMutations=function(){return this.watchMutations?this.observer.observe(this.el,{childList:!0}):void 0},a.prototype.stopWatchingMutations=function(){var a;return null!=(a=this.observer)?a.disconnect():void 0},a.prototype.cleanValue=function(a){var b;return"string"==typeof a&&(a=a.replace(null!=(b=this.format.radix)?b:".",""),a=a.replace(/[.,]/g,""),a=a.replace("","."),a=parseFloat(a,10)||0),x(a,this.format.precision)},a.prototype.bindTransitionEnd=function(){var a,b,c,d,e,f,g=this;if(!this.transitionEndBound){for(this.transitionEndBound=!0,b=!1,e=o.split(" "),f=[],c=0,d=e.length;d>c;c++)a=e[c],f.push(this.el.addEventListener(a,function(){return b?!0:(b=!0,setTimeout(function(){return g.render(),b=!1,z(g.el,"odometerdone")},0),!0)},!1));return f}},a.prototype.resetFormat=function(){var a,b,d,e,f,g,i,j;if(a=null!=(i=this.options.format)?i:c,a||(a="d"),d=h.exec(a),!d)throw new Error("Odometer: Unparsable digit format");return j=d.slice(1,4),g=j[0],f=j[1],b=j[2],e=(null!=b?b.length:void 0)||0,this.format={repeating:g,radix:f,precision:e}},a.prototype.render=function(a){var b,c,d,e,f,g,h;for(null==a&&(a=this.value),this.stopWatchingMutations(),this.resetFormat(),this.inside.innerHTML="",f=this.options.theme,b=this.el.className.split(" "),e=[],g=0,h=b.length;h>g;g++)c=b[g],c.length&&((d=/^odometer-theme-(.+)$/.exec(c))?f=d[1]:/^odometer(-|$)/.test(c)||e.push(c));return e.push("odometer"),p||e.push("odometer-no-transitions"),e.push(f?"odometer-theme-"+f:"odometer-auto-theme"),this.el.className=e.join(" "),this.ribbons={},this.formatDigits(a),this.startWatchingMutations()},a.prototype.formatDigits=function(a){var b,c,d,e,f,g,h,i,j,k;if(this.digits=[],this.options.formatFunction)for(d=this.options.formatFunction(a),j=d.split("").reverse(),f=0,h=j.length;h>f;f++)c=j[f],c.match(/0-9/)?(b=this.renderDigit(),b.querySelector(".odometer-value").innerHTML=c,this.digits.push(b),this.insertDigit(b)):this.addSpacer(c);else for(e=!this.format.precision||!t(a)||!1,k=a.toString().split("").reverse(),g=0,i=k.length;i>g;g++)b=k[g],"."===b&&(e=!0),this.addDigit(b,e)},a.prototype.update=function(a){var b,c=this;return a=this.cleanValue(a),(b=a-this.value)?(v(this.el,"odometer-animating-up odometer-animating-down odometer-animating"),b>0?r(this.el,"odometer-animating-up"):r(this.el,"odometer-animating-down"),this.stopWatchingMutations(),this.animate(a),this.startWatchingMutations(),setTimeout(function(){return c.el.offsetHeight,r(c.el,"odometer-animating")},0),this.value=a):void 0},a.prototype.renderDigit=function(){return s(d)},a.prototype.insertDigit=function(a,b){return null!=b?this.inside.insertBefore(a,b):this.inside.children.length?this.inside.insertBefore(a,this.inside.children[0]):this.inside.appendChild(a)},a.prototype.addSpacer=function(a,b,c){var d;return d=s(g),d.innerHTML=a,c&&r(d,c),this.insertDigit(d,b)},a.prototype.addDigit=function(a,b){var c,d,e,f;if(null==b&&(b=!0),"-"===a)return this.addSpacer(a,null,"odometer-negation-mark");if("."===a)return this.addSpacer(null!=(f=this.format.radix)?f:".",null,"odometer-radix-mark");if(b)for(e=!1;;){if(!this.format.repeating.length){if(e)throw new Error("Bad odometer format without digits");this.resetFormat(),e=!0}if(c=this.format.repeating[this.format.repeating.length-1],this.format.repeating=this.format.repeating.substring(0,this.format.repeating.length-1),"d"===c)break;this.addSpacer(c)}return d=this.renderDigit(),d.querySelector(".odometer-value").innerHTML=a,this.digits.push(d),this.insertDigit(d)},a.prototype.animate=function(a){return p&&"count"!==this.options.animation?this.animateSlide(a):this.animateCount(a)},a.prototype.animateCount=function(a){var c,d,e,f,g,h=this;if(d=+a-this.value)return f=e=u(),c=this.value,(g=function(){var i,j,k;return u()-f>h.options.duration?(h.value=a,h.render(),void z(h.el,"odometerdone")):(i=u()-e,i>b&&(e=u(),k=i/h.options.duration,j=d*k,c+=j,h.render(Math.round(c))),null!=w?w(g):setTimeout(g,b))})()},a.prototype.getDigitCount=function(){var a,b,c,d,e,f;for(d=1<=arguments.length?G.call(arguments,0):[],a=e=0,f=d.length;f>e;a=++e)c=d[a],d[a]=Math.abs(c);return b=Math.max.apply(Math,d),Math.ceil(Math.log(b+1)/Math.log(10))},a.prototype.getFractionalDigitCount=function(){var a,b,c,d,e,f,g;for(e=1<=arguments.length?G.call(arguments,0):[],b=/^\-?\d*\.(\d*?)0*$/,a=f=0,g=e.length;g>f;a=++f)d=e[a],e[a]=d.toString(),c=b.exec(e[a]),e[a]=null==c?0:c[1].length;return Math.max.apply(Math,e)},a.prototype.resetDigits=function(){return this.digits=[],this.ribbons=[],this.inside.innerHTML="",this.resetFormat()},a.prototype.animateSlide=function(a){var b,c,d,f,g,h,i,j,k,l,m,n,o,p,q,s,t,u,v,w,x,y,z,B,C,D,E;if(s=this.value,j=this.getFractionalDigitCount(s,a),j&&(a*=Math.pow(10,j),s*=Math.pow(10,j)),d=a-s){for(this.bindTransitionEnd(),f=this.getDigitCount(s,a),g=[],b=0,m=v=0;f>=0?f>v:v>f;m=f>=0?++v:--v){if(t=A(s/Math.pow(10,f-m-1)),i=A(a/Math.pow(10,f-m-1)),h=i-t,Math.abs(h)>this.MAX_VALUES){for(l=[],n=h/(this.MAX_VALUES+this.MAX_VALUES*b*e),c=t;h>0&&i>c||0>h&&c>i;)l.push(Math.round(c)),c+=n;l[l.length-1]!==i&&l.push(i),b++}else l=function(){E=[];for(var a=t;i>=t?i>=a:a>=i;i>=t?a++:a--)E.push(a);return E}.apply(this);for(m=w=0,y=l.length;y>w;m=++w)k=l[m],l[m]=Math.abs(k%10);g.push(l)}for(this.resetDigits(),D=g.reverse(),m=x=0,z=D.length;z>x;m=++x)for(l=D[m],this.digits[m]||this.addDigit(" ",m>=j),null==(u=this.ribbons)[m]&&(u[m]=this.digits[m].querySelector(".odometer-ribbon-inner")),this.ribbons[m].innerHTML="",0>d&&(l=l.reverse()),o=C=0,B=l.length;B>C;o=++C)k=l[o],q=document.createElement("div"),q.className="odometer-value",q.innerHTML=k,this.ribbons[m].appendChild(q),o===l.length-1&&r(q,"odometer-last-value"),0===o&&r(q,"odometer-first-value");return 0>t&&this.addDigit("-"),p=this.inside.querySelector(".odometer-radix-mark"),null!=p&&p.parent.removeChild(p),j?this.addSpacer(this.format.radix,this.digits[j-1],"odometer-radix-mark"):void 0}},a}(),m.options=null!=(E=window.odometerOptions)?E:{},setTimeout(function(){var a,b,c,d,e;if(window.odometerOptions){d=window.odometerOptions,e=[];for(a in d)b=d[a],e.push(null!=(c=m.options)[a]?(c=m.options)[a]:c[a]=b);return e}},0),m.init=function(){var a,b,c,d,e,f;if(null!=document.querySelectorAll){for(b=document.querySelectorAll(m.options.selector||".odometer"),f=[],c=0,d=b.length;d>c;c++)a=b[c],f.push(a.odometer=new m({el:a,value:null!=(e=a.innerText)?e:a.textContent}));return f}},null!=(null!=(F=document.documentElement)?F.doScroll:void 0)&&null!=document.createEventObject?(D=document.onreadystatechange,document.onreadystatechange=function(){return"complete"===document.readyState&&m.options.auto!==!1&&m.init(),null!=D?D.apply(this,arguments):void 0}):document.addEventListener("DOMContentLoaded",function(){return m.options.auto!==!1?m.init():void 0},!1),"function"==typeof define&&define.amd?define(["jquery"],function(){return m}):"undefined"!=typeof exports&&null!==exports?module.exports=m:window.Odometer=m}).call(this); \ No newline at end of file +(function(){var a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G=[].slice;r='',o=''+r+"",d='8'+o+"",g='',c="(,ddd).dd",k=0,h=/^\(?([^)]*)\)?(?:(.)(D*)(d*))?$/,i=30,f=2e3,a=20,j=2,e=.5,l=1e3/i,b=1e3/a,p="transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd",y=document.createElement("div").style,q=null!=y.transition||null!=y.webkitTransition||null!=y.mozTransition||null!=y.oTransition,w=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame,m=window.MutationObserver||window.WebKitMutationObserver||window.MozMutationObserver,t=function(a){var b;return b=document.createElement("div"),b.innerHTML=a,b.children[0]},v=function(a,b){return a.className=a.className.replace(new RegExp("(^| )"+b.split(" ").join("|")+"( |$)","gi")," ")},s=function(a,b){return v(a,b),a.className+=" "+b},z=function(a,b){var c;return null!=document.createEvent?(c=document.createEvent("HTMLEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):void 0},u=function(){var a,b;return null!=(a=null!=(b=window.performance)&&"function"==typeof b.now?b.now():void 0)?a:+new Date},x=function(a,b){return null==b&&(b=0),b?(a*=Math.pow(10,b),a+=.5,a=Math.floor(a),a/=Math.pow(10,b)):Math.round(a)},A=function(a){return 0>a?Math.ceil(a):Math.floor(a)},C=!1,(B=function(){var a,b,c,d,e;if(!C&&null!=window.jQuery){for(C=!0,d=["html","text"],e=[],b=0,c=d.length;c>b;b++)a=d[b],e.push(function(a){var b;return b=window.jQuery.fn[a],window.jQuery.fn[a]=function(a){var c;return null==a||null==(null!=(c=this[0])?c.odometer:void 0)?b.apply(this,arguments):this[0].odometer.update(a)}}(a));return e}})(),setTimeout(B,0),n=function(){function a(b){var c,d,e,g,h,i,k,m,n,o,p=this;if(this.options=b,this.el=this.options.el,null!=this.el.odometer)return this.el.odometer;this.el.odometer=this,m=a.options;for(d in m)g=m[d],null==this.options[d]&&(this.options[d]=g);null==(h=this.options).duration&&(h.duration=f),this.MAX_VALUES=this.options.duration/l/j|0,this.resetFormat(),this.value=this.cleanValue(null!=(n=this.options.value)?n:""),this.renderInside(),this.render();try{for(o=["innerHTML","innerText","textContent"],i=0,k=o.length;k>i;i++)e=o[i],null!=this.el[e]&&!function(a){return Object.defineProperty(p.el,a,{get:function(){var b;return"innerHTML"===a?p.inside.outerHTML:null!=(b=p.inside.innerText)?b:p.inside.textContent},set:function(a){return p.update(a)}})}(e)}catch(q){c=q,this.watchForMutations()}}return a.prototype.renderInside=function(){return this.inside=document.createElement("div"),this.inside.className="odometer-inside",this.el.innerHTML="",this.el.appendChild(this.inside)},a.prototype.watchForMutations=function(){var a,b=this;if(null!=m)try{return null==this.observer&&(this.observer=new m(function(a){var c;return c=b.el.innerText,b.renderInside(),b.render(b.value),b.update(c)})),this.watchMutations=!0,this.startWatchingMutations()}catch(c){a=c}},a.prototype.startWatchingMutations=function(){return this.watchMutations?this.observer.observe(this.el,{childList:!0}):void 0},a.prototype.stopWatchingMutations=function(){var a;return null!=(a=this.observer)?a.disconnect():void 0},a.prototype.cleanValue=function(a){var b;return"string"==typeof a&&(a=a.replace(null!=(b=this.format.radix)?b:".",""),a=a.replace(/[.,]/g,""),a=a.replace("","."),a=parseFloat(a,10)||0),x(a,this.format.precision)},a.prototype.bindTransitionEnd=function(){var a,b,c,d,e,f,g=this;if(!this.transitionEndBound){for(this.transitionEndBound=!0,b=!1,e=p.split(" "),f=[],c=0,d=e.length;d>c;c++)a=e[c],f.push(this.el.addEventListener(a,function(){return b?!0:(b=!0,setTimeout(function(){return g.render(),b=!1,z(g.el,"odometerdone")},0),!0)},!1));return f}},a.prototype.resetFormat=function(){var a,b,d,e,f,g,i,j,k,l;if(a=null!=(k=this.options.format)?k:c,a||(a="d"),f=h.exec(a),!f)throw new Error("Odometer: Unparsable digit format");return l=f.slice(1,5),j=l[0],i=l[1],d=l[2],e=l[3],b=(null!=d?d.length:void 0)||0,g=b+(null!=e?e.length:void 0)||0,this.format={repeating:j,radix:i,precision:g,fractional:b}},a.prototype.render=function(a){var b,c,d,e,f,g,h;for(null==a&&(a=this.value),this.stopWatchingMutations(),this.resetFormat(),this.inside.innerHTML="",f=this.options.theme,b=this.el.className.split(" "),e=[],g=0,h=b.length;h>g;g++)c=b[g],c.length&&((d=/^odometer-theme-(.+)$/.exec(c))?f=d[1]:/^odometer(-|$)/.test(c)||e.push(c));return e.push("odometer"),q||e.push("odometer-no-transitions"),f?e.push("odometer-theme-"+f):e.push("odometer-auto-theme"),this.el.className=e.join(" "),this.ribbons={},this.formatDigits(a),this.startWatchingMutations()},a.prototype.formatDigits=function(a){var b,c,d,e,f,g,h,i,j,l,m,n,o;if(this.digits=[],this.options.formatFunction)for(h=this.options.formatFunction(a),m=h.split("").reverse(),i=0,l=m.length;l>i;i++)g=m[i],g.match(/[0-9]/)?(b=this.renderDigit(),b.querySelector(".odometer-value").innerHTML=g,this.digits.push(b),this.insertDigit(b)):this.addSpacer(g);else{for(f=Math.abs(a),c=Math.max(this.format.fractional,this.getFractionalDigitCount(f)),c&&(f=Math.round(f*Math.pow(10,c))),d=0;f>0;)this.addDigit((f%10).toString(),d>=c),f=Math.floor(f/10),d+=1,d===c&&this.addDigit(".",!0);for(e=null!=(n=this.options.minIntegerLen)?n:k,d=j=o=d-c;e>j;d=j+=1)this.addDigit(0,!0);0>a&&this.addDigit("-",!0)}},a.prototype.update=function(a){var b,c=this;return a=this.cleanValue(a),(b=a-this.value)?(v(this.el,"odometer-animating-up odometer-animating-down odometer-animating"),b>0?s(this.el,"odometer-animating-up"):s(this.el,"odometer-animating-down"),this.stopWatchingMutations(),this.animate(a),this.startWatchingMutations(),setTimeout(function(){return c.el.offsetHeight,s(c.el,"odometer-animating")},0),this.value=a):void 0},a.prototype.renderDigit=function(){return t(d)},a.prototype.insertDigit=function(a,b){return null!=b?this.inside.insertBefore(a,b):this.inside.children.length?this.inside.insertBefore(a,this.inside.children[0]):this.inside.appendChild(a)},a.prototype.addSpacer=function(a,b,c){var d;return d=t(g),d.innerHTML=a,c&&s(d,c),this.insertDigit(d,b)},a.prototype.addDigit=function(a,b){var c,d,e,f;if(null==b&&(b=!0),"-"===a)return this.addSpacer(a,null,"odometer-negation-mark");if("."===a)return this.addSpacer(null!=(f=this.format.radix)?f:".",null,"odometer-radix-mark");if(b)for(e=!1;;){if(!this.format.repeating.length){if(e)throw new Error("Bad odometer format without digits");this.resetFormat(),e=!0}if(c=this.format.repeating[this.format.repeating.length-1],this.format.repeating=this.format.repeating.substring(0,this.format.repeating.length-1),"d"===c)break;this.addSpacer(c)}return d=this.renderDigit(),d.querySelector(".odometer-value").innerHTML=a,this.digits.push(d),this.insertDigit(d)},a.prototype.animate=function(a){return q&&"count"!==this.options.animation?this.animateSlide(a):this.animateCount(a)},a.prototype.animateCount=function(a){var c,d,e,f,g,h=this;if(d=+a-this.value)return f=e=u(),c=this.value,(g=function(){var i,j,k;return u()-f>h.options.duration?(h.value=a,h.render(),void z(h.el,"odometerdone")):(i=u()-e,i>b&&(e=u(),k=i/h.options.duration,j=d*k,c+=j,h.render(Math.round(c))),null!=w?w(g):setTimeout(g,b))})()},a.prototype.getDigitCount=function(){var a,b,c,d,e,f;for(d=1<=arguments.length?G.call(arguments,0):[],a=e=0,f=d.length;f>e;a=++e)c=d[a],d[a]=Math.abs(c);return b=Math.max.apply(Math,d),Math.ceil(Math.log(b+1)/Math.log(10))},a.prototype.getFractionalDigitCount=function(){var a,b,c,d,e,f,g;for(e=1<=arguments.length?G.call(arguments,0):[],b=/^\-?\d*\.(\d*?)0*$/,a=f=0,g=e.length;g>f;a=++f)d=e[a],e[a]=d.toString(),c=b.exec(e[a]),null==c?e[a]=0:e[a]=c[1].length;return Math.max.apply(Math,e)},a.prototype.resetDigits=function(){return this.digits=[],this.ribbons=[],this.inside.innerHTML="",this.resetFormat()},a.prototype.animateSlide=function(a){var b,c,d,f,g,h,i,j,l,m,n,o,p,q,r,t,u,v,w,x,y,z,B,C,D,E,F,G,H;if(u=this.value,j=Math.max(this.format.fractional,this.getFractionalDigitCount(u,a)),j&&(a=Math.round(a*Math.pow(10,j)),u=Math.round(u*Math.pow(10,j))),d=a-u){for(this.bindTransitionEnd(),r=null!=(F=this.options.minIntegerLen)?F:k,f=Math.max(this.getDigitCount(u,a),r+j),g=[],b=0,n=x=0;f>=0?f>x:x>f;n=f>=0?++x:--x){if(v=A(u/Math.pow(10,f-n-1)),i=A(a/Math.pow(10,f-n-1)),h=i-v,Math.abs(h)>this.MAX_VALUES){for(m=[],o=h/(this.MAX_VALUES+this.MAX_VALUES*b*e),c=v;h>0&&i>c||0>h&&c>i;)m.push(Math.round(c)),c+=o;m[m.length-1]!==i&&m.push(i),b++}else m=function(){H=[];for(var a=v;i>=v?i>=a:a>=i;i>=v?a++:a--)H.push(a);return H}.apply(this);for(n=y=0,B=m.length;B>y;n=++y)l=m[n],m[n]=Math.abs(l%10);g.push(m)}for(this.resetDigits(),G=g.reverse(),n=z=0,C=G.length;C>z;n=++z)for(m=G[n],this.digits[n]||this.addDigit(" ",n>=j),null==(w=this.ribbons)[n]&&(w[n]=this.digits[n].querySelector(".odometer-ribbon-inner")),this.ribbons[n].innerHTML="",0>d&&(m=m.reverse()),p=E=0,D=m.length;D>E;p=++E)l=m[p],t=document.createElement("div"),t.className="odometer-value",t.innerHTML=l,this.ribbons[n].appendChild(t),p===m.length-1&&s(t,"odometer-last-value"),0===p&&s(t,"odometer-first-value");return 0>v&&this.addDigit("-"),q=this.inside.querySelector(".odometer-radix-mark"),null!=q&&q.parent.removeChild(q),j?this.addSpacer(this.format.radix,this.digits[j-1],"odometer-radix-mark"):void 0}},a}(),n.options=null!=(E=window.odometerOptions)?E:{},setTimeout(function(){var a,b,c,d,e;if(window.odometerOptions){d=window.odometerOptions,e=[];for(a in d)b=d[a],e.push(null!=(c=n.options)[a]?(c=n.options)[a]:c[a]=b);return e}},0),n.init=function(){var a,b,c,d,e,f;if(null!=document.querySelectorAll){for(b=document.querySelectorAll(n.options.selector||".odometer"),f=[],c=0,d=b.length;d>c;c++)a=b[c],f.push(a.odometer=new n({el:a,value:null!=(e=a.innerText)?e:a.textContent}));return f}},null!=(null!=(F=document.documentElement)?F.doScroll:void 0)&&null!=document.createEventObject?(D=document.onreadystatechange,document.onreadystatechange=function(){return"complete"===document.readyState&&n.options.auto!==!1&&n.init(),null!=D?D.apply(this,arguments):void 0}):document.addEventListener("DOMContentLoaded",function(){return n.options.auto!==!1?n.init():void 0},!1),"function"==typeof define&&define.amd?define(["jquery"],function(){return n}):"undefined"!=typeof exports&&null!==exports?module.exports=n:window.Odometer=n}).call(this); \ No newline at end of file diff --git a/test/leading-zero.html b/test/leading-zero.html new file mode 100644 index 0000000..b2771ca --- /dev/null +++ b/test/leading-zero.html @@ -0,0 +1,68 @@ + + + + + +

+ +

Leading zero as minimal integer length is set to 6

+
+
+
+
+
+
+
+ +

No leading zeros

+
+
+
+
+
+
+
+ + diff --git a/test/trailing-zero.html b/test/trailing-zero.html new file mode 100644 index 0000000..436a694 --- /dev/null +++ b/test/trailing-zero.html @@ -0,0 +1,51 @@ + + + + + +
+
+
+
+
+
+
+
+ +