Problem with my simple timer

Ionic Framework ionic-v3
1

Hello guys! I have a big problem. My user can set a time in minutes in the settings and my timer will countdown from that time. However when i load the page, the timer display shows: NaN:NaN : NaN

If i start the timer and reset it, i get the correct value, but seems like it is undefinied on pageload. However i can clearly see in the console log, that the value is there on ionviewwillenter

Can you check pls:

export class IdomeroPage {
timeInSeconds: number;

time: number;
remainingTime: number;
runTimer: boolean;
hasStarted: boolean;
hasFinished: boolean;
displayTime: string;
userido:number;
constructor(public navCtrl: NavController, public navParams: NavParams,private vibration: Vibration,private storage: Storage) {
}

ionViewDidEnter() {
}

ionViewWillEnter(){
this.storage.get(‘idomerouserido’).then((val)=>{
if(val!=null){
this.userido=parseInt(val);
console.log(“if ág eleje”,this.userido);
} else{
console.log(“else ág”)
this.userido=10;
}});
}

idomeroBeallitasok(){
this.navCtrl.push(IdomerobeallitasokPage);
}

ngOnInit() {
this.initTimer();
}

initTimer() {
if (!this.timeInSeconds) { this.timeInSeconds = this.userido*60; }

this.time = this.timeInSeconds;
 this.runTimer = false;
 this.hasStarted = false;
 this.hasFinished = false;
 this.remainingTime = this.timeInSeconds;

 this.displayTime = this.getSecondsAsDigitalClock(this.remainingTime);

}

startTimer() {
this.runTimer = true;
this.hasStarted = true;
this.timerTick();
}

pauseTimer() {
this.runTimer = false;
}

resumeTimer() {
this.startTimer();
}

timerTick() {
setTimeout(() => {

  if (!this.runTimer) { return; }
  this.remainingTime--;
  this.displayTime = this.getSecondsAsDigitalClock(this.remainingTime);
  if (this.remainingTime > 0) {
    this.timerTick();
  }
  else {
    this.hasFinished = true;
    this.vibration.vibrate(1000);
    this.vibration.vibrate(1000);
    
  }
}, 1000);

}

getSecondsAsDigitalClock(inputSeconds: number) {
var sec_num = parseInt(inputSeconds.toString(), 10);
var hours = Math.floor(sec_num / 3600);
var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
var seconds = sec_num - (hours * 3600) - (minutes * 60);
var hoursString = ‘’;
var minutesString = ‘’;
var secondsString = ‘’;
hoursString = (hours < 10) ? “0” + hours : hours.toString();
minutesString = (minutes < 10) ? “0” + minutes : minutes.toString();
secondsString = (seconds < 10) ? “0” + seconds : seconds.toString();
return hoursString + ‘:’ + minutesString + ‘:’ + secondsString;
}
}

2

From the logs, i can see that the inittimer() is running sooner than the ionviewwillenter()

Anyone can explain why this is happening?

3

Pls make sure that your code does not contain any hungarian word also.:slight_smile:
IdomeroPage :slight_smile:

It sucks, but typescript does not have any default value on number, you should set it to 0 in the constructor at least. It’s a guess, but i had problem with it previously. (got NAN values also)

4

Because the page is initialized first, then set up, then ready to enter. You start inittimer when the page is initialized.

5

holy*, i always mix those. Ty solved