globe/index.html at master · stephenenriquez/globe · GitHub

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
<!-- source: https://github.com/zebradog/globe -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Globe</title>
    <script type="text/javascript">
    if(!window.chrome) {
      alert("This application requires Google Chrome");
      window.location = "http://www.google.com/chrome";
    }
    </script>
		<link rel="stylesheet" type="text/css" href="css/globe.css" />
    <script src="js/lib/jquery.min.js"></script>
    <script src="js/lib/jquery.transit.min.js"></script>
    <script src="js/lib/stretch-video.js"></script>
    <script src="js/lib/d3.min.js"></script>
    <script src="js/lib/Cesium/Cesium.js"></script>
    <script src="js/lib/dat.gui.min.js"></script>
  </head>
<body>
  <canvas id="glow"></canvas>
  <div id="map" class="container"></div>
  <div id="overlay" class="container">
    <div class="point city trondheim" data-latitude="63.4187362" data-longitude="10.4387621" data-city="trondheim"></div>
		<div class="label" data-city="trondheim">Trondheim</div>
    <div class="point city bergen" data-latitude="60.3894" data-longitude="5.3300" data-city="bergen"></div>
		<div class="label" data-city="bergen">Bergen</div>
    <div class="point city liverpool" data-latitude="53.4200911" data-longitude="-2.9108429" data-city="liverpool"></div>
		<div class="label" data-city="liverpool">Liverpool, UK</div>
    <div class="point city new-york highlighted" data-latitude="40.7056308" data-longitude="-73.9780035" data-city="new-york"></div>
		<div class="label" data-city="new-york">New York, New York</div>
    <div class="point city stoughton highlighted" data-latitude="42.9230266" data-longitude="-89.2180235" data-city="stoughton"></div>
		<div class="label" data-city="stoughton">Stoughton, Wisconsin</div>
    <div class="point city christiana highlighted" data-latitude="59.8938549" data-longitude="10.7851166" data-city="christiana"></div>
		<div class="label" data-city="christiana">Christiania</div>
    <div class="point city arendal highlighted" data-latitude="58.4687227" data-longitude="8.7618567" data-city="arendal"></div>
		<div class="label" data-city="arendal">Arendal</div>
    <div class="point city kristiansand highlighted" data-latitude="58.1529776" data-longitude="8.0092118" data-city="kristiansand"></div>
		<div class="label" data-city="kristiansand">Kristiansand</div>
    <div class="point city hamburg highlighted" data-latitude="53.558572" data-longitude="9.9278215" data-city="hamburg"></div>
		<div class="label" data-city="hamburg">Hamburg, Germany</div>
  </div>
  <div id="content" class="container"></div>
  <div class="cloud container">
    <video id="zoom" class="StretchtoFit" src="video/zoom.webm"></video>
    <video id="clouds" class="StretchtoFit" autoplay src="video/clouds.webm" loop></video>
  </div>
  <script src="js/globe.js"></script>
</body>
</html>