-
-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.php
324 lines (290 loc) · 15.8 KB
/
index.php
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
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
<!DOCTYPE html>
<?php
date_default_timezone_set("Europe/London");
$now = time();
$start_date_web = strtotime("1989-03-12");
$start_date_internet = strtotime("1969-10-29");
$birthday = $_GET['date'] ?? null;
$web_days = floor(($now - $start_date_web)/(60*60*24));
$age_days = floor(($now - $birthday)/(60*60*24));
$internet_days = floor(($now - $start_date_internet)/(60*60*24));
$younger_age_difference = $web_days - $age_days;
$older_age_difference = $age_days - $web_days;
$sharing_result = "";
if ($age_days < $web_days) {
$sharing_result = "The internet was $younger_age_difference days old when I was born! Click on the link to find out just how old you were when the internet was launched.";
$days = $younger_age_difference;
} elseif ($age_days > $web_days) {
$sharing_result = "The internet was launched $older_age_difference days after I was born! Click on the link to find out just how old you were when the internet was launched.";
$days = $older_age_difference;
} else {
$sharing_result = "Wow! I'm exactly the same age as the internet! Click on the link to find out just how old you were when the internet was launched.";
$days = 0;
}
?>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link type="text/plain" rel="author" href="/humans.txt">
<title>The Age of the Internet</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta property="og:site_name" content="How old is the internet?">
<meta property="og:title" content="How old is the internet?">
<?php if (isset($_GET['date'])) { ?>
<meta name="description" property="og:description" content="<?=$sharing_result?>">
<meta property="og:image" content="https://howoldistheinter.net/image.php?text=<?= $days; ?>">
<meta property="og:url" content="https://howoldistheinter.net/?date=<?= $_GET['date']; ?>">
<?php } else { ?>
<meta name="description" property="og:description" content="Use How Old is the Internet to find out just how many days old is the internet right now. You can also find out how old you were when the internet began!">
<meta property="og:image" content="https://howoldistheinter.net/social.png">
<meta property="og:url" content="https://howoldistheinter.net">
<?php } ?>
<meta property="og:type" content="website">
<meta property="locale" content="en_GB">
<link rel="canonical" href="https://howoldistheinter.net/">
<script async defer data-domain="howoldistheinter.net" src="https://plausible.io/js/script.outbound-links.js"></script>
<link rel="me" href="https://masto.ai/@tosbourn">
<link rel="me" href="https://tosbourn.com">
<link rel="me" href="mailto:[email protected]">
<script async src="https://epnt.ebay.com/static/epn-smart-tools.js"></script>
</head>
<body>
<h1>
The Internet is <span class="larger"><?=$web_days; ?><sup><a href="#days-old">*</a></sup></span> days old
</h1>
<section class="intro date-box">
<h3 class="box-text">How old were you when the internet was launched?</h3>
<div>
<form action="/post-results.php" method="POST">
<span class="dropdown dropdown--emerald dropdown--large">
<select name="year" class="dropdown__select dropdown__select--emerald">
<option value="">Year</option>
<?php for ($year = date('Y'); $year > date('Y')-100; $year--) { ?>
<option value="<?php echo $year; ?>"><?php echo $year; ?></option>
<?php } ?>
</select>
</span>
<span class="dropdown dropdown--emerald dropdown--large">
<select name="month" class="dropdown__select dropdown__select--emerald">
<option value="">Month</option>
<?php for ($month = 1; $month <= 12; $month++) { ?>
<option value="<?php echo strlen($month)==1 ? '0'.$month : $month; ?>"><?php echo strlen($month)==1 ? '0'.$month : $month; ?></option>
<?php } ?>
</select>
</span>
<span class="dropdown dropdown--emerald dropdown--large">
<select name="day" class="dropdown__select dropdown__select--emerald">
<option value="">Day</option>
<?php for ($day = 1; $day <= 31; $day++) { ?>
<option value="<?php echo strlen($day)==1 ? '0'.$day : $day; ?>"><?php echo strlen($day)==1 ? '0'.$day : $day; ?></option>
<?php } ?>
</select>
</span>
<input type="submit" value="Find out!" class="submit">
</form>
</div>
</section>
<div class="socialshares">
<a class="social facebook" target="_blank" rel="noopener" href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fhowoldistheinter.net%2Fresults.php"><img src="images/share-facebook.svg" alt="Facebook icon" width="32" height="32"><span>Facebook</span></a>
<a class="social twitter" target="_blank" rel="noopener" href="https://twitter.com/intent/tweet?text=The+internet+is+<?=$web_days;?>+days+old&url=http%3A%2F%2Fhowoldistheinter.net"><img src="images/share-twitter.svg" alt="Twitter icon" width="32" height="32"><span>Twitter</span></a>
<a class="social linkedin" target="_blank" rel="noopener" href="https://www.linkedin.com/shareArticle?mini=true&url=http%3A%2F%2Fhowoldistheinter.net&title=The+internet+is+<?=$web_days?>+days+old&summary=The+internet+is+<?=$web_days?>+days+old&source=http%3A%2F%2Fhowoldistheinter.net"><img src="images/share-linkedin.svg" alt="LinkedIn icon" width="32" height="32"><span>Linkedin</span></a>
</div>
<script async src="https://cdn.carbonads.com/carbon.js?serve=CKYI523W&placement=howoldistheinternet" id="_carbonads_js"></script>
<section class="intro">
<h2>Internet Timeline ↓</h2>
</section>
<section class="timeline">
<ul>
<li>
<div class="timeline-element">
<time datetime="1989">1989 - day <span class="day-highlight">0</span></time>
<h3>The Birth of WWW</h3>
Tim Berners-Lee and Robert Cailliau proposed a 'hypertext' system starting the modern Internet. Berners-Lee invented the Web while at CERN, he developed HTML, HTTP and URIs which have been further refined and form the basis of the modern internet.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1991">1991 - day <span class="day-highlight">919</span></time>
<h3>Release of Linux</h3>
Linux was developed by Linus Torvalds, which is the basis for Android and Chrome OS. Linus was also responsible for developing Git, a distributed revision control system. He is a vocal advocate for Open Source software.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1993">1993 - day <span class="day-highlight">1549</span></time>
<h3>First Microsoft Windows browser released</h3>
Cello was the first Microsoft Windows browser released and was used at Cornell Law School as Windows access was more widespread amongst lawyers than Unix. As hated as IE? Who knows!
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1993">1993 - day <span class="day-highlight">1635</span></time>
<h3><a href="https://en.wikipedia.org/wiki/W3Catalog">W3 Catalog</a></h3>
One of the earliest web search engines was put online.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1993">1993 - day <span class="day-highlight">1685</span></time>
<h3>First Livestream</h3>
A coffee pot at the University of Cambridge was the subject of the world's first livestream.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1993">1993 - day <span class="day-highlight">1657</span></time>
<h3><a href="https://web.archive.org/web/20001109142800/https://www.ibiblio.org/Dave/drfun.html">Doctor Fun</a></h3>
This web comic was created by David Farley and was one of the first on the world wide web. (unfortunately the original URL now 404s)
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1993">1994 - day <span class="day-highlight">1978</span></time>
<h3>The first ecommerce site & transaction</h3>
This is a contended fact but NetMarket claims to have conducted the first online sale for a Sting CD for the grand total of $12.48 plus postage and packaging.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1995">1995 - day <span class="day-highlight">2181</span></time>
<h3>Yahoo incorporated</h3>
Believe it or not Yahoo were one of the pioneers of the early internet.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1995">1995 - day <span class="day-highlight">2366</span></time>
<h3>eBay founded</h3>
One of the notable success stories of the dot-com bubble. Our ads help us run the site! ❤️<br>
<a target="_blank" href="https://www.ebay.com/?mkcid=1&mkrid=711-53200-19255-0&siteid=0&campid=5339010372&customid=&toolid=10001&mkevt=1">
<img src="/images/ebay-logo.png" alt="eBay advertisement" class="ebay-ad-timeline-element">
</a>
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1995">1995 - day <span class="day-highlight">2372</span></time>
<h3>WinPlay3 release</h3>
With the release of the first real-time software MP3 player, many people were able to encode and play back MP3s on their PCs.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1996">1996 - day <span class="day-highlight">2671</span></time>
<h3>Hotmail goes live</h3>
Hotmail was bought by Microsoft a year after launch and is now known as Outlook.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1996">1996 - day <span class="day-highlight">2713</span></time>
<h3>First mobile phone with internet access</h3>
The phone was large and heavy but the first that could access the internet.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1998">1998 - day <span class="day-highlight">3470</span></time>
<h3>Google goes live</h3>
Now a household name, since incorporation Google has had rapid growth offering a range of services including email, social networking, cloud storage, mapping and video sharing. They lead development on the Android mobile operating system and Google Chrome. They have recently made rapid developments and innovations in hardware.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1999">1999 - day <span class="day-highlight">3713</span></time>
<h3>First major online leak</h3>
One of the first major online leak scandals happened when the name of British intelligence agents appeared on an American website -pre Wikileaks!
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="1999">1999 - day <span class="day-highlight">3946</span></time>
<h3>Millennium Bug</h3>
The Y2K bug was something that could’ve caused problems with dates beyond 31st December 1999, as computers often dealt with the last two numbers in a year, making 1900 the “same” as 2000. Very few problems were ever reported and despite my Father’s panic, our home PC was fine.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2001">2001 - day <span class="day-highlight">4608</span></time>
<h3>First iPod released</h3>
Thus began Apple’s domination.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2004">2004 - day <span class="day-highlight">5442</span></time>
<h3>Facebook launches</h3>
Facebook first launched as The Facebook for Harvard University students.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2004">2005 - day <span class="day-highlight">5886</span></time>
<h3>The first YouTube video</h3>
Uploaded by cofounder Jawed Karim. It was a video of of himself at the San Diego Zoo called <a href="https://www.youtube.com/watch?v=jNQXAC9IVRw">"Me at the zoo"</a>.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2006">2006 - day <span class="day-highlight">6128</span></time>
<h3>Twitter founded</h3>
Quite often the source of breaking news the world over.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2006">2010 - day <span class="day-highlight">7692</span></time>
<h3>First iPad launched</h3>
Although not the first tablet, it's the ubiquitous term for tablet devices.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2006">2012 - day <span class="day-highlight">8685</span></time>
<h3>First video with 1 billion views on YouTube</h3>
South Korean superstar Psy was the first to reach 1 billion views with the viral hit Gangnam Style.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2016">2016 - day <span class="day-highlight">10035</span></time>
<h3>TikTok launched</h3>
A new social media platform for a new generation.
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="2022">2022 - day <span class="day-highlight">12308</span></time>
<h3>Chat GPT launched</h3>
ChatGPT is a large language model trained by OpenAI, capable of generating human-like responses to natural language inputs (we asked ChatGPT for this description!).
</div>
</li>
<li>
<div class="timeline-element">
<time datetime="<?= date("Y"); ?>"><?= date("Y"); ?> - day <span class="day-highlight"><?=$web_days; ?></span></time>
<h3>NOW</h3>
Something we left out? Something happened that you think we should include? <a href="https://tosbourn.com/contact/">Contact us!</a>
</div>
</li>
</ul>
</section>
<div class="ebay-ad">
<ins class="epn-placement" data-config-id="ffe17ccbb34b8e64b8f903ed"></ins>
</div>
<footer>
<p>
<sup id="days-old">*</sup>Assuming by Internet we mean the Internet as we know it today (<a href="https://en.wikipedia.org/wiki/History_of_the_World_Wide_Web">the World Wide Web</a>).
</p>
<p>
If you want the number of days from the time the internet technology was made it is <a href="https://en.wikipedia.org/wiki/Internet#History"><?=$internet_days;?></a>.
</p>
<p class="madeby">
<a href="https://tosbourn.com/"><img class="logo" src="images/logo.png" alt="Tosbourn logo" width="48" height="48"></a>
Made by <a href="https://tosbourn.com/" rel="author">tosbourn ltd</a>
</p>
</footer>
</body>
</html>