html/index.html at master · Willjfield/html · 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
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
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="../style.css">
		<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.min.js"></script>
		<script type="text/javascript" src="https://use.typekit.net/pwk6ibv.js"></script>
		<script type="text/javascript">try{Typekit.load({ async: true });}catch(e){}</script>
		<title>explore.js</title>
		<!--<script src="https://use.typekit.net/pwk6ibv.js"></script>
		<script>try{Typekit.load({ async: true });}catch(e){}</script>-->
	</head>
	<body>
		<script type="text/javascript" src="script.js"></script>
		<ul id="mainMenu">
			<h1 class="top-title">explore.js</h1>
			<li><a href="./">Home</a></li>
			<li><a href="./demos">Demos</a></li>
			<li><a href="./download">Download</a></li>
			<li><a href="./documentation">Documentation</a></li>
			<li><a href="./tutorials">Tutorials</a></li>
			<li><a href="./about">About</a></li>
			<li><a href="/credits">Credits</a></li>
		</ul>
		<p class="welcome">
 		 <iframe id="video" src="https://player.vimeo.com/video/162909814?title=0&byline=0&portrait=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
 		<br><br>
		explore.js is an open-source toolkit that helps designers, artists, teachers, and amateur astronomers visualize the cosmos.
 		It is composed of a JavaScript library that consolidates various astronomy tools, a texture pack, and scripts to help manage API requests on the back-end.<br><br>
 		If it's your first time here, checkout the <a href='./demos'>demo section</a> to see what the library can do.<br><br>Find the library on github <a href="https://github.com/Willjfield/explore">here</a>.
 		</p>
	</body>
	<script type="text/javascript">
			var isMobile = false;
			if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
				isMobile = true
			}

		function respond(){
			if(window.innerWidth<780 || isMobile){
				document.getElementById("mainMenu").style.position = "absolute";
				document.getElementById("mainMenu").style.width = "92%";

				document.getElementById("video").style.width="100%";

				document.getElementsByClassName("welcome")[0].style.position = "absolute";
				document.getElementsByClassName("welcome")[0].style.top = "700px";
				document.getElementsByClassName("welcome")[0].style.left = "0px";
				document.getElementsByClassName("welcome")[0].style.width = "90%";
				document.getElementsByClassName("welcome")[0].style.padding = "5%";

				var lis = document.getElementsByTagName("LI");
				for(var item=0;item<lis.length;item++){
					var txt = document.getElementsByTagName("A");
					for(var j=0;j<txt.length;j++){
						txt[j].style.padding = "20px";
						txt[j].style.fontSize = "30px";
				}
			}
			}else{
				document.getElementById("mainMenu").style.position = "";
				document.getElementById("mainMenu").style.width = "";

				document.getElementById("video").style.width="";

				document.getElementsByClassName("welcome")[0].style.position = "";
				document.getElementsByClassName("welcome")[0].style.left = "";
				document.getElementsByClassName("welcome")[0].style.width = "";
				document.getElementsByClassName("welcome")[0].style.padding = "";
				document.getElementsByClassName("welcome")[0].style.top = "";

				var lis = document.getElementsByTagName("LI");
				for(var item=0;item<lis.length;item++){
					var txt = document.getElementsByTagName("A");
					for(var j=0;j<txt.length;j++){
						txt[j].style.padding = "";
						txt[j].style.fontSize = "";
					}
				}
			}
		}
		respond();
		window.addEventListener("resize",respond);
	</script>
</html>