-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
137 lines (95 loc) · 4.9 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
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Remember this moment!">
<meta name="keywords" content="remember, moment">
<meta name="author" content="Baird Castleberry">
<title>Remember This Moment</title>
<link href="client/styles/main.css" rel="stylesheet">
<link rel="apple-touch-icon-precomposed" href="public/img/touch.png">
<link rel="icon" href="public/img/favicon.ico" type="image/x-icon">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="client/scripts/main.js" ></script>
<script type="text/javascript" src="client/scripts/twitter.js" ></script>
</head>
<body>
<div id="titlediv">
<h1>Remember this moment.</h1>
</div>
<div id="buttondiv">
<span class="btn" id="moment" data-action="run">Never Forget</span>
</div>
<div id="questionsbox" class="col-md-8 col-md-offset-2">
<p>Hello! This project would not have been possible without free and open data from some great projects.</p>
<p>I used <a href="https://twitter.com" target="_blank">Twitter</a> for the trend which was more difficult than it should have been. I encourage Twitter to begin using OAuth2 for user authentications. You can check out a <a href="https://dev.twitter.com/discussions/397" target="_blank">thread here</a> that was started almost 4 years ago (at the time of writing) asking about this functionality.The data is free but requires a significant authorization and a custom written proxy to make the handshake. It seems due to the sheer traffic Twitter experiences they have been forced to make some tough descisions. I do find this metric facinating as a social study.</p>
<p>The quantum number is is sourced through a brilliant project you can find <a href="http://qrng.anu.edu.au/" target="_blank">here</a>. The ANU Quantum Random Number Generator uses quantum fluctuations inside a vacuum to generate random numbers. The number you find in this project each time you generate results is <i>truly</i> random. Some of you may know this is a hard thing to come by. You can even incorporate this data to modify the entropy of other projects.</p>
<p>The currency valuations are sourced from an open API provided by <a href="http://coinabul.com/" target="_blank">Coinabul</a>. They are generated on the fly and are another facinating thing to watch change.</p>
<p>The earthquake data is sourced from the <a href="http://earthquake.usgs.gov/" target="_blank">USGS</a>. The data shown in this project is from the most recent earthquake in the last hour measuring any magnitude. Baby earthquakes happen all the time!</p>
<p>The moon phase is sourced from the <a href="http://www.almanac.com/" target="_blank">Old Farmers Almanac</a>.</p>
<p>The current headline is sourced from <a href="https://news.google.com/" target="_blank">Google News</a> and like a few of the other feeds, is pulled using the <a href="https://developers.google.com/feed/" target="_blank">Google Feed API</a>.</p>
<p>If you have any other questions feel free to <a href="https://github.com/baird" target="_blank">get in touch</a>.
</div>
<div class="container">
<div class="row">
<div id="datediv" class="col-md-4">
<h2 id="dateheader"></h2>
</div>
<div id="trenddiv" class="col-md-4">
<h2 id="trendheader"></h2>
</div>
<div id="quantumdiv" class="col-md-4">
<h2 id="quantumheader"></h2>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div id="btcdiv" class="col-md-4">
<h2 id="btcheader"></h2>
</div>
<div id="golddiv" class="col-md-4">
<h2 id="goldheader"></h2>
</div>
<div id="silverdiv" class="col-md-4">
<h2 id="silverheader"></h2>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div id="quakediv" class="col-md-4">
<h2 id="quakeheader"></h2>
</div>
<div id="magdiv" class="col-md-4">
<h2 id="magheader"></h2>
</div>
<div id="moondiv" class="col-md-4">
<h2 id="moonheader"></h2>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div id="newsdiv" class="col-md-8 col-md-offset-2">
<h2 id="newsheader"></h2>
</div>
</div>
</div>
<br>
<div id="footer">
<h3>A real-time data experiment by <a href="https://github.com/baird" target="_blank">Baird Castleberry</a>.</h3>
</div>
<div id="again">
<a href="/">Do it again!</a>
</div>
<div id="questions">
<span id="questionlink" data-action="run">Questions?</span>
</div>
<div id="twitterdiv">
<span id="twitterlink" data-action="run">Share this!</span>
</div>
</body>