/
index.html
78 lines (71 loc) · 2.8 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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Twitter Showdown</title>
<link rel="stylesheet" href="fonts/fonts.css" type="text/css" />
<link rel="stylesheet" href="css/map.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
</head>
<body>
<div id="header">
<h1>Twitter Showdown</h1>
</div>
<div id="content">
<img id="logo" src="img/illustration.png" alt="Work vs. Play">
<table id="counter">
<tr>
<th class='first'>First Tweets</th>
<th class='second'>Second Tweets</th>
</tr>
<tr>
<td class='first'>--</td>
<td class='second'>--</td>
</tr>
</table>
<a href="#" id="stop">Pause</a>
<div id="about">
<h2>About this Site</h2>
<p>Follow two competing live Twitter feeds, one including tweets with the keyword 'play', and one with tweets that include the keyword 'work'. Find out which parts of the country are working hardest and which ones are having the most fun. </p>
</div>
</div>
<div id="map" class="map"></div>
<!-- External libraries and site script -->
<script src="ext/jquery.min.js"></script>
<script src="ext/underscore.min.js"></script>
<script src="ext/modestmaps.min.js"></script>
<script src="ext/wax/wax.mm.js"></script>
<script src="ext/wax/wax.ext.js"></script>
<script src="ext/easey.js"></script>
<script src="ext/mmg.js"></script>
<script src="tweetRace.js"></script>
<script src="script.js"></script>
<!-- Site configuration -->
<script type="text/javascript">
// Specify the tweets and location / radius to search
var tweets = [
'work', // First term
'play', // Second term
'39,-98,1500mi' // search location and radius (lat,lon,radius)
];
// Make a new map in the #map element
var main = Map('map', {
// Specify the MapBox API url
api: 'http://a.tiles.mapbox.com/v3/mapbox.map-hv50mbs9.jsonp',
center: {
lat: 40, // Intial center point and zoom level.
lon: -80, // To find coordinates and zoom levels,
zoom: 4 // try: http://www.getlatlon.com
},
zoomRange: [2, 15], // Limit zooming on the map to these levels
features: [ // Map features (see readme.md)
'zoomwheel',
'zoombox',
'zoompan',
'share'
]
}, tweetRace.start); // Callback function to start when map is loaded
</script>
</body>
</html>