Roo.ux.FlipCounter = function(options)
{
- Roo.ux.FlipCounter.superclass.constructor.call(this, config);
+ Roo.ux.FlipCounter.superclass.constructor.call(this, options);
//Roo.apply(this, options);
//this.el = $(element);
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)
Roo.ux.FlipCounter.Digit = function(options)
{
//Roo.apply(this, options);
- Roo.ux.FlipCounter.Digit.superclass.constructor.call(this, config);
+ Roo.ux.FlipCounter.Digit.superclass.constructor.call(this, options);
this.currentNumber = parseInt(this.currentNumber);
manager : null, // the flipcounter...
currentNumber : 0,
+
+
+ currentNum : 0,
+ nextNum : 0,
targetNum : 0,
topFrontDiv : null,
bottomNumFront : null,
+
+
getAutoCreate : function(){
return {
{
cls : 'flipper_top flipper_top2 flipper_top_back',
cn : [
- { tag: 'span', html: num },
+ { tag: 'span', html: this.currentNumber },
{ cls : 'rings' }
]
{
cls : 'flipper_top flipper_top_front',
cn : [
- { tag: 'span', html: num },
+ { tag: 'span', html: this.currentNumber },
{ cls : 'rings' }
]
{
cls : 'flipper_bottom flipper_bottom1 flipper_bottom_back',
cn : [
- { tag: 'span', html: num },
+ { tag: 'span', html: this.currentNumber },
{ cls : 'rings' }
]
},
{
cls : 'flipper_bottom flipper_bottom_front',
cn : [
- { tag: 'span', html: num },
+ { tag: 'span', html: this.currentNumber },
{ cls : 'rings' }
]
},
- 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 = currentNumber;
- this.currentNum = currentNumber;
- this.nextNum = currentNumber;
+ this.targetNum = this.currentNumber;
+ this.currentNum = this.currentNumber;
+ this.nextNum = this.currentNumber;
this.currentlyAnimating = false;
},
// 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;