Skip to content

Commit 03dba4a

Browse files
author
David Shaw
committed
UI updates
1 parent 16ad6e7 commit 03dba4a

File tree

1 file changed

+98
-43
lines changed

1 file changed

+98
-43
lines changed

‎index.html

+98-43
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,23 @@
1+
2+
<!-----------------------------------------------------
3+
sleepyti.me bedtime calculator
4+
Author: David Shaw (dshaw dot jobs at gmail dot com)
5+
URL: http://github.com/davidshaw/sleepyti.me/
6+
------------------------------------------------------>
7+
18
<html>
29
<head>
310
<title>sleepyti.me bedtime calculator</title>
11+
<META NAME="Description" CONTENT="Sleepyti.me is a bedtime calculator that can help you calculate when to fall asleep. By counting backwards in sleep cycles, sleepyti.me has the ability to help you wake up refreshed, instead of feeling groggy. Sleepyti.me can also help you figure out what time to set your alarm if you are going to sleep at that moment.">
12+
<META NAME="Keywords" CONTENT="sleep, refreshed, sleeping, health, bedtime, bed, bed time, calculator, ajax, javascript">
13+
<META NAME="robots" CONTENT="index">
414
<script src="jquery.js"></script>
515
<script>
616
$(document).ready(function() {
717
function ren() {
818
// render the page -- in case you're wondering,
919
// nothing will work without javascript!
10-
$("#tit").html('<font face="Garamond"><h1>&nbsp;&nbsp;<i>sleepyti.me <font color="#33CC33">beta 2</font></i></h1></font>');
20+
$("#tit").html('<font face="Garamond"><h1>&nbsp;&nbsp;<i>sleepyti.me <font color="#33CC33">beta 3</font></i></h1></font>');
1121
var mrend = '';
1222
mrend = mrend +
1323
'<table><tr width="100%">' +
@@ -41,11 +51,15 @@
4151
'<td></td></span>' +
4252
'<td></tr><tr><span class="results" style="display:none;"></span></td>' +
4353
'</tr></table>';
44-
4554
$('#main').html(mrend);
4655
}
4756
ren();
4857

58+
function putads() {
59+
// let's throw in some ads
60+
$('#amazon').fadeIn(2500);
61+
}
62+
4963
// calculates an hour and a half back
5064
function sleepback(hr, min, an) {
5165
var rmin = 0;
@@ -101,8 +115,8 @@
101115
}
102116
}
103117

104-
r = '<p>It takes the average human <b>fourteen minutes</b> to fall asleep.</p><p>If you head to bed right now, you should try to wake up at one of the following times:</p><p>&nbsp;&nbsp;<font size=6><font color="#666666">';
105-
for(var ctr = 0; ctr < 6; ctr++) { // normal sleep scheedule
118+
r = '<table><tr><td width="5%"></td><td><font size="5"><p>It takes the average human <b>fourteen minutes</b> to fall asleep.</p><p>If you head to bed right now, you should try to wake up at one of the following times:</p><h2><font color="#666666">';
119+
for(var ctr = 0; ctr < 6; ctr++) { // normal sleep schedule
106120
// add an hour and a half
107121
if(min < 30) {
108122
min = min + 30;
@@ -131,6 +145,9 @@
131145
ap = ' PM';
132146
dhr = hr - 12;
133147
}
148+
if(dhr == 0) {
149+
dhr = 12;
150+
}
134151
if(ctr == 0) {
135152
if(min > 9) {
136153
r = r + dhr + ':' + min + ap;
@@ -157,15 +174,15 @@
157174
}
158175
else {
159176
if(min > 9) {
160-
r = r + ' <i>or</i> ' + hr + ':' + min + ap;
177+
r = r + ' <i>or</i> ' + dhr + ':' + min + ap;
161178
}
162179
else {
163-
r = r + ' <i>or</i> ' + hr + ':0' + min + ap;
180+
r = r + ' <i>or</i> ' + dhr + ':0' + min + ap;
164181
}
165182
}
166183
}
167-
r = r + '</font></font></p><p>A good night\'s sleep consists of 5-6 complete sleep cycles.</p>';
168-
r = r + '<a href="index.html">back</a>';
184+
r = r + '</h2></font><p>A good night\'s sleep consists of 5-6 complete sleep cycles.</p>';
185+
r = r + '<center><a href="index.html"><h3>back</h3></a></center>';
169186
return r;
170187
}
171188

@@ -179,11 +196,12 @@
179196
var d = new Date();
180197
answ = knockout(d); // knockout takes a Date() and returns a string of wake times
181198
st = '<span id="bit" style=display:none><font face="Garamond" size=5>' +
182-
answ +
183-
'</font></span>';
184-
$('#main').fadeOut(500);
199+
answ + '</font></span>';
200+
$('#main').hide();
185201
$('#instant').html(st);
186-
$('#bit').delay(500).show(500);
202+
$('#instant').show()
203+
$('#bit').show(250);
204+
putads()
187205
});
188206

