-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·176 lines (124 loc) · 8.74 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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset="utf-8">
<title>The Revolutionaries</title>
<link href="css/style.min.css?v=20100628-3" rel="stylesheet" type="text/css">
</head>
<body>
<!-- end sidebar -->
<div id="sidebar">
<h1><a href="http://dharmafly.com/revolutionaries/">The Revolutionaries</a></h1>
<p class="report"></p>
<blockquote id="the-default">
<a class="cite" href="http://twitter.com/sciencehackday/status/16608593166" title='OH: "Isaac Newton should be the default..."'>Isaac Newton should be the default...</a>
</blockquote>
<form>
<input class="search" value="Search" title="Search">
</form>
<p class="hint">Try searching for inventors, thinkers, or revolutionaries (<em>e.g. "<a href="#Isaac_Newton">Isaac Newton</a>", "<a href="#Albert_Einstein">Albert Einstein</a>", "<a href="#George_Orwell">George Orwell</a>"</em>).<p>
<ul class="history">
<li class="previous">← Previous</li>
<li class="next">Next →</li>
</ul>
</div>
<!-- end sidebar -->
<!-- content -->
<div id="content">
<div class="about">
<h2>About</h2>
<p><strong><em><a href="http://dharmafly.com/revolutionaries/">"The Revolutionaries"</a></em></strong> is an explorer of the influence and relationships between different scientists, inventors and revolutionary thinkers. It was built in 24 hours at <a href="http://sciencehackday.com">Science Hack Day</a>, in June 2010 (and improved a fair bit, after the event).</p>
<h3>The idea</h3>
<p>The original idea was to help visualise how we arrive at great inventions, and how ideas evolve over time. For example, something like the <a href="#Space_Shuttle">space shuttle</a> is the result of countless generations of converging technologies, and all the thought processes and new paradigms behind them.</p>
<h3>The data</h3>
<p>None of the information in this tool is stored within it. It is dynamically driven by the crowd-sourced knowledge on WikiPedia, and how that data links to other information on the Web. Data is cached within your browser, to speed up navigation.</p>
<h3>The code</h3>
<p>The source code is free and <em>open source</em>, and <a href="http://github.com/premasagar/revolutionaries" title="The Revolutionaries, on GitHub">available on GitHub.</a> If you have any feedback or improvements, please let us know.</p>
<h3>Start exploring here...</h3>
<p class="get-started">
<a href="#Isaac_Newton" title="Isaac Newton">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/3/39/GodfreyKneller-IsaacNewton-1689.jpg/178px-GodfreyKneller-IsaacNewton-1689.jpg" width=178 height=244></a>
</p>
<h3>Who built it?</h3>
<ul>
<li><a href="http://twitter.com/mia_out">@mia_out</a> - original idea for exploring evolution of inventions over time; guidance on Science Museum data</li>
<li><a href="http://twitter.com/premasagar">@premasagar</a> - JavaScript, app creation, coordination</li>
<li><a href="http://twitter.com/ironyboy">@ironyboy</a> - YQL'ing, R & D'ing</li>
<li><a href="http://twitter.com/tommorris">@tommorris</a> - SPARQL queries, DBpedia brains</li>
<li><a href="http://twitter.com/yaili">@yaili</a> & <a href="http://twitter.com/goodonpaper">@goodonpaper</a> - design kung fu; markup & CSS</li>
<li><a href="http://twitter.com/rboulton">@rboulton</a> - R & D in scraping Science Museum collection to make an API</li>
</ul>
<p class="icons">
<a title="Science Hack Day" href="http://sciencehackday.com"><img src="img/scihack.png" alt="Science Hack Day"></a>
<a title="Wikipedia" href="http://en.wikipedia.org"><img src="img/wikipedia.png" alt="Wikipedia"></a>
<a title="DBpedia" href="http://dbpedia.org"><img src="img/dbpedia.png" alt="DBpedia"></a>
<a title="YQL" href="http://developer.yahoo.com/yql/"><img src="img/yql.gif" alt="YQL"></a>
</p>
<h3>Technical details</h3>
<p>The application does not have its own server. Instead, it uses JavaScript to request data from <a href="http://en.wikipedia.org">Wikipedia</a>. It does this via <a href="http://en.wikipedia.org/wiki/SPARQL">SPARQL queries</a> into the <a href="http://dbpedia.org">DBpedia</a> API, which lets us pull together information from DBpedia's <a href="http://en.wikipedia.org/wiki/Resource_Description_Framework">RDF linked data</a>, such as which person has influenced which other people. This is then wrapped in calls to Yahoo's <a href="http://developer.yahoo.com/yql/">YQL</a> web service. We also use a couple of other little tricks, like passing any keywords in the Search box through Google, to find the top result in Wikipedia for that term.</p>
<h3>Browser caching</h3>
<p>In order to speed up the browsing experience and to reduce the number of API calls, the app takes advantage of <a href="http://hacks.mozilla.org/2009/06/localstorage/">localStorage</a>, which is like a simple database contained within the browser. If you are using a modern browser, you should find that previously viewed people display very fast.</p>
<h3>The Science Museum Collection</h3>
<p>We began to integrate the <a href="http://collectionsonline.nmsi.ac.uk">Science Museum's collections database</a>, to let us shift the context from the scientists to the technologies they invented, but this work hasn't been completed.</p>
<h3>A prototype</h3>
<p>This is a prototype, and it's nicely rough around the edges. It hasn't been properly cross-browser tested and it doesn't warn you when things go wrong. If, for example, the application suddenly stops displaying content, this may be due to limits from the YQL service - just wait an hour and try again.</p>
<h3>We won a bug</h3>
<p>The hack won the "You know, for kids" award - for which we took home a prestigious, jittery electric bug! <a href="http://sciencehackday.pbworks.com/hacks">See all the other hacks...</a></p>
</div>
<div id="revolutionary"></div>
<div id="related"></div>
</div>
<a href=http://github.com/premasagar/revolutionaries title="The Revolutionaries, on GitHub"><img style="position: absolute; top: 0; right: 0; border: 0;" src=http://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png alt="Fork me on GitHub" /></a>
<!-- end content -->
<!-- templates -->
<script type="text/template" id="descParaTmpl">
<p><%= paragraph %></p>
</script>
<script type="text/template" id="descMoreLessTmpl">
<a class="moreless"><%= moreless %></a>
</script>
<script type="text/template" id="itemDetailTmpl">
<div class="item-detail vcard <%= id %>">
<h2><a class="fn url" href="<%= url %>" title="<%= name %>, on Wikipedia"><%= name %></a></h2>
<ul class="history">
<li class="previous">← Previous</li>
<li class="next">Next →</li>
</ul>
<div class="desc"><%= desc %></div>
<p><a class="photo-container" href="<%= url %>" title="<%= name %>, on Wikipedia"></a></p>
</div>
</script>
<script type="text/template" id="itemSummaryTmpl">
<div class="item-summary vcard">
<h4><a class="fn url" href="<%= url %>" title="<%= name %>"><%= name %></a></h4>
<a class="photo-container" href="<%= url %>" title="<%= name %>"></a>
</div>
</script>
<script type="text/template" id="itemTmpl">
<li class="<%= id %>"><%= item %></li>
</script>
<script type="text/template" id="itemsTmpl">
<div class="<%= type %>">
<h3><%= title %></h3>
<ul></ul>
</div>
</script>
<!-- end templates -->
<!-- scripts -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="revolutionaries.min.js?v=20100628-3"></script>
<!-- end scripts -->
<!-- teh goog -->
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-2150808-7']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- end teh goog -->
</body>
</html>