-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
133 lines (101 loc) · 4.12 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!doctype html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width" />
<link href='http://fonts.googleapis.com/css?family=Raleway:200,400,800,900' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<nav>
<h1>Kevin Tracker</h1>
<h3>It's <span class="current-time"></span>. Do you know where your Kevin is?</h3>
<h3 class="locate-button">Find Kevin</h3>
</nav>
</header>
<div class="main-content">
<!-- <h1 class="title">Is Kevin Here?</h1> -->
<h2 class="answer"></h2>
<a HREF="javascript:history.go(0)"><h3 class="try-again">Try Again?</h3></a>
<img class="kevin-pic" src="http://i.imgur.com/PuZWj31.gif">
</div>
<script src="js/tabletop.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$('.main-content').hide();
var sheetsURL = '1wcy-iE3QWs-2iN2hIBO6X1ro7UBdCwoYhRrYNFmR6CU';
Tabletop.init( {
key: sheetsURL,
callback: showInfo,
debug: true,
parseNumbers: true,
simpleSheet: true
} );
var kevinData;
function showInfo(data, tabletop){
//let's put all the data in one variable
kevinData = data;
console.log( "Here is your data", kevinData);
}
function isKevinHere(internetWisdom) {
var kevinWhereabouts = internetWisdom[0];
var affirmative = "Yes! He's here! It's a miracle!";
var negatory = "We're sorry. Your Kevin is in another castle.";
var yes_no = kevinWhereabouts.inoffice;
var choice;
if (yes_no === "yes") {
choice = affirmative;
$('body').toggleClass('yes-gradient');
} else {
choice = negatory;
$('body').toggleClass('no-gradient');
}
var imHere;
if(yes_no === "no") {
imHere = " leaving the office ";
} else {
imHere = " entering the office ";
};
var locationDetailsText = "<p>Kevin was last seen" + imHere +
"on " + kevinWhereabouts.date +
" at about " + kevinWhereabouts.time +
"</p>";
$('.answer').append("<span class='choice'>" + choice + "</span>");
$('.answer').append(locationDetailsText);
}
$('.locate-button').on('click', function(){
$('header').fadeOut(600)
.promise()
.done(function() {
isKevinHere(kevinData);
$('header').remove();
$('.main-content').fadeIn(600);
});
});
$('.current-time').append(kevinTime());
function kevinTime() {
var date = new Date();
var hours = date.getHours();
var minutes = ('0' + date.getMinutes()).slice(-2);
var formattedTime;
var amPm;
var regTime = function(hr, min) {
var hrs = hr;
var mins = min;
if (hrs === 0) {
hrs = 12;
amPm = 'am';
} else if (hrs > 12) {
hrs = hrs - 12;
amPm = 'pm';
} else {
amPm = 'am';
}
formattedTime = hrs + ':' + mins + ' ' + amPm;
return formattedTime;
}
return regTime(hours, minutes);
}
</script>
</body>
</html>