Skip to content

Instantly share code, notes, and snippets.

@gabehollombe
Created May 16, 2011 01:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gabehollombe/75ae61fda6bc60fd4012 to your computer and use it in GitHub Desktop.
Save gabehollombe/75ae61fda6bc60fd4012 to your computer and use it in GitHub Desktop.
Laksa Time - Refactored - HTML and Coffee
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Is it laksa time yet?</title>
<!--
_____ _____ _____ _____ _____
/\ \ /\ \ /\ \ /\ \ /\ \
/::\____\ /::\ \ /::\____\ /::\ \ /::\ \
/:::/ / /::::\ \ /:::/ / /::::\ \ /::::\ \
/:::/ / /::::::\ \ /:::/ / /::::::\ \ /::::::\ \
/:::/ / /:::/\:::\ \ /:::/ / /:::/\:::\ \ /:::/\:::\ \
/:::/ / /:::/__\:::\ \ /:::/____/ /:::/__\:::\ \ /:::/__\:::\ \
/:::/ / /::::\ \:::\ \ /::::\ \ \:::\ \:::\ \ /::::\ \:::\ \
/:::/ / /::::::\ \:::\ \ /::::::\____\________ ___\:::\ \:::\ \ /::::::\ \:::\ \
/:::/ / /:::/\:::\ \:::\ \ /:::/\:::::::::::\ \ /\ \:::\ \:::\ \ /:::/\:::\ \:::\ \
/:::/____/ /:::/ \:::\ \:::\____\/:::/ |:::::::::::\____\/::\ \:::\ \:::\____\/:::/ \:::\ \:::\____\
\:::\ \ \::/ \:::\ /:::/ /\::/ |::|~~~|~~~~~ \:::\ \:::\ \::/ /\::/ \:::\ /:::/ /
\:::\ \ \/____/ \:::\/:::/ / \/____|::| | \:::\ \:::\ \/____/ \/____/ \:::\/:::/ /
\:::\ \ \::::::/ / |::| | \:::\ \:::\ \ \::::::/ /
\:::\ \ \::::/ / |::| | \:::\ \:::\____\ \::::/ /
\:::\ \ /:::/ / |::| | \:::\ /:::/ / /:::/ /
\:::\ \ /:::/ / |::| | \:::\/:::/ / /:::/ /
\:::\ \ /:::/ / |::| | \::::::/ / /:::/ /
\:::\____\ /:::/ / \::| | \::::/ / /:::/ /
\::/ / \::/ / \:| | \::/ / \::/ /
\/____/ \/____/ \|___| \/____/ \/____/
_____ _____ _____ _____
/\ \ /\ \ /\ \ /\ \
/::\ \ /::\ \ /::\____\ /::\ \
\:::\ \ \:::\ \ /::::| | /::::\ \
\:::\ \ \:::\ \ /:::::| | /::::::\ \
\:::\ \ \:::\ \ /::::::| | /:::/\:::\ \
\:::\ \ \:::\ \ /:::/|::| | /:::/__\:::\ \
/::::\ \ /::::\ \ /:::/ |::| | /::::\ \:::\ \
/::::::\ \ ____ /::::::\ \ /:::/ |::|___|______ /::::::\ \:::\ \
/:::/\:::\ \ /\ \ /:::/\:::\ \ /:::/ |::::::::\ \ /:::/\:::\ \:::\ \
/:::/ \:::\____\/::\ \/:::/ \:::\____\/:::/ |:::::::::\____\/:::/__\:::\ \:::\____\
/:::/ \::/ /\:::\ /:::/ \::/ /\::/ / ~~~~~/:::/ /\:::\ \:::\ \::/ /
/:::/ / \/____/ \:::\/:::/ / \/____/ \/____/ /:::/ / \:::\ \:::\ \/____/
/:::/ / \::::::/ / /:::/ / \:::\ \:::\ \
/:::/ / \::::/____/ /:::/ / \:::\ \:::\____\
\::/ / \:::\ \ /:::/ / \:::\ \::/ /
\/____/ \:::\ \ /:::/ / \:::\ \/____/
\:::\ \ /:::/ / \:::\ \
\:::\____\ /:::/ / \:::\____\
\::/ / \::/ / \::/ /
\/____/ \/____/ \/____/
-->
<!-- Sure it's overkill, but it's probably cached already... -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://jashkenas.github.com/coffee-script/extras/coffee-script.js"></script>
<script type="text/coffeescript">
options =
target: "#isitlaksatime"
day: 5 #friday
hour: 12 #noon
messages: [
#[less than X mins to go, more than or equal to Y mins to go, message]
[null, 45, "Not Yet"],
[45, 15, "Soon"],
[15, 5, "Really soon"],
[5, 2, "Get ready"],
[2, 0, "YES!"],
]
timeval = (num, type) ->
switch type
when 'seconds' then num * 1000
when 'minutes' then num * timeval 60, 'seconds'
when 'hours' then num * timeval 60, 'minutes'
when 'days' then num * timeval 24, 'hours'
tv = (num, type) -> timeval(num, type) #shorthand for timeval
next_date_from_date = (from_date, day, hours) ->
d = new Date(from_date.valueOf()) #dates are passed by reference, so make a copy
#get now if it's friday, otherwise get next friday
d.setDate( d.getDate() + (7 + day - d.getDay()) % 7 )
#make the date match the time set in options
d.setHours(hours)
d.setMinutes(0)
d.setSeconds(0)
d.setMilliseconds(0)
return d
get_message_for_date = (date) ->
target_date = next_date_from_date(date, options.day, options.hour)
time_diff = target_date - date
return "You missed it today. <br/> See you next Friday?" if time_diff < 0
message = null
$(options.messages).each ->
[max, min, msg] = this
max = tv(max, 'minutes') if max != null #allow a null value for max since it's a special case where we'll only want to compare time_diff to min when it's null
min = tv(min, 'minutes')
if max > time_diff >= min or (max == null and time_diff >= min)
message = msg
return false
return message
update_message = ->
message = get_message_for_date(new Date())
$(options.target).html(message)
if message.length > 10
$("body").addClass("long");
else
$("body").removeClass("long");
run_tests = ->
#Testing next_date_from_date(from_date, day, hour)
test_cases = [
{
from_date: new Date(2011, 4, 16, 10, 0, 0) #months start at 0
expected_date: new Date(2011, 4, 20, 12, 0, 0)
}
{
from_date: new Date(2011, 4, 20, 10, 0, 0)
expected_date: new Date(2011, 4, 20, 12, 0, 0)
}
{
from_date: new Date(2011, 4, 21, 10, 0, 0)
expected_date: new Date(2011, 4, 27, 12, 0, 0)
}
]
test_next_date_from_date = (from_date, expected_date) ->
if next_date_from_date(from_date, 5, 12).valueOf() == expected_date.valueOf()
console.log 'OK'
else
console.log 'NO'
test_next_date_from_date(test.from_date, test.expected_date) for test in test_cases
#Testing get_message_for_date(date)
test_cases = [
{
for_date: new Date(2011, 4, 20, 10, 0, 0)
expected_message: "Not Yet"
}
{
for_date: new Date(2011, 4, 20, 11, 0, 0)
expected_message: "Not Yet"
}
{
for_date: new Date(2011, 4, 20, 11, 30, 0)
expected_message: "Soon"
}
{
for_date: new Date(2011, 4, 20, 11, 45, 0)
expected_message: "Soon"
}
{
for_date: new Date(2011, 4, 20, 11, 46, 0)
expected_message: "Really soon"
}
{
for_date: new Date(2011, 4, 20, 11, 56, 0)
expected_message: "Get ready"
}
{
for_date: new Date(2011, 4, 20, 11, 58, 1)
expected_message: "YES!"
}
{
for_date: new Date(2011, 4, 20, 12, 0, 0)
expected_message: "YES!"
}
{
for_date: new Date(2011, 4, 20, 12, 15, 0)
expected_message: "You missed it today. <br/> See you next Friday?"
}
]
test_get_message_for_date = (for_date, expected_message) ->
if get_message_for_date(for_date) == expected_message
console.log 'OK'
else
console.log 'NO'
test_get_message_for_date(test.for_date, test.expected_message) for test in test_cases
$ ->
update_message()
timer = setInterval update_message, timeval(10, 'seconds')
run_tests()
</script>
<style type="text/css">
body { background: white; color: black; text-align: center; font-family: sans-serif; }
.assistive { position: absolute; left: -5000px; width: 4000px; overflow: hidden; top: 0; height: 0; }
#isitlaksatime { font-size: 10em; margin: 10% 5% 0 5%; text-shadow: 3px 3px 3px #ddd; }
.long #isitlaksatime { font-size: 6em; }
</style>
</head>
<body>
<h1 class="assistive">is it laksa time yet?</h1>
<p id="isitlaksatime">
<noscript><a href="http://twitter.com/home/?status=Oi%20@rioter,%20is%20it%20laksa%20time%20yet?%20http://isitlaksatimeyet.200ok.com.au/">Ask Jared</a>.</noscript>
</p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment