/****
App allows you to use well known productivity technique called Pomodoro, where you work without interruption for period of time (25 minutes default) and make 5 minute break. 
App notifies user by playing horn sound at every session or break end.

It's mainly vanilla JS. Only library used is jQuery to control the DOM, and a bit of Bootstrap 3 to style the buttons.

Plan is to rewrite app with AngularJS to shorten the code with angular models and binding.
****/

//Widen this JS window for better readability. CodePen wraps lines. 
$(document).ready(function() {
  
  //Set initial values
	var setSessionMinutes = 25,
		setBreakMinutes = 5,
		sessionMinutes = setSessionMinutes,
		breakMinutes = setBreakMinutes,
		counterSeconds = -1,
		countTimeout,
		runState = false;
  
  //change values by buttons. First thing to rewrite in Angular
	$('#minusbreak').click(function() {
		$('#break').html(setBreakMinutes > 0 ? --setBreakMinutes : 0);
		breakMinutes = setBreakMinutes;
	});
  
	$('#plusbreak').click(function() {
		$('#break').html(++setBreakMinutes);
		breakMinutes = setBreakMinutes;
	});
  
	$('#minusSession').click(function() {
		$('#session').html(setSessionMinutes > 0 ? --setSessionMinutes : 0);
		$('#time').html(formatTime(setSessionMinutes, 0));
		sessionMinutes = setSessionMinutes;
	});
  
	$('#plusSession').click(function() {
		$('#session').html(++setSessionMinutes);
		$('#time').html(formatTime(setSessionMinutes, 0));
		sessionMinutes = setSessionMinutes;
	});
  
  // If user changes session/break lengths, update the DOM
	function setClockValues() {
		$('#break').html(setBreakMinutes);
		$('#session').html(setSessionMinutes);
		$('#time').html(formatTime(setSessionMinutes, 0));
		sessionMinutes = setSessionMinutes;
		breakMinutes = setBreakMinutes;
		counterSeconds = -1;
	};
  
	setClockValues();
  
  //Display minutes, seconds as regular clock would eg. 09:09 instead of 9:9
	function formatTime(minutes, seconds) {
		minutes = minutes >= 10 ? minutes : '0' + minutes;
		seconds = seconds >= 10 ? seconds : '0' + seconds;
		return minutes + ':' + seconds;
	}	
  
  // Count session time, decrement before variable to properly display time
	function countDown() {
		if (counterSeconds < 0 && sessionMinutes >= 0) {
			--sessionMinutes;
			counterSeconds = 59;
		}
		$('#time').html(formatTime(sessionMinutes, counterSeconds));
		--counterSeconds;
		if (counterSeconds >= 0 && sessionMinutes >= 0)
			countTimeout = setTimeout(countDown, 1000);
		else {
			$('#finish').get(0).play();
			setTimeout(countDownBreak, 1000);
		}
	}
  
  // Count break time, decrement before variable to properly display time 
	function countDownBreak() {
		if (counterSeconds < 0 && breakMinutes >= 0) {
			--breakMinutes;
			counterSeconds = 59;
		}
    
		$('#time').html(formatTime(breakMinutes, counterSeconds));
		--counterSeconds;
		if (counterSeconds >= 0 && breakMinutes >= 0)
			countTimeout = setTimeout(countDownBreak, 1000);
		else {
			stopCountDown();
			$('#status').html('start');
			runState = false;
			$('#finish').get(0).play();
		}
	}
    
	function stopCountDown() {
		clearTimeout(countTimeout);
		setClockValues();
	}

	// start/stop and reset timer, update the DOM
	$('#status').click(function() {
		switch (runState) {
			case false:
				$('#status').html('reset');
				countDown();
				runState = true;
				break;
			case true:
				$('#status').html('start');
				stopCountDown();
				runState = false;
				break;
		}
	});

});