DEV Community

Cover image for Day 3 - 100 days of Coding - Vs Code Extension
Ganesh Raja
Ganesh Raja

Posted on

Day 3 - 100 days of Coding - Vs Code Extension

So it's day three of the extension building. For the first two days, we built a basic working extension and converted it into class.

Today we are gonna majorly focus on adding pause Feature to our Pomodoro Timer. To achieve this we need to store the timer into our class field. We will store the current state as either Pomodoro or Rest in our class as well. we will store the timer id into the class.

    this.tick = 0;
    this.currentTimerID = null;
    this.currentAction = POMODO_TIMER;
Enter fullscreen mode Exit fullscreen mode

Whenever a new timer is called this will be updated. Whenever new tick happened tick will be updated and Whenever the actions is changed current Action will be updated.


  pausePomodoTimer() {
    if (this.currentTimerID) {
      this.vsCodeStatusBar.text = "Pomodo Timer passed. Click to Resume";
      clearInterval(this.currentTimerID);
      switch (this.currentAction) {
        case POMODO_TIMER:
          this.vsCodeStatusBar.command = "extension.startPomodoTimer";
          break;
        case REST_TIMER:
          // this.vsCodeStatusBar.command = "extension.startPomodoTimer";
          break;
      }
    }
  }
Enter fullscreen mode Exit fullscreen mode

Whenever the user tried to pause (with a new command registered. ) by clicking on status bar item. We will be updating the item command to start (for resume on next click) and clear the current timer. When user tries to resume next, we will take the value and state stored in the constructor and resume it.

You can check the full code in my repo simple-pomodoro-timer

Top comments (0)