A Pen by Timothy Zeb Girouard on CodePen.
Created
September 23, 2015 02:28
-
-
Save ZebGirouard/37a50f070e35f691aad1 to your computer and use it in GitHub Desktop.
WQGbRr
This file contains hidden or 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
<body style='background-color: black'> | |
<div class='text-center'> | |
<h1>Pomodoro FTW!</h1> | |
<div id = 'timer-entry'> | |
<h2>Work Time</h2> | |
<input type="text" id='#workEntry' placeholder='25'></input> | |
<h2>Break Time</h2> | |
<input type="text" id='#breakEntry' placeholder='5'></input> | |
</br> | |
<button class='btn btn-primary' id='start-button'>Start</button> | |
</div> | |
<div id="timer"> | |
<h2 id='timerHeader'</h2> | |
<h1 id='timerClock'></h1> | |
</div> | |
</div> | |
<audio id="startBreak"> | |
<source src="http://cwealthcraft.com/Computer_Magic.wav"></source> | |
Update your browser to enjoy HTML5 audio! | |
</audio> | |
<audio id="startWork"> | |
<source src="http://cwealthcraft.com/Ting.wav"></source> | |
Update your browser to enjoy HTML5 audio! | |
</audio> | |
</body> |
This file contains hidden or 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
$(document).ready(function() { | |
var startSound = {}; | |
startSound.Work = $('#startWork')[0]; | |
startSound.Break = $('#startBreak')[0]; | |
function myTimer(timerTotal, timeAtStart) { | |
var currentTime = new Date() / 1000; | |
var timeRemaining = Math.ceil((timeAtStart - currentTime) + timerTotal); | |
var seconds = timeRemaining % 60; | |
var secondsRemaining = (seconds < 10) ? ("0" + seconds) : seconds; | |
var minutesRemaining = Math.floor(timeRemaining / 60); | |
$("#timerClock").text(minutesRemaining+" : " + secondsRemaining); | |
} | |
var startTimer = function(breakWork,times) { | |
timePeriod = times[breakWork]; | |
$("#timerHeader").text(breakWork + " Time"); | |
$('#timer-entry').hide(); | |
$('#timer').show(); | |
startSound[breakWork].play(); | |
var timeAtStart = new Date() / 1000; | |
var count = 1; | |
var i = setInterval(function() { | |
myTimer(timePeriod, timeAtStart); | |
if(count >= timePeriod) { | |
clearInterval(i); | |
//Start Break after Work Timer Ends | |
if(breakWork === "Work") { | |
startTimer("Break", times); | |
} | |
else { | |
startSound.Work.play(); | |
$('#timer').hide(); | |
$('#timer-entry').show(); | |
} | |
} | |
count++; | |
}, 1000); | |
} | |
$('#start-button').click(function() { | |
var times = {}; | |
times.Work = (document.getElementById('#workEntry').value || 25) * 60; | |
times.Break = (document.getElementById('#breakEntry').value || 5) * 60; | |
startTimer("Work", times); | |
}); | |
}); | |
This file contains hidden or 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
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> |
This file contains hidden or 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
.text-center { | |
font-family: 'Lucida Bright', Georgia, serif; | |
color: rgb(200,200,200); | |
} | |
h1 { | |
font-size: 72px; | |
} |
This file contains hidden or 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
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment