jannik/server-wakeonlan
Archived
1
0
Fork 0
Code Issues Pull requests Releases Activity

[CODE] get ping results asynchronously for faster page loading

Browse source
This commit is contained in:
Jannik Beyerstedt 2017-10-21 00:16:21 +02:00
parent 8446cfe206
commit 0115ea37d2
2 changed files with 85 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

82
index.php
View file

@ -10,8 +10,8 @@ if (isset($_GET['wake'])) {
$return = shell_exec('wakeonlan '.$_GET['wake']);
}
$clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
"magrathea" =>"60:03:08:9c:25:6a"];
$clients = ["nuc6i5-host.fra80"=>"b8:ae:ed:ec:18:f7",
"magrathea.fra80" =>"60:03:08:9c:25:6a"];
?>
<!DOCTYPE html>
@ -24,13 +24,17 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
body {
max-width: 500px;
margin: 0 auto;
padding: 0 5px;
padding: 0 10px;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}
body > h1:first-child { margin-top: 0.3em; }
small {
font-size: 0.7em;
font-weight: 500;
}
ul {
padding-left: 20px;
}
li {
margin-bottom: 1.5em;
}
@ -38,6 +42,16 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
color: blue;
}
div.info {
margin: -10px; padding: 10px;
background-color: #e2e2e2;
border: 1px solid #787878;
border-radius: 5px;
}
div.info > p:first-child {
margin-top: 0;
}
.red { color: red; }
.green { color: green; }
</style>
@ -45,24 +59,58 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
<body>
<h1>Wake On LAN Service</h1>
<?php if (isset($return)) : ?>
<p>The command returned:</p>
<pre><?php echo $return; ?></pre>
<a href="index.php">OK</a>
<div class="info">
<p>The command returned:</p>
<pre><?php echo $return; ?></pre>
<a href="index.php">OK</a>
</div>
<?php endif; ?>
<p>I can wake up the following clients:</p>
<ul>
<p>I can try to wake up the following clients for you:</p>
<ul id="clients">
<?php foreach ($clients as $name=>$mac) : ?>
<li>
<a href="?wake=<?php echo $mac ?>"><?php echo $name ?> (<?php echo $mac ?>)</a>
<?php $foo = array(); $status; exec("ping -c 1 ".$name.".fra80", $foo, $status); ?>
<?php if (!$status) : ?>
<span class="green">&#8226;</span> online
<?php else : ?>
<span class="red">&#8226;</span> offline
<?php endif; ?>
<li data="<?php echo $name ?>">
<a href="?wake=<?php echo $mac ?>">wake up</a> <?php echo $name ?> (<?php echo $mac ?>)
</li>
<?php endforeach; ?>
</ul>
</body>
</html>
<script type="text/javascript">
clients = document.getElementById("clients").children;
for (var i = 0; i < clients.length; i++) {
element = clients[i];
hostname = clients[i].attributes['data'].value;
console.log("ping: " + hostname);
asyncRequest(element, hostname);
}
function asyncRequest(element, hostname) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if (this.readyState == 4) {
if (this.status == 200) {
callBack(element, xhttp.responseText, this.status);
} else {
console.log("Error requesting ping: " + this.status + ", " + xhttp.responseText);
}
}
};
xhttp.open("GET", "ping.php?hostname=" + hostname, true);
xhttp.send();
function callBack(element, response, statusCode) {
var node = document.createElement("span");
node.innerHTML = "&#8226;";
if (xhttp.responseText.substring(0, 1) == "1") {
node.className = "green";
element.appendChild(node);
element.append(" online");
} else {
node.className = "red";
element.appendChild(node);
element.append(" offline");
}
}
}
</script>
</html>

20
ping.php Normal file
View file

@ -0,0 +1,20 @@
<?php
// -------------------------------------------
// Wake On LAN Webclient -- on private LAN
// copyright: Jannik Beyerstedt | https://jannikbeyerstedt.de
// license: http://www.gnu.org/licenses/gpl-3.0.txt GPLv3 License
// -------------------------------------------
if (isset($_GET['hostname'])) {
$foo = array(); $status;
exec("ping -c 1 ".$_GET['hostname'], $foo, $status);
if (!$status) {
echo "1 online";
} else {
echo "0 offline";
}
} else {
header("HTTP/1.1 400 Bad Request");
echo "ERROR: invalid request";
}