Search code examples
javascripttitaniumappceleratorcountdown

Create countdown in rowview (Titanium)


I am a beginner in Appcelerator Titanium APP development. From the inspiration of this link I am trying to create a countdown timer to be work in TableRowView as each row have its own time set. And I customize this class to show Hours with minutes and seconds.

I created the following code in each TableRowView to execute countdown in list on the fly.

Code 1

my_timer[timer_index] = new countDown(parseInt(timer_index), parseInt(15), parseInt(50),
function() {
    remainingTime.text = ''+my_timer[timer_index].time.h + " : " + my_timer[timer_index].time.m + " : " + my_timer              [timer_index].time.s;
}, function() {
    //alert("The time is up!");
    }
);

my_timer[timer_index++].start();

my_time used to push all the instances of countdown timer for each row.

The data is coming from XHR, therefore I created an array literal to hold all instances like in the snippet of code.

Problem: when I try to run my app with this code, it shows me an exception saying something like "time.h is undefined". However, I defined time.h as you can see in code.

Furthermore, I can use this class for multiple countdowns by using single array

for example:

my_timer[0] = new countDown(2,5,5,function(){
    somelabel1.text = my_timer[0].time.h+":"+my_timer[0].time.m+":"+my_timer[0].time.s;
})
my_timer[1] = new countDown(2,5,5,function(){
    somelabel1.text = my_timer[1].time.h+":"+my_timer[1].time.m+":"+my_timer[1].time.s;
})

the above code works perfectly and it has no error. But if I try to use this class in loop and pass index number rather than hard-coded values like in Code 1, it shows exception as I stated above.

Any help will be highly appreciable.

Thank you in advance.

Desire screen to create with countdown timer in TableRowView


Solution

  • I just solved this problem by customizing CountDown Class

    var countDown = function(h, m, s, _instance_index, fn_tick, fn_end) {
            return {
                total_sec : h * 60 * 60 + m * 60 + s,
                timer : this.timer,
                instance_index : _instance_index,
                set : function(h, m, s) {
                    this.total_sec = parseInt(heart) * 60 * 60 + parseInt(e) * 60 + parseInt(s);
                    this.time = {
                        h : h,
                        m : m,
                        s : s
                    };
                    return this;
                },
                start : function() {
                    var self = this;
                    this.timer = setInterval(function() {
                        ///alert('running');
                        if (self.total_sec) {
                            self.total_sec--;
                            var hour = parseInt(self.total_sec / (60 * 60));
                            var min = (self.total_sec - (parseInt(hour * (60 * 60))) - (self.total_sec % 60)) / 60;
    
                            self.time = {
                                h : parseInt(self.total_sec / (60 * 60)),
                                m : parseInt(min),
                                s : (self.total_sec % 60)
                            };
                            fn_tick(self.time.h + ":" + self.time.m + ":" + self.time.s, self.instance_index);
                        } else {
                            self.stop();
                            fn_end();
                        }
                    }, 1000);
                    return this;
                },
                stop : function() {
                    clearInterval(this.timer);
                    this.time = {
                        h : 0,
                        m : 0,
                        s : 0
                    };
                    this.total_sec = 0;
                    return this;
                }
            };
        };
    

    And call this class by using the following code:

     my_timer[items_json.Record.NEW[i].ASSIGN_QUEST_ID] = new countDown(parseInt(n[0]), parseInt(n[1]), parseInt(n[2]), items_json.Record.NEW[i].ASSIGN_QUEST_ID, function(curr_time, instance_index) {
                                            questTime[instance_index].text = 'TIME LEFT ' + curr_time;
                
                                        }, function() {
                                            //alert("The time is up!");
                                        });
                                        my_timer[items_json.Record.NEW[i].ASSIGN_QUEST_ID].start();