-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
131 lines (117 loc) · 6.45 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
<html lang="en">
<head>
<title>The Silence of Aang - Avatar: The Last Airbender Hiatus Tracker</title>
<meta charset="UTF-8">
<meta name="description" content="Tracks the length between episodes of the Avatar: The Last Airbender Universe,
as well as keeping a list of these hiatuses.">
<link rel="stylesheet" type="text/css" href="style/style.css">
<link rel="icon" href="images/icon.ico" type="image/x-icon"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
<script src="javascripts/script.js" defer></script>
<script src="javascripts/modal.js" defer></script>
<!--<script src="javascripts/youtube.js" defer></script>-->
<script src="javascripts/navbar.js" defer></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(window).on("load", function() {
$("#loader").fadeOut("slow");;
$("#page").fadeIn("slow");;
});
</script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-MYQ6GY4MZH"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-MYQ6GY4MZH');
</script>
</head>
<body onload="createTable(hiatusList);">
<div id="loader"></div>
<div style="display:none;" id="page">
<div id="info">
<div class="info-content">
<span class="close">×</span>
<p>This website tracks the hiatuses of the ATLA universe. <br> A hiatus is a time period starting from the end
of one announced schedule to the begining of another.
<br>This site is <b>not official</b> and is maintained by one person.
</div>
</div>
<button id="infoBtn">i</button>
<div class="topnav">
<a class = "website" href="https://xman2156.github.io/arcane/">Arcane</a>
<a class = "active website" href="https://xman2156.github.io/atla/">ATLA</a>
<div class= "dropdown">
<button class="dropbtn">The Graveyard
<i class="fa-solid fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="https://xman2156.github.io/TOH/">The Owl House</a>
<a href="https://xman2156.github.io/amphibia/">Amphibia</a>
<a href="https://xman2156.github.io/spop/">She-Ra</a>
<a href="https://xman2156.github.io/infinitytrain/">Infinity Train</a>
</div>
</div>
<a class = "report website" target="_blank" href="https://forms.gle/St9a76Ca95swT4am9">Report a bug or ask a question</a>
</div>
<!--<div class="alert">
<span class="closebtn">×</span>
<strong>INFO!</strong> I recently started
<a target="_blank" href="https://twitter.com/AnimationHiatus">a Twitter page</a>
to share updates about the sites and new projects.
</div>-->
<div class="count">
<h1>It has been</h1>
<h1 style="font-size:600%">
<span id="count">xxx</span></h1>
<h1>
"<span id="previousEpisode">xxx</span>"
</h1>
</div>
<div class="tab">
<p style="font-size:150%">
<!--Note: ATLA is currently not on hiatus.<br>-->
<a onclick=switchMode() id="changeCount"> Click here <span id="moreorless">to count less precisely.</span></a>
</p>
<hr class="spacer">
<div class="list">
<h1> The Grand List of Hiatuses </h1>
<table id="hiatus"></table>
<br>
</div>
<br>
<hr class="spacer">
<div class="countdowns">
<h2>Time To Next Release<br>"<span id=nextEpisode>???</span>"</h2>
<h1 style="font-size:250%">
<span id="count4">Unknown</span>
</h1>
<hr class="spacer">
</div>
<div class="trailers">
<h2>Some of the latest tweets</h2>
<blockquote class="twitter-tweet" data-theme="dark"><p lang="en" dir="ltr">The Avatar will return. AVATAR: THE LAST AIRBENDER Seasons 2 & 3. Only on Netflix. <a href="https://t.co/sUnY5w6Jgf">pic.twitter.com/sUnY5w6Jgf</a></p>— Avatar: The Last Airbender (@AvatarNetflix) <a href="https://twitter.com/AvatarNetflix/status/1765391893909897350?ref_src=twsrc%5Etfw">March 6, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet" data-theme="dark"><p lang="en" dir="ltr">In honor of Father's Day, here's Zuko and Ozai's Agni Kai like you've never seen it before... with Dallas Liu and Daniel Dae Kim swapping roles! <a href="https://t.co/f1N6xGm1pY">pic.twitter.com/f1N6xGm1pY</a></p>— Avatar: The Last Airbender (@AvatarNetflix) <a href="https://twitter.com/AvatarNetflix/status/1802385653453262916?ref_src=twsrc%5Etfw">June 16, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<blockquote class="twitter-tweet" data-theme="dark"><p lang="en" dir="ltr">found this stuck in my drafts, thought you might like it 🫶🏻 <a href="https://t.co/nI99TOilCJ">pic.twitter.com/nI99TOilCJ</a></p>— Avatar: The Last Airbender (@AvatarNetflix) <a href="https://twitter.com/AvatarNetflix/status/1795137893070975135?ref_src=twsrc%5Etfw">May 27, 2024</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<hr class="spacer">
<div class="link">
<h3>
You can find me on <a class="links" target="_blank" href="https://github.com/xman2156">GitHub</a> & <a class="links" target="_blank" href="https://twitter.com/AnimationHiatus">Twitter</a><br>
<a class="links" target="_blank" href="https://github.com/TurtleByte/stevenhiatus/tree/gh-pages"> Credit to TurtleByte for original idea</a>
</h3>
<br>
</div>
</div>
</div>
<script>
var close = document.getElementsByClassName("closebtn");
close[0].onclick = function(){
var div = this.parentElement;
div.style.opacity = "0";
setTimeout(function(){ div.style.display = "none"; }, 600);
}
</script>
</body>
</html>