tacke758 · December 14, 2015 04:19
diff --git a/pomodoro.html b/pomodoro.html
 <html>
 
 <head>
 <title> Pomodoro Timer </title>
 <script type="text/javascript">
 <!--
 
 var minTextElem;
 var secTextElem;

 var pomodoroNameElem;
 
 var pomodoro_list = [];
 var current_pomodoro = null;
 
 // internal state
 var mode = "Pomodoro"; // mode = Pomodoro or Rest
 
 
 /* onLoad */
 
 var load = function () {
  minTextElem = document.getElementById('min');
  secTextElem = document.getElementById('sec');
  pomodoroNameElem = document.getElementById('name');
 }
 
 
 /* Model */
 
 var Pomodoro = function (name) {
  this.name = name;
  this.start_time = null;
  this.finish_time = null;
 }

 var Rest = function () {
  this.start_time = null;
  this.finish_time = null;
 }
 

 /* Event */
 
 var start_pomodoro = function () {
  if (current_pomodoro) {
    var name = prompt("Input new pomodoro name: ", current_pomodoro.name);
  } else {
    var name = prompt("Input new pomodoro name: ");
  }

  // prompt cancel button pushed
  if (name == null) {
 	  return ;
  }
  var pomodoro = new Pomodoro(name);
  pomodoroNameElem.innerText = name;
  pomodoro.start_time = new Date();
  pomodoro_list.push(pomodoro);
  current_pomodoro = pomodoro;
  timer.start(25, 0);
 }

 var start_rest = function () {
  var rest = new Rest();
  pomodoroNameElem.innerText = "Rest";
  rest.start_time = new Date();
  current_pomodoro = rest;
  timer.start(5, 0);
 }

 var start_button_clicked = function () {
  if (mode == "Pomodoro") {
    start_pomodoro();
  } else if (mode == "Rest") {
    start_rest();
  }
 }

 var suspend_button_clicked = function () {
  timer.suspend();
 }
 
 var resume_button_clicked = function () {
  timer.resume();
 }
 
 
 /* Timer */
 
 var Timer = function () {
 
  var self = this;
 
  var min;
  var sec;
 
  var interval_id = null;
  this.when_finish = function () {}

  var next_tick = function() {
    if (sec == 0) {
      min --;
      sec = 59;
    } else {
      sec --;
    }
   
    minTextElem.innerText = "" + min;
    secTextElem.innerText = "" + sec;
   
    if (min == 0 && sec == 0) {
      self.when_finish();
      clearInterval(interval_id);
      interval_id = null;
    }
  }
 
  this.start = function (min_, sec_) {

    min = min_;
    sec = sec_;

    if (!interval_id) {
      clearInterval(interval_id);
      interval_id = null;
    }
    interval_id = setInterval(next_tick, 1000);
  }
 
  this.suspend = function () {
    if (interval_id != null) {
      clearInterval(interval_id);
      interval_id = null;
    }
  }
 
  this.resume = function () {
    if (interval_id == null) {
      interval_id = setInterval(next_tick, 1000);
    }
  }
 }
 
 var hhmm = function(a_date) {
 var hour = a_date.getHours();
 var minute = a_date.getMinutes();

 if (minute < 10) {
  return hour + ":" + "0" + minute;
 } else {
  return hour + ":" + minute;
 }
 }

 var toggle_state = function () {
  if (mode == "Pomodoro") {
    mode = "Rest";
  } else if (mode == "Rest") {
    mode = "Pomodoro";
  }
 }
 
 var timer = new Timer();
 timer.when_finish = function () {
  current_pomodoro.finish_time = new Date();

  if (mode == "Pomodoro") {
    alert("Pomodoro <" + current_pomodoro.name
          + " (" + hhmm(current_pomodoro.start_time) + "~" + hhmm(current_pomodoro.finish_time) + ")"
          + " > finished!");
  } else if (mode == "Rest") {
    alert("Rest (" + hhmm(current_pomodoro.start_time) + "~" + hhmm(current_pomodoro.finish_time)
          + ") finished!");
  }

  toggle_state();
 }

 //-->
 </script>
 </head>
 
  <body onLoad="load();">
    <div id="min" style="font-size: 160; float: left;">25</div>
    <div style="font-size: 160; float: left;">:</div>
    <div id="sec" style="font-size: 160; float: left;">00</div>
  </body>
   
  <div style="clear: both; "></div>
  <div id="name" style="font-size: 80;"></div>
  <div>
    <button onClick="start_button_clicked();">START!</button>
    <button onClick="suspend_button_clicked();">SUSPEND</button>
    <button onClick="resume_button_clicked();">RESUME</button>
  </div>
 </html>
	<html>

	<head>
	<title> Pomodoro Timer </title>
	<script type="text/javascript">
	<!--

	var minTextElem;
	var secTextElem;

	var pomodoroNameElem;

	var pomodoro_list = [];
	var current_pomodoro = null;

	// internal state
	var mode = "Pomodoro"; // mode = Pomodoro or Rest


	/* onLoad */

	var load = function () {
	minTextElem = document.getElementById('min');
	secTextElem = document.getElementById('sec');
	pomodoroNameElem = document.getElementById('name');
	}


	/* Model */

	var Pomodoro = function (name) {
	this.name = name;
	this.start_time = null;
	this.finish_time = null;
	}

	var Rest = function () {
	this.start_time = null;
	this.finish_time = null;
	}


	/* Event */

	var start_pomodoro = function () {
	if (current_pomodoro) {
	var name = prompt("Input new pomodoro name: ", current_pomodoro.name);
	} else {
	var name = prompt("Input new pomodoro name: ");
	}

	// prompt cancel button pushed
	if (name == null) {
	return ;
	}
	var pomodoro = new Pomodoro(name);
	pomodoroNameElem.innerText = name;
	pomodoro.start_time = new Date();
	pomodoro_list.push(pomodoro);
	current_pomodoro = pomodoro;
	timer.start(25, 0);
	}

	var start_rest = function () {
	var rest = new Rest();
	pomodoroNameElem.innerText = "Rest";
	rest.start_time = new Date();
	current_pomodoro = rest;
	timer.start(5, 0);
	}

	var start_button_clicked = function () {
	if (mode == "Pomodoro") {
	start_pomodoro();
	} else if (mode == "Rest") {
	start_rest();
	}
	}

	var suspend_button_clicked = function () {
	timer.suspend();
	}

	var resume_button_clicked = function () {
	timer.resume();
	}


	/* Timer */

	var Timer = function () {

	var self = this;

	var min;
	var sec;

	var interval_id = null;
	this.when_finish = function () {}

	var next_tick = function() {
	if (sec == 0) {
	min --;
	sec = 59;
	} else {
	sec --;
	}

	minTextElem.innerText = "" + min;
	secTextElem.innerText = "" + sec;

	if (min == 0 && sec == 0) {
	self.when_finish();
	clearInterval(interval_id);
	interval_id = null;
	}
	}

	this.start = function (min_, sec_) {

	min = min_;
	sec = sec_;

	if (!interval_id) {
	clearInterval(interval_id);
	interval_id = null;
	}
	interval_id = setInterval(next_tick, 1000);
	}

	this.suspend = function () {
	if (interval_id != null) {
	clearInterval(interval_id);
	interval_id = null;
	}
	}

	this.resume = function () {
	if (interval_id == null) {
	interval_id = setInterval(next_tick, 1000);
	}
	}
	}

	var hhmm = function(a_date) {
	var hour = a_date.getHours();
	var minute = a_date.getMinutes();

	if (minute < 10) {
	return hour + ":" + "0" + minute;
	} else {
	return hour + ":" + minute;
	}
	}

	var toggle_state = function () {
	if (mode == "Pomodoro") {
	mode = "Rest";
	} else if (mode == "Rest") {
	mode = "Pomodoro";
	}
	}

	var timer = new Timer();
	timer.when_finish = function () {
	current_pomodoro.finish_time = new Date();

	if (mode == "Pomodoro") {
	alert("Pomodoro <" + current_pomodoro.name
	+ " (" + hhmm(current_pomodoro.start_time) + "~" + hhmm(current_pomodoro.finish_time) + ")"
	+ " > finished!");
	} else if (mode == "Rest") {
	alert("Rest (" + hhmm(current_pomodoro.start_time) + "~" + hhmm(current_pomodoro.finish_time)
	+ ") finished!");
	}

	toggle_state();
	}

	//-->
	</script>
	</head>

	<body onLoad="load();">
	<div id="min" style="font-size: 160; float: left;">25</div>
	<div style="font-size: 160; float: left;">:</div>
	<div id="sec" style="font-size: 160; float: left;">00</div>
	</body>

	<div style="clear: both; "></div>
	<div id="name" style="font-size: 80;"></div>
	<div>
	<button onClick="start_button_clicked();">START!</button>
	<button onClick="suspend_button_clicked();">SUSPEND</button>
	<button onClick="resume_button_clicked();">RESUME</button>
	</div>
	</html>