Skip to content

Instantly share code, notes, and snippets.

@mj41

mj41/rele.html

Created December 26, 2020 16:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mj41/4f329b6fcef152faa4e59cd56befc878 to your computer and use it in GitHub Desktop.
Save mj41/4f329b6fcef152faa4e59cd56befc878 to your computer and use it in GitHub Desktop.
Download ZIP
WiFi Rele 4x simple HTML
Raw
rele.html
<!DOCTYPE html>
<html>
<head>
<title>Rele</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<style>
.flex-container {
display: flex;
flex-direction: row;
height: 25%;
align-items: center;
}
.btn {
align: center;
border: solid 2px black;
margin: 5px;
padding: 15px;
}
.gr {
color: green;
}
.rd {
color: red;
}
</style>
<script type="text/javascript">
function CallRelayAction(action) {
fetch(
'http://192.168.1.1/' + action,
{
cache: 'no-store'
}
);
}
</script>
<div class="flex-container">
<div class="btn gr" onclick="CallRelayAction('h1');">1. ON</div>
<div class="btn rd" onclick="CallRelayAction('l1');">1. OFF</div>
</div>
<div class="flex-container">
<div class="btn gr" onclick="CallRelayAction('h2');">2. ON</div>
<div class="btn rd" onclick="CallRelayAction('l2');">2. OFF</div>
</div>
<div class="flex-container">
<div class="btn gr" onclick="CallRelayAction('h3');">3. ON</div>
<div class="btn rd" onclick="CallRelayAction('l3');">3. OFF</div>
</div>
<div class="flex-container">
<div class="btn gr" onclick="CallRelayAction('h4');">4. ON</div>
<div class="btn rd" onclick="CallRelayAction('l4');">4. OFF</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment