Last active
August 29, 2015 14:03
-
-
Save aike/0407b644441a3332ec96 to your computer and use it in GitHub Desktop.
Pomodoro technique timer using Yo notification
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<!-- | |
Yomodoro Timer | |
This program is licensed under the MIT License. | |
Copyright 2014, aike (Yo: AIKE1000) | |
--> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Yomodoro Timer</title> | |
<script type="text/javascript"> | |
// your api key | |
// https://medium.com/@YoAppStatus/yo-developers-api-e7f2f0ec5c3c | |
// http://yoapi.justyo.co/ | |
var APIkey = <<YOUR API KEY>>; | |
// your yo id | |
var sendTo = <<YOUR YO ID>>; | |
var button; | |
var disp; | |
var rev = location.search === '?countdown' ? true : false; | |
var sec = 0; | |
var id = null; | |
var workterm = 25 * 60; | |
var breakterm = 5 * 60; | |
var currentterm = workterm; | |
function yo() { | |
var xhr = new XMLHttpRequest(); | |
xhr.open('POST', 'http://api.justyo.co/yo/'); | |
xhr.setRequestHeader('Content-Type' , 'application/x-www-form-urlencoded'); | |
xhr.send('api_token=' + APIkey + '&username=' + sendTo); | |
} | |
function formatTime(seconds) { | |
seconds = rev ? currentterm - seconds : seconds; | |
var m = Math.floor(seconds / 60); | |
var s = seconds - (m * 60); | |
m = '0' + String(m); | |
s = '0' + String(s); | |
m = m.substr(m.length - 2, 2); | |
s = s.substr(s.length - 2, 2); | |
return m + ':' + s; | |
} | |
function starttimer() { | |
button = document.getElementById('start'); | |
disp = document.getElementById('disp'); | |
document.body.style.backgroundColor = '#fbb'; | |
if (id) { | |
clearInterval(id); | |
id = null; | |
} | |
if (button.innerText === 'STOP') { | |
button.innerText = 'START'; | |
document.body.style.backgroundColor = '#fff'; | |
return; | |
} | |
button.innerText = 'STOP'; | |
sec = 0; | |
disp.innerText = document.title = formatTime(sec); | |
id = setInterval( | |
function() { | |
sec++; | |
disp.innerHTML = document.title = formatTime(sec); | |
if (sec === currentterm) { | |
sec = -1; | |
if (currentterm === workterm) { | |
currentterm = breakterm; | |
document.body.style.backgroundColor = '#bbf'; | |
} else { | |
currentterm = workterm; | |
document.body.style.backgroundColor = '#fbb'; | |
} | |
yo(); | |
} | |
}, 1000); | |
} | |
</script> | |
</head> | |
<body> | |
<div id="disp" style="font-size:250px;text-align:center;">00:00</div> | |
<div style="position:absolute;left:10px;top:10px;"> | |
<button id="start" onclick="starttimer();" style="width:150px;font-size:30px;">START</button> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment