brettlangdon
/
brewtimer
mirror of https://github.com/brettlangdon/brewtimer.git
1
0
Fork 0
Code Issues 0 Projects 0 Releases 0 Wiki Activity
Browse Source

make warning alerts optional

gh-pages
Brett Langdon 13 years ago
parent
df6321365a
commit
c954df90ad
5 changed files with 40 additions and 7 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      index.html
  2. +10
    -0
      index.jade
  3. +27
    -5
      scripts/main.js
  4. +1
    -1
      scripts/main.min.js
  5. +1
    -0
      styles/foundation.select.min.css

+ 1
- 1
index.html View File

@ -1,4 +1,4 @@
<!DOCTYPE html><html><head><title>Brew Timer</title><link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Offside"><link rel="stylesheet" href="styles/foundation.min.css"><link rel="stylesheet" href="styles/general_foundicons.min.css"><!--[if lt IE 8]><link><![endif]--><link rel="stylesheet" href="styles/main.min.css"><script src="scripts/jquery.min.js"></script><script src="scripts/foundation.min.js"></script><script src="scripts/modernizr.foundation.js"></script><script src="scripts/main.min.js"></script></head><body><audio id="clinking" preload="auto"><source src="sounds/clinking.mp3" type="audio/mpeg"><source src="sounds/clinking.wav" type="audio/wav"></audio><audio id="answering-machine" preload="auto"><source src="sounds/answering_machine.mp3" type="audio/mpeg"><source src="sounds/answering_machine.wav" type="audio/wav"></audio><audio id="beep" preload="auto"><source src="sounds/beep.mp3" type="audio/mpeg"><source src="sounds/beep.wav" type="audio/wav"></audio><div id="wrapper" class="block-grid"><div id="header" class="row"><div class="ten columns centered"><h1>Brew Timer</h1></div></div><div id="toolbar" class="row"><div class="three columns offset-by-eight"><a href="#" data-reveal-id="settings" id="open-settings" class="button"><span class="foundicon-settings"></span> Settings</a></div></div><div id="timers" class="row"><div id="remaining" class="six columns"><div class="block-grid"><h3 class="four columns offset-by-eight">00:00:00</h3></div></div><div id="elapsed" class="six columns"><h3 class="four column">-00:00:00</h3></div></div><div id="set-timer" class="row"><div class="three columns offset-by-five"><input id="total" placeholder="Total Time (mins)" type="text"></div><div class="two columns end"><button id="set" class="button">Start Timer</button></div></div><div id="stop-timer" class="row"><div class="two columns offset-by-eight end"><button id="stop" class="button">Stop Timer</button></div></div><div id="add-step" class="row"><div class="four columns offset-by-two"><input id="name" placeholder="Step Name" type="text"></div><div class="two columns"><input id="time" placeholder="Alert At (mins left)" type="text"></div><div class="two columns end"><button id="add" class="button">Add Step</button></div></div><div id="steps" class="row"><div id="list" class="block grid"><div class="header row"><div class="six columns"><h5 class="name">Step Name</h5></div><div class="two columns end"><h5 class="at">Alert At</h5></div></div></div></div><div id="footer" class="row"><div class="six columns">Brought to you by: <a href="//www.brett.is" target="_blank">Brett Langdon</a></div><div class="six columns">Sound Effects (<a href="//creativecommons.org/licenses/by/3.0/" target="_blank">Attribution 3.0</a>): <br><a href="//soundbible.com/1806-Censored-Beep.html" target="_blank">Censored Beep</a>, <a href="//soundbible.com/1967-Clinking-Teaspoon.html" target="_blank">Clinking Teaspoon</a>, <a href="//soundbible.com/5-Answering-Machine-Beep.html" target="_blank">Answering Machine Beep</a></div></div><div id="settings" class="reveal-modal"><div class="block-grid"><div class="row"><div class="six columns"><label for="warning-time" class="right">Warning Time (mins)</label></div><div class="five columns end"><input id="warning-time" type="text"></div></div><div class="row"><div class="six columns"><label for="finished-audio" class="right">Finished Audio</label></div><div class="five columns end"><select id="finished-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div class="six columns"><label for="warning-audio" class="right">Warning Audio</label></div><div class="five columns end"><select id="warning-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div class="six columns"><label for="step-audio" class="right">Step Audio</label></div><div class="five columns end"><select id="step-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div id="save" class="two columns offset-by-ten button end">Save</div></div></div><a class="close-reveal-modal">&#215;</a></div></div><script type="text/javascript">var _gaq = _gaq || [];
<!DOCTYPE html><html><head><title>Brew Timer</title><link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Offside"><link rel="stylesheet" href="styles/foundation.min.css"><link rel="stylesheet" href="styles/foundation.select.min.css"><link rel="stylesheet" href="styles/general_foundicons.min.css"><!--[if lt IE 8]><link><![endif]--><link rel="stylesheet" href="styles/main.min.css"><script src="scripts/jquery.min.js"></script><script src="scripts/foundation.min.js"></script><script src="scripts/modernizr.foundation.js"></script><script src="scripts/main.min.js"></script></head><body><audio id="clinking" preload="auto"><source src="sounds/clinking.mp3" type="audio/mpeg"><source src="sounds/clinking.wav" type="audio/wav"></audio><audio id="answering-machine" preload="auto"><source src="sounds/answering_machine.mp3" type="audio/mpeg"><source src="sounds/answering_machine.wav" type="audio/wav"></audio><audio id="beep" preload="auto"><source src="sounds/beep.mp3" type="audio/mpeg"><source src="sounds/beep.wav" type="audio/wav"></audio><div id="wrapper" class="block-grid"><div id="header" class="row"><div class="ten columns centered"><h1>Brew Timer</h1></div></div><div id="toolbar" class="row"><div class="three columns offset-by-eight"><a href="#" data-reveal-id="settings" id="open-settings" class="button"><span class="foundicon-settings"></span> Settings</a></div></div><div id="timers" class="row"><div id="remaining" class="six columns"><div class="block-grid"><h3 class="four columns offset-by-eight">00:00:00</h3></div></div><div id="elapsed" class="six columns"><h3 class="four column">-00:00:00</h3></div></div><div id="set-timer" class="row"><div class="three columns offset-by-five"><input id="total" placeholder="Total Time (mins)" type="text"></div><div class="two columns end"><button id="set" class="button">Start Timer</button></div></div><div id="stop-timer" class="row"><div class="two columns offset-by-eight end"><button id="stop" class="button">Stop Timer</button></div></div><div id="add-step" class="row"><div class="four columns offset-by-two"><input id="name" placeholder="Step Name" type="text"></div><div class="two columns"><input id="time" placeholder="Alert At (mins left)" type="text"></div><div class="two columns end"><button id="add" class="button">Add Step</button></div></div><div id="steps" class="row"><div id="list" class="block grid"><div class="header row"><div class="six columns"><h5 class="name">Step Name</h5></div><div class="two columns end"><h5 class="at">Alert At</h5></div></div></div></div><div id="footer" class="row"><div class="six columns">Brought to you by: <a href="//www.brett.is" target="_blank">Brett Langdon</a></div><div class="six columns">Sound Effects (<a href="//creativecommons.org/licenses/by/3.0/" target="_blank">Attribution 3.0</a>): <br><a href="//soundbible.com/1806-Censored-Beep.html" target="_blank">Censored Beep</a>, <a href="//soundbible.com/1967-Clinking-Teaspoon.html" target="_blank">Clinking Teaspoon</a>, <a href="//soundbible.com/5-Answering-Machine-Beep.html" target="_blank">Answering Machine Beep</a></div></div><div id="settings" class="reveal-modal"><div class="block-grid"><div class="row"><div class="six columns"><label for="warning-time" class="right">Warning Time (mins)</label></div><div class="five columns end"><input id="warning-time" type="text"></div></div><div class="row"><div class="six columns"><label for="warning-enabled" class="right">Enable Warning</label></div><div class="five columns end"><div class="switch radius"><input id="off" type="radio" name="enable"><label for="off">Off</label><input id="on" type="radio" checked="true" name="enable"><label for="on">On</label></div></div></div><div class="row"><div class="six columns"><label for="finished-audio" class="right">Finished Audio</label></div><div class="five columns end"><select id="finished-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div class="six columns"><label for="warning-audio" class="right">Warning Audio</label></div><div class="five columns end"><select id="warning-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div class="six columns"><label for="step-audio" class="right">Step Audio</label></div><div class="five columns end"><select id="step-audio"><option value="#clinking">Clinking</option><option value="#beep">Beep</option><option value="#answering-machine">Answering machine</option></select></div></div><div class="row"><div id="save" class="two columns offset-by-ten button end">Save</div></div></div><a class="close-reveal-modal">&#215;</a></div></div><script type="text/javascript">var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-34513423-2']); _gaq.push(['_setAccount', 'UA-34513423-2']);
_gaq.push(['_trackPageview']); _gaq.push(['_trackPageview']);
(function() { (function() {


+ 10
- 0
index.jade View File

@ -4,6 +4,7 @@ html
title Brew Timer title Brew Timer
link(rel="stylesheet", href="http://fonts.googleapis.com/css?family=Offside") link(rel="stylesheet", href="http://fonts.googleapis.com/css?family=Offside")
link(rel="stylesheet", href="styles/foundation.min.css") link(rel="stylesheet", href="styles/foundation.min.css")
link(rel="stylesheet", href="styles/foundation.select.min.css")
link(rel="stylesheet", href="styles/general_foundicons.min.css") link(rel="stylesheet", href="styles/general_foundicons.min.css")
//if lt IE 8 //if lt IE 8
link(rel='styleheet", href="styles/general_foundicons_ie7.min.css") link(rel='styleheet", href="styles/general_foundicons_ie7.min.css")
@ -81,6 +82,15 @@ html
label.right(for="warning-time") Warning Time (mins) label.right(for="warning-time") Warning Time (mins)
.five.columns.end .five.columns.end
input#warning-time(type="text") input#warning-time(type="text")
.row
.six.columns
label.right(for="warning-enabled") Enable Warning
.five.columns.end
.switch.radius
input#off(type="radio", name="enable")
label(for="off") Off
input#on(type="radio", checked="true", name="enable")
label(for="on") On
.row .row
.six.columns .six.columns
label.right(for="finished-audio") Finished Audio label.right(for="finished-audio") Finished Audio


+ 27
- 5
scripts/main.js View File

@ -1,4 +1,5 @@
var warning_time = 60; var warning_time = 60;
var warning_enabled = true;
var finished_audio = '#answering-machine'; var finished_audio = '#answering-machine';
var warning_audio = '#beep'; var warning_audio = '#beep';
var completed_audio = '#clinking'; var completed_audio = '#clinking';
@ -52,7 +53,7 @@ var update_timers = function(){
if(remaining_time > 0){ if(remaining_time > 0){
update_timeout = setTimeout(update_timers, 1000); update_timeout = setTimeout(update_timers, 1000);
} else{ } else{
$(finished_audio).trigger('play');
play(finished_audio);
$('#set-timer').show(); $('#set-timer').show();
$('#stop-timer').hide(); $('#stop-timer').hide();
} }
@ -166,10 +167,16 @@ var check_steps = function(time){
} else if(at == time){ } else if(at == time){
$(this).removeClass('warning'); $(this).removeClass('warning');
$(this).addClass('current'); $(this).addClass('current');
$(completed_audio).trigger('play');
} else if(warning_time && (at + warning_time) == time){
$(this).addClass('warning');
$(warning_audio).trigger('play');
play(completed_audio)
} else if(warning_enabled && warning_time){
if(time <= (at + warning_time) && time >= at){
if(!$(this).hasClass('warning')){
$(this).addClass('warning');
play(warning_audio);
}
} else{
$(this).removeClass('warning');
}
} else{ } else{
$(this).removeClass('current'); $(this).removeClass('current');
$(this).removeClass('completed'); $(this).removeClass('completed');
@ -185,6 +192,7 @@ var round = function(num, num_places){
var save_settings = function(){ var save_settings = function(){
warning_time = parseFloat($('#warning-time').val()) * 60; warning_time = parseFloat($('#warning-time').val()) * 60;
warning_enabled = $('.switch #on').prop('checked');
finished_audio = $('#finished-audio').val(); finished_audio = $('#finished-audio').val();
completed_audio = $('#step-audio').val(); completed_audio = $('#step-audio').val();
warning_audio = $('#warning-audio').val(); warning_audio = $('#warning-audio').val();
@ -196,6 +204,14 @@ var save_settings = function(){
var open_settings = function(){ var open_settings = function(){
$('#warning-time').val(round(warning_time / 60, 2)); $('#warning-time').val(round(warning_time / 60, 2));
if(warning_enabled){
$('.switch #on').prop('checked', true);
$('.switch #off').removeAttr('checked');
} else{
$('.switch #off').prop('checked', true);
$('.switch #on').removeAttr('checked');
}
$('#settings #finished-audio').children('option').each(function(){ $('#settings #finished-audio').children('option').each(function(){
if($(this).val() == finished_audio){ if($(this).val() == finished_audio){
$(this).prop('selected', true); $(this).prop('selected', true);
@ -220,3 +236,9 @@ var open_settings = function(){
} }
}); });
}; };
var play = function(id){
$(id).trigger('load');
$(id).trigger('play');
}

+ 1
- 1
scripts/main.min.js
File diff suppressed because it is too large
View File


+ 1
- 0
styles/foundation.select.min.css View File

@ -0,0 +1 @@
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}html,body{font-size:16px}body{background:#fff;color:#222;padding:0;margin:0;font-family:"Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;font-weight:normal;font-style:normal;line-height:1;position:relative;-webkit-font-smoothing:antialiased}img,object,embed{max-width:100%;height:auto}object,embed{height:100%}img{-ms-interpolation-mode:bicubic}#map_canvas img,#map_canvas embed,#map_canvas object,.map_canvas img,.map_canvas embed,.map_canvas object{max-width:none !important}.left{float:left}.right{float:right}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.hide{display:none}img{display:block}textarea{height:auto;min-height:50px}select{width:100%}@media only screen{.switch{position:relative;width:100%;padding:0;display:block;overflow:hidden;border-style:solid;border-width:1px;margin-bottom:1.25em;-webkit-animation:webkitSiblingBugfix infinite 1s;height:36px;background:#fff;border-color:#ccc}.switch label{position:relative;left:0;z-index:2;float:left;width:50%;height:100%;margin:0;text-align:right;font-weight:bold;text-align:left;-webkit-transition:all 0.1s ease-out;-moz-transition:all 0.1s ease-out;transition:all 0.1s ease-out}.switch input{position:absolute;z-index:3;opacity:0;width:100%;height:100%}.switch input:hover,.switch input:focus{cursor:pointer}.switch>span{position:absolute;top:-1px;left:-1px;z-index:1;display:block;padding:0;border-width:1px;border-style:solid;-webkit-transition:all 0.1s ease-out;-moz-transition:all 0.1s ease-out;transition:all 0.1s ease-out}.switch input:last-of-type+label{text-align:right}.switch input:not(:checked)+label{opacity:0}.switch input:checked{display:none}.switch input{left:0}.switch input:first-of-type+label{left:-50%}.switch input:first-of-type:checked+label{left:0%}.switch input:last-of-type+label{right:-50%;left:auto}.switch input:last-of-type:checked+label{right:0%;left:auto}.switch label{padding:0 0.375em;line-height:2.3em;font-size:0.875em}.switch input:first-of-type:checked ~ span{left:100%;margin-left:-2.1875em}.switch>span{width:2.25em;height:2.25em}.switch>span{border-color:#b3b3b3;background:#fff;background:-moz-linear-gradient(top, #fff 0%, #f2f2f2 100%);background:-webkit-linear-gradient(top, #fff 0%, #f2f2f2 100%);background:linear-gradient(to bottom, #fff 0%, #f2f2f2 100%);-webkit-box-shadow:2px 0 10px 0 rgba(0,0,0,0.07),1000px 0 0 1000px #e1f5d1,-2px 0 10px 0 rgba(0,0,0,0.07),-1000px 0 0 1000px #f5f5f5;box-shadow:2px 0 10px 0 rgba(0,0,0,0.07),1000px 0 0 980px #e1f5d1,-2px 0 10px 0 rgba(0,0,0,0.07),-1000px 0 0 1000px #f5f5f5}.switch:hover>span,.switch:focus>span{background:#fff;background:-moz-linear-gradient(top, #fff 0%, #e6e6e6 100%);background:-webkit-linear-gradient(top, #fff 0%, #e6e6e6 100%);background:linear-gradient(to bottom, #fff 0%, #e6e6e6 100%)}.switch:active{background:transparent}.switch.large{height:44px}.switch.large label{padding:0 0.375em;line-height:2.3em;font-size:1.0625em}.switch.large input:first-of-type:checked ~ span{left:100%;margin-left:-2.6875em}.switch.large>span{width:2.75em;height:2.75em}.switch.small{height:28px}.switch.small label{padding:0 0.375em;line-height:2.1em;font-size:0.75em}.switch.small input:first-of-type:checked ~ span{left:100%;margin-left:-1.6875em}.switch.small>span{width:1.75em;height:1.75em}.switch.tiny{height:22px}.switch.tiny label{padding:0 0.375em;line-height:1.9em;font-size:0.6875em}.switch.tiny input:first-of-type:checked ~ span{left:100%;margin-left:-1.3125em}.switch.tiny>span{width:1.375em;height:1.375em}.switch.radius{-webkit-border-radius:4px;border-radius:4px}.switch.radius>span{-webkit-border-radius:3px;border-radius:3px}.switch.round{-webkit-border-radius:1000px;border-radius:1000px}.switch.round>span{-webkit-border-radius:999px;border-radius:999px}.switch.round label{padding:0 0.5625em}@-webkit-keyframes webkitSiblingBugfix{from{position:relative}to{position:relative}}}

Write Preview
Loading…
Cancel
Save