speed : 0.2,
startnumber : 0,
+ currentNumber : 0,
+ decimal : 0,
digits : false, // array...
- ulWidth : 0,
+ ulWidth : 0,
+ cls : '',
getAutoCreate : function(){
return {
tag: 'ul',
- cls: 'flipcounter',
+ cls: 'flipcounter ' + this.cls,
};
},
initEvents : function ()
{
- var startNum = ""+ this.startnumber;
+ var startNum = (1.0*this.startnumber).toFixed(this.decimal);
for (i=startNum.length-1; i>=0; i=i-1)
{
+ if (startNum[i] == '.') {
+ this.addSeparator('.');
+ continue;
+ }
this.addDigit(startNum[i]);
}
+ this.currentNumber = this.startnumber;
},
addDigit : function (num)
{
// Add separator after every 3rd digit
- if (this.digits.length % 3 == 0 && this.digits.length != 0)
+ /*if (this.digits.length % 3 == 0 && this.digits.length != 0)
{
- this.addSeparator();
+ this.addSeparator(',');
}
-
-
-
+ */
+
var digit = new Roo.ux.FlipCounter.Digit({ manager : this, currentNumber : num });
digit.manager = this;
this.digits.push(digit);
- digit.render(this.el);
+ digit.render(this.el, 0);
// Update width
this.ulWidth = this.ulWidth + digit.el.getWidth(true);
{
var digit = this.digits.splice(this.digits.length-1, 1)[0];
- this.ulWidth = this.ulWidth - digit.el.outerWidth(true);
- digit.li.remove();
+ this.ulWidth = this.ulWidth - digit.el.getWidth(true);
+ digit.el.remove();
// Remove separators
- if (this.digits.length % 3 == 0)
- {
- var comma = this.el.select('li.comma:first-child');
- this.ulWidth = this.ulWidth - comma.getWidth(true);
- comma.remove();
- }
+ // if (this.digits.length % 3 == 0)
+ // {
+ // var comma = this.el.select('li.comma:first-child');
+ // this.ulWidth = this.ulWidth - comma.getWidth(true);
+ // comma.remove();
+ //}
// Update width to current
this.el.set( { 'min-width' : this.ulWidth});
},
- addSeparator : function (num)
+ addSeparator : function (str)
{
- var comma = this.el.insertHtml('afterBegin','<li class="comma">,</li>',true);
+ var comma = this.el.insertHtml('afterBegin','<li class="comma">'+str+'</li>',true);
// Update width
updateTo : function (num)
{
- var numStr = parseInt(num).toString();
+ var numStr = (1.0*num).toFixed(this.decimal);
+ this.currentNumber = num;
+
+ var dl = this.digits.length + (this.decimal > 0 ? 1 : 0);
// Change the number of digits displayed if needed
if (numStr.length != this.digits.length)
{
var diff = numStr.length - this.digits.length;
+ Roo.log("DIFF LEN=" +diff);
if (diff > 0)
{
for (i=0; i<diff; i=i+1) {
// Change all digit values
for (i=0; i<numStr.length; i=i+1)
{
+ if (numStr[numStr.length - 1 - i] == '.') {
+ continue;
+ }
+ Roo.log("UPDATE DIGIT=" + i + " to " + numStr[numStr.length - 1 - i]);
this.digits[i].flipTo(numStr[numStr.length - 1 - i]);
}
}
manager : null, // the flipcounter...
currentNumber : 0,
+
+
+ currentNum : 0,
+ nextNum : 0,
targetNum : 0,
topFrontDiv : null,
bottomNumFront : null,
+
+
getAutoCreate : function(){
return {
- this.topFrontDiv = this.el.select('.flipper_top_front',true);
- this.bottomFrontDiv = this.el.select('.flipper_bottom_front',true);
- this.topNumBack = this.el.select('.flipper_top_back span',true);
- this.topNumFront = this.el.select('.flipper_top_front span',true);
- this.bottomNumBack = this.el.select('.flipper_bottom_back span',true);
- this.bottomNumFront = this.el.select('.flipper_bottom_front span',true);
+ this.topFrontDiv = this.el.select('.flipper_top_front',true).first();
+ this.bottomFrontDiv = this.el.select('.flipper_bottom_front',true).first();
+ this.topNumBack = this.el.select('.flipper_top_back span',true).first();
+ this.topNumFront = this.el.select('.flipper_top_front span',true).first();
+ this.bottomNumBack = this.el.select('.flipper_bottom_back span',true).first();
+ this.bottomNumFront = this.el.select('.flipper_bottom_front span',true).first();
this.targetNum = this.currentNumber;
this.currentNum = this.currentNumber;
// Animate top flipper
var digit = this;
- digit.topNumBack.html(digit.nextNum);
+ digit.topNumBack.dom.innerHTML = digit.nextNum;
(function() {
digit.topFrontDiv.animate(
{
scaleY: {from: 0, to : 1},
},
- this.manager.options.speed * 0.5, //duration
+ this.manager.speed * 0.5, //duration
function() {
digit.currentNum = digit.nextNum;
digit.topNumFront.dom.innerHTML = digit.currentNum;