You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.2 KiB
51 lines
1.2 KiB
<html>
|
|
<head>
|
|
<title>Egg Count</title>
|
|
|
|
<style>
|
|
body, html {
|
|
background-color: transparent;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.container {
|
|
height: 185px;
|
|
position: relative;
|
|
width: 128px;
|
|
}
|
|
|
|
.egg, .count {
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
text-align: center;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.count {
|
|
font-size: 64px;
|
|
padding: 16px 0 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="egg">
|
|
<img src="./1f95a.svg" height="128" />
|
|
</div>
|
|
<div class="count" id="count">
|
|
0
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
const count = document.querySelector('#count')
|
|
const socket = new WebSocket('ws://10.0.1.11:8080')
|
|
socket.onmessage = (event) => {
|
|
count.innerHTML = event.data
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |