Start using new HTML5/CSS code.

This commit is contained in:
Darren 'Tadgy' Austin 2024-08-10 23:06:12 +01:00
commit cb4688d7a6
23 changed files with 650 additions and 616 deletions

View file

@ -1,89 +1,136 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<?php
if ($_COOKIE['theme'] == "light") {
$light = true;
} else {
$light = false;
}
?>
<!DOCTYPE html>
<html>
<head>
<?php if ($light) { ?>
<link rel="stylesheet" href="//slackware.uk/html/light.css" type="text/css">
<link rel="stylesheet" href="/light.css" type="text/css">
<?php if ($_COOKIE['theme'] == "light") { ?>
<link rel="stylesheet" href="/light.css" type="text/css">
<?php } else { ?>
<link rel="stylesheet" href="https://slackware.uk/html/dark.css" type="text/css">
<link rel="stylesheet" href="/dark.css" type="text/css">
<link rel="stylesheet" href="/dark.css" type="text/css">
<?php } ?>
<link rel="shortcut icon" href="/favicon.ico">
<meta charset="UTF-8">
<meta name="author" content="Darren 'Tadgy' Austin">
<meta name="description" content="Slackware UK Speedtest">
<meta name="keywords" content="Slackware UK Speedtest">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no">
<meta name="description" content="Slackware UK download speedtest">
<meta name="keywords" content="Slackware UK, speedtest, speed">
<title>Slackware UK: Speedtest</title>
<script type="text/javascript" src="speedtest.js"></script>
<script type="text/javascript" src="init.js"></script>
<script type="text/javascript" src="/speedtest.js"></script>
<script type="text/javascript">
var s=new Speedtest();
s.setParameter("test_order","IP_D"); // Only get IP, and do ping and download tests
s.setParameter("time_auto",true); // Use a fixed duration for tests
s.setParameter("time_dl_max",10); // 10 seconds for the download test
function I(id) {
return document.getElementById(id);
}
function startStop() {
if(s.getState() == 3) {
s.abort();
} else {
s.start();
I("startstopbutton").className="running";
}
}
function initUI() {
I("downloadtext").textContent="";
I("pingtext").textContent="";
I("jittertext").textContent="";
I("ip").textContent="";
}
s.onupdate=function(data) {
I("ip").textContent=data.clientIp;
I("downloadtext").textContent=(data.testState == 1 && data.dlStatus == 0) ? "..." : data.dlStatus;
I("pingtext").textContent=data.pingStatus;
I("jittertext").textContent=data.jitterStatus;
var prog=(Number(data.dlProgress)*2+Number(data.pingProgress))/3;
I("progress").style.width=(100*prog)+"%";
}
s.onend=function(aborted) {
I("startstopbutton").className="";
if(aborted) {
initUI();
}
}
</script>
</head>
<body>
<?php if ($light) { ?>
<p><a href="//slackware.uk/" title="Slackware UK"><img src="//slackware.uk/html/slackwareuk-black.png" title="Slackware UK" alt="Slackware UK Logo" border=0 align=center></a></p>
<?php } else { ?>
<p><a href="//slackware.uk/" title="Slackware UK"><img src="//slackware.uk/html/slackwareuk-white.png" title="Slackware UK" alt="Slackware UK Logo" border=0 align=center></a></p>
<?php } ?>
<p>
<b>is kindly sponsored by:</b>
<div align="center">
<a href="//mailg.ukservers.com/c/eJxVjDkOwyAQAF8DJYLlLijS-B8LbGTLdhKBE5TfhzajKUdTk0fnNN8SSADplVETAGFUVqWCCmBiDETMyPfeqX2odVGeJ18TeQXag9W2uoAaCLyNeC9GZp-drfxI63W9OtM3Bst0jCH-Jy31b8d6bo_57weWfWCjGf0AmK0uIA" title="UK Servers"><img src="//slackware.uk/html/ukservers.png" title="UK Servers" alt="UK Servers Logo" border="0" align="center" hspace="50"></a>
<?php if ($light) { ?>
<a href="//www.uk2.net/" title="UK2"><img src="//slackware.uk/html/uk2-black.png" title="UK2" alt="UK2 Logo" border="0" align="center" hspace="50"></a>
<div id="page">
<div id="logo">
<?php if ($_COOKIE['theme'] == "light") { ?>
<a href="/" title="Slackware UK"><img src="/slackwareuk-black.png" title="Slackware UK" alt="Slackware UK Logo"></a>
<?php } else { ?>
<a href="//www.uk2.net/" title="UK2"><img src="//slackware.uk/html/uk2-white.png" title="UK2" alt="UK2 Logo" border="0" align="center" hspace="50"></a>
<a href="/" title="Slackware UK"><img src="/slackwareuk-white.png" title="Slackware UK" alt="Slackware UK Logo"></a>
<?php } ?>
</div>
<br>
<b>Please take a moment to visit the sponsors using the links above!</b>
</p><br>
<center>
<table class="header">
<tr align="center">
<td>
<b class="heading">Slackware UK Speedtest</b><br><br>
<hr>
<div class="notice">
<span class="heading bold">Patronage & Donations</span><br>
If you use the Slackware UK services on a regular basis, and would like to contribute to running costs, make a continuing patronage (and receive special benefits), or make a one off PayPal payment, please use one of the following buttons:
<div id="donatebuttons">
<?php if ($_COOKIE['theme'] == "light") { ?>
<a class="donatebutton" href="https://www.patreon.com/slackwareUK" title="Patreon"><img src="/patreon-black.png" title="Patreon" alt="Patreon Logo"></a>
<a class="donatebutton" href="https://paypal.me/DonateToSlackwareUK" title="PayPal"><img src="/paypal-black.png" title="PayPal" alt="PayPal Logo"></a>
<?php } else { ?>
<a class="donatebutton" href="https://www.patreon.com/slackwareUK" title="Patreon"><img src="/patreon-white.png" title="Patreon" alt="Patreon Logo"></a>
<a class="donatebutton" href="https://paypal.me/DonateToSlackwareUK" title="PayPal"><img src="/paypal-white.png" title="PayPal" alt="PayPal Logo"></a>
<?php } ?>
</div>
All <a href="//slackware.uk/html/donors.php" title="Donors">donations</a> will be gratefully received - thank you!
</div>
<div id="theme">
<div></div>
<div></div>
<div class="box boxmargins" id="themetoggle">
<span id="themetoggletext">Toggle&nbsp;theme:</span><a href="/toggletheme.php" title="Toggle Theme"><img id="themetoggleimg" src="/toggletheme.png" title="Toggle Theme" alt="Toggle Theme Button"></a>
</div>
</div>
<div class="box boxmargins" id="headingbox">
<div id="headingtext">
<span class="heading bold">Slackware UK Speedtest</span><br>
<span class="subheading">
On this page you can test the speed at which you<br>
can download data from the Slackware UK server.
</td>
</tr>
</table>
</center>
<div id="test">
<div class="testGroup">
<div class="testArea">
<div class="testName">Ping</div>
<div id="pingText" class="meterText"></div>
<div class="unit">ms</div>
</div>
<div class="testArea">
<div class="testName">Jitter</div>
<div id="jitText" class="meterText"></div>
<div class="unit">ms</div>
</div>
<div class="testArea">
<div class="testName">Download</div>
<div id="dlText" class="meterText"></div>
<div class="unit">Mbit/s</div>
</span>
</div>
</div>
<div class="ip" id="ipArea">
Your IP information: <span id="ip"></span>
<div class="box boxmargins boxpadding" id="testbox">
<div id="tests">
<div>
<div class="subheading bold">Ping</div>
<div id="pingtext" class="metertext"></div>
<div>ms</div>
</div>
<div>
<div class="subheading bold">Jitter</div>
<div id="jittertext" class="metertext"></div>
<div>ms</div>
</div>
<div>
<div class="subheading bold">Download</div>
<div id="downloadtext" class="metertext"></div>
<div>Mbit/sec</div>
</div>
</div>
<div id="startstopbutton" onclick="startStop()"></div>
<div id="ipinfo">
Your IP information: <span id="ip"></span>
</div>
</div>
<br>
<div class="bold" id="progresstext">Test progress</div>
<div id="progressbar">
<div id="progress"></div>
</div>
<div id="copyright">
Slackware UK logo, design and code &copy; Darren 'Tadgy' Austin<br>
Speedtest code by <a href="https://github.com/librespeed/speedtest.git" title="LibreSpeed">LibreSpeed</a>
</div>
<script type="text/javascript">
initUI();
</script>
</div>
<div id="startStopBtn" onclick="startStop()"></div>
<div class="progressText">Test progress...</div>
<div id="progressBar">
<div id="progress"></div>
</div>
<script type="text/javascript">
initUI();
</script>
</body>
</html>