189207
// user changes the list, so we calculate times!
@@ -207,16 +225,17 @@
207225
}
208226
}
209227

210-
var txt = '<font face="Garamond" size=5><br/><br/>You should try to <b>fall asleep</b> at one of the following times:<br/><br/><font size=6>';
228+
var txt = '<table><tr><td width="5%"></td><td><font face="Garamond" size=5>You should try to <b>fall asleep</b> at one of the following times:<br/><br/><font size=6>';
211229
var first = true;
212-
230+
var times = new Array();
213231
for(var c = 1; c <= 10; c++) {
214232
var back = sleepback(hr, min, ampm);
215233
var nhr = back[0];
216234
var nmin = back[1];
217235
ampm = back[2];
218236
var ampmt = "";
219237
ampmt = back[2];
238+
220239
// countdown from 12, but that's not
221240
// how am/pm system works... whoops!
222241
if(nhr == 12) {
@@ -227,49 +246,47 @@
227246
ampmt = "AM";
228247
}
229248
}
230-
249+
// TODO: reverse display order
231250
if(c == 6 || c == 4 || c == 5 || c == 3) {
251+
var temp = '';
232252
if(nmin > 9) {
233-
if(first == true) {
234-
first = false;
235-
txt = txt + '<font color="#01DF74" size="7">' + nhr + ':' + nmin + ' ' + ampmt + '</font>';
253+
if(c == 6) {
254+
temp = '<font color="#01DF74" size="7">' + nhr + ':' + nmin + ' ' + ampmt + '</font>';
255+
times.push(temp);
236256
}
237257
else {
238-
txt = txt + ' <i>or</i> ' + '<font color="#01DF74" size="7">' + nhr + ':' + nmin + ' ' + ampmt + '</font>';
258+
temp = ' <i>or</i> ' + '<font color="#01DF74" size="7">' + nhr + ':' + nmin + ' ' + ampmt + '</font>';
259+
times.push(temp);
239260
}
240261
}
241-
else {
242-
if(first == true) {
243-
first = false;
244-
txt = txt + '<font color="#01DF74" size="7">' + nhr + ':0' + nmin + ' ' + ampmt + '</font>';
245-
}
246-
else {
247-
txt = txt + ' <i>or</i> ' + '<font color="#01DF74" size="7">' + nhr + ':0' + nmin + ' ' + ampmt + '</font>';
248-
}
262+
else { // insert 0
263+
if(c == 6) {
264+
temp = '<font color="#01DF74" size="7">' + nhr + ':0' + nmin + ' ' + ampmt + '</font>';
265+
times.push(temp);
266+
}
267+
else {
268+
temp = ' <i>or</i> ' + '<font color="#01DF74" size="7">' + nhr + ':0' + nmin + ' ' + ampmt + '</font>';
269+
times.push(temp);
270+
}
271+
249272
}
250273
}
251274
hr = nhr;
252275
min = nmin;
253276
}
277+
for(i = 3; i >= 0; i--) {
278+
txt = txt + times[i];
279+
}
280+
254281
txt = txt + '</font>';
255282

256283
txt = txt + '<br/><br/><font color="#0080FF">Please keep in mind that you should be <i>falling asleep</i> at these times.<br/><br/> The average adult human takes <b>fourteen minutes</b> to fall asleep, so plan accordingly!</font>';
257284
txt = txt + '<br/></br><font color="#9966CC">sleepyti.me works by counting backwards in <b>sleep cycles</b>. Sleep cycles typically last <b>90 minutes</b>.<br/><br/>Waking up in the middle of a sleep cycle leaves you feeling tired and groggy, but waking up <i>in between</i> cycles lets you wake up feeling refreshed and alert!</font>';
258-
txt = txt + '<br/><br/><a href="index.html"><big>back</big></a>';
259-
txt = txt + '<br/><br/><br/><span class="donate" style="display:none;"></span>';
260-
$('#main').fadeOut(1000);
261-
$('#instant').delay(1000).html(txt);
262-
$('#instant').delay(1000).fadeIn(1000);
285+
txt = txt + '<br/><br/><center><a href="index.html"><h3>back</h3></a></center>';
286+
$('#main').hide();
287+
$('#instant').html(txt)
288+
$('#instant').show(500)
263289

264-
donate = '<font face="Garamond" size=5 color="#666666"><table><tr height="100%"><td valign="bottom">Are you waking up refreshed because of sleepyti.me? Consider donating to support this free and open source project!<br/><br/>' +
265-
'<center>' +
266-
'<form action="https://www.paypal.com/cgi-bin/webscr" method="post"><input type="hidden" name="cmd" value="_s-xclick">' +
267-
'<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----">' +
268-
'<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_donate_SM.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">' +
269-
'<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1"></form>';
270-
donate = donate + '<br/><br/><center><font face="Garamond"><h2>&copy; <a href="http://github.com/davidshaw/dshaw_resume/raw/master/dshaw_resume_2010.pdf">David Shaw</a>, 2010</font></h2></center>';
271-
$('.donate').html(donate);
272-
$('.donate').fadeIn(1000); // necessary?
273290
var wtime = "";
274291
if(orig[1] > 9) {
275292
wtime = '<b>' + orig[0] + ':' + orig[1] + ' ' + orig[2] + '</b>';
@@ -279,13 +296,51 @@
279296
}
280297
$('.waketime').html(wtime);
281298
$('.waketime').fadeIn(1000);
299+
putads();
282300
});
283301
});
284302
</script>
303+
304+
<script type="text/javascript">
305+
306+
var _gaq = _gaq || [];
307+
_gaq.push(['_setAccount', 'UA-19580945-1']);
308+
_gaq.push(['_trackPageview']);
309+
310+
(function() {
311+
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
312+
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
313+
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
314+
})();
315+
316+
</script>
317+
285318
</head>
286-
<body>
319+
<body link="#0080FF" vlink="#0080FF">
320+
<noscript><font face="Garamond" size="5"><center>Hello, and welcome to sleepyti.me. Sleepyti.me is a bedtime calculator that counts backwards in sleep cycles and tells you when to go to sleep so that you can wake up refreshed! This site is written in Javascript, which must be enabled in order to use the page. Thanks for visiting, and sorry for the inconvenience!</noscript>
287321
<div id="tit"></div>
288322
<div id="main"></div>
289-
<div id="instant"></div>
323+
<div id="instant" style="display:none;"></div>
324+
<div id="amazon" style="display:none;" align="center" valign="bottom">
325+
<hr color="#CCCCCC" width="30%"><font face="Garamond" size=5 color="#666666"><i>Sleepyti.me is provided as a free service thanks to support from our ads.<br/><br/>
326+
327+
<script type="text/javascript"><!--
328+
google_ad_client = "ca-pub-7082199327067068";
329+
/* sleepy */
330+
google_ad_slot = "4113086282";
331+
google_ad_width = 728;
332+
google_ad_height = 90;
333+
//-->
334+
</script>
335+
<script type="text/javascript"
336+
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
337+
</script>
338+
</div>
339+
<div id="fb">
340+
<hr color="white">
341+
<hr color="white">
342+
<hr color="white">
343+
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fsleepyti.me&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
344+
</div>
290345
</body>
291346
</html>

0 commit comments

Comments
 (0)