Codebar fix for the timer

pomodoro-codebar.js

// Pomodoro Module
var PomodoroApp = (function() {

   var pomodoro = {
      countDown: false,
      minutesLeft: false,
      secondsLeft: false,
      endFunction: false
   };

   // Cache DOM Elements
   var domElements = {

      watch: {

         output: document.querySelector('.output'),
         runSessionBtn: document.querySelector('button.play'),
         pauseSessionBtn: document.querySelector('button.pause'),
         openSettingsBtn: document.querySelector('button.open-settings')

      },

      settingsForm : {

         pomodoroSessionTime: document.getElementById('pomodoroSessionTime'),
         pomodoroBgColor: document.getElementById('pomodoroBgColor'),
         pomodoroTextColor: document.getElementById('pomodoroTextColor'),

         shortBreakSessionTime: document.getElementById('shortBreakSessionTime'),
         shortBreakBgColor: document.getElementById('shortBreakBgColor'),
         shortBreakTextColor: document.getElementById('shortBreakTextColor'),

         longBreakSessionTime: document.getElementById('longBreakSessionTime'),
         longBreakBgColor: document.getElementById('longBreakBgColor'),
         longBreakTextColor: document.getElementById('longBreakTextColor'),

         modifyConfigBtn: document.getElementById('modifyConfigBtn'),
         resetConfigBtn: document.getElementById('resetConfigBtn')

      }

   }

   // Default Settings can be changed later by the user
   var config =  {

      numberSessionsDone: 0,
      sessionSeconds: "00",
      running: false,
      paused: false,

      workSettings: {
         sessionTime: 25,
         bgColor: 'firebrick',
         textColor: 'wheat'
      },

      shortBreakSettings: {
         sessionTime: 5,
         bgColor: 'dodgerblue',
         textColor: 'gold'
      },

      longBreakSettings: {

         sessionTime: 15,
         bgColor: 'mediumseagreen',
         textColor: 'orange'
      }
   };


   pomodoro.startInterval = function() {

      pomodoro.countDown = setInterval(function() {

         if ( pomodoro.secondsLeft === false ) {
            pomodoro.secondsLeft = 59;
         }

         if ( pomodoro.secondsLeft === 0 ) {

            pomodoro.secondsLeft = 59;

            // when the timer runs out, ie hits 0
            if ( pomodoro.minutesLeft === 0 ) {

               clearInterval(pomodoro.countDown); // stop the timer
               if ( typeof pomodoro.endFunction === 'function' ) {
                  pomodoro.endFunction();
               }// Run the end function

            } else {
               pomodoro.minutesLeft--; // decrease the timer by 1 every minute
            }
         }

         pomodoro.renderOutput();

         pomodoro.secondsLeft--;

      }, 4);
   }

   // This function runs the timer, you give it an initial value and a callback function to run after the timer runs out.
   pomodoro.runTimer = function(sessionTime, endFunction) {

      config.running = true; // set running to true

      if (endFunction) {
         pomodoro.endFunction = endFunction;
      }

      if ( config.paused == true ) {
         pomodoro.startInterval();
      }

      else {
         sessionTime--; // Decrement sessionTime (Temporary fix)

         pomodoro.minutesLeft = sessionTime; // Store the time left on the timer

         // If the play button is pressed
         if ( config.running == true ) {

            pomodoro.startInterval();

         }

      }
   }

   // This function pauses the timer when it's running
   pomodoro.pauseTimer = function() {


      if ( config.running == true ) {


         clearInterval(pomodoro.countDown);
         config.running = false;
         config.paused = true;
         console.log(config.running);
      }

   }

   // Start pomodoro
   pomodoro.startPomodoro = function() {
      pomodoro.changeColors("#d56073","#F8F1FF");
      pomodoro.runTimer(config.workSettings.sessionTime, pomodoro.finishPomodoro);
      console.log(config.running);
   }

   // Finish pomodoro
   pomodoro.finishPomodoro = function() {

      config.numberSessionsDone++; // Increases the number of sessions done
      console.log(config.numberSessionsDone);

      if ( config.numberSessionsDone <= 3 ) {
         console.log("start short break");
         pomodoro.startShortBreak(); // if it's less than 3, start a 5 minutes short break

      } else if ( config.numberSessionsDone === 4 ) {

         pomodoro.startLongBreak(); // after the 4th pomodoro session, start a longbreak
         console.log("start long break");
         config.numberSessionsDone = 0;
      }
   }

   // Start a 5 minutes short break
   pomodoro.startShortBreak = function() {

      // Change colors
      pomodoro.changeColors("mediumseagreen", "dodgerblue");

      pomodoro.runTimer(config.shortBreakSettings.sessionTime, pomodoro.finishShortBreak);

   }

   // Finish Short Break
   pomodoro.finishShortBreak = function() {
      pomodoro.startPomodoro();
   }

   // Start Long Break
   pomodoro.startLongBreak = function() {
      // Change colors
      pomodoro.changeColors("#7a4579", "#F8F1FF");

      pomodoro.runTimer(config.longBreakSettings.sessionTime, pomodoro.finishLongBreak);
   }

   // Finish Long Break
   pomodoro.finishLongBreak = function() {

   }

   // Change Colors
   pomodoro.changeColors = function (bgColor, textColor) {
      document.body.style.backgroundColor = bgColor;
      document.body.style.color = textColor;
   }

   // Renders the front end
   pomodoro.renderOutput = function() {

      var secondsToRender = pomodoro.secondsLeft;
      var minutesToRender = pomodoro.minutesLeft;

      if ( secondsToRender < 10 ) {
         secondsToRender = "0" + secondsToRender;
      }

      domElements.watch.output.innerHTML = minutesToRender + ":" + secondsToRender;


   }

   // Event Listeners
   domElements.watch.runSessionBtn.addEventListener("click", pomodoro.startPomodoro, false);

   domElements.watch.pauseSessionBtn.addEventListener("click", pomodoro.pauseTimer, false);

   return {
      // return the whole object under the 'watch' alias
      watch: pomodoro

   };

}